From 793a8e1b84e78bf1e20cd48a7210d10f409b2ef9 Mon Sep 17 00:00:00 2001
From: qiaoxinjiu <qiaoxinjiu@sparkedu.com>
Date: Mon, 18 May 2026 17:05:45 +0800
Subject: [PATCH] =?UTF-8?q?fix(case):=20AI=20=E7=94=A8=E4=BE=8B=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85=E5=BC=B9=E7=AA=97=E6=B7=B1=E6=B5=85=E8=89=B2=E4=B8=BB?=
 =?UTF-8?q?=E9=A2=98=E5=8F=AF=E8=AF=BB=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

为 append-to-body 详情弹窗增加独立样式，修复标题、标签与描述列表在浅色/服务器环境下的对比度。

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 src/components/TestPlatform/Case/CaseList.vue | 123 +++++++++++++++++-
 1 file changed, 118 insertions(+), 5 deletions(-)

diff --git a/src/components/TestPlatform/Case/CaseList.vue b/src/components/TestPlatform/Case/CaseList.vue
index de65d01..a44c098 100644
--- a/src/components/TestPlatform/Case/CaseList.vue
+++ b/src/components/TestPlatform/Case/CaseList.vue
@@ -588,6 +588,7 @@
       width="760px"
       top="6vh"
       append-to-body
+      custom-class="case-ai-detail-dialog"
       @closed="resetAiCaseDetailDialog">
       <div v-loading="aiCaseDetailLoading" class="ai-case-detail-wrap">
         <template v-if="!aiCaseDetailLoading && aiCaseDetailRowPresent">
@@ -2539,7 +2540,6 @@ export default {
 .ai-case-detail-title {
   font-size: 16px;
   font-weight: 600;
-  color: #f8fafc;
   line-height: 1.4;
   margin-bottom: 14px;
 }
@@ -2555,20 +2555,16 @@ export default {
 .ai-case-detail-label {
   font-size: 13px;
   font-weight: 600;
-  color: #cbd5e1;
   margin-bottom: 6px;
 }
 
 .ai-case-detail-text {
   font-size: 13px;
-  color: #e5e7eb;
   line-height: 1.6;
   white-space: pre-wrap;
   word-break: break-word;
   padding: 10px 12px;
-  background: #0f172a;
   border-radius: 4px;
-  border: 1px solid rgba(148, 163, 184, 0.2);
 }
 
 .ai-case-detail-empty {
@@ -2790,4 +2786,121 @@ body.theme-light .page-wrap .el-date-editor .el-range-input {
 body.theme-light .page-wrap .el-date-editor .el-range-separator {
   color: #909399;
 }
+
+/* AI 用例详情弹窗（append-to-body） */
+.el-dialog.case-ai-detail-dialog {
+  background: #111827;
+  border: 1px solid rgba(148, 163, 184, 0.2);
+}
+
+.el-dialog.case-ai-detail-dialog .el-dialog__header {
+  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
+}
+
+.el-dialog.case-ai-detail-dialog .el-dialog__title {
+  color: #f8fafc;
+}
+
+.el-dialog.case-ai-detail-dialog .el-dialog__body {
+  color: #e5e7eb;
+}
+
+.el-dialog.case-ai-detail-dialog .ai-case-detail-title {
+  color: #f8fafc;
+}
+
+.el-dialog.case-ai-detail-dialog .ai-case-detail-label {
+  color: #dbeafe;
+}
+
+.el-dialog.case-ai-detail-dialog .ai-case-detail-text {
+  color: #e5e7eb;
+  background: #0f172a;
+  border: 1px solid rgba(148, 163, 184, 0.2);
+}
+
+.el-dialog.case-ai-detail-dialog .ai-case-detail-empty {
+  color: #94a3b8;
+}
+
+.el-dialog.case-ai-detail-dialog .el-descriptions__body {
+  background-color: #111827;
+  color: #e5e7eb;
+}
+
+.el-dialog.case-ai-detail-dialog .el-descriptions-item__label {
+  color: #94a3b8;
+  background: #1f2937;
+}
+
+.el-dialog.case-ai-detail-dialog .el-descriptions-item__content {
+  color: #e5e7eb;
+  background: #111827;
+}
+
+.el-dialog.case-ai-detail-dialog .el-descriptions__body .el-descriptions__table {
+  border-color: rgba(148, 163, 184, 0.2);
+}
+
+.el-dialog.case-ai-detail-dialog .el-descriptions__body .el-descriptions-item__cell {
+  border-color: rgba(148, 163, 184, 0.2);
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog {
+  background: #ffffff;
+  border-color: #e5e7eb;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-dialog__header {
+  border-bottom-color: #ebeef5;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-dialog__title {
+  color: #303133;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-dialog__body {
+  color: #303133;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .ai-case-detail-title {
+  color: #0f172a;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .ai-case-detail-label {
+  color: #303133;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .ai-case-detail-text {
+  color: #334155;
+  background: #f8fafc;
+  border: 1px solid #e5e7eb;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .ai-case-detail-empty {
+  color: #909399;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-descriptions__body {
+  background-color: #ffffff;
+  color: #303133;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-descriptions-item__label {
+  color: #606266;
+  background: #fafafa;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-descriptions-item__content {
+  color: #303133;
+  background: #ffffff;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-descriptions__body .el-descriptions__table {
+  border-color: #ebeef5;
+}
+
+body.theme-light .el-dialog.case-ai-detail-dialog .el-descriptions__body .el-descriptions-item__cell {
+  border-color: #ebeef5;
+}
 </style>