Просмотр исходного кода

style(admin): A-1 色彩令牌收敛 - 12 个优先页 (Dashboard/admin-Dashboard/teacher-*/admin-*/Layout)

按计划 admin-beautification-plan.md §3.1 映射表:CSS/template 段替换为 var(--adm-*);script 段 (ECharts) 保留 Ant 等价具体色值。构建通过 (dist_verify).
liaoxg 3 недель назад
Родитель
Сommit
ae7f5d377f

+ 69 - 69
cfc-web/src/views/Dashboard.vue

@@ -13,7 +13,7 @@
 <el-row :gutter="20" class="stats-row">
 <el-row :gutter="20" class="stats-row">
   <el-col :xs="12" :sm="12" :md="6">
   <el-col :xs="12" :sm="12" :md="6">
     <el-card class="stat-card" shadow="never">
     <el-card class="stat-card" shadow="never">
-      <div class="stat-icon" style="background: #FFFBE6; color: #D48806;">
+      <div class="stat-icon" style="background: var(--adm-warning-bg); color: var(--adm-warning-text);">
         <i class="el-icon-s-home"></i>
         <i class="el-icon-s-home"></i>
       </div>
       </div>
       <div class="stat-info">
       <div class="stat-info">
@@ -24,7 +24,7 @@
   </el-col>
   </el-col>
   <el-col :xs="12" :sm="12" :md="6">
   <el-col :xs="12" :sm="12" :md="6">
     <el-card class="stat-card" shadow="never">
     <el-card class="stat-card" shadow="never">
-      <div class="stat-icon" style="background: #E6F4FF; color: #1677FF;">
+      <div class="stat-icon" style="background: var(--adm-info-bg); color: var(--adm-primary);">
         <i class="el-icon-user"></i>
         <i class="el-icon-user"></i>
       </div>
       </div>
       <div class="stat-info">
       <div class="stat-info">
@@ -35,7 +35,7 @@
   </el-col>
   </el-col>
   <el-col :xs="12" :sm="12" :md="6">
   <el-col :xs="12" :sm="12" :md="6">
     <el-card class="stat-card" shadow="never">
     <el-card class="stat-card" shadow="never">
-      <div class="stat-icon" style="background: #FFFBE6; color: #D48806;">
+      <div class="stat-icon" style="background: var(--adm-warning-bg); color: var(--adm-warning-text);">
         <i class="el-icon-s-custom"></i>
         <i class="el-icon-s-custom"></i>
       </div>
       </div>
       <div class="stat-info">
       <div class="stat-info">
@@ -46,7 +46,7 @@
   </el-col>
   </el-col>
   <el-col :xs="12" :sm="12" :md="6">
   <el-col :xs="12" :sm="12" :md="6">
     <el-card class="stat-card" shadow="never">
     <el-card class="stat-card" shadow="never">
-      <div class="stat-icon" style="background: #F6FFED; color: #389E0D;">
+      <div class="stat-icon" style="background: var(--adm-success-bg); color: var(--adm-success-text);">
         <i class="el-icon-s-cooperation"></i>
         <i class="el-icon-s-cooperation"></i>
       </div>
       </div>
       <div class="stat-info">
       <div class="stat-info">
@@ -89,7 +89,7 @@
   </el-col>
   </el-col>
   <el-col :xs="12" :sm="12" :md="6">
   <el-col :xs="12" :sm="12" :md="6">
     <el-card class="stat-card" shadow="never">
     <el-card class="stat-card" shadow="never">
-      <div class="stat-icon" style="background: #E6F4FF; color: #1677FF;">
+      <div class="stat-icon" style="background: var(--adm-info-bg); color: var(--adm-primary);">
         <i class="el-icon-user-solid"></i>
         <i class="el-icon-user-solid"></i>
       </div>
       </div>
       <div class="stat-info">
       <div class="stat-info">
@@ -100,7 +100,7 @@
   </el-col>
   </el-col>
   <el-col :xs="12" :sm="12" :md="6">
   <el-col :xs="12" :sm="12" :md="6">
     <el-card class="stat-card" shadow="never">
     <el-card class="stat-card" shadow="never">
-      <div class="stat-icon" style="background: #E6F4FF; color: #1677FF;">
+      <div class="stat-icon" style="background: var(--adm-info-bg); color: var(--adm-primary);">
         <i class="el-icon-s-home"></i>
         <i class="el-icon-s-home"></i>
       </div>
       </div>
       <div class="stat-info">
       <div class="stat-info">
@@ -190,7 +190,7 @@
       <div class="health-label">系统版本</div>
       <div class="health-label">系统版本</div>
       <div class="health-value">
       <div class="health-value">
         {{ version }}
         {{ version }}
-        <button type="button" style="font-size:12px;border:none;background:none;color:#409EFF;cursor:pointer;padding:0;margin-left:6px" @click="showChangelog()">查看变更日志</button>
+        <button type="button" style="font-size:12px;border:none;background:none;color:var(--adm-primary);cursor:pointer;padding:0;margin-left:6px" @click="showChangelog()">查看变更日志</button>
       </div>
       </div>
     </div>
     </div>
   </div>
   </div>
@@ -587,7 +587,7 @@ initMemberPieChart() {
       data: [
       data: [
         { value: this.membershipData.freeCount || 0, name: '免费用户', itemStyle: { color: '#94A3B8' } },
         { value: this.membershipData.freeCount || 0, name: '免费用户', itemStyle: { color: '#94A3B8' } },
         { value: this.membershipData.familyCount || 0, name: '家庭会员', itemStyle: { color: '#F97316' } },
         { value: this.membershipData.familyCount || 0, name: '家庭会员', itemStyle: { color: '#F97316' } },
-        { value: this.membershipData.providerCount || 0, name: '服务商', itemStyle: { color: '#10B981' } }
+        { value: this.membershipData.providerCount || 0, name: '服务商', itemStyle: { color: '#52C41A' } }
       ]
       ]
     }]
     }]
   })
   })
@@ -603,15 +603,15 @@ initMemberPieChart() {
 
 
 /* 欢迎横幅 */
 /* 欢迎横幅 */
 .welcome-banner {
 .welcome-banner {
-  background: #E6F4FF; color: #1677FF;
+  background: var(--adm-info-bg); color: var(--adm-primary);
   border-radius: 8px;
   border-radius: 8px;
   padding: 24px 32px;
   padding: 24px 32px;
   display: flex;
   display: flex;
   justify-content: space-between;
   justify-content: space-between;
   align-items: center;
   align-items: center;
   margin-bottom: 24px;
   margin-bottom: 24px;
-  color: #1E293B;
-  border: 1px solid #E6F4FF;
+  color: var(--adm-text-88);
+  border: 1px solid var(--adm-info-bg);
 }
 }
 
 
 .welcome-title {
 .welcome-title {
@@ -637,7 +637,7 @@ initMemberPieChart() {
 
 
 .stat-card {
 .stat-card {
   border-radius: 8px;
   border-radius: 8px;
-  border: 1px solid #F0F0F0;
+  border: 1px solid var(--adm-border-split);
 }
 }
 
 
 .stat-card ::v-deep .el-card__body {
 .stat-card ::v-deep .el-card__body {
@@ -664,42 +664,42 @@ initMemberPieChart() {
   align-items: center;
   align-items: center;
   justify-content: center;
   justify-content: center;
   font-size: 24px;
   font-size: 24px;
-  color: #1677FF;
-  background: #E6F4FF;
+  color: var(--adm-primary);
+  background: var(--adm-info-bg);
   margin-right: 16px;
   margin-right: 16px;
   flex-shrink: 0;
   flex-shrink: 0;
 }
 }
 
 
-.stat-icon.blue { background:#E6F4FF; color:#1677FF; }
-.stat-icon.green { background: #F6FFED; color: #389E0D; }
-.stat-icon.orange { background: #FFFBE6; color: #D48806; }
-.stat-icon.purple { background:#E6F4FF; color:#1677FF; }
-.stat-icon.todo-warning { background: #FFFBE6; color: #D48806; }
-.stat-icon.todo-heart { background: #FFF1F0; color: #CF1322; }
-.stat-icon.todo-danger { background: #FFF1F0; color: #CF1322; }
-.stat-icon.todo-disabled { background: #F5F5F5; color: rgba(0,0,0,0.45); }
+.stat-icon.blue { background:var(--adm-info-bg); color:var(--adm-primary); }
+.stat-icon.green { background: var(--adm-success-bg); color: var(--adm-success-text); }
+.stat-icon.orange { background: var(--adm-warning-bg); color: var(--adm-warning-text); }
+.stat-icon.purple { background:var(--adm-info-bg); color:var(--adm-primary); }
+.stat-icon.todo-warning { background: var(--adm-warning-bg); color: var(--adm-warning-text); }
+.stat-icon.todo-heart { background: var(--adm-error-bg); color: var(--adm-error-text); }
+.stat-icon.todo-danger { background: var(--adm-error-bg); color: var(--adm-error-text); }
+.stat-icon.todo-disabled { background: var(--adm-fill); color: rgba(0,0,0,0.45); }
 
 
 .stat-value {
 .stat-value {
   font-size: 28px;
   font-size: 28px;
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
   line-height: 1.2;
   line-height: 1.2;
 }
 }
 
 
 .stat-label {
 .stat-label {
-  color: #64748B;
+  color: var(--adm-text-45);
   font-size: 14px;
   font-size: 14px;
   margin-top: 4px;
   margin-top: 4px;
 }
 }
 
 
 .stat-trend {
 .stat-trend {
   font-size: 12px;
   font-size: 12px;
-  color: #1677FF;
+  color: var(--adm-primary);
   margin-top: 8px;
   margin-top: 8px;
 }
 }
 
 
 .stat-trend.disabled {
 .stat-trend.disabled {
-  color: #94A3B8;
+  color: var(--adm-text-45);
 }
 }
 
 
 /* 内容卡片 */
 /* 内容卡片 */
@@ -709,7 +709,7 @@ initMemberPieChart() {
 
 
 .content-card {
 .content-card {
   border-radius: 8px;
   border-radius: 8px;
-  border: 1px solid #F0F0F0;
+  border: 1px solid var(--adm-border-split);
   margin-bottom: 20px;
   margin-bottom: 20px;
 }
 }
 
 
@@ -722,25 +722,25 @@ initMemberPieChart() {
 .card-title {
 .card-title {
   font-size: 16px;
   font-size: 16px;
   font-weight: 600;
   font-weight: 600;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 /* 表格样式 */
 /* 表格样式 */
 .custom-table ::v-deep .el-table__header th {
 .custom-table ::v-deep .el-table__header th {
-  background: #F8FAFC;
-  color: #64748B;
+  background: var(--adm-bg-header);
+  color: var(--adm-text-45);
   font-weight: 600;
   font-weight: 600;
 }
 }
 
 
 .points-text {
 .points-text {
-  color: #F59E0B;
+  color: var(--adm-warning);
   font-weight: 600;
   font-weight: 600;
 }
 }
 
 
 /* 系统健康面板 */
 /* 系统健康面板 */
 .system-health-card {
 .system-health-card {
   border-radius: 8px;
   border-radius: 8px;
-  border: 1px solid #F0F0F0;
+  border: 1px solid var(--adm-border-split);
 }
 }
 
 
 .health-grid {
 .health-grid {
@@ -769,31 +769,31 @@ initMemberPieChart() {
 }
 }
 
 
 .health-icon--status {
 .health-icon--status {
-  background: #F6FFED; color: #389E0D;
+  background: var(--adm-success-bg); color: var(--adm-success-text);
 }
 }
 
 
 .health-icon--version {
 .health-icon--version {
-  background: #E6F4FF; color: #1677FF;
+  background: var(--adm-info-bg); color: var(--adm-primary);
 }
 }
 
 
 .health-icon--time {
 .health-icon--time {
-  background: #FFFBE6; color: #D48806;
+  background: var(--adm-warning-bg); color: var(--adm-warning-text);
 }
 }
 
 
 .health-icon--api {
 .health-icon--api {
-  background: #E6F4FF; color: #1677FF;
+  background: var(--adm-info-bg); color: var(--adm-primary);
 }
 }
 
 
 .health-icon--uptime {
 .health-icon--uptime {
-  background: #E6F4FF; color: #1677FF;
+  background: var(--adm-info-bg); color: var(--adm-primary);
 }
 }
 
 
 .health-icon--cpu {
 .health-icon--cpu {
-  background: #FFF1F0; color: #CF1322;
+  background: var(--adm-error-bg); color: var(--adm-error-text);
 }
 }
 
 
 .health-icon--memory {
 .health-icon--memory {
-  background: #F6FFED; color: #389E0D;
+  background: var(--adm-success-bg); color: var(--adm-success-text);
 }
 }
 
 
 .health-info {
 .health-info {
@@ -802,24 +802,24 @@ initMemberPieChart() {
 
 
 .health-label {
 .health-label {
   font-size: 12px;
   font-size: 12px;
-  color: #9ca3af;
+  color: var(--adm-text-45);
   margin-bottom: 2px;
   margin-bottom: 2px;
 }
 }
 
 
 .health-value {
 .health-value {
   font-size: 14px;
   font-size: 14px;
   font-weight: 600;
   font-weight: 600;
-  color: #1f2937;
+  color: var(--adm-text-88);
 }
 }
 
 
 .health-value--online {
 .health-value--online {
-  color: #10B981;
+  color: var(--adm-success);
 }
 }
 
 
 .health-links {
 .health-links {
   margin-top: 16px;
   margin-top: 16px;
   padding-top: 16px;
   padding-top: 16px;
-  border-top: 1px solid #f3f4f6;
+  border-top: 1px solid var(--adm-border-split);
   display: flex;
   display: flex;
   gap: 8px;
   gap: 8px;
 }
 }
@@ -845,18 +845,18 @@ initMemberPieChart() {
 }
 }
 
 
 .quick-item:hover {
 .quick-item:hover {
-  background: #F8FAFC;
+  background: var(--adm-bg-header);
 }
 }
 
 
 .quick-item i {
 .quick-item i {
   font-size: 24px;
   font-size: 24px;
-  color: #1677FF;
+  color: var(--adm-primary);
   margin-bottom: 8px;
   margin-bottom: 8px;
 }
 }
 
 
 .quick-item span {
 .quick-item span {
   font-size: 12px;
   font-size: 12px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 /* 快捷操作 4x2 网格 */
 /* 快捷操作 4x2 网格 */
@@ -871,7 +871,7 @@ initMemberPieChart() {
 .section-title {
 .section-title {
   font-size: 16px;
   font-size: 16px;
   font-weight: 600;
   font-weight: 600;
-  color: #1f2937;
+  color: var(--adm-text-88);
 }
 }
 
 
 .quick-actions-grid {
 .quick-actions-grid {
@@ -887,13 +887,13 @@ initMemberPieChart() {
   text-align: center;
   text-align: center;
   cursor: pointer;
   cursor: pointer;
   transition: all 0.2s ease;
   transition: all 0.2s ease;
-  border: 1px solid #f3f4f6;
+  border: 1px solid var(--adm-border-split);
 }
 }
 
 
 .action-card:hover {
 .action-card:hover {
   transform: translateY(-2px);
   transform: translateY(-2px);
   box-shadow: 0 4px 12px rgba(0,0,0,0.08);
   box-shadow: 0 4px 12px rgba(0,0,0,0.08);
-  border-color: #e5e7eb;
+  border-color: var(--adm-border-base);
 }
 }
 
 
 .action-icon {
 .action-icon {
@@ -909,40 +909,40 @@ initMemberPieChart() {
 }
 }
 
 
 .action-icon--primary {
 .action-icon--primary {
-  background: #FFFBE6; color: #D48806;
+  background: var(--adm-warning-bg); color: var(--adm-warning-text);
 }
 }
 
 
 .action-icon--family {
 .action-icon--family {
-  background: #E6F4FF; color: #1677FF;
+  background: var(--adm-info-bg); color: var(--adm-primary);
 }
 }
 
 
 .action-icon--guide {
 .action-icon--guide {
-  background: #FFFBE6; color: #D48806;
+  background: var(--adm-warning-bg); color: var(--adm-warning-text);
 }
 }
 
 
 .action-icon--package {
 .action-icon--package {
-  background: #F6FFED; color: #389E0D;
+  background: var(--adm-success-bg); color: var(--adm-success-text);
 }
 }
 
 
 .action-icon--reward {
 .action-icon--reward {
-  background: #FFF1F0; color: #CF1322;
+  background: var(--adm-error-bg); color: var(--adm-error-text);
 }
 }
 
 
 .action-icon--user {
 .action-icon--user {
-  background: #E6F4FF; color: #1677FF;
+  background: var(--adm-info-bg); color: var(--adm-primary);
 }
 }
 
 
 .action-icon--audit {
 .action-icon--audit {
-  background: #E6F4FF; color: #1677FF;
+  background: var(--adm-info-bg); color: var(--adm-primary);
 }
 }
 
 
 .action-icon--settings {
 .action-icon--settings {
-  background: #F5F5F5; color: rgba(0,0,0,0.45);
+  background: var(--adm-fill); color: rgba(0,0,0,0.45);
 }
 }
 
 
 .action-label {
 .action-label {
   font-size: 13px;
   font-size: 13px;
-  color: #374151;
+  color: var(--adm-text-65);
   font-weight: 500;
   font-weight: 500;
 }
 }
 
 
@@ -952,7 +952,7 @@ initMemberPieChart() {
 }
 }
 .chart-card {
 .chart-card {
   border-radius: 8px;
   border-radius: 8px;
-  border: 1px solid #F0F0F0;
+  border: 1px solid var(--adm-border-split);
   min-height: 320px;
   min-height: 320px;
 }
 }
 .echarts-container {
 .echarts-container {
@@ -970,27 +970,27 @@ initMemberPieChart() {
   padding: 8px 4px;
   padding: 8px 4px;
   line-height: 1.8;
   line-height: 1.8;
   font-size: 14px;
   font-size: 14px;
-  color: #374151;
+  color: var(--adm-text-65);
 }
 }
 .changelog-body h1 {
 .changelog-body h1 {
   font-size: 20px;
   font-size: 20px;
   font-weight: 700;
   font-weight: 700;
   margin: 16px 0 8px;
   margin: 16px 0 8px;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 .changelog-body h2 {
 .changelog-body h2 {
   font-size: 17px;
   font-size: 17px;
   font-weight: 600;
   font-weight: 600;
   margin: 14px 0 6px;
   margin: 14px 0 6px;
-  color: #1E293B;
-  border-left: 3px solid #1677FF;
+  color: var(--adm-text-88);
+  border-left: 3px solid var(--adm-primary);
   padding-left: 8px;
   padding-left: 8px;
 }
 }
 .changelog-body h3 {
 .changelog-body h3 {
   font-size: 15px;
   font-size: 15px;
   font-weight: 600;
   font-weight: 600;
   margin: 10px 0 4px;
   margin: 10px 0 4px;
-  color: #374151;
+  color: var(--adm-text-65);
 }
 }
 .changelog-body ul {
 .changelog-body ul {
   margin: 4px 0 8px;
   margin: 4px 0 8px;
@@ -1004,18 +1004,18 @@ initMemberPieChart() {
 }
 }
 .changelog-body .cl-empty {
 .changelog-body .cl-empty {
   text-align: center;
   text-align: center;
-  color: #94A3B8;
+  color: var(--adm-text-45);
   padding: 32px 0;
   padding: 32px 0;
 }
 }
 .changelog-body code {
 .changelog-body code {
-  background: #F1F5F9;
+  background: var(--adm-bg-header);
   padding: 2px 6px;
   padding: 2px 6px;
   border-radius: 3px;
   border-radius: 3px;
   font-size: 13px;
   font-size: 13px;
 }
 }
 .changelog-body pre {
 .changelog-body pre {
-  background: #F8FAFC;
-  border: 1px solid #E2E8F0;
+  background: var(--adm-bg-header);
+  border: 1px solid var(--adm-border-split);
   border-radius: 8px;
   border-radius: 8px;
   padding: 12px;
   padding: 12px;
   overflow-x: auto;
   overflow-x: auto;
@@ -1025,7 +1025,7 @@ initMemberPieChart() {
   padding: 0;
   padding: 0;
 }
 }
 .changelog-body a {
 .changelog-body a {
-  color: #1677FF;
+  color: var(--adm-primary);
   text-decoration: none;
   text-decoration: none;
 }
 }
 .changelog-body a:hover {
 .changelog-body a:hover {

+ 16 - 16
cfc-web/src/views/Layout.vue

@@ -14,8 +14,8 @@
           :default-active="activeMenu"
           :default-active="activeMenu"
           class="sidebar-menu"
           class="sidebar-menu"
           background-color="transparent"
           background-color="transparent"
-          text-color="#64748B"
-          active-text-color="#1677FF"
+          text-color="var(--adm-text-45)"
+          active-text-color="var(--adm-primary)"
           @select="handleMenuSelect"
           @select="handleMenuSelect"
         >
         >
 <template v-for="item in effectiveMenuItems">
 <template v-for="item in effectiveMenuItems">
@@ -708,7 +708,7 @@ export default {
   height: 60px;
   height: 60px;
   line-height: 60px;
   line-height: 60px;
   text-align: center;
   text-align: center;
-  color: #fff;
+  color: var(--adm-bg-container);
   font-size: 20px;
   font-size: 20px;
   font-weight: bold;
   font-weight: bold;
   background-color: #001529;
   background-color: #001529;
@@ -744,7 +744,7 @@ export default {
 }
 }
 
 
 .el-header {
 .el-header {
-  background-color: #fff;
+  background-color: var(--adm-bg-container);
   box-shadow: 0 1px 4px rgba(0,21,41,.08);
   box-shadow: 0 1px 4px rgba(0,21,41,.08);
   display: flex;
   display: flex;
   justify-content: space-between;
   justify-content: space-between;
@@ -763,7 +763,7 @@ export default {
 }
 }
 
 
 .invite-code-btn {
 .invite-code-btn {
-  color: #1677FF;
+  color: var(--adm-primary);
   font-size: 13px;
   font-size: 13px;
 }
 }
 .invite-code-btn:hover {
 .invite-code-btn:hover {
@@ -783,7 +783,7 @@ export default {
   padding: 4px;
   padding: 4px;
 }
 }
 .msg-btn:hover {
 .msg-btn:hover {
-  color: #1677FF;
+  color: var(--adm-primary);
 }
 }
 
 
 .invite-code-content {
 .invite-code-content {
@@ -791,8 +791,8 @@ export default {
 }
 }
 
 
 .invite-code-section {
 .invite-code-section {
-  background: #F8FAFC;
-  border: 1px solid #E2E8F0;
+  background: var(--adm-bg-header);
+  border: 1px solid var(--adm-border-split);
   border-radius: 8px;
   border-radius: 8px;
   padding: 20px;
   padding: 20px;
   text-align: center;
   text-align: center;
@@ -800,7 +800,7 @@ export default {
 
 
 .invite-code-label {
 .invite-code-label {
   font-size: 14px;
   font-size: 14px;
-  color: #64748B;
+  color: var(--adm-text-45);
   margin-bottom: 12px;
   margin-bottom: 12px;
 }
 }
 
 
@@ -816,14 +816,14 @@ export default {
   font-size: 28px;
   font-size: 28px;
   font-weight: 700;
   font-weight: 700;
   letter-spacing: 6px;
   letter-spacing: 6px;
-  color: #1E293B;
+  color: var(--adm-text-88);
   font-family: monospace;
   font-family: monospace;
 }
 }
 
 
 .no-invite-code {
 .no-invite-code {
   text-align: center;
   text-align: center;
   padding: 24px;
   padding: 24px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
 }
 }
 .no-invite-code i {
 .no-invite-code i {
   font-size: 48px;
   font-size: 48px;
@@ -935,7 +935,7 @@ export default {
     padding: 8px;
     padding: 8px;
   }
   }
   .hamburger-btn:hover {
   .hamburger-btn:hover {
-    color: #1677FF;
+    color: var(--adm-primary);
   }
   }
 
 
   .el-header {
   .el-header {
@@ -1031,22 +1031,22 @@ export default {
 .menu-load-failed {
 .menu-load-failed {
   padding: 24px 16px;
   padding: 24px 16px;
   text-align: center;
   text-align: center;
-  color: #94a3b8;
+  color: var(--adm-text-45);
 }
 }
 .menu-load-failed .el-icon-warning-outline {
 .menu-load-failed .el-icon-warning-outline {
   font-size: 28px;
   font-size: 28px;
-  color: #f59e0b;
+  color: var(--adm-warning);
 }
 }
 .menu-load-failed-title {
 .menu-load-failed-title {
   margin: 8px 0 0;
   margin: 8px 0 0;
   font-size: 13px;
   font-size: 13px;
   font-weight: 600;
   font-weight: 600;
-  color: #64748b;
+  color: var(--adm-text-45);
 }
 }
 .menu-load-failed-sub {
 .menu-load-failed-sub {
   margin: 4px 0 0;
   margin: 4px 0 0;
   font-size: 12px;
   font-size: 12px;
-  color: #94a3b8;
+  color: var(--adm-text-45);
 }
 }
 
 
 </style>
 </style>

+ 27 - 27
cfc-web/src/views/TeacherDashboard.vue

@@ -26,25 +26,25 @@
           <div class="td-quick-actions">
           <div class="td-quick-actions">
             <div class="td-action-item" @click="$router.push('/teacher-families')">
             <div class="td-action-item" @click="$router.push('/teacher-families')">
               <div class="td-action-icon" style="background: #EBF5FF">
               <div class="td-action-icon" style="background: #EBF5FF">
-                <i class="el-icon-user" style="color: #3B82F6"></i>
+                <i class="el-icon-user" style="color: var(--adm-primary)"></i>
               </div>
               </div>
               <span>管理家庭</span>
               <span>管理家庭</span>
             </div>
             </div>
             <div class="td-action-item" @click="$router.push('/teacher-messages')">
             <div class="td-action-item" @click="$router.push('/teacher-messages')">
               <div class="td-action-icon" style="background: #ECFDF5">
               <div class="td-action-icon" style="background: #ECFDF5">
-                <i class="el-icon-chat-line-round" style="color: #10B981"></i>
+                <i class="el-icon-chat-line-round" style="color: var(--adm-success)"></i>
               </div>
               </div>
               <span>消息中心</span>
               <span>消息中心</span>
             </div>
             </div>
             <div class="td-action-item" @click="$router.push('/teacher-orders')">
             <div class="td-action-item" @click="$router.push('/teacher-orders')">
               <div class="td-action-icon" style="background: #FFFBEB">
               <div class="td-action-icon" style="background: #FFFBEB">
-                <i class="el-icon-document" style="color: #F59E0B"></i>
+                <i class="el-icon-document" style="color: var(--adm-warning)"></i>
               </div>
               </div>
               <span>查看订单</span>
               <span>查看订单</span>
             </div>
             </div>
             <div class="td-action-item" @click="$router.push('/teacher-assessment')">
             <div class="td-action-item" @click="$router.push('/teacher-assessment')">
               <div class="td-action-icon" style="background: #F5F3FF">
               <div class="td-action-icon" style="background: #F5F3FF">
-                <i class="el-icon-edit-outline" style="color: #1677FF"></i>
+                <i class="el-icon-edit-outline" style="color: var(--adm-primary)"></i>
               </div>
               </div>
               <span>DAN测评</span>
               <span>DAN测评</span>
             </div>
             </div>
@@ -65,19 +65,19 @@
           </div>
           </div>
           <div class="td-today-stats">
           <div class="td-today-stats">
             <div class="td-today-stat-item">
             <div class="td-today-stat-item">
-              <div class="td-today-stat-value" style="color: #3B82F6">{{ todayStats.newFamilies }}</div>
+              <div class="td-today-stat-value" style="color: var(--adm-primary)">{{ todayStats.newFamilies }}</div>
               <div class="td-today-stat-label">新增家庭</div>
               <div class="td-today-stat-label">新增家庭</div>
             </div>
             </div>
             <div class="td-today-stat-item">
             <div class="td-today-stat-item">
-              <div class="td-today-stat-value" style="color: #10B981">{{ todayStats.completedTasks }}</div>
+              <div class="td-today-stat-value" style="color: var(--adm-success)">{{ todayStats.completedTasks }}</div>
               <div class="td-today-stat-label">完成任务</div>
               <div class="td-today-stat-label">完成任务</div>
             </div>
             </div>
             <div class="td-today-stat-item">
             <div class="td-today-stat-item">
-              <div class="td-today-stat-value" style="color: #F59E0B">{{ todayStats.newOrders }}</div>
+              <div class="td-today-stat-value" style="color: var(--adm-warning)">{{ todayStats.newOrders }}</div>
               <div class="td-today-stat-label">新订单</div>
               <div class="td-today-stat-label">新订单</div>
             </div>
             </div>
             <div class="td-today-stat-item">
             <div class="td-today-stat-item">
-              <div class="td-today-stat-value" style="color: #1677FF">{{ todayStats.pendingReviews }}</div>
+              <div class="td-today-stat-value" style="color: var(--adm-primary)">{{ todayStats.pendingReviews }}</div>
               <div class="td-today-stat-label">待审核</div>
               <div class="td-today-stat-label">待审核</div>
             </div>
             </div>
           </div>
           </div>
@@ -287,38 +287,38 @@ export default {
 .td-stat-row { margin-bottom: 24px; }
 .td-stat-row { margin-bottom: 24px; }
 .td-section-row { margin-bottom: 24px; }
 .td-section-row { margin-bottom: 24px; }
 .td-card-header { display: flex; justify-content: space-between; align-items: center; }
 .td-card-header { display: flex; justify-content: space-between; align-items: center; }
-.td-card-title { font-size: 16px; font-weight: 600; color: #1E293B; }
-.td-card-date { font-size: 13px; color: #64748B; }
+.td-card-title { font-size: 16px; font-weight: 600; color: var(--adm-text-88); }
+.td-card-date { font-size: 13px; color: var(--adm-text-45); }
 .td-quick-card, .td-overview-card, .td-list-card, .td-orders-card { border-radius: 16px; border: none; box-shadow: 0 2px 12px rgba(59,130,246,0.06); }
 .td-quick-card, .td-overview-card, .td-list-card, .td-orders-card { border-radius: 16px; border: none; box-shadow: 0 2px 12px rgba(59,130,246,0.06); }
-.td-quick-card >>> .el-card__header, .td-overview-card >>> .el-card__header, .td-list-card >>> .el-card__header, .td-orders-card >>> .el-card__header { border-bottom: 1px solid #F1F5F9; padding: 16px 20px; }
+.td-quick-card >>> .el-card__header, .td-overview-card >>> .el-card__header, .td-list-card >>> .el-card__header, .td-orders-card >>> .el-card__header { border-bottom: 1px solid var(--adm-bg-header); padding: 16px 20px; }
 .td-quick-actions { display: flex; flex-wrap: wrap; gap: 16px; }
 .td-quick-actions { display: flex; flex-wrap: wrap; gap: 16px; }
-.td-action-item { flex: 1 1 calc(50% - 8px); min-width: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px; background: #F8FAFC; border-radius: 12px; cursor: pointer; transition: all 0.2s; box-sizing: border-box; }
-.td-action-item:hover { background: #F1F5F9; transform: translateY(-2px); }
+.td-action-item { flex: 1 1 calc(50% - 8px); min-width: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px; background: var(--adm-bg-header); border-radius: 12px; cursor: pointer; transition: all 0.2s; box-sizing: border-box; }
+.td-action-item:hover { background: var(--adm-bg-header); transform: translateY(-2px); }
 .td-action-icon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 8px; font-size: 20px; }
 .td-action-icon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 8px; font-size: 20px; }
-.td-action-item span { font-size: 13px; color: #64748B; }
+.td-action-item span { font-size: 13px; color: var(--adm-text-45); }
 .td-today-stats { display: flex; flex-wrap: wrap; gap: 16px; }
 .td-today-stats { display: flex; flex-wrap: wrap; gap: 16px; }
-.td-today-stat-item { flex: 1 1 calc(25% - 12px); min-width: 100px; text-align: center; padding: 12px; background: #F8FAFC; border-radius: 12px; box-sizing: border-box; }
+.td-today-stat-item { flex: 1 1 calc(25% - 12px); min-width: 100px; text-align: center; padding: 12px; background: var(--adm-bg-header); border-radius: 12px; box-sizing: border-box; }
 .td-today-stat-value { font-size: 28px; font-weight: 700; line-height: 1.2; }
 .td-today-stat-value { font-size: 28px; font-weight: 700; line-height: 1.2; }
-.td-today-stat-label { font-size: 13px; color: #64748B; margin-top: 4px; }
+.td-today-stat-label { font-size: 13px; color: var(--adm-text-45); margin-top: 4px; }
 .td-family-list, .td-team-list { max-height: 400px; overflow-y: auto; }
 .td-family-list, .td-team-list { max-height: 400px; overflow-y: auto; }
-.td-family-item, .td-team-item { display: flex; align-items: center; padding: 12px 0; border-bottom: 1px solid #F1F5F9; }
+.td-family-item, .td-team-item { display: flex; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--adm-bg-header); }
 .td-family-item:last-child, .td-team-item:last-child { border-bottom: none; }
 .td-family-item:last-child, .td-team-item:last-child { border-bottom: none; }
-.td-family-avatar, .td-member-avatar { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #EBF5FF; color: #3B82F6; font-size: 20px; margin-right: 12px; flex-shrink: 0; }
+.td-family-avatar, .td-member-avatar { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #EBF5FF; color: var(--adm-primary); font-size: 20px; margin-right: 12px; flex-shrink: 0; }
 .td-family-info, .td-member-info { flex: 1; min-width: 0; }
 .td-family-info, .td-member-info { flex: 1; min-width: 0; }
-.td-family-name, .td-member-name { font-size: 14px; font-weight: 600; color: #1E293B; margin-bottom: 4px; }
+.td-family-name, .td-member-name { font-size: 14px; font-weight: 600; color: var(--adm-text-88); margin-bottom: 4px; }
 .td-family-meta { display: flex; gap: 12px; }
 .td-family-meta { display: flex; gap: 12px; }
-.td-meta-tag { font-size: 12px; color: #64748B; }
+.td-meta-tag { font-size: 12px; color: var(--adm-text-45); }
 .td-meta-tag i { margin-right: 2px; }
 .td-meta-tag i { margin-right: 2px; }
 .td-family-stats { text-align: center; margin-left: 12px; }
 .td-family-stats { text-align: center; margin-left: 12px; }
 .td-member-level { margin-top: 2px; }
 .td-member-level { margin-top: 2px; }
 .td-member-performance { text-align: right; margin-left: 12px; }
 .td-member-performance { text-align: right; margin-left: 12px; }
-.td-performance-value { font-size: 14px; font-weight: 600; color: #1E293B; }
-.td-performance-label { font-size: 11px; color: #64748B; margin-top: 2px; }
-.td-empty-state { text-align: center; padding: 40px 0; color: #94A3B8; }
+.td-performance-value { font-size: 14px; font-weight: 600; color: var(--adm-text-88); }
+.td-performance-label { font-size: 11px; color: var(--adm-text-45); margin-top: 2px; }
+.td-empty-state { text-align: center; padding: 40px 0; color: var(--adm-text-45); }
 .td-empty-state i { font-size: 40px; margin-bottom: 8px; }
 .td-empty-state i { font-size: 40px; margin-bottom: 8px; }
 .td-empty-state p { font-size: 14px; margin: 0; }
 .td-empty-state p { font-size: 14px; margin: 0; }
-.td-orders-table >>> .el-table__header th { background: #F8FAFC; color: #64748B; font-weight: 600; }
-.td-order-no { color: #3B82F6; font-weight: 500; }
-.td-family-cell i { margin-right: 4px; color: #64748B; }
-.td-amount-value { font-weight: 600; color: #1E293B; }
+.td-orders-table >>> .el-table__header th { background: var(--adm-bg-header); color: var(--adm-text-45); font-weight: 600; }
+.td-order-no { color: var(--adm-primary); font-weight: 500; }
+.td-family-cell i { margin-right: 4px; color: var(--adm-text-45); }
+.td-amount-value { font-weight: 600; color: var(--adm-text-88); }
 </style>
 </style>

+ 23 - 23
cfc-web/src/views/admin/Dashboard.vue

@@ -341,8 +341,8 @@ export default {
         xAxis: { type: 'category', data: this.trafficDates, axisLabel: { rotate: 45, interval: 2, fontSize: 10 } },
         xAxis: { type: 'category', data: this.trafficDates, axisLabel: { rotate: 45, interval: 2, fontSize: 10 } },
         yAxis: { type: 'value' },
         yAxis: { type: 'value' },
         series: [
         series: [
-          { name: 'PV', type: 'bar', barWidth: '30%', data: this.pvData, itemStyle: { color: '#3B82F6', borderRadius: [4, 4, 0, 0] } },
-          { name: 'UV', type: 'line', smooth: true, data: this.uvData, lineStyle: { color: '#10B981', width: 2 }, itemStyle: { color: '#10B981' } }
+          { name: 'PV', type: 'bar', barWidth: '30%', data: this.pvData, itemStyle: { color: '#1677FF', borderRadius: [4, 4, 0, 0] } },
+          { name: 'UV', type: 'line', smooth: true, data: this.uvData, lineStyle: { color: '#52C41A', width: 2 }, itemStyle: { color: '#52C41A' } }
         ]
         ]
       })
       })
     },
     },
@@ -362,7 +362,7 @@ export default {
           label: { show: false },
           label: { show: false },
           emphasis: { label: { show: true, fontSize: 13, fontWeight: 'bold' } },
           emphasis: { label: { show: true, fontSize: 13, fontWeight: 'bold' } },
           data: this.sharePieData,
           data: this.sharePieData,
-          color: ['#F97316', '#3B82F6', '#10B981', '#8B5CF6', '#EC4899']
+          color: ['#F97316', '#1677FF', '#52C41A', '#8B5CF6', '#EC4899']
         }]
         }]
       })
       })
     },
     },
@@ -400,7 +400,7 @@ export default {
           data: [
           data: [
             { value: this.membershipData.freeCount || 0, name: '免费用户', itemStyle: { color: '#94A3B8' } },
             { value: this.membershipData.freeCount || 0, name: '免费用户', itemStyle: { color: '#94A3B8' } },
             { value: this.membershipData.familyCount || 0, name: '家庭会员', itemStyle: { color: '#F97316' } },
             { value: this.membershipData.familyCount || 0, name: '家庭会员', itemStyle: { color: '#F97316' } },
-            { value: this.membershipData.providerCount || 0, name: '服务商', itemStyle: { color: '#10B981' } }
+            { value: this.membershipData.providerCount || 0, name: '服务商', itemStyle: { color: '#52C41A' } }
           ]
           ]
         }]
         }]
       })
       })
@@ -432,11 +432,11 @@ export default {
 .dashboard-container { padding: 20px; }
 .dashboard-container { padding: 20px; }
 .section-row { margin-top: 16px; }
 .section-row { margin-top: 16px; }
 .section-card { margin-bottom: 0; }
 .section-card { margin-bottom: 0; }
-.card-header { font-weight: 600; font-size: 15px; color: #1E293B; }
+.card-header { font-weight: 600; font-size: 15px; color: var(--adm-text-88); }
 .card-header i { margin-right: 6px; }
 .card-header i { margin-right: 6px; }
 .stat-card {
 .stat-card {
   display: flex; align-items: center; padding: 16px 12px;
   display: flex; align-items: center; padding: 16px 12px;
-  background: #fff; border-radius: 8px; border: 1px solid #f0f0f0;
+  background: var(--adm-bg-container); border-radius: 8px; border: 1px solid var(--adm-border-split);
   transition: all 0.25s ease; margin-bottom: 12px;
   transition: all 0.25s ease; margin-bottom: 12px;
 }
 }
 .stat-card:hover {
 .stat-card:hover {
@@ -449,43 +449,43 @@ export default {
   font-size: 22px; margin-right: 12px; flex-shrink: 0;
   font-size: 22px; margin-right: 12px; flex-shrink: 0;
 }
 }
 .stat-orange .stat-icon-wrap { background: #FEF3C7; color: #F97316; }
 .stat-orange .stat-icon-wrap { background: #FEF3C7; color: #F97316; }
-.stat-blue .stat-icon-wrap   { background: #DBEAFE; color: #3B82F6; }
+.stat-blue .stat-icon-wrap   { background: #DBEAFE; color: var(--adm-primary); }
 .stat-cyan .stat-icon-wrap   { background: #CFFAFE; color: #06B6D4; }
 .stat-cyan .stat-icon-wrap   { background: #CFFAFE; color: #06B6D4; }
-.stat-green .stat-icon-wrap  { background: #D1FAE5; color: #10B981; }
-.stat-red .stat-icon-wrap    { background: #FEE2E2; color: #EF4444; }
-.stat-purple .stat-icon-wrap { background: #EDE9FE; color: #1677FF; }
+.stat-green .stat-icon-wrap  { background: #D1FAE5; color: var(--adm-success); }
+.stat-red .stat-icon-wrap    { background: #FEE2E2; color: var(--adm-error); }
+.stat-purple .stat-icon-wrap { background: #EDE9FE; color: var(--adm-primary); }
 .stat-body { flex: 1; min-width: 0; }
 .stat-body { flex: 1; min-width: 0; }
-.stat-value { font-size: 24px; font-weight: 700; color: #1E293B; line-height: 1.2; }
-.stat-label { font-size: 13px; color: #94A3B8; margin-top: 2px; }
+.stat-value { font-size: 24px; font-weight: 700; color: var(--adm-text-88); line-height: 1.2; }
+.stat-label { font-size: 13px; color: var(--adm-text-45); margin-top: 2px; }
 .chart-card { min-height: 320px; }
 .chart-card { min-height: 320px; }
 .echarts-container { height: 260px; width: 100%; }
 .echarts-container { height: 260px; width: 100%; }
 .revenue-card { min-height: 140px; }
 .revenue-card { min-height: 140px; }
 .revenue-body { text-align: center; padding: 8px 0; }
 .revenue-body { text-align: center; padding: 8px 0; }
 .revenue-value { font-size: 28px; font-weight: 700; line-height: 1.3; }
 .revenue-value { font-size: 28px; font-weight: 700; line-height: 1.3; }
 .revenue-orange { color: #F97316; }
 .revenue-orange { color: #F97316; }
-.revenue-green  { color: #10B981; }
-.revenue-blue   { color: #3B82F6; }
-.revenue-sub { font-size: 13px; color: #94A3B8; margin-top: 6px; }
+.revenue-green  { color: var(--adm-success); }
+.revenue-blue   { color: var(--adm-primary); }
+.revenue-sub { font-size: 13px; color: var(--adm-text-45); margin-top: 6px; }
 .hot-card { min-height: 200px; }
 .hot-card { min-height: 200px; }
 .hot-list { padding: 8px 0; }
 .hot-list { padding: 8px 0; }
 .hot-item {
 .hot-item {
   display: flex; align-items: center; padding: 8px 12px;
   display: flex; align-items: center; padding: 8px 12px;
-  border-bottom: 1px solid #f5f5f5; transition: background 0.2s;
+  border-bottom: 1px solid var(--adm-fill); transition: background 0.2s;
 }
 }
-.hot-item:hover { background: #fafafa; }
+.hot-item:hover { background: var(--adm-bg-header); }
 .hot-item:last-child { border-bottom: none; }
 .hot-item:last-child { border-bottom: none; }
 .hot-rank {
 .hot-rank {
   width: 24px; height: 24px; border-radius: 50%;
   width: 24px; height: 24px; border-radius: 50%;
   display: inline-flex; align-items: center; justify-content: center;
   display: inline-flex; align-items: center; justify-content: center;
   font-size: 12px; font-weight: 700; margin-right: 12px; flex-shrink: 0;
   font-size: 12px; font-weight: 700; margin-right: 12px; flex-shrink: 0;
 }
 }
-.rank-1 { background: #FEF3C7; color: #F59E0B; }
-.rank-2 { background: #F1F5F9; color: #64748B; }
+.rank-1 { background: #FEF3C7; color: var(--adm-warning); }
+.rank-2 { background: var(--adm-bg-header); color: var(--adm-text-45); }
 .rank-3 { background: #FFF7ED; color: #EA580C; }
 .rank-3 { background: #FFF7ED; color: #EA580C; }
-.rank-other { background: #F8FAFC; color: #94A3B8; }
-.hot-title { flex: 1; font-size: 13px; color: #374151; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.hot-value { font-size: 13px; color: #64748B; margin-left: 8px; }
-.hot-empty { text-align: center; color: #94A3B8; padding: 20px 0; font-size: 13px; }
+.rank-other { background: var(--adm-bg-header); color: var(--adm-text-45); }
+.hot-title { flex: 1; font-size: 13px; color: var(--adm-text-65); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.hot-value { font-size: 13px; color: var(--adm-text-45); margin-left: 8px; }
+.hot-empty { text-align: center; color: var(--adm-text-45); padding: 20px 0; font-size: 13px; }
 @media (max-width: 768px) {
 @media (max-width: 768px) {
   .dashboard-container { padding: 12px; }
   .dashboard-container { padding: 12px; }
   .stat-card { padding: 12px 10px; }
   .stat-card { padding: 12px 10px; }

+ 13 - 13
cfc-web/src/views/admin/MenuManage.vue

@@ -709,7 +709,7 @@ export default {
 
 
 .role-col-header {
 .role-col-header {
   font-weight: 600;
   font-weight: 600;
-  color: #303133;
+  color: var(--adm-text-88);
   margin-bottom: 12px;
   margin-bottom: 12px;
   font-size: 13px;
   font-size: 13px;
 }
 }
@@ -736,7 +736,7 @@ export default {
   align-items: center;
   align-items: center;
   justify-content: space-between;
   justify-content: space-between;
   font-weight: 600;
   font-weight: 600;
-  color: #303133;
+  color: var(--adm-text-88);
   margin-bottom: 12px;
   margin-bottom: 12px;
   font-size: 13px;
   font-size: 13px;
 }
 }
@@ -785,7 +785,7 @@ export default {
 }
 }
 
 
 .menu-role-desc {
 .menu-role-desc {
-  color: #909399;
+  color: var(--adm-text-45);
   font-size: 12px;
   font-size: 12px;
   margin: 12px 0;
   margin: 12px 0;
 }
 }
@@ -807,7 +807,7 @@ export default {
 .menu-count {
 .menu-count {
   font-weight: normal;
   font-weight: normal;
   font-size: 12px;
   font-size: 12px;
-  color: #909399;
+  color: var(--adm-text-45);
 }
 }
 
 
 .empty-state .el-empty {
 .empty-state .el-empty {
@@ -822,13 +822,13 @@ export default {
 .parent-hint {
 .parent-hint {
   margin-top: 8px;
   margin-top: 8px;
   font-size: 12px;
   font-size: 12px;
-  color: #909399;
+  color: var(--adm-text-45);
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   gap: 4px;
   gap: 4px;
 }
 }
 .parent-hint-top {
 .parent-hint-top {
-  color: #67c23a;
+  color: var(--adm-success);
 }
 }
 .custom-tree-node {
 .custom-tree-node {
   font-size: 13px;
   font-size: 13px;
@@ -850,10 +850,10 @@ export default {
 }
 }
 .icon-picker-clear-btn {
 .icon-picker-clear-btn {
   cursor: pointer;
   cursor: pointer;
-  color: #909399;
+  color: var(--adm-text-45);
 }
 }
 .icon-picker-clear-btn:hover {
 .icon-picker-clear-btn:hover {
-  color: #f56c6c;
+  color: var(--adm-error);
 }
 }
 .icon-picker-panel {
 .icon-picker-panel {
   display: flex;
   display: flex;
@@ -892,22 +892,22 @@ export default {
   color: #606266;
   color: #606266;
 }
 }
 .icon-picker-item:hover {
 .icon-picker-item:hover {
-  border-color: #409eff;
+  border-color: var(--adm-primary);
   background: #ecf5ff;
   background: #ecf5ff;
 }
 }
 .icon-picker-item:hover i {
 .icon-picker-item:hover i {
-  color: #409eff;
+  color: var(--adm-primary);
 }
 }
 .icon-picker-item.is-active {
 .icon-picker-item.is-active {
-  border-color: #409eff;
+  border-color: var(--adm-primary);
   background: #ecf5ff;
   background: #ecf5ff;
 }
 }
 .icon-picker-item.is-active i {
 .icon-picker-item.is-active i {
-  color: #409eff;
+  color: var(--adm-primary);
 }
 }
 .icon-picker-item-name {
 .icon-picker-item-name {
   font-size: 10px;
   font-size: 10px;
-  color: #909399;
+  color: var(--adm-text-45);
   max-width: 100%;
   max-width: 100%;
   overflow: hidden;
   overflow: hidden;
   text-overflow: ellipsis;
   text-overflow: ellipsis;

+ 25 - 25
cfc-web/src/views/admin/ProductEdit.vue

@@ -31,7 +31,7 @@
             <el-radio :label="1">是</el-radio>
             <el-radio :label="1">是</el-radio>
             <el-radio :label="0">否</el-radio>
             <el-radio :label="0">否</el-radio>
           </el-radio-group>
           </el-radio-group>
-          <span style="margin-left: 10px; font-size: 12px; color: #999;">开启后自动同步商品信息至营养产品,小程序营养产品详情可跳转购买</span>
+          <span style="margin-left: 10px; font-size: 12px; color: var(--adm-text-45);">开启后自动同步商品信息至营养产品,小程序营养产品详情可跳转购买</span>
         </el-form-item>
         </el-form-item>
 
 
         <el-form-item label="商品分类">
         <el-form-item label="商品分类">
@@ -40,12 +40,12 @@
               <el-option v-for="cat in group.options" :key="cat.id" :label="cat.label" :value="cat.id" />
               <el-option v-for="cat in group.options" :key="cat.id" :label="cat.label" :value="cat.id" />
             </el-option-group>
             </el-option-group>
           </el-select>
           </el-select>
-          <div style="font-size: 12px; color: #999; margin-top: 4px;">不选则不出现在商城分类筛选中;可在「商品分类管理」中维护分类</div>
+          <div style="font-size: 12px; color: var(--adm-text-45); margin-top: 4px;">不选则不出现在商城分类筛选中;可在「商品分类管理」中维护分类</div>
         </el-form-item>
         </el-form-item>
 
 
         <el-form-item label="商品标签">
         <el-form-item label="商品标签">
           <el-input v-model="form.tags" placeholder="逗号分隔,如: 育儿,亲子,心理" maxlength="200" clearable style="width: 400px;" />
           <el-input v-model="form.tags" placeholder="逗号分隔,如: 育儿,亲子,心理" maxlength="200" clearable style="width: 400px;" />
-          <div style="font-size: 12px; color: #999; margin-top: 4px;">用于小程序文章详情页「相关商品」推荐:标签与文章标签一字不差才会匹配,留空则不参与匹配</div>
+          <div style="font-size: 12px; color: var(--adm-text-45); margin-top: 4px;">用于小程序文章详情页「相关商品」推荐:标签与文章标签一字不差才会匹配,留空则不参与匹配</div>
         </el-form-item>
         </el-form-item>
 
 
         <!-- 测评商品扩展信息 -->
         <!-- 测评商品扩展信息 -->
@@ -94,7 +94,7 @@
               <el-button type="danger" size="mini" @click="removeBundleItem(idx)">删除</el-button>
               <el-button type="danger" size="mini" @click="removeBundleItem(idx)">删除</el-button>
             </div>
             </div>
             <el-button type="primary" size="mini" plain @click="addBundleItem()">+ 添加子商品</el-button>
             <el-button type="primary" size="mini" plain @click="addBundleItem()">+ 添加子商品</el-button>
-            <div style="margin-top:8px; font-size:12px; color:#999;">套餐出库时自动完成所有组成商品出库(数量 × 套餐数量)</div>
+            <div style="margin-top:8px; font-size:12px; color:var(--adm-text-45);">套餐出库时自动完成所有组成商品出库(数量 × 套餐数量)</div>
           </el-form-item>
           </el-form-item>
         </template>
         </template>
 
 
@@ -106,7 +106,7 @@
             active-text="开启"
             active-text="开启"
             inactive-text="关闭"
             inactive-text="关闭"
           />
           />
-          <span style="margin-left: 10px; font-size: 12px; color: #999;">在成长档案上传页推荐该商品</span>
+          <span style="margin-left: 10px; font-size: 12px; color: var(--adm-text-45);">在成长档案上传页推荐该商品</span>
         </el-form-item>
         </el-form-item>
 
 
         <el-form-item label="商品简介" prop="intro">
         <el-form-item label="商品简介" prop="intro">
@@ -115,7 +115,7 @@
 
 
         <el-form-item label="排序值">
         <el-form-item label="排序值">
           <el-input-number v-model="form.sortOrder" :min="0" :precision="0" style="width: 200px;" controls />
           <el-input-number v-model="form.sortOrder" :min="0" :precision="0" style="width: 200px;" controls />
-          <span style="margin-left: 10px; font-size: 12px; color: #999;">越小越靠前</span>
+          <span style="margin-left: 10px; font-size: 12px; color: var(--adm-text-45);">越小越靠前</span>
         </el-form-item>
         </el-form-item>
 
 
         <el-form-item label="商品描述" prop="description">
         <el-form-item label="商品描述" prop="description">
@@ -189,14 +189,14 @@
           <el-select v-model="form.distributionSystemId" placeholder="不属于任何体系" clearable :disabled="isSupplierAdmin" style="width: 100%" @change="handleSystemChange">
           <el-select v-model="form.distributionSystemId" placeholder="不属于任何体系" clearable :disabled="isSupplierAdmin" style="width: 100%" @change="handleSystemChange">
             <el-option v-for="s in supplySystems" :key="s.id" :label="s.name" :value="s.id"></el-option>
             <el-option v-for="s in supplySystems" :key="s.id" :label="s.name" :value="s.id"></el-option>
           </el-select>
           </el-select>
-          <span v-if="selectedSystem" style="font-size: 12px; color: #999; margin-left: 8px">
+          <span v-if="selectedSystem" style="font-size: 12px; color: var(--adm-text-45); margin-left: 8px">
             平台留利: {{ selectedSystem.platformProfitRate }}% → {{ selectedSystem.platformProfitRate * 10 }}‰
             平台留利: {{ selectedSystem.platformProfitRate }}% → {{ selectedSystem.platformProfitRate * 10 }}‰
           </span>
           </span>
         </el-form-item>
         </el-form-item>
 
 
         <el-form-item label="仅体系可见">
         <el-form-item label="仅体系可见">
           <el-switch v-model="form.vendorVisible" />
           <el-switch v-model="form.vendorVisible" />
-          <span style="margin-left: 10px; font-size: 12px; color: #999;">开启后仅所属供应体系的用户可在列表中看到该商品,分享商品详情页所有人可访问</span>
+          <span style="margin-left: 10px; font-size: 12px; color: var(--adm-text-45);">开启后仅所属供应体系的用户可在列表中看到该商品,分享商品详情页所有人可访问</span>
         </el-form-item>
         </el-form-item>
 
 
         <el-form-item label="配送方式">
         <el-form-item label="配送方式">
@@ -220,7 +220,7 @@
                   :label="g.realName || g.nickname"
                   :label="g.realName || g.nickname"
                   :value="g.userId">
                   :value="g.userId">
                   <span style="float:left">{{ g.realName || g.nickname }}</span>
                   <span style="float:left">{{ g.realName || g.nickname }}</span>
-                  <span style="float:right;color:#999;font-size:12px">{{ g.title || g.specialty || '' }}</span>
+                  <span style="float:right;color:var(--adm-text-45);font-size:12px">{{ g.title || g.specialty || '' }}</span>
                 </el-option>
                 </el-option>
               </el-select>
               </el-select>
               <el-button type="primary" size="mini" style="margin-left:8px" @click="addSelectedGuide()">添加</el-button>
               <el-button type="primary" size="mini" style="margin-left:8px" @click="addSelectedGuide()">添加</el-button>
@@ -282,7 +282,7 @@
               :value="lv.levelCode"
               :value="lv.levelCode"
             />
             />
           </el-select>
           </el-select>
-          <span style="margin-left: 10px; font-size: 12px; color: #999;">留空=全部会员可见;选择后仅该级别及更高级别会员可见</span>
+          <span style="margin-left: 10px; font-size: 12px; color: var(--adm-text-45);">留空=全部会员可见;选择后仅该级别及更高级别会员可见</span>
         </el-form-item>
         </el-form-item>
 
 
         <el-form-item label="商品维度">
         <el-form-item label="商品维度">
@@ -1226,18 +1226,18 @@ async loadGiftRule(productId) {
   text-align: center;
   text-align: center;
   font-size: 28px;
   font-size: 28px;
   color: #8c939d;
   color: #8c939d;
-  border: 1px dashed #d9d9d9;
+  border: 1px dashed var(--adm-border-base);
   border-radius: 4px;
   border-radius: 4px;
   display: block;
   display: block;
   cursor: pointer;
   cursor: pointer;
 }
 }
 .cover-icon:hover {
 .cover-icon:hover {
-  border-color: #409eff;
-  color: #409eff;
+  border-color: var(--adm-primary);
+  color: var(--adm-primary);
 }
 }
 .cover-tip {
 .cover-tip {
   font-size: 12px;
   font-size: 12px;
-  color: #999;
+  color: var(--adm-text-45);
 }
 }
 .images-uploader {
 .images-uploader {
   display: flex;
   display: flex;
@@ -1262,8 +1262,8 @@ async loadGiftRule(productId) {
   right: -6px;
   right: -6px;
   width: 18px;
   width: 18px;
   height: 18px;
   height: 18px;
-  background: #f56c6c;
-  color: #fff;
+  background: var(--adm-error);
+  color: var(--adm-bg-container);
   border-radius: 50%;
   border-radius: 50%;
   text-align: center;
   text-align: center;
   line-height: 18px;
   line-height: 18px;
@@ -1277,14 +1277,14 @@ async loadGiftRule(productId) {
   text-align: center;
   text-align: center;
   font-size: 24px;
   font-size: 24px;
   color: #8c939d;
   color: #8c939d;
-  border: 1px dashed #d9d9d9;
+  border: 1px dashed var(--adm-border-base);
   border-radius: 4px;
   border-radius: 4px;
   display: block;
   display: block;
   cursor: pointer;
   cursor: pointer;
 }
 }
 .image-add-icon:hover {
 .image-add-icon:hover {
-  border-color: #409eff;
-  color: #409eff;
+  border-color: var(--adm-primary);
+  color: var(--adm-primary);
 }
 }
 .product-edit .el-card {
 .product-edit .el-card {
   width: 100%;
   width: 100%;
@@ -1316,7 +1316,7 @@ async loadGiftRule(productId) {
   flex-wrap: wrap;
   flex-wrap: wrap;
   gap: 8px;
   gap: 8px;
   padding: 12px;
   padding: 12px;
-  background: #fafafa;
+  background: var(--adm-bg-header);
   border-radius: 4px;
   border-radius: 4px;
   border: 1px solid #eee;
   border: 1px solid #eee;
 }
 }
@@ -1325,7 +1325,7 @@ async loadGiftRule(productId) {
   align-items: center;
   align-items: center;
   gap: 8px;
   gap: 8px;
   padding: 6px 12px;
   padding: 6px 12px;
-  background: #fff;
+  background: var(--adm-bg-container);
   border: 1px solid #e8e8e8;
   border: 1px solid #e8e8e8;
   border-radius: 4px;
   border-radius: 4px;
 }
 }
@@ -1356,7 +1356,7 @@ async loadGiftRule(productId) {
   border-radius: 4px;
   border-radius: 4px;
   padding: 10px;
   padding: 10px;
   margin-bottom: 10px;
   margin-bottom: 10px;
-  background: #fafafa;
+  background: var(--adm-bg-header);
 }
 }
 .sp-header {
 .sp-header {
   display: flex;
   display: flex;
@@ -1371,7 +1371,7 @@ async loadGiftRule(productId) {
 .sp-slots {
 .sp-slots {
   margin-top: 8px;
   margin-top: 8px;
   padding: 8px;
   padding: 8px;
-  background: #fff;
+  background: var(--adm-bg-container);
   border-radius: 4px;
   border-radius: 4px;
 }
 }
 .sp-slot-row {
 .sp-slot-row {
@@ -1382,13 +1382,13 @@ async loadGiftRule(productId) {
 .delivery-config-hint {
 .delivery-config-hint {
   margin-top: 6px;
   margin-top: 6px;
   font-size: 12px;
   font-size: 12px;
-  color: #999;
+  color: var(--adm-text-45);
 }
 }
 
 
 /* 企业级视觉对齐:与商品列表页(ProductManage)统一设计语言 */
 /* 企业级视觉对齐:与商品列表页(ProductManage)统一设计语言 */
 .product-edit /deep/ .el-card {
 .product-edit /deep/ .el-card {
   border-radius: 8px;
   border-radius: 8px;
-  border: 1px solid #f0f0f0;
+  border: 1px solid var(--adm-border-split);
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
   /* 覆盖全局 .admin-page > .el-card 的 flex:1;min-height:0(会裁剪超长内容)
   /* 覆盖全局 .admin-page > .el-card 的 flex:1;min-height:0(会裁剪超长内容)
      改为由内容撑开高度,超出时由 el-main 滚动显示 */
      改为由内容撑开高度,超出时由 el-main 滚动显示 */

+ 21 - 21
cfc-web/src/views/admin/ProductManage.vue

@@ -550,7 +550,7 @@ export default {
 }
 }
 
 
 .pm-card {
 .pm-card {
-  border: 1px solid #f0f0f0;
+  border: 1px solid var(--adm-border-split);
   border-radius: 8px;
   border-radius: 8px;
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
 }
 }
@@ -601,7 +601,7 @@ export default {
   gap: 16px;
   gap: 16px;
   padding-bottom: 16px;
   padding-bottom: 16px;
   margin-bottom: 16px;
   margin-bottom: 16px;
-  border-bottom: 1px solid #f0f0f0;
+  border-bottom: 1px solid var(--adm-border-split);
 }
 }
 
 
 .pm-filter__fields {
 .pm-filter__fields {
@@ -645,8 +645,8 @@ export default {
   height: 40px;
   height: 40px;
   padding: 0 16px;
   padding: 0 16px;
   margin-bottom: 12px;
   margin-bottom: 12px;
-  background: #e6f4ff;
-  border: 1px solid #91caff;
+  background: var(--adm-info-bg);
+  border: 1px solid var(--adm-info-border);
   border-radius: 6px;
   border-radius: 6px;
 }
 }
 
 
@@ -656,7 +656,7 @@ export default {
 }
 }
 
 
 .pm-batch-bar__text b {
 .pm-batch-bar__text b {
-  color: #0958d9;
+  color: var(--adm-primary-active);
   font-weight: 600;
   font-weight: 600;
 }
 }
 
 
@@ -683,7 +683,7 @@ export default {
 .pm-table-wrap /deep/ .el-table th {
 .pm-table-wrap /deep/ .el-table th {
   height: 46px;
   height: 46px;
   padding: 0;
   padding: 0;
-  background: #fafafa;
+  background: var(--adm-bg-header);
   color: rgba(0, 0, 0, 0.88);
   color: rgba(0, 0, 0, 0.88);
   font-weight: 500;
   font-weight: 500;
 }
 }
@@ -703,7 +703,7 @@ export default {
   height: 40px;
   height: 40px;
   object-fit: cover;
   object-fit: cover;
   border-radius: 4px;
   border-radius: 4px;
-  border: 1px solid #f0f0f0;
+  border: 1px solid var(--adm-border-split);
   cursor: pointer;
   cursor: pointer;
   display: block;
   display: block;
 }
 }
@@ -713,7 +713,7 @@ export default {
 }
 }
 
 
 .pm-stock-warning {
 .pm-stock-warning {
-  color: #cf1322;
+  color: var(--adm-error-text);
   font-weight: 600;
   font-weight: 600;
 }
 }
 
 
@@ -726,7 +726,7 @@ export default {
 }
 }
 
 
 .pm-sort-header:hover {
 .pm-sort-header:hover {
-  color: #1677ff;
+  color: var(--adm-primary);
 }
 }
 
 
 .pm-sort-index {
 .pm-sort-index {
@@ -739,8 +739,8 @@ export default {
   font-size: 11px;
   font-size: 11px;
   font-weight: 400;
   font-weight: 400;
   text-align: center;
   text-align: center;
-  color: #1677ff;
-  background: #e6f4ff;
+  color: var(--adm-primary);
+  background: var(--adm-info-bg);
   border-radius: 2px;
   border-radius: 2px;
 }
 }
 
 
@@ -763,11 +763,11 @@ export default {
   background: currentColor;
   background: currentColor;
 }
 }
 
 
-.pm-status--pending { background: #fffbe6; color: #d48806; }
-.pm-status--approved { background: #e6f4ff; color: #0958d9; }
-.pm-status--on_shelf { background: #f6ffed; color: #389e0d; }
-.pm-status--off_shelf { background: #f5f5f5; color: rgba(0, 0, 0, 0.65); }
-.pm-status--rejected { background: #fff1f0; color: #cf1322; }
+.pm-status--pending { background: var(--adm-warning-bg); color: var(--adm-warning-text); }
+.pm-status--approved { background: var(--adm-info-bg); color: var(--adm-primary-active); }
+.pm-status--on_shelf { background: var(--adm-success-bg); color: var(--adm-success-text); }
+.pm-status--off_shelf { background: var(--adm-fill); color: rgba(0, 0, 0, 0.65); }
+.pm-status--rejected { background: var(--adm-error-bg); color: var(--adm-error-text); }
 
 
 /* ---------- 分页 ---------- */
 /* ---------- 分页 ---------- */
 .pm-pagination {
 .pm-pagination {
@@ -779,7 +779,7 @@ export default {
 /* ---------- 弹窗内区块 ---------- */
 /* ---------- 弹窗内区块 ---------- */
 .pm-dialog /deep/ .el-dialog__header {
 .pm-dialog /deep/ .el-dialog__header {
   padding: 16px 24px;
   padding: 16px 24px;
-  border-bottom: 1px solid #f0f0f0;
+  border-bottom: 1px solid var(--adm-border-split);
 }
 }
 
 
 .pm-dialog /deep/ .el-dialog__title {
 .pm-dialog /deep/ .el-dialog__title {
@@ -794,7 +794,7 @@ export default {
 
 
 .pm-dialog /deep/ .el-dialog__footer {
 .pm-dialog /deep/ .el-dialog__footer {
   padding: 12px 24px;
   padding: 12px 24px;
-  border-top: 1px solid #f0f0f0;
+  border-top: 1px solid var(--adm-border-split);
 }
 }
 
 
 .pm-section {
 .pm-section {
@@ -806,13 +806,13 @@ export default {
   font-weight: 500;
   font-weight: 500;
   color: rgba(0, 0, 0, 0.88);
   color: rgba(0, 0, 0, 0.88);
   padding-left: 8px;
   padding-left: 8px;
-  border-left: 3px solid #1677ff;
+  border-left: 3px solid var(--adm-primary);
   margin-bottom: 12px;
   margin-bottom: 12px;
   line-height: 1.2;
   line-height: 1.2;
 }
 }
 
 
-.pm-qty-in { color: #389e0d; font-variant-numeric: tabular-nums; }
-.pm-qty-out { color: #cf1322; font-variant-numeric: tabular-nums; }
+.pm-qty-in { color: var(--adm-success-text); font-variant-numeric: tabular-nums; }
+.pm-qty-out { color: var(--adm-error-text); font-variant-numeric: tabular-nums; }
 
 
 .pm-empty {
 .pm-empty {
   padding: 32px 0;
   padding: 32px 0;

+ 8 - 8
cfc-web/src/views/admin/ReportTemplateManage.vue

@@ -411,26 +411,26 @@ export default {
 <style scoped>
 <style scoped>
 .report-template-page { padding: 20px; }
 .report-template-page { padding: 20px; }
 .block-list { border: 1px solid #ebeef5; border-radius: 4px; margin-bottom: 12px; }
 .block-list { border: 1px solid #ebeef5; border-radius: 4px; margin-bottom: 12px; }
-.block-item { border-bottom: 1px solid #f0f0f0; padding: 12px 16px; }
+.block-item { border-bottom: 1px solid var(--adm-border-split); padding: 12px 16px; }
 .block-item:last-child { border-bottom: none; }
 .block-item:last-child { border-bottom: none; }
 .block-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
 .block-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
 .drag-handle { cursor: move; color: #bbb; font-size: 16px; }
 .drag-handle { cursor: move; color: #bbb; font-size: 16px; }
 .block-type-tag { background: #f0f9ff; color: #2c7be5; padding: 2px 8px; border-radius: 4px; font-size: 12px; }
 .block-type-tag { background: #f0f9ff; color: #2c7be5; padding: 2px 8px; border-radius: 4px; font-size: 12px; }
 .block-title-display { color: #333; font-size: 14px; }
 .block-title-display { color: #333; font-size: 14px; }
 .block-del { margin-left: auto; }
 .block-del { margin-left: auto; }
-.hint-text { margin-left: 12px; color: #999; font-size: 12px; }
+.hint-text { margin-left: 12px; color: var(--adm-text-45); font-size: 12px; }
 .block-list { border: 1px solid #ebeef5; border-radius: 4px; margin-bottom: 12px; }
 .block-list { border: 1px solid #ebeef5; border-radius: 4px; margin-bottom: 12px; }
-.block-item { border-bottom: 1px solid #f0f0f0; padding: 12px 16px; }
+.block-item { border-bottom: 1px solid var(--adm-border-split); padding: 12px 16px; }
 .block-item:last-child { border-bottom: none; }
 .block-item:last-child { border-bottom: none; }
 .block-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
 .block-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
 .block-type-tag { background: #f0f9ff; color: #2c7be5; padding: 2px 8px; border-radius: 4px; font-size: 12px; }
 .block-type-tag { background: #f0f9ff; color: #2c7be5; padding: 2px 8px; border-radius: 4px; font-size: 12px; }
 .block-title-display { color: #333; font-size: 14px; }
 .block-title-display { color: #333; font-size: 14px; }
 .block-del { margin-left: auto; }
 .block-del { margin-left: auto; }
-.block-move-up, .block-move-dn { color: #909399; }
-.preview-block { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 16px; margin-bottom: 12px; }
-.preview-block-title { font-weight: bold; font-size: 15px; margin-bottom: 10px; color: #303133; }
+.block-move-up, .block-move-dn { color: var(--adm-text-45); }
+.preview-block { background: var(--adm-bg-container); border: 1px solid #eee; border-radius: 8px; padding: 16px; margin-bottom: 12px; }
+.preview-block-title { font-weight: bold; font-size: 15px; margin-bottom: 10px; color: var(--adm-text-88); }
 .preview-score-item { display: inline-block; background: #f5f7fa; padding: 4px 12px; margin: 4px; border-radius: 4px; }
 .preview-score-item { display: inline-block; background: #f5f7fa; padding: 4px 12px; margin: 4px; border-radius: 4px; }
-.preview-ind-item { display: flex; align-items: center; padding: 6px 0; border-bottom: 1px solid #f0f0f0; }
+.preview-ind-item { display: flex; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--adm-border-split); }
 .ind-name { flex: 1; font-size: 13px; }
 .ind-name { flex: 1; font-size: 13px; }
 .ind-value { font-size: 13px; color: #666; margin: 0 12px; }
 .ind-value { font-size: 13px; color: #666; margin: 0 12px; }
 .ind-status { font-size: 12px; padding: 2px 8px; border-radius: 10px; }
 .ind-status { font-size: 12px; padding: 2px 8px; border-radius: 10px; }
@@ -449,6 +449,6 @@ export default {
   font-size: 12px;
   font-size: 12px;
 }
 }
 .sort-header:hover {
 .sort-header:hover {
-  color: #409eff;
+  color: var(--adm-primary);
 }
 }
 </style>
 </style>

+ 20 - 20
cfc-web/src/views/admin/SpecialPriceManage.vue

@@ -539,7 +539,7 @@ export default {
   gap: 16px;
   gap: 16px;
   padding-bottom: 16px;
   padding-bottom: 16px;
   margin-bottom: 16px;
   margin-bottom: 16px;
-  border-bottom: 1px solid #f0f0f0;
+  border-bottom: 1px solid var(--adm-border-split);
 }
 }
 .pm-filter__fields {
 .pm-filter__fields {
   display: flex;
   display: flex;
@@ -585,7 +585,7 @@ export default {
 .pm-table-wrap /deep/ .el-table th {
 .pm-table-wrap /deep/ .el-table th {
   height: 46px;
   height: 46px;
   padding: 0;
   padding: 0;
-  background: #fafafa;
+  background: var(--adm-bg-header);
   color: rgba(0, 0, 0, 0.88);
   color: rgba(0, 0, 0, 0.88);
   font-weight: 500;
   font-weight: 500;
 }
 }
@@ -614,7 +614,7 @@ export default {
   color: rgba(0, 0, 0, 0.88);
   color: rgba(0, 0, 0, 0.88);
 }
 }
 .pm-price__special--discount {
 .pm-price__special--discount {
-  color: #cf1322;
+  color: var(--adm-error-text);
 }
 }
 
 
 /* ---------- 时间窗口 ---------- */
 /* ---------- 时间窗口 ---------- */
@@ -639,13 +639,13 @@ export default {
   height: 6px;
   height: 6px;
   width: 100%;
   width: 100%;
   min-width: 60px;
   min-width: 60px;
-  background: #f0f0f0;
+  background: var(--adm-border-split);
   border-radius: 3px;
   border-radius: 3px;
   overflow: hidden;
   overflow: hidden;
 }
 }
 .pm-quota__fill {
 .pm-quota__fill {
   height: 100%;
   height: 100%;
-  background: linear-gradient(90deg, #ff7a45, #ff4d4f);
+  background: linear-gradient(90deg, #ff7a45, var(--adm-error));
   border-radius: 3px;
   border-radius: 3px;
 }
 }
 .pm-quota__text {
 .pm-quota__text {
@@ -656,7 +656,7 @@ export default {
 
 
 /* ---------- 商品链接 ---------- */
 /* ---------- 商品链接 ---------- */
 .pm-product-link {
 .pm-product-link {
-  color: #1677ff;
+  color: var(--adm-primary);
   cursor: pointer;
   cursor: pointer;
 }
 }
 .pm-product-link:hover {
 .pm-product-link:hover {
@@ -685,17 +685,17 @@ export default {
   border-radius: 50%;
   border-radius: 50%;
   background: currentColor;
   background: currentColor;
 }
 }
-.pm-status--active { background: #f6ffed; color: #389e0d; }
-.pm-status--not_started { background: #e6f4ff; color: #0958d9; }
-.pm-status--sold_out { background: #fff1f0; color: #cf1322; }
-.pm-status--ended { background: #f5f5f5; color: rgba(0, 0, 0, 0.65); }
-.pm-status--draft { background: #fffbe6; color: #d48806; }
-.pm-status--disabled { background: #f5f5f5; color: rgba(0, 0, 0, 0.65); }
+.pm-status--active { background: var(--adm-success-bg); color: var(--adm-success-text); }
+.pm-status--not_started { background: var(--adm-info-bg); color: var(--adm-primary-active); }
+.pm-status--sold_out { background: var(--adm-error-bg); color: var(--adm-error-text); }
+.pm-status--ended { background: var(--adm-fill); color: rgba(0, 0, 0, 0.65); }
+.pm-status--draft { background: var(--adm-warning-bg); color: var(--adm-warning-text); }
+.pm-status--disabled { background: var(--adm-fill); color: rgba(0, 0, 0, 0.65); }
 
 
 /* ---------- 操作按钮颜色 ---------- */
 /* ---------- 操作按钮颜色 ---------- */
-.pm-text-success { color: #389e0d; }
-.pm-text-warning { color: #d48806; }
-.pm-text-danger { color: #cf1322; }
+.pm-text-success { color: var(--adm-success-text); }
+.pm-text-warning { color: var(--adm-warning-text); }
+.pm-text-danger { color: var(--adm-error-text); }
 
 
 /* ---------- 分页 ---------- */
 /* ---------- 分页 ---------- */
 .pm-pagination {
 .pm-pagination {
@@ -714,9 +714,9 @@ export default {
   margin-top: -12px;
   margin-top: -12px;
   padding: 8px 12px;
   padding: 8px 12px;
   font-size: 12px;
   font-size: 12px;
-  color: #d48806;
-  background: #fffbe6;
-  border: 1px solid #ffe58f;
+  color: var(--adm-warning-text);
+  background: var(--adm-warning-bg);
+  border: 1px solid var(--adm-warning-border);
   border-radius: 4px;
   border-radius: 4px;
 }
 }
 
 
@@ -732,7 +732,7 @@ export default {
 .pm-qr-img {
 .pm-qr-img {
   width: 240px;
   width: 240px;
   height: 240px;
   height: 240px;
-  border: 1px solid #f0f0f0;
+  border: 1px solid var(--adm-border-split);
   border-radius: 6px;
   border-radius: 6px;
 }
 }
 .pm-qr-empty {
 .pm-qr-empty {
@@ -747,6 +747,6 @@ export default {
 .pm-qr-download {
 .pm-qr-download {
   float: left;
   float: left;
   line-height: 32px;
   line-height: 32px;
-  color: #1677ff;
+  color: var(--adm-primary);
 }
 }
 </style>
 </style>

+ 37 - 37
cfc-web/src/views/teacher/TeacherFamilies.vue

@@ -221,19 +221,19 @@
         <el-row :gutter="12" class="task-stats">
         <el-row :gutter="12" class="task-stats">
           <el-col :span="8">
           <el-col :span="8">
             <div class="task-stat-item">
             <div class="task-stat-item">
-              <div class="task-stat-value" style="color: #3B82F6">{{ currentFamily.todayTasks || 0 }}</div>
+              <div class="task-stat-value" style="color: var(--adm-primary)">{{ currentFamily.todayTasks || 0 }}</div>
               <div class="task-stat-label">今日任务</div>
               <div class="task-stat-label">今日任务</div>
             </div>
             </div>
           </el-col>
           </el-col>
           <el-col :span="8">
           <el-col :span="8">
             <div class="task-stat-item">
             <div class="task-stat-item">
-              <div class="task-stat-value" style="color: #10B981">{{ currentFamily.completedTasks || 0 }}</div>
+              <div class="task-stat-value" style="color: var(--adm-success)">{{ currentFamily.completedTasks || 0 }}</div>
               <div class="task-stat-label">已完成</div>
               <div class="task-stat-label">已完成</div>
             </div>
             </div>
           </el-col>
           </el-col>
           <el-col :span="8">
           <el-col :span="8">
             <div class="task-stat-item">
             <div class="task-stat-item">
-              <div class="task-stat-value" style="color: #F59E0B">{{ currentFamily.pendingTasks || 0 }}</div>
+              <div class="task-stat-value" style="color: var(--adm-warning)">{{ currentFamily.pendingTasks || 0 }}</div>
               <div class="task-stat-label">待完成</div>
               <div class="task-stat-label">待完成</div>
             </div>
             </div>
           </el-col>
           </el-col>
@@ -332,9 +332,9 @@ export default {
     },
     },
 
 
     getCompletionColor(rate) {
     getCompletionColor(rate) {
-      if (rate >= 80) return '#10B981'
-      if (rate >= 50) return '#F59E0B'
-      return '#EF4444'
+      if (rate >= 80) return '#52C41A'
+      if (rate >= 50) return '#FAAD14'
+      return '#FF4D4F'
     }
     }
   }
   }
 }
 }
@@ -358,17 +358,17 @@ export default {
 .page-title {
 .page-title {
   font-size: 24px;
   font-size: 24px;
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
   margin: 0 0 4px 0;
   margin: 0 0 4px 0;
 }
 }
 
 
 .page-desc {
 .page-desc {
   font-size: 14px;
   font-size: 14px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .primary-btn {
 .primary-btn {
-  background: #1677FF;
+  background: var(--adm-primary);
   border: none;
   border: none;
   padding: 12px 24px;
   padding: 12px 24px;
   border-radius: 10px;
   border-radius: 10px;
@@ -376,7 +376,7 @@ export default {
 }
 }
 
 
 .primary-btn:hover {
 .primary-btn:hover {
-  background: #0958D9;
+  background: var(--adm-primary-active);
 }
 }
 
 
 /* 统计卡片 */
 /* 统计卡片 */
@@ -388,7 +388,7 @@ export default {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   padding: 20px 24px;
   padding: 20px 24px;
-  background: #FFFFFF;
+  background: var(--adm-bg-container);
   border-radius: 16px;
   border-radius: 16px;
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.08);
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.08);
 }
 }
@@ -402,34 +402,34 @@ export default {
   justify-content: center;
   justify-content: center;
   margin-right: 16px;
   margin-right: 16px;
   font-size: 22px;
   font-size: 22px;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
 }
 }
 
 
 .stat-icon.blue {
 .stat-icon.blue {
-  background: #1677FF;
+  background: var(--adm-primary);
 }
 }
 
 
 .stat-icon.green {
 .stat-icon.green {
-  background: #52C41A;
+  background: var(--adm-success);
 }
 }
 
 
 .stat-icon.orange {
 .stat-icon.orange {
-  background: #FAAD14;
+  background: var(--adm-warning);
 }
 }
 
 
 .stat-icon.purple {
 .stat-icon.purple {
-  background: #1677FF;
+  background: var(--adm-primary);
 }
 }
 
 
 .stat-value {
 .stat-value {
   font-size: 28px;
   font-size: 28px;
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .stat-label {
 .stat-label {
   font-size: 14px;
   font-size: 14px;
-  color: #64748B;
+  color: var(--adm-text-45);
   margin-top: 2px;
   margin-top: 2px;
 }
 }
 
 
@@ -456,12 +456,12 @@ export default {
 .family-avatar {
 .family-avatar {
   width: 40px;
   width: 40px;
   height: 40px;
   height: 40px;
-  background: #1677FF;
+  background: var(--adm-primary);
   border-radius: 10px;
   border-radius: 10px;
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   justify-content: center;
   justify-content: center;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
   margin-right: 12px;
   margin-right: 12px;
   font-size: 16px;
   font-size: 16px;
 }
 }
@@ -469,23 +469,23 @@ export default {
 .family-name {
 .family-name {
   font-weight: 600;
   font-weight: 600;
   font-size: 15px;
   font-size: 15px;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .family-id {
 .family-id {
   font-size: 12px;
   font-size: 12px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
   margin-top: 2px;
   margin-top: 2px;
 }
 }
 
 
 .price {
 .price {
   font-weight: 600;
   font-weight: 600;
-  color: #F59E0B;
+  color: var(--adm-warning);
 }
 }
 
 
 .children-count {
 .children-count {
   font-weight: 600;
   font-weight: 600;
-  color: #3B82F6;
+  color: var(--adm-primary);
 }
 }
 
 
 .completion-cell {
 .completion-cell {
@@ -497,7 +497,7 @@ export default {
 .completion-text {
 .completion-text {
   font-size: 13px;
   font-size: 13px;
   font-weight: 600;
   font-weight: 600;
-  color: #64748B;
+  color: var(--adm-text-45);
   width: 35px;
   width: 35px;
 }
 }
 
 
@@ -510,16 +510,16 @@ export default {
   display: flex;
   display: flex;
   justify-content: space-between;
   justify-content: space-between;
   padding: 10px 0;
   padding: 10px 0;
-  border-bottom: 1px solid #F1F5F9;
+  border-bottom: 1px solid var(--adm-bg-header);
 }
 }
 
 
 .detail-label {
 .detail-label {
-  color: #64748B;
+  color: var(--adm-text-45);
   font-size: 14px;
   font-size: 14px;
 }
 }
 
 
 .detail-value {
 .detail-value {
-  color: #1E293B;
+  color: var(--adm-text-88);
   font-size: 14px;
   font-size: 14px;
   font-weight: 500;
   font-weight: 500;
 }
 }
@@ -532,7 +532,7 @@ export default {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   padding: 12px 0;
   padding: 12px 0;
-  border-bottom: 1px solid #F1F5F9;
+  border-bottom: 1px solid var(--adm-bg-header);
 }
 }
 
 
 .member-avatar {
 .member-avatar {
@@ -543,13 +543,13 @@ export default {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   justify-content: center;
   justify-content: center;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
   margin-right: 12px;
   margin-right: 12px;
 }
 }
 
 
 .member-name {
 .member-name {
   font-weight: 600;
   font-weight: 600;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .member-meta {
 .member-meta {
@@ -558,7 +558,7 @@ export default {
   gap: 8px;
   gap: 8px;
   margin-top: 4px;
   margin-top: 4px;
   font-size: 13px;
   font-size: 13px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .member-stats {
 .member-stats {
@@ -567,13 +567,13 @@ export default {
 
 
 .points {
 .points {
   font-weight: 600;
   font-weight: 600;
-  color: #F59E0B;
+  color: var(--adm-warning);
 }
 }
 
 
 .no-members {
 .no-members {
   text-align: center;
   text-align: center;
   padding: 24px;
   padding: 24px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
 }
 }
 
 
 .task-stats {
 .task-stats {
@@ -583,7 +583,7 @@ export default {
 .task-stat-item {
 .task-stat-item {
   text-align: center;
   text-align: center;
   padding: 16px;
   padding: 16px;
-  background: #F8FAFC;
+  background: var(--adm-bg-header);
   border-radius: 12px;
   border-radius: 12px;
 }
 }
 
 
@@ -594,7 +594,7 @@ export default {
 
 
 .task-stat-label {
 .task-stat-label {
   font-size: 12px;
   font-size: 12px;
-  color: #64748B;
+  color: var(--adm-text-45);
   margin-top: 4px;
   margin-top: 4px;
 }
 }
 
 
@@ -605,6 +605,6 @@ export default {
   font-size: 12px;
   font-size: 12px;
 }
 }
 .sort-header:hover {
 .sort-header:hover {
-  color: #409eff;
+  color: var(--adm-primary);
 }
 }
 </style>
 </style>

+ 50 - 50
cfc-web/src/views/teacher/TeacherMessages.vue

@@ -141,25 +141,25 @@
           <el-row :gutter="16" style="margin-bottom: 16px;">
           <el-row :gutter="16" style="margin-bottom: 16px;">
             <el-col :span="6">
             <el-col :span="6">
               <div class="stat-card">
               <div class="stat-card">
-                <div class="stat-number" style="color: #409EFF;">{{ familyTaskOverview.totalChildren || 0 }}</div>
+                <div class="stat-number" style="color: var(--adm-primary);">{{ familyTaskOverview.totalChildren || 0 }}</div>
                 <div class="stat-label">孩子数量</div>
                 <div class="stat-label">孩子数量</div>
               </div>
               </div>
             </el-col>
             </el-col>
             <el-col :span="6">
             <el-col :span="6">
               <div class="stat-card">
               <div class="stat-card">
-                <div class="stat-number" style="color: #67C23A;">{{ familyTaskOverview.totalCompleted || 0 }}</div>
+                <div class="stat-number" style="color: var(--adm-success);">{{ familyTaskOverview.totalCompleted || 0 }}</div>
                 <div class="stat-label">已完成任务</div>
                 <div class="stat-label">已完成任务</div>
               </div>
               </div>
             </el-col>
             </el-col>
             <el-col :span="6">
             <el-col :span="6">
               <div class="stat-card">
               <div class="stat-card">
-                <div class="stat-number" style="color: #E6A23C;">{{ familyTaskOverview.totalPendingReview || 0 }}</div>
+                <div class="stat-number" style="color: var(--adm-warning);">{{ familyTaskOverview.totalPendingReview || 0 }}</div>
                 <div class="stat-label">待审核</div>
                 <div class="stat-label">待审核</div>
               </div>
               </div>
             </el-col>
             </el-col>
             <el-col :span="6">
             <el-col :span="6">
               <div class="stat-card">
               <div class="stat-card">
-                <div class="stat-number" style="color: #F56C6C;">{{ familyTaskOverview.totalOverdue || 0 }}</div>
+                <div class="stat-number" style="color: var(--adm-error);">{{ familyTaskOverview.totalOverdue || 0 }}</div>
                 <div class="stat-label">已超时</div>
                 <div class="stat-label">已超时</div>
               </div>
               </div>
             </el-col>
             </el-col>
@@ -170,7 +170,7 @@
             <div class="child-task-section" v-for="child in familyTaskOverview.children" :key="child.memberId">
             <div class="child-task-section" v-for="child in familyTaskOverview.children" :key="child.memberId">
               <div class="child-header">
               <div class="child-header">
                 <strong>{{ child.childName || '孩子' }}</strong>
                 <strong>{{ child.childName || '孩子' }}</strong>
-                <span style="margin-left: 12px; color: #909399; font-size: 12px;">
+                <span style="margin-left: 12px; color: var(--adm-text-45); font-size: 12px;">
                   积分: {{ child.totalPoints || 0 }} | 连续: {{ child.streakDays || 0 }}天
                   积分: {{ child.totalPoints || 0 }} | 连续: {{ child.streakDays || 0 }}天
                 </span>
                 </span>
               </div>
               </div>
@@ -369,24 +369,24 @@ export default {
 .page-title {
 .page-title {
   font-size: 24px;
   font-size: 24px;
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
   margin: 0 0 4px 0;
   margin: 0 0 4px 0;
 }
 }
 
 
 .page-desc {
 .page-desc {
   font-size: 14px;
   font-size: 14px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .mark-read-btn {
 .mark-read-btn {
-  border: 1px solid #E2E8F0;
+  border: 1px solid var(--adm-border-split);
   border-radius: 8px;
   border-radius: 8px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .mark-read-btn:hover {
 .mark-read-btn:hover {
-  border-color: #3B82F6;
-  color: #3B82F6;
+  border-color: var(--adm-primary);
+  color: var(--adm-primary);
 }
 }
 
 
 /* 消息卡片 */
 /* 消息卡片 */
@@ -406,7 +406,7 @@ export default {
 /* 会话列表 */
 /* 会话列表 */
 .conversation-list {
 .conversation-list {
   width: 320px;
   width: 320px;
-  border-right: 1px solid #F1F5F9;
+  border-right: 1px solid var(--adm-bg-header);
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
 }
 }
@@ -416,19 +416,19 @@ export default {
   justify-content: space-between;
   justify-content: space-between;
   align-items: center;
   align-items: center;
   padding: 12px 16px;
   padding: 12px 16px;
-  border-bottom: 1px solid #F1F5F9;
+  border-bottom: 1px solid var(--adm-bg-header);
 }
 }
 
 
 .list-title {
 .list-title {
   font-size: 14px;
   font-size: 14px;
   font-weight: 600;
   font-weight: 600;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .unread-total {
 .unread-total {
   font-size: 12px;
   font-size: 12px;
-  color: #FFFFFF;
-  background: #EF4444;
+  color: var(--adm-bg-container);
+  background: var(--adm-error);
   padding: 2px 8px;
   padding: 2px 8px;
   border-radius: 10px;
   border-radius: 10px;
 }
 }
@@ -442,17 +442,17 @@ export default {
   display: flex;
   display: flex;
   padding: 14px 16px;
   padding: 14px 16px;
   cursor: pointer;
   cursor: pointer;
-  border-bottom: 1px solid #F8FAFC;
+  border-bottom: 1px solid var(--adm-bg-header);
   transition: all 0.2s;
   transition: all 0.2s;
 }
 }
 
 
 .conversation-item:hover {
 .conversation-item:hover {
-  background: #F8FAFC;
+  background: var(--adm-bg-header);
 }
 }
 
 
 .conversation-item.active {
 .conversation-item.active {
   background: #EBF5FF;
   background: #EBF5FF;
-  border-left: 3px solid #3B82F6;
+  border-left: 3px solid var(--adm-primary);
 }
 }
 
 
 .conversation-item.unread {
 .conversation-item.unread {
@@ -467,12 +467,12 @@ export default {
   position: relative;
   position: relative;
   width: 44px;
   width: 44px;
   height: 44px;
   height: 44px;
-  background: #1677FF;
+  background: var(--adm-primary);
   border-radius: 12px;
   border-radius: 12px;
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   justify-content: center;
   justify-content: center;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
   margin-right: 12px;
   margin-right: 12px;
   font-size: 18px;
   font-size: 18px;
   flex-shrink: 0;
   flex-shrink: 0;
@@ -484,8 +484,8 @@ export default {
   right: -4px;
   right: -4px;
   min-width: 18px;
   min-width: 18px;
   height: 18px;
   height: 18px;
-  background: #EF4444;
-  color: #FFFFFF;
+  background: var(--adm-error);
+  color: var(--adm-bg-container);
   border-radius: 9px;
   border-radius: 9px;
   font-size: 11px;
   font-size: 11px;
   font-weight: 600;
   font-weight: 600;
@@ -510,35 +510,35 @@ export default {
 .sender-name {
 .sender-name {
   font-size: 14px;
   font-size: 14px;
   font-weight: 600;
   font-weight: 600;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .conversation-item.unread .sender-name {
 .conversation-item.unread .sender-name {
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .message-time {
 .message-time {
   font-size: 12px;
   font-size: 12px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
 }
 }
 
 
 .conversation-preview {
 .conversation-preview {
   font-size: 13px;
   font-size: 13px;
-  color: #64748B;
+  color: var(--adm-text-45);
   overflow: hidden;
   overflow: hidden;
   text-overflow: ellipsis;
   text-overflow: ellipsis;
   white-space: nowrap;
   white-space: nowrap;
 }
 }
 
 
 .conversation-item.unread .conversation-preview {
 .conversation-item.unread .conversation-preview {
-  color: #1E293B;
+  color: var(--adm-text-88);
   font-weight: 500;
   font-weight: 500;
 }
 }
 
 
 .empty-conversations {
 .empty-conversations {
   text-align: center;
   text-align: center;
   padding: 48px 0;
   padding: 48px 0;
-  color: #94A3B8;
+  color: var(--adm-text-45);
 }
 }
 
 
 .empty-conversations i {
 .empty-conversations i {
@@ -559,27 +559,27 @@ export default {
   justify-content: space-between;
   justify-content: space-between;
   align-items: center;
   align-items: center;
   padding: 14px 20px;
   padding: 14px 20px;
-  border-bottom: 1px solid #F1F5F9;
+  border-bottom: 1px solid var(--adm-bg-header);
 }
 }
 
 
 .chat-title {
 .chat-title {
   font-size: 15px;
   font-size: 15px;
   font-weight: 600;
   font-weight: 600;
-  color: #1E293B;
+  color: var(--adm-text-88);
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   gap: 8px;
   gap: 8px;
 }
 }
 
 
 .chat-title i {
 .chat-title i {
-  color: #3B82F6;
+  color: var(--adm-primary);
 }
 }
 
 
 .chat-messages {
 .chat-messages {
   flex: 1;
   flex: 1;
   padding: 20px;
   padding: 20px;
   overflow-y: auto;
   overflow-y: auto;
-  background: #F8FAFC;
+  background: var(--adm-bg-header);
 }
 }
 
 
 .chat-message {
 .chat-message {
@@ -597,20 +597,20 @@ export default {
 .message-bubble {
 .message-bubble {
   padding: 12px 16px;
   padding: 12px 16px;
   border-radius: 16px;
   border-radius: 16px;
-  background: #FFFFFF;
+  background: var(--adm-bg-container);
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
   word-wrap: break-word;
   word-wrap: break-word;
   line-height: 1.5;
   line-height: 1.5;
 }
 }
 
 
 .chat-message.mine .message-bubble {
 .chat-message.mine .message-bubble {
-  background: #1677FF;
-  color: #FFFFFF;
+  background: var(--adm-primary);
+  color: var(--adm-bg-container);
 }
 }
 
 
 .message-meta {
 .message-meta {
   font-size: 11px;
   font-size: 11px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
   margin-top: 4px;
   margin-top: 4px;
 }
 }
 
 
@@ -619,12 +619,12 @@ export default {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   justify-content: center;
   justify-content: center;
-  background: #F8FAFC;
+  background: var(--adm-bg-header);
 }
 }
 
 
 .empty-content {
 .empty-content {
   text-align: center;
   text-align: center;
-  color: #94A3B8;
+  color: var(--adm-text-45);
 }
 }
 
 
 .empty-content i {
 .empty-content i {
@@ -634,8 +634,8 @@ export default {
 
 
 .chat-input {
 .chat-input {
   padding: 16px 20px;
   padding: 16px 20px;
-  border-top: 1px solid #F1F5F9;
-  background: #FFFFFF;
+  border-top: 1px solid var(--adm-bg-header);
+  background: var(--adm-bg-container);
 }
 }
 
 
 .message-input ::v-deep .el-input__inner {
 .message-input ::v-deep .el-input__inner {
@@ -644,9 +644,9 @@ export default {
 
 
 .message-input ::v-deep .el-button {
 .message-input ::v-deep .el-button {
   border-radius: 0 20px 20px 0;
   border-radius: 0 20px 20px 0;
-  background: #1677FF;
+  background: var(--adm-primary);
   border: none;
   border: none;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
 }
 }
 
 
 /* 家庭信息弹窗样式 */
 /* 家庭信息弹窗样式 */
@@ -654,7 +654,7 @@ export default {
   font-weight: 600;
   font-weight: 600;
   font-size: 14px;
   font-size: 14px;
   margin-bottom: 8px;
   margin-bottom: 8px;
-  color: #303133;
+  color: var(--adm-text-88);
 }
 }
 
 
 .member-item {
 .member-item {
@@ -678,7 +678,7 @@ export default {
 .stat-card {
 .stat-card {
   text-align: center;
   text-align: center;
   padding: 12px 8px;
   padding: 12px 8px;
-  background: #F8FAFC;
+  background: var(--adm-bg-header);
   border-radius: 8px;
   border-radius: 8px;
   border: 1px solid #EBEEF5;
   border: 1px solid #EBEEF5;
 }
 }
@@ -691,21 +691,21 @@ export default {
 
 
 .stat-label {
 .stat-label {
   font-size: 12px;
   font-size: 12px;
-  color: #909399;
+  color: var(--adm-text-45);
   margin-top: 4px;
   margin-top: 4px;
 }
 }
 
 
 .child-task-section {
 .child-task-section {
   padding: 10px;
   padding: 10px;
-  background: #FAFAFA;
+  background: var(--adm-bg-header);
   border-radius: 6px;
   border-radius: 6px;
   margin-bottom: 8px;
   margin-bottom: 8px;
-  border: 1px solid #F0F0F0;
+  border: 1px solid var(--adm-border-split);
 }
 }
 
 
 .child-header {
 .child-header {
   font-size: 13px;
   font-size: 13px;
-  color: #303133;
+  color: var(--adm-text-88);
 }
 }
 
 
 .message-reply {
 .message-reply {
@@ -718,7 +718,7 @@ export default {
 }
 }
 
 
 .message-reply .reply-text {
 .message-reply .reply-text {
-  color: #409EFF;
+  color: var(--adm-primary);
   margin-left: 4px;
   margin-left: 4px;
 }
 }
 
 

+ 20 - 20
cfc-web/src/views/teacher/TeacherOrders.vue

@@ -354,24 +354,24 @@ export default {
 .page-title {
 .page-title {
   font-size: 24px;
   font-size: 24px;
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
   margin: 0 0 4px 0;
   margin: 0 0 4px 0;
 }
 }
 
 
 .page-desc {
 .page-desc {
   font-size: 14px;
   font-size: 14px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .export-btn {
 .export-btn {
-  border: 1px solid #E2E8F0;
+  border: 1px solid var(--adm-border-split);
   border-radius: 8px;
   border-radius: 8px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .export-btn:hover {
 .export-btn:hover {
-  border-color: #3B82F6;
-  color: #3B82F6;
+  border-color: var(--adm-primary);
+  color: var(--adm-primary);
 }
 }
 
 
 /* 统计卡片 */
 /* 统计卡片 */
@@ -400,21 +400,21 @@ export default {
 }
 }
 
 
 .rate-label {
 .rate-label {
-  color: #64748B;
+  color: var(--adm-text-45);
   font-size: 14px;
   font-size: 14px;
 }
 }
 
 
 .rate-value {
 .rate-value {
   font-size: 20px;
   font-size: 20px;
   font-weight: 700;
   font-weight: 700;
-  color: #3B82F6;
+  color: var(--adm-primary);
 }
 }
 
 
 .commission-tip {
 .commission-tip {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   gap: 6px;
   gap: 6px;
-  color: #64748B;
+  color: var(--adm-text-45);
   font-size: 13px;
   font-size: 13px;
 }
 }
 
 
@@ -436,7 +436,7 @@ export default {
 .order-no {
 .order-no {
   font-family: 'Monaco', 'Menlo', monospace;
   font-family: 'Monaco', 'Menlo', monospace;
   font-size: 13px;
   font-size: 13px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .family-cell {
 .family-cell {
@@ -453,23 +453,23 @@ export default {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   justify-content: center;
   justify-content: center;
-  color: #3B82F6;
+  color: var(--adm-primary);
   font-size: 14px;
   font-size: 14px;
 }
 }
 
 
 .guide-name {
 .guide-name {
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .amount {
 .amount {
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
   font-size: 15px;
   font-size: 15px;
 }
 }
 
 
 .commission {
 .commission {
   font-weight: 700;
   font-weight: 700;
-  color: #10B981;
+  color: var(--adm-success);
 }
 }
 
 
 .pagination-wrapper {
 .pagination-wrapper {
@@ -488,16 +488,16 @@ export default {
   justify-content: space-between;
   justify-content: space-between;
   align-items: center;
   align-items: center;
   padding: 10px 0;
   padding: 10px 0;
-  border-bottom: 1px solid #F1F5F9;
+  border-bottom: 1px solid var(--adm-bg-header);
 }
 }
 
 
 .detail-label {
 .detail-label {
-  color: #64748B;
+  color: var(--adm-text-45);
   font-size: 14px;
   font-size: 14px;
 }
 }
 
 
 .detail-value {
 .detail-value {
-  color: #1E293B;
+  color: var(--adm-text-88);
   font-size: 14px;
   font-size: 14px;
   font-weight: 500;
   font-weight: 500;
 }
 }
@@ -507,12 +507,12 @@ export default {
 }
 }
 
 
 .detail-value.price {
 .detail-value.price {
-  color: #F59E0B;
+  color: var(--adm-warning);
   font-weight: 700;
   font-weight: 700;
 }
 }
 
 
 .detail-value.commission {
 .detail-value.commission {
-  color: #10B981;
+  color: var(--adm-success);
   font-weight: 700;
   font-weight: 700;
 }
 }
 
 
@@ -523,6 +523,6 @@ export default {
   font-size: 12px;
   font-size: 12px;
 }
 }
 .sort-header:hover {
 .sort-header:hover {
-  color: #409eff;
+  color: var(--adm-primary);
 }
 }
 </style>
 </style>

+ 34 - 34
cfc-web/src/views/teacher/TeacherTeam.vue

@@ -194,13 +194,13 @@
         <el-row :gutter="12">
         <el-row :gutter="12">
           <el-col :span="12">
           <el-col :span="12">
             <div class="mini-stat">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: #3B82F6">{{ formatPriceWithSymbol(currentMember.monthlySales || 0) }}</div>
+              <div class="mini-stat-value" style="color: var(--adm-primary)">{{ formatPriceWithSymbol(currentMember.monthlySales || 0) }}</div>
               <div class="mini-stat-label">本月业绩</div>
               <div class="mini-stat-label">本月业绩</div>
             </div>
             </div>
           </el-col>
           </el-col>
           <el-col :span="12">
           <el-col :span="12">
             <div class="mini-stat">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: #10B981">{{ formatPriceWithSymbol(currentMember.totalSales || 0) }}</div>
+              <div class="mini-stat-value" style="color: var(--adm-success)">{{ formatPriceWithSymbol(currentMember.totalSales || 0) }}</div>
               <div class="mini-stat-label">累计业绩</div>
               <div class="mini-stat-label">累计业绩</div>
             </div>
             </div>
           </el-col>
           </el-col>
@@ -210,19 +210,19 @@
         <el-row :gutter="12">
         <el-row :gutter="12">
           <el-col :span="8">
           <el-col :span="8">
             <div class="mini-stat">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: #F59E0B">{{ currentMember.familyCount || 0 }}</div>
+              <div class="mini-stat-value" style="color: var(--adm-warning)">{{ currentMember.familyCount || 0 }}</div>
               <div class="mini-stat-label">服务家庭</div>
               <div class="mini-stat-label">服务家庭</div>
             </div>
             </div>
           </el-col>
           </el-col>
           <el-col :span="8">
           <el-col :span="8">
             <div class="mini-stat">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: #1677FF">{{ currentMember.childrenCount || 0 }}</div>
+              <div class="mini-stat-value" style="color: var(--adm-primary)">{{ currentMember.childrenCount || 0 }}</div>
               <div class="mini-stat-label">服务孩子</div>
               <div class="mini-stat-label">服务孩子</div>
             </div>
             </div>
           </el-col>
           </el-col>
           <el-col :span="8">
           <el-col :span="8">
             <div class="mini-stat">
             <div class="mini-stat">
-              <div class="mini-stat-value" style="color: #10B981">{{ currentMember.taskCount || 0 }}</div>
+              <div class="mini-stat-value" style="color: var(--adm-success)">{{ currentMember.taskCount || 0 }}</div>
               <div class="mini-stat-label">完成任务</div>
               <div class="mini-stat-label">完成任务</div>
             </div>
             </div>
           </el-col>
           </el-col>
@@ -373,24 +373,24 @@ export default {
 .page-title {
 .page-title {
   font-size: 24px;
   font-size: 24px;
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
   margin: 0 0 4px 0;
   margin: 0 0 4px 0;
 }
 }
 
 
 .page-desc {
 .page-desc {
   font-size: 14px;
   font-size: 14px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .primary-btn {
 .primary-btn {
-  background: #1677FF;
+  background: var(--adm-primary);
   border: none;
   border: none;
   padding: 12px 24px;
   padding: 12px 24px;
   border-radius: 10px;
   border-radius: 10px;
 }
 }
 
 
 .primary-btn:hover {
 .primary-btn:hover {
-  background: #0958D9;
+  background: var(--adm-primary-active);
 }
 }
 
 
 /* 统计卡片 */
 /* 统计卡片 */
@@ -402,7 +402,7 @@ export default {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   padding: 20px 24px;
   padding: 20px 24px;
-  background: #FFFFFF;
+  background: var(--adm-bg-container);
   border-radius: 16px;
   border-radius: 16px;
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.08);
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.08);
 }
 }
@@ -416,34 +416,34 @@ export default {
   justify-content: center;
   justify-content: center;
   margin-right: 16px;
   margin-right: 16px;
   font-size: 22px;
   font-size: 22px;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
 }
 }
 
 
 .stat-icon.blue {
 .stat-icon.blue {
-  background: #1677FF;
+  background: var(--adm-primary);
 }
 }
 
 
 .stat-icon.green {
 .stat-icon.green {
-  background: #52C41A;
+  background: var(--adm-success);
 }
 }
 
 
 .stat-icon.orange {
 .stat-icon.orange {
-  background: #FAAD14;
+  background: var(--adm-warning);
 }
 }
 
 
 .stat-icon.purple {
 .stat-icon.purple {
-  background: #1677FF;
+  background: var(--adm-primary);
 }
 }
 
 
 .stat-value {
 .stat-value {
   font-size: 28px;
   font-size: 28px;
   font-weight: 700;
   font-weight: 700;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .stat-label {
 .stat-label {
   font-size: 14px;
   font-size: 14px;
-  color: #64748B;
+  color: var(--adm-text-45);
   margin-top: 2px;
   margin-top: 2px;
 }
 }
 
 
@@ -453,7 +453,7 @@ export default {
   margin-bottom: 24px;
   margin-bottom: 24px;
   border: none;
   border: none;
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.06);
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.06);
-  background: #1677FF;
+  background: var(--adm-primary);
 }
 }
 
 
 .invite-code-content {
 .invite-code-content {
@@ -473,7 +473,7 @@ export default {
   display: block;
   display: block;
   font-size: 28px;
   font-size: 28px;
   font-weight: 700;
   font-weight: 700;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
   font-family: 'Monaco', 'Menlo', monospace;
   font-family: 'Monaco', 'Menlo', monospace;
   letter-spacing: 2px;
   letter-spacing: 2px;
 }
 }
@@ -506,12 +506,12 @@ export default {
 .card-title {
 .card-title {
   font-size: 16px;
   font-size: 16px;
   font-weight: 600;
   font-weight: 600;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .card-count {
 .card-count {
   font-size: 13px;
   font-size: 13px;
-  color: #64748B;
+  color: var(--adm-text-45);
 }
 }
 
 
 .member-cell {
 .member-cell {
@@ -526,7 +526,7 @@ export default {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   justify-content: center;
   justify-content: center;
-  color: #FFFFFF;
+  color: var(--adm-bg-container);
   margin-right: 12px;
   margin-right: 12px;
   font-size: 16px;
   font-size: 16px;
 }
 }
@@ -534,33 +534,33 @@ export default {
 .member-name {
 .member-name {
   font-weight: 600;
   font-weight: 600;
   font-size: 15px;
   font-size: 15px;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .member-id {
 .member-id {
   font-size: 12px;
   font-size: 12px;
-  color: #94A3B8;
+  color: var(--adm-text-45);
   margin-top: 2px;
   margin-top: 2px;
 }
 }
 
 
 .family-count, .children-count {
 .family-count, .children-count {
   font-weight: 600;
   font-weight: 600;
-  color: #3B82F6;
+  color: var(--adm-primary);
 }
 }
 
 
 .sales-value {
 .sales-value {
   font-weight: 600;
   font-weight: 600;
-  color: #F59E0B;
+  color: var(--adm-warning);
 }
 }
 
 
 .total-value {
 .total-value {
   font-weight: 600;
   font-weight: 600;
-  color: #1E293B;
+  color: var(--adm-text-88);
 }
 }
 
 
 .commission-value {
 .commission-value {
   font-weight: 700;
   font-weight: 700;
-  color: #10B981;
+  color: var(--adm-success);
 }
 }
 
 
 /* 抽屉样式 */
 /* 抽屉样式 */
@@ -573,16 +573,16 @@ export default {
   justify-content: space-between;
   justify-content: space-between;
   align-items: center;
   align-items: center;
   padding: 10px 0;
   padding: 10px 0;
-  border-bottom: 1px solid #F1F5F9;
+  border-bottom: 1px solid var(--adm-bg-header);
 }
 }
 
 
 .detail-label {
 .detail-label {
-  color: #64748B;
+  color: var(--adm-text-45);
   font-size: 14px;
   font-size: 14px;
 }
 }
 
 
 .detail-value {
 .detail-value {
-  color: #1E293B;
+  color: var(--adm-text-88);
   font-size: 14px;
   font-size: 14px;
   font-weight: 500;
   font-weight: 500;
 }
 }
@@ -590,7 +590,7 @@ export default {
 .mini-stat {
 .mini-stat {
   text-align: center;
   text-align: center;
   padding: 16px;
   padding: 16px;
-  background: #F8FAFC;
+  background: var(--adm-bg-header);
   border-radius: 12px;
   border-radius: 12px;
 }
 }
 
 
@@ -601,7 +601,7 @@ export default {
 
 
 .mini-stat-label {
 .mini-stat-label {
   font-size: 12px;
   font-size: 12px;
-  color: #64748B;
+  color: var(--adm-text-45);
   margin-top: 4px;
   margin-top: 4px;
 }
 }
 
 
@@ -612,6 +612,6 @@ export default {
   font-size: 12px;
   font-size: 12px;
 }
 }
 .sort-header:hover {
 .sort-header:hover {
-  color: #409eff;
+  color: var(--adm-primary);
 }
 }
 </style>
 </style>