fix(内置插件): 管理端插件页面硬编码颜色替换为深色模式令牌

frontend/admin/src/pages/plugin/aiagent/components/AiWriteModal.vue

@@ -338,9 +338,9 @@ onBeforeUnmount(stopGenerate);
   max-height: 400px;
   overflow-y: auto;
   padding: 12px 16px;
-  border: 1px solid #e5e5e5;
+  border: 1px solid var(--prev-border-color-base);
   border-radius: 4px;
-  background: #fafafa;
+  background: var(--prev-bg-color);
   font-size: 14px;
   line-height: 1.7;
   :deep() {
@@ -366,7 +366,7 @@ onBeforeUnmount(stopGenerate);
       color: #666;
     }
     code {
-      background: #f1f1f1;
+      background: var(--prev-bg-color);
       padding: 1px 4px;
       border-radius: 3px;
     }

frontend/admin/src/pages/plugin/aiagent/components/AskCard.vue

@@ -146,7 +146,7 @@ function submit() {
 .confirm-card {
   width: 380px;
   padding: 14px 16px;
-  background: #f0f7ff;
+  background: var(--prev-color-primary-light-9);
   border: 1px solid #d9ecff;
   border-radius: 12px;
   .confirm-head {
@@ -157,20 +157,20 @@ function submit() {
   }
   &.rejected .confirm-head,
   &.expired .confirm-head {
-    color: #909399;
+    color: var(--prev-color-text-secondary);
   }
   &.rejected,
   &.expired {
-    color: #909399;
-    background: #f4f4f5;
-    border-color: #e9e9eb;
+    color: var(--prev-color-text-secondary);
+    background: var(--prev-bg-color);
+    border-color: var(--prev-border-color-base);
     .ask-question,
     .ask-label {
-      color: #909399;
+      color: var(--prev-color-text-secondary);
     }
     .ask-option {
       cursor: default;
-      border-color: #e9e9eb;
+      border-color: var(--prev-border-color-base);
     }
   }
 }
@@ -182,7 +182,7 @@ function submit() {
   font-weight: 600;
   .confirm-state {
     margin-left: auto;
-    color: #909399;
+    color: var(--prev-color-text-secondary);
     font-size: 12px;
     font-weight: 400;
     &.ok {
@@ -192,7 +192,7 @@ function submit() {
 }
 .ask-question {
   margin-top: 10px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 14px;
   font-weight: 600;
   line-height: 1.6;
@@ -212,8 +212,8 @@ function submit() {
   font-size: 13px;
   cursor: pointer;
   user-select: none;
-  background: #fff;
-  border: 1px solid #e4e7ed;
+  background: var(--prev-bg-white);
+  border: 1px solid var(--prev-border-color-light);
   border-radius: 8px;
   transition: border-color 0.15s, background 0.15s;
   &:hover {
@@ -221,7 +221,7 @@ function submit() {
   }
   &.selected {
     color: var(--prev-color-primary);
-    background: #f0f7ff;
+    background: var(--prev-color-primary-light-9);
     border-color: var(--prev-color-primary);
   }
 }
@@ -235,8 +235,8 @@ function submit() {
   margin-top: 1px;
   color: #fff;
   font-size: 11px;
-  background: #fff;
-  border: 1px solid #c0c4cc;
+  background: var(--prev-bg-white);
+  border: 1px solid var(--prev-border-color-hover);
   &.single {
     border-radius: 50%;
   }
@@ -250,7 +250,7 @@ function submit() {
   }
 }
 .ask-label {
-  color: #303133;
+  color: var(--prev-color-text-regular);
   line-height: 1.5;
   word-break: break-word;
 }
@@ -270,11 +270,11 @@ function submit() {
   border-radius: 14px;
   border: 1px solid transparent;
   &.cancel {
-    color: #606266;
-    background: #fff;
-    border-color: #dcdfe6;
+    color: var(--prev-color-text-primary);
+    background: var(--prev-bg-white);
+    border-color: var(--prev-border-color-base);
     &:hover {
-      color: #909399;
+      color: var(--prev-color-text-secondary);
       border-color: #c0c4cc;
     }
   }

frontend/admin/src/pages/plugin/aiagent/components/ChatInput.vue

@@ -232,11 +232,11 @@ defineExpose({ focus });
   align-items: center;
   gap: 6px;
   padding: 7px 16px;
-  color: #606266;
+  color: var(--prev-color-text-primary);
   font-size: 13px;
   cursor: pointer;
-  background: #fff;
-  border: 1px solid #e4e7ed;
+  background: var(--prev-bg-white);
+  border: 1px solid var(--prev-border-color-light);
   border-radius: 999px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
   transition: color 0.15s, border-color 0.15s, background 0.15s;
@@ -245,14 +245,14 @@ defineExpose({ focus });
   }
   &:hover {
     color: var(--prev-color-primary);
-    background: #f0f7ff;
+    background: var(--prev-color-primary-light-9);
     border-color: var(--prev-color-primary);
   }
 }
 /* 输入卡片 */
 .input-card {
   margin: 0 0 24px;
-  border: 1px solid #e4e7ed;
+  border: 1px solid var(--prev-border-color-light);
   border-radius: 20px;
   transition: border-color 0.2s;
   &:focus-within {
@@ -261,7 +261,7 @@ defineExpose({ focus });
 }
 .input-card :deep(.el-textarea__inner) {
   padding: 16px 18px 0;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 14px;
   background: transparent;
   border: none;
@@ -288,7 +288,7 @@ defineExpose({ focus });
 }
 .panel-tip {
   padding: 2px 10px 8px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   font-size: 12px;
 }
 .model-trigger {
@@ -297,7 +297,7 @@ defineExpose({ focus });
   gap: 6px;
   max-width: 220px;
   padding: 6px 10px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 13px;
   cursor: pointer;
   background: transparent;
@@ -305,7 +305,7 @@ defineExpose({ focus });
   border-radius: 8px;
   &:hover {
     color: var(--prev-color-primary);
-    background: #f2f3f5;
+    background: var(--prev-bg-color);
   }
   span {
     overflow: hidden;
@@ -330,9 +330,9 @@ defineExpose({ focus });
     opacity: 0.85;
   }
   &:disabled {
-    color: #a8abb2;
+    color: var(--prev-color-text-secondary);
     cursor: not-allowed;
-    background: #e9e9eb;
+    background: var(--prev-bg-color);
   }
   /* 停止态：流式输出进行中，点击终止输出 */
   &.stop {
@@ -356,11 +356,11 @@ defineExpose({ focus });
   cursor: pointer;
   border-radius: 6px;
   &:hover {
-    background: #f5f7fa;
+    background: var(--prev-bg-color);
   }
   &.active {
     color: var(--prev-color-primary);
-    background: #f0f7ff;
+    background: var(--prev-color-primary-light-9);
     i {
       color: var(--prev-color-primary);
     }
@@ -376,8 +376,8 @@ defineExpose({ focus });
   white-space: nowrap;
 }
 .model-manage {
-  color: #606266;
-  border-top: 1px solid #ebeef5;
+  color: var(--prev-color-text-primary);
+  border-top: 1px solid var(--prev-border-color-lighter);
   border-radius: 0;
   &:hover {
     color: var(--prev-color-primary);

frontend/admin/src/pages/plugin/aiagent/components/ConfirmCard.vue

@@ -129,7 +129,7 @@ function formatValue(value) {
 .confirm-card {
   width: 380px;
   padding: 14px 16px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   background: #fdf6ec;
   border: 1px solid #faecd8;
   border-radius: 12px;
@@ -145,15 +145,15 @@ function formatValue(value) {
   }
   &.rejected,
   &.expired {
-    color: #909399;
+    color: var(--prev-color-text-secondary);
     background: #f4f4f5;
     border-color: #e9e9eb;
     .confirm-head {
-      color: #909399;
+      color: var(--prev-color-text-secondary);
     }
     .confirm-tool,
     .confirm-args {
-      color: #909399;
+      color: var(--prev-color-text-secondary);
     }
     .confirm-preview {
       opacity: 0.6;
@@ -168,7 +168,7 @@ function formatValue(value) {
   font-weight: 600;
   .confirm-state {
     margin-left: auto;
-    color: #909399;
+    color: var(--prev-color-text-secondary);
     font-size: 12px;
     font-weight: 400;
     &.ok {
@@ -178,7 +178,7 @@ function formatValue(value) {
 }
 .confirm-tool {
   margin-top: 10px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 13px;
   font-weight: 600;
   word-break: break-all;
@@ -192,7 +192,7 @@ function formatValue(value) {
     word-break: break-all;
   }
   .arg-key {
-    color: #909399;
+    color: var(--prev-color-text-secondary);
   }
   .arg-toggle {
     margin-left: 4px;
@@ -207,12 +207,12 @@ function formatValue(value) {
     display: flex;
     align-items: center;
     gap: 4px;
-    color: #909399;
+    color: var(--prev-color-text-secondary);
     font-size: 12px;
     cursor: pointer;
     user-select: none;
     &:hover {
-      color: #606266;
+      color: var(--prev-color-text-primary);
     }
   }
   .preview-frame {
@@ -237,11 +237,11 @@ function formatValue(value) {
   border-radius: 14px;
   border: 1px solid transparent;
   &.cancel {
-    color: #606266;
-    background: #fff;
-    border-color: #dcdfe6;
+    color: var(--prev-color-text-primary);
+    background: var(--prev-bg-white);
+    border-color: var(--prev-border-color-base);
     &:hover {
-      color: #909399;
+      color: var(--prev-color-text-secondary);
       border-color: #c0c4cc;
     }
   }

frontend/admin/src/pages/plugin/aiagent/components/ConversationPanel.vue

@@ -103,12 +103,12 @@ function formatTime(time) {
   flex-direction: column;
   padding: 16px 12px;
   overflow-y: auto;
-  background: #f7f8fa;
-  border-right: 1px solid #ebeef5;
+  background: var(--prev-bg-color);
+  border-right: 1px solid var(--prev-border-color-lighter);
 }
 .panel-brand {
   margin: 0 8px 16px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 17px;
   font-weight: 700;
 }
@@ -121,21 +121,21 @@ function formatTime(time) {
   gap: 10px;
   margin-bottom: 2px;
   padding: 9px 10px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 14px;
   cursor: pointer;
   border-radius: 8px;
   i {
-    color: #606266;
+    color: var(--prev-color-text-primary);
     font-size: 16px;
   }
   &:hover {
-    background: #ececec;
+    background: var(--prev-color-hover);
   }
 }
 .panel-section {
   margin: 12px 8px 6px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   font-size: 12px;
 }
 .conversation-list {
@@ -154,7 +154,7 @@ function formatTime(time) {
 .conversation-item:hover,
 .conversation-item.active {
   color: var(--prev-color-primary);
-  background: #fff;
+  background: var(--prev-bg-white);
 }
 .conversation-info {
   display: flex;
@@ -171,7 +171,7 @@ function formatTime(time) {
 }
 .conversation-time {
   margin-top: 4px;
-  color: #a8abb2;
+  color: var(--prev-color-text-secondary);
   font-size: 12px;
 }
 .conversation-actions {
@@ -186,7 +186,7 @@ function formatTime(time) {
   }
 }
 .action-icon {
-  color: #a8abb2;
+  color: var(--prev-color-text-secondary);
   font-size: 16px;
   cursor: pointer;
   &:hover {
@@ -205,7 +205,7 @@ function formatTime(time) {
   opacity: 1;
 }
 .conversation-empty {
-  color: #a8abb2;
+  color: var(--prev-color-text-secondary);
   font-size: 13px;
   text-align: center;
 }

frontend/admin/src/pages/plugin/aiagent/components/McpManage.vue

@@ -363,7 +363,7 @@ function removeServer(row) {
   font-size: 12px;
 }
 .muted {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   font-size: 12px;
 }
 .danger {
@@ -384,8 +384,8 @@ function removeServer(row) {
   height: 44px;
   margin-right: 14px;
   border-radius: 10px;
-  background: #f2f3f5;
-  color: #303133;
+  background: var(--prev-bg-color);
+  color: var(--prev-color-text-regular);
   font-size: 22px;
 }
 .mcp-hero-main {
@@ -427,7 +427,7 @@ function removeServer(row) {
   margin-left: 8px;
   padding: 1px 9px;
   border-radius: 10px;
-  background: #f2f3f5;
+  background: var(--prev-bg-color);
   color: #4e5969;
   font-size: 12px;
 }
@@ -443,15 +443,15 @@ function removeServer(row) {
 }
 .mcp-card {
   margin-bottom: 12px;
-  border: 1px solid #f0f1f3;
+  border: 1px solid var(--prev-border-color-lighter);
   border-radius: 12px;
-  background: #fff;
+  background: var(--prev-bg-white);
   transition: box-shadow 0.2s;
   &:hover {
     box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
   }
   &.is-expanded {
-    border-color: #e5e6eb;
+    border-color: var(--prev-border-color-base);
   }
 }
 .mcp-card-head {
@@ -471,7 +471,7 @@ function removeServer(row) {
   font-size: 12px;
   cursor: pointer;
   &:hover {
-    background: #f2f3f5;
+    background: var(--prev-bg-color);
   }
 }
 .mcp-avatar {
@@ -583,13 +583,13 @@ function removeServer(row) {
 .tool-chip {
   padding: 5px 12px;
   border-radius: 8px;
-  background: #f2f3f5;
+  background: var(--prev-bg-color);
   color: #1d2129;
   font-size: 12px;
   cursor: default;
   transition: background 0.15s;
   &:hover {
-    background: #e5e6eb;
+    background: var(--prev-bg-color);
   }
 }
 
@@ -604,7 +604,7 @@ function removeServer(row) {
 /* 弹窗 */
 .dialog-tip {
   margin-bottom: 10px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   font-size: 13px;
   line-height: 1.6;
 }

frontend/admin/src/pages/plugin/aiagent/components/TaskManage.vue

@@ -724,7 +724,7 @@ function formatFullTime(timestamp) {
   font-size: 12px;
 }
 .muted {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   font-size: 12px;
 }
 .danger {
@@ -745,8 +745,8 @@ function formatFullTime(timestamp) {
   height: 44px;
   margin-right: 14px;
   border-radius: 10px;
-  background: #f2f3f5;
-  color: #303133;
+  background: var(--prev-bg-color);
+  color: var(--prev-color-text-regular);
   font-size: 22px;
 }
 .task-hero-main {
@@ -778,7 +778,7 @@ function formatFullTime(timestamp) {
   margin-left: 8px;
   padding: 1px 9px;
   border-radius: 10px;
-  background: #f2f3f5;
+  background: var(--prev-bg-color);
   color: #4e5969;
   font-size: 12px;
 }
@@ -794,9 +794,9 @@ function formatFullTime(timestamp) {
 }
 .task-card {
   margin-bottom: 12px;
-  border: 1px solid #f0f1f3;
+  border: 1px solid var(--prev-border-color-lighter);
   border-radius: 12px;
-  background: #fff;
+  background: var(--prev-bg-white);
   transition: box-shadow 0.2s;
   &:hover {
     box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
@@ -985,7 +985,7 @@ function formatFullTime(timestamp) {
   max-width: 78%;
   padding: 10px 14px;
   border-radius: 10px 2px 10px 10px;
-  background: #f2f3f5;
+  background: var(--prev-bg-color);
   color: #1d2129;
   font-size: 13px;
   line-height: 1.7;
@@ -995,9 +995,9 @@ function formatFullTime(timestamp) {
 .msg-content {
   width: 100%;
   padding: 10px 12px;
-  border: 1px solid #f0f1f3;
+  border: 1px solid var(--prev-border-color-lighter);
   border-radius: 2px 10px 10px 10px;
-  background: #fafbfc;
+  background: var(--prev-bg-color);
   font-size: 13px;
   line-height: 1.7;
   word-break: break-word;
@@ -1006,7 +1006,7 @@ function formatFullTime(timestamp) {
   margin-bottom: 14px;
   padding: 8px 12px;
   border-radius: 8px;
-  background: #f7f8fa;
+  background: var(--prev-bg-color);
   .tool-line {
     display: flex;
     align-items: center;

frontend/admin/src/pages/plugin/aiagent/pages/index.vue

@@ -595,7 +595,7 @@ function onMessageBoxClick(e) {
   min-height: 480px;
   margin-top: 0;
   overflow: hidden;
-  border: 1px solid #ebeef5;
+  border: 1px solid var(--prev-border-color-lighter);
   border-radius: 12px;
 }
 .chat-main {
@@ -604,7 +604,7 @@ function onMessageBoxClick(e) {
   flex: 1;
   min-width: 0;
   flex-direction: column;
-  background: #fff;
+  background: var(--prev-bg-white);
 }
 /* 管理页遮盖层：覆盖右侧对话区，左侧导航仍可切换 */
 .manage-overlay {
@@ -614,33 +614,33 @@ function onMessageBoxClick(e) {
   display: flex;
   flex-direction: column;
   overflow: hidden;
-  background: #fff;
+  background: var(--prev-bg-white);
 }
 .manage-header {
   display: flex;
   align-items: center;
   gap: 14px;
   padding: 12px 20px;
-  border-bottom: 1px solid #ebeef5;
+  border-bottom: 1px solid var(--prev-border-color-lighter);
 }
 .manage-back {
   display: inline-flex;
   align-items: center;
   gap: 4px;
   padding: 6px 12px;
-  color: #606266;
+  color: var(--prev-color-text-primary);
   font-size: 13px;
   cursor: pointer;
-  background: #f4f4f5;
+  background: var(--prev-bg-color);
   border: none;
   border-radius: 16px;
   &:hover {
     color: var(--prev-color-primary);
-    background: #e9e9eb;
+    background: var(--prev-color-hover);
   }
 }
 .manage-title {
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 15px;
   font-weight: 600;
 }
@@ -663,13 +663,13 @@ function onMessageBoxClick(e) {
   text-align: center;
 }
 .empty-title {
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 22px;
   font-weight: 600;
 }
 .empty-tip {
   margin-top: 10px;
-  color: #a8abb2;
+  color: var(--prev-color-text-secondary);
   font-size: 13px;
 }
 /* 用户消息：右侧浅灰气泡 */
@@ -686,11 +686,11 @@ function onMessageBoxClick(e) {
 }
 .user-bubble {
   padding: 12px 18px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   line-height: 1.65;
   white-space: pre-wrap;
   word-break: break-word;
-  background: #f2f3f5;
+  background: var(--prev-bg-color);
   border-radius: 18px;
 }
 /* 气泡下方操作图标：hover 时浮现 */
@@ -699,7 +699,7 @@ function onMessageBoxClick(e) {
   gap: 14px;
   margin-top: 6px;
   padding-right: 6px;
-  color: #a8abb2;
+  color: var(--prev-color-text-secondary);
   font-size: 14px;
   opacity: 0;
   transition: opacity 0.15s;
@@ -733,7 +733,7 @@ function onMessageBoxClick(e) {
     font-size: 12px;
   }
   &:hover {
-    color: #606266;
+    color: var(--prev-color-text-primary);
   }
 }
 .reasoning-content {
@@ -760,15 +760,15 @@ function onMessageBoxClick(e) {
   line-height: 18px;
   padding: 0 6px;
   font-size: 12px;
-  color: #909399;
-  background: #f7f8fa;
-  border: 1px solid #e9e9eb;
+  color: var(--prev-color-text-secondary);
+  background: var(--prev-bg-color);
+  border: 1px solid var(--prev-border-color-lighter);
   border-radius: 4px;
   cursor: default;
   user-select: none;
 }
 .assistant-content {
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 14px;
   line-height: 1.75;
   word-break: break-word;
@@ -786,14 +786,14 @@ function onMessageBoxClick(e) {
   :deep(h5),
   :deep(h6) {
     margin: 20px 0 10px;
-    color: #1f2937;
+    color: var(--prev-color-text-regular);
     line-height: 1.4;
   }
   :deep(hr) {
     height: 0;
     margin: 16px 0;
     border: 0;
-    border-top: 1px solid #e4e7ed;
+    border-top: 1px solid var(--prev-border-color-light);
   }
   :deep(ul),
   :deep(ol) {
@@ -803,23 +803,23 @@ function onMessageBoxClick(e) {
   :deep(blockquote) {
     margin: 12px 0;
     padding: 4px 12px;
-    color: #606266;
-    border-left: 3px solid #dcdfe6;
+    color: var(--prev-color-text-primary);
+    border-left: 3px solid var(--prev-border-color-base);
   }
   :deep(pre) {
     margin: 12px 0;
     padding: 12px;
     overflow-x: auto;
-    color: #303133;
+    color: var(--prev-color-text-regular);
     white-space: pre-wrap;
-    background: #f5f7fa;
+    background: var(--prev-bg-color);
     border-radius: 6px;
   }
   :deep(code) {
     padding: 2px 4px;
     font-family: Consolas, Monaco, monospace;
     font-size: 0.9em;
-    background: #f5f7fa;
+    background: var(--prev-bg-color);
     border-radius: 3px;
   }
   :deep(pre code) {
@@ -835,17 +835,17 @@ function onMessageBoxClick(e) {
   :deep(td) {
     padding: 8px 10px;
     text-align: left;
-    border: 1px solid #ebeef5;
+    border: 1px solid var(--prev-border-color-lighter);
   }
   :deep(th) {
-    background: #f5f7fa;
+    background: var(--prev-bg-color);
   }
   :deep(a) {
     color: var(--prev-color-primary);
   }
 }
 .assistant-content.typing {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
 }
 /* 推荐追问：回答完成后展示的胶囊标签，点击直接发送 */
 .followups {
@@ -856,19 +856,19 @@ function onMessageBoxClick(e) {
 }
 .followup-tag {
   padding: 6px 14px;
-  color: #606266;
+  color: var(--prev-color-text-primary);
   font-size: 13px;
   line-height: 1.5;
   text-align: left;
   cursor: pointer;
   word-break: break-all;
-  background: #f7f8fa;
-  border: 1px solid #e4e7ed;
+  background: var(--prev-bg-color);
+  border: 1px solid var(--prev-border-color-light);
   border-radius: 999px;
   transition: color 0.15s, border-color 0.15s, background 0.15s;
   &:hover:not(:disabled) {
     color: var(--prev-color-primary);
-    background: #f0f7ff;
+    background: var(--prev-color-primary-light-9);
     border-color: var(--prev-color-primary);
   }
   &:disabled {
@@ -882,7 +882,7 @@ function onMessageBoxClick(e) {
   align-items: center;
   gap: 14px;
   margin-top: 12px;
-  color: #a8abb2;
+  color: var(--prev-color-text-secondary);
   font-size: 14px;
 }
 .action-icon {

frontend/admin/src/pages/plugin/normal/add/productAdd.scss

@@ -406,6 +406,25 @@
   padding-top: 50px;
   margin: 0 auto;
 
+  /* 深色模式：白色手机壳图（"详情预览"标题烧在图里）改为深色面板 + CSS 标题，
+     编辑区已跟随主题，预览保持同观感（2026-09-28 用户裁定） */
+  html[data-theme='dark'] & {
+    background: var(--prev-bg-white);
+    border: 1px solid var(--prev-border-color-light);
+    border-radius: 24px;
+
+    &::before {
+      content: '详情预览';
+      display: block;
+      height: 40px;
+      margin: -50px -20px 10px;
+      line-height: 40px;
+      text-align: center;
+      font-size: 14px;
+      color: var(--prev-color-text-regular);
+    }
+  }
+
   .content {
     height: 560px;
     overflow: hidden;

frontend/admin/src/pages/plugin/normal/order/Detail.vue

@@ -646,14 +646,14 @@ defineExpose({ loadDetail });
       min-width: 0;
       padding-left: 12px;
       font-size: 13px;
-      color: #606266;
+      color: var(--prev-color-text-primary);
 
       .title {
         margin-bottom: 10px;
         font-weight: 500;
         font-size: 16px;
         line-height: 16px;
-        color: rgba(0, 0, 0, 0.85);
+        color: var(--prev-color-text-regular);
       }
     }
   }
@@ -670,13 +670,13 @@ defineExpose({ loadDetail });
       width: 200px;
       font-size: 14px;
       line-height: 14px;
-      color: rgba(0, 0, 0, 0.85);
+      color: var(--prev-color-text-regular);
 
       .title {
         margin-bottom: 12px;
         font-size: 13px;
         line-height: 13px;
-        color: #666666;
+        color: var(--prev-color-text-primary);
       }
 
       .value1 {
@@ -687,12 +687,9 @@ defineExpose({ loadDetail });
   }
 }
 
-:deep(.el-drawer__body) {
-  padding: 20px 0;
-}
-
 :deep(.el-tabs--border-card > .el-tabs__content) {
-  padding: 0 35px;
+  /* 与 .head 的 30px 左右缩进对齐（body 左右已由列表页归零） */
+  padding: 0 30px;
 }
 
 :deep(.el-tabs--border-card > .el-tabs__header),
@@ -706,7 +703,7 @@ defineExpose({ loadDetail });
   border-top: 2px solid var(--prev-color-primary);
   font-size: 13px;
   font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   line-height: 16px;
 }
 
@@ -722,7 +719,7 @@ defineExpose({ loadDetail });
   width: 92px !important;
   font-size: 13px;
   font-weight: 400;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   line-height: 16px;
 }
 
@@ -734,7 +731,7 @@ defineExpose({ loadDetail });
 /* section 通用 */
 .section {
   padding: 20px 0;
-  border-bottom: 1px dashed #eee;
+  border-bottom: 1px dashed var(--prev-border-color-lighter);
 }
 .section:last-child {
   border-bottom: none;
@@ -744,7 +741,7 @@ defineExpose({ loadDetail });
   border-left: 3px solid var(--prev-color-primary, #1890ff);
   font-size: 15px;
   font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   margin-bottom: 16px;
 }
 
@@ -755,11 +752,11 @@ defineExpose({ loadDetail });
   display: flex;
   padding: 8px 0;
   font-size: 13px;
-  color: #666;
+  color: var(--prev-color-text-primary);
 }
 .detail-item .label {
   flex-shrink: 0;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   margin-right: 4px;
 }
 .detail-item .value {
@@ -786,7 +783,7 @@ defineExpose({ loadDetail });
 
 /* 商品表格 */
 .goods-table {
-  border: 1px solid #ebeef5;
+  border: 1px solid var(--prev-border-color-lighter);
   border-radius: 4px;
 }
 .goods-cell {
@@ -806,7 +803,7 @@ defineExpose({ loadDetail });
 .goods-name {
   margin: 0;
   font-size: 13px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -814,7 +811,7 @@ defineExpose({ loadDetail });
 .goods-sku {
   margin: 2px 0 0;
   font-size: 12px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
 }
 
 /* 表单图片 */
@@ -829,16 +826,21 @@ defineExpose({ loadDetail });
 /* 时间线 */
 .tl-section {
   padding: 16px 0;
+
+  /* EP 时间线默认 padding-left 40px，叠加 tabs 缩进后过深，收齐到内容左缘 */
+  :deep(.el-timeline) {
+    padding-left: 4px;
+  }
 }
 :deep(.el-timeline-item__content .tl-title) {
   font-size: 13px;
   font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
 }
 :deep(.el-timeline-item__content .tl-desc) {
   margin-left: 8px;
   font-size: 12px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
 }
 /* 售后来源标签 */
 .source-tag {
@@ -851,7 +853,7 @@ defineExpose({ loadDetail });
 }
 .empty-tips {
   padding: 20px 0;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   font-size: 13px;
 }
 
@@ -859,14 +861,14 @@ defineExpose({ loadDetail });
 .logistics-panel {
   margin-top: 16px;
   padding: 16px;
-  background: #fafafa;
+  background: var(--prev-bg-color);
   border-radius: 8px;
 
   .logistics-header {
     display: flex;
     align-items: center;
     padding-bottom: 12px;
-    border-bottom: 1px solid #ebeef5;
+    border-bottom: 1px solid var(--prev-border-color-lighter);
     margin-bottom: 16px;
 
     .logistics-icon {
@@ -885,7 +887,7 @@ defineExpose({ loadDetail });
     .logistics-company {
       font-size: 14px;
       font-weight: 600;
-      color: #303133;
+      color: var(--prev-color-text-regular);
       margin-bottom: 4px;
     }
 
@@ -895,18 +897,18 @@ defineExpose({ loadDetail });
       font-size: 12px;
 
       .label {
-        color: #909399;
+        color: var(--prev-color-text-secondary);
         margin-right: 6px;
         flex-shrink: 0;
       }
 
       .value {
-        color: #606266;
+        color: var(--prev-color-text-primary);
         word-break: break-all;
       }
 
       .copy-btn {
-        color: #909399;
+        color: var(--prev-color-text-secondary);
         cursor: pointer;
         margin-left: 6px;
         font-size: 13px;
@@ -945,7 +947,7 @@ defineExpose({ loadDetail });
   .track-item {
     .track-status {
       font-size: 13px;
-      color: #606266;
+      color: var(--prev-color-text-primary);
       line-height: 1.5;
       margin-bottom: 2px;
 
@@ -963,7 +965,7 @@ defineExpose({ loadDetail });
 
   .empty-logistics {
     text-align: center;
-    color: #909399;
+    color: var(--prev-color-text-secondary);
     padding: 30px 0;
     font-size: 13px;
   }

frontend/admin/src/pages/plugin/normal/order/Edit.vue

@@ -246,7 +246,7 @@ defineExpose({ open });
   font-size: 13px;
 }
 .value {
-  color: #333;
+  color: var(--prev-color-text-regular);
   font-size: 13px;
 }
 .form-section {
@@ -255,7 +255,7 @@ defineExpose({ open });
 .section-title {
   font-size: 14px;
   font-weight: 600;
-  color: #333;
+  color: var(--prev-color-text-regular);
   margin-bottom: 12px;
 }
 </style>

frontend/admin/src/pages/plugin/normal/order/List.vue

@@ -140,7 +140,9 @@
               <template>SF1234567890</template>
             </el-table-column>
           </el-table>
-          <p class="mb10" style="color: #909399; font-size: 12px">第一行为表头，从第二行开始为数据</p>
+          <p class="mb10" style="color: var(--prev-color-text-secondary); font-size: 12px">
+            第一行为表头，从第二行开始为数据
+          </p>
           <el-upload
             ref="upload"
             :action="adminApi + 'normal/order/batch_shipment'"
@@ -172,7 +174,13 @@
     <OrderEdit ref="editRef" @saved="onEditSuccess" />
 
     <!-- 订单详情抽屉 -->
-    <el-drawer v-model="detailDrawerVisible" title="订单详情" size="720px" @opened="onDetailDrawerOpened">
+    <el-drawer
+      v-model="detailDrawerVisible"
+      title="订单详情"
+      size="720px"
+      class="order-detail-drawer"
+      @opened="onDetailDrawerOpened"
+    >
       <OrderDetail :orderNo="detailOrderNo" ref="detailRef" />
     </el-drawer>
   </div>
@@ -497,7 +505,8 @@ function openPrintWindow(data, type) {
   }
   var html =
     '<html><head><meta charset="utf-8"><title>' + (type === 'receipt' ? '小票打印' : '配货单打印') + '</title><style>';
-  html += 'body{font-family:"Microsoft YaHei",sans-serif;padding:0;margin:20px;font-size:14px;color:#333}';
+  html +=
+    'body{font-family:"Microsoft YaHei",sans-serif;padding:0;margin:20px;font-size:14px;color: var(--prev-color-text-regular)}';
   html += 'h2{text-align:center;margin-bottom:15px}';
   html += 'table{width:100%;border-collapse:collapse;margin-bottom:15px}';
   html += 'table,th,td{border:1px solid #ddd}';
@@ -776,6 +785,11 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
+/* 详情抽屉 body 左右归零（全局 variables.scss 为 20px 35px）：
+   内容组件 tabs 已不再叠加 padding，对齐用户详情抽屉的 20px 紧凑边距 */
+:deep(.order-detail-drawer .el-drawer__body) {
+  padding: 20px 0 !important;
+}
 .normal-order-list {
   .mt16 {
     margin-top: 16px;
@@ -801,7 +815,7 @@ onMounted(() => {
       display: flex;
       align-items: center;
       padding: 10px 0 20px;
-      border-bottom: 1px solid #ebeef5;
+      border-bottom: 1px solid var(--prev-border-color-lighter);
       margin-bottom: 20px;
 
       .logistics-icon {
@@ -815,14 +829,14 @@ onMounted(() => {
           margin: 0;
           line-height: 1.8;
           font-size: 13px;
-          color: #303133;
+          color: var(--prev-color-text-regular);
         }
       }
     }
 
     .logistics-status {
       font-size: 13px;
-      color: #606266;
+      color: var(--prev-color-text-primary);
     }
   }
 }

frontend/admin/src/pages/plugin/normal/order/components/OrderExpand.vue

@@ -65,16 +65,16 @@ function formatTime(ts) {
 <style scoped>
 .expand {
   font-size: 13px;
-  color: #606266;
+  color: var(--prev-color-text-primary);
 }
 .expand-row {
   margin-bottom: 16px;
 }
 .expand-key {
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   margin-right: 4px;
 }
 .expand-value {
-  color: #303133;
+  color: var(--prev-color-text-regular);
 }
 </style>

frontend/admin/src/pages/plugin/normal/order/components/OrderStatistics.vue

@@ -122,7 +122,7 @@ const statusCounts = computed(() => props.data.status_counts || {});
     .stat-value {
       font-size: 24px;
       font-weight: bold;
-      color: #333;
+      color: var(--prev-color-text-regular);
     }
 
     .stat-label {

frontend/admin/src/pages/plugin/normal/order/components/OrderTable.vue

@@ -129,7 +129,9 @@
         <template #default="scope">
           <template v-if="scope.row.delivery_name">
             <div>{{ scope.row.delivery_name || '--' }}</div>
-            <div style="font-size: 12px; color: #909399">{{ scope.row.delivery_id || '--' }}</div>
+            <div style="font-size: 12px; color: var(--prev-color-text-secondary)">
+              {{ scope.row.delivery_id || '--' }}
+            </div>
             <a
               v-if="scope.row.delivery_type === 'express' && scope.row.delivery_id"
               v-db-click
@@ -138,7 +140,7 @@
               >物流查询</a
             >
           </template>
-          <span v-else style="color: #909399">未发货</span>
+          <span v-else style="color: var(--prev-color-text-secondary)">未发货</span>
         </template>
       </el-table-column>
       <el-table-column label="创建时间" width="160">
@@ -594,7 +596,7 @@ defineExpose({ selectedIds, page });
 
 .toolbar {
   padding: 10px 20px;
-  border-bottom: 1px solid #ebeef5;
+  border-bottom: 1px solid var(--prev-border-color-lighter);
 }
 
 .orderData {

frontend/admin/src/pages/plugin/normal/order/handle/OrderRefund.vue

@@ -27,7 +27,9 @@
           :step="0.01"
           style="width: 200px"
         ></el-input-number>
-        <span style="margin-left: 8px; color: #909399; font-size: 12px">输入0~{{ formData.max_refund }}</span>
+        <span style="margin-left: 8px; color: var(--prev-color-text-secondary); font-size: 12px"
+          >输入0~{{ formData.max_refund }}</span
+        >
       </el-form-item>
     </el-form>
     <template #footer

frontend/admin/src/pages/plugin/normal/order/handle/OrderSend.vue

@@ -556,7 +556,7 @@ function handleCopyUserInfo() {
   .product-name {
     margin: 0;
     font-size: 13px;
-    color: #303133;
+    color: var(--prev-color-text-regular);
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -564,7 +564,7 @@ function handleCopyUserInfo() {
   .product-sku {
     margin: 2px 0 0;
     font-size: 12px;
-    color: #909399;
+    color: var(--prev-color-text-secondary);
   }
 }
 </style>

frontend/admin/src/pages/plugin/normal/product/List.vue

@@ -1027,7 +1027,7 @@ onActivated(() => {
 }
 .el-dropdown-menu__item {
   a {
-    color: #606266;
+    color: var(--prev-color-text-primary);
   }
 }
 .label_width {

frontend/admin/src/pages/plugin/normal/product/goodsImport.vue

@@ -175,7 +175,7 @@ function downloadFailData() {
   background-color: var(--prev-color-primary-light-9);
   padding: 12px;
   border-radius: 4px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   font-size: 12px;
   img {
     width: 19px;
@@ -246,12 +246,12 @@ function downloadFailData() {
   .rule-title {
     font-weight: 500;
     font-size: 14px;
-    color: #303133;
+    color: var(--prev-color-text-regular);
     margin-bottom: 6px;
   }
   .rule-text {
     font-size: 12px;
-    color: #303133;
+    color: var(--prev-color-text-regular);
   }
 }
 </style>

frontend/admin/src/pages/plugin/virtual/order/Detail.vue

@@ -466,12 +466,12 @@ async function loadDetail() {
 .head .text .title {
   font-size: 16px;
   font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   margin-bottom: 6px;
 }
 .head .text div {
   font-size: 13px;
-  color: #606266;
+  color: var(--prev-color-text-primary);
 }
 .head-list {
   display: flex;
@@ -484,11 +484,11 @@ async function loadDetail() {
   flex: 0 0 160px;
   margin-top: 12px;
   font-size: 14px;
-  color: rgba(0, 0, 0, 0.85);
+  color: var(--prev-color-text-regular);
 }
 .head-list .item .label {
   font-size: 13px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   margin-bottom: 8px;
 }
 .head-list .item .price {
@@ -509,7 +509,7 @@ async function loadDetail() {
   border-left: 3px solid var(--prev-color-primary, #1890ff);
   font-size: 15px;
   font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   margin-bottom: 16px;
 }
 .detail-grid {
@@ -523,7 +523,7 @@ async function loadDetail() {
 }
 .detail-item .label {
   flex-shrink: 0;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
   margin-right: 4px;
 }
 .detail-item .value {
@@ -540,7 +540,7 @@ async function loadDetail() {
 
 /* 商品表格 */
 .goods-table {
-  border: 1px solid #ebeef5;
+  border: 1px solid var(--prev-border-color-lighter);
   border-radius: 4px;
 }
 .goods-cell {
@@ -560,7 +560,7 @@ async function loadDetail() {
 .goods-name {
   margin: 0;
   font-size: 13px;
-  color: #303133;
+  color: var(--prev-color-text-regular);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -568,7 +568,7 @@ async function loadDetail() {
 .goods-sku {
   margin: 2px 0 0;
   font-size: 12px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
 }
 
 /* 表单图片 */
@@ -587,12 +587,12 @@ async function loadDetail() {
 :deep(.el-timeline-item__content .tl-title) {
   font-size: 13px;
   font-weight: 500;
-  color: #303133;
+  color: var(--prev-color-text-regular);
 }
 :deep(.el-timeline-item__content .tl-desc) {
   margin-left: 8px;
   font-size: 12px;
-  color: #909399;
+  color: var(--prev-color-text-secondary);
 }
 
 .empty-tip {
@@ -600,7 +600,8 @@ async function loadDetail() {
 }
 
 :deep(.el-tabs--border-card > .el-tabs__content) {
-  padding: 0 24px;
+  /* 独立路由详情页：.head 无缩进，tabs 内容对齐 */
+  padding: 0;
 }
 :deep(.el-tabs--border-card) {
   border: none;

frontend/admin/src/pages/plugin/wechat_mini/pages/live/goods/detail.vue

@@ -58,7 +58,7 @@ defineProps({
   display: inline-block;
   width: 150px;
   text-align: right;
-  color: #606266;
+  color: var(--prev-color-text-primary);
 }
 .box-container .list img {
   width: 80px;

frontend/admin/src/pages/plugin/wechat_mini/pages/live/goods/list.vue

@@ -253,7 +253,7 @@ function del(row, tit, num) {
   }
   .txt {
     margin-left: 10px;
-    color: #000;
+    color: var(--prev-color-text-regular);
     font-size: 12px;
   }
 }

frontend/admin/src/pages/plugin/wechat_mini/pages/live/room/detail.vue

@@ -124,7 +124,7 @@ defineExpose({ getData });
   display: inline-block;
   width: 150px;
   text-align: right;
-  color: #606266;
+  color: var(--prev-color-text-primary);
 }
 .box-container .list .blue {
   color: var(--prev-color-primary);

frontend/admin/src/pages/plugin/wechat_mini/pages/routine/download/index.vue

@@ -180,7 +180,7 @@ function downLoadCode(url) {
   display: flex;
   align-items: center;
   margin: 20px 20px 0 20px;
-  color: #333;
+  color: var(--prev-color-text-regular);
 }
 .content-box.last {
   margin-top: 0;