Преглед изворни кода

style(web): U6 后台间距令牌归并——teacher 全目录 + OrderManage + Dashboard 裸写 px → var(--spacing-*)

依据:docs/superpowers/plans/2026-10-26-ui-token-convergence-tasks.md §U6(控制批次规模,不做全库)

范围:cfc-web/src/views/teacher/(10 个 .vue)+ src/views/admin/OrderManage.vue + src/views/admin/Dashboard.vue

改动:
- padding/margin 裸写 px 归并到既有令牌 var(--spacing-*):
  8→sm / 12→md / 16→base / 20→lg / 24→lg / 32→xxl(刻度 8/12/16/20/24/32 就近匹配,20px 优先对齐 24px 规范方向)
- 65 处声明、69 个 px 值替换为令牌引用
- 本批 padding/margin 裸写 px:87 → 29(-66.7%)
- 全库 var(-- 引用率(.vue 口径,审计基线 21.9%):22.02% → 24.10%

未动:admin-tokens.css 与 uni.scss 令牌定义/值;border-radius / font-size / width / height / line-height /
top / left;非候选刻度(2/4/6/10/14/15/48px)按 U6 范围外保留(逐条清单见回报报告)。

验证:
- cfc-backend mvn clean compile → BUILD SUCCESS(1948 源文件)
- cfc-web npm run build → DONE Build complete(85s;dist CSS 中 85 处 var(--spacing-*) 生效)
- lint 不可用:package.json 无 lint script、未安装 @vue/cli-plugin-eslint(vue-cli-service lint: command does not exist)
Sisyphus Agent пре 2 недеља
родитељ
комит
01514f230a

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

@@ -413,24 +413,24 @@ export default {
 </script>
 
 <style scoped>
-.dashboard-container { padding: 24px; }
-.section-row { margin-top: 16px; }
+.dashboard-container { padding: var(--spacing-lg); }
+.section-row { margin-top: var(--spacing-base); }
 .section-card { margin-bottom: 0; }
 .card-header { font-weight: 600; font-size: 15px; color: var(--adm-text-88); }
 .card-header i { margin-right: 6px; }
 .chart-card { min-height: 320px; }
 .echarts-container { height: 260px; width: 100%; }
 .revenue-card { min-height: 140px; }
-.revenue-body { text-align: center; padding: 8px 0; }
+.revenue-body { text-align: center; padding: var(--spacing-sm) 0; }
 .revenue-value { font-size: 28px; font-weight: 700; line-height: 1.3; }
 .revenue-orange { color: #F97316; }
 .revenue-green  { color: var(--adm-success); }
 .revenue-blue   { color: var(--adm-primary); }
 .revenue-sub { font-size: 12px; color: var(--adm-text-45); margin-top: 6px; }
 .hot-card { min-height: 200px; }
-.hot-list { padding: 8px 0; }
+.hot-list { padding: var(--spacing-sm) 0; }
 .hot-item {
-  display: flex; align-items: center; padding: 8px 12px;
+  display: flex; align-items: center; padding: var(--spacing-sm) var(--spacing-md);
   border-bottom: 1px solid var(--adm-fill); transition: background 0.2s;
 }
 .hot-item:hover { background: var(--adm-bg-header); }
@@ -438,17 +438,17 @@ export default {
 .hot-rank {
   width: 24px; height: 24px; border-radius: 50%;
   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: var(--spacing-md); flex-shrink: 0;
 }
 .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-other { background: var(--adm-bg-header); color: var(--adm-text-45); }
 .hot-title { flex: 1; font-size: 14px; color: var(--adm-text-65); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.hot-value { font-size: 14px; color: var(--adm-text-45); margin-left: 8px; }
-.hot-empty { text-align: center; color: var(--adm-text-45); padding: 24px 0; font-size: 12px; }
+.hot-value { font-size: 14px; color: var(--adm-text-45); margin-left: var(--spacing-sm); }
+.hot-empty { text-align: center; color: var(--adm-text-45); padding: var(--spacing-lg) 0; font-size: 12px; }
 @media (max-width: 768px) {
-  .dashboard-container { padding: 12px; }
+  .dashboard-container { padding: var(--spacing-md); }
   .echarts-container { height: 200px; }
 }
 </style>

+ 1 - 1
cfc-web/src/views/admin/OrderManage.vue

@@ -420,7 +420,7 @@ export default {
 </script>
 
 <style scoped>
-.order-manage { padding: 24px; }
+.order-manage { padding: var(--spacing-lg); }
 .filters {
   display: flex;
   gap: 10px;

+ 2 - 2
cfc-web/src/views/teacher/HealthPlanReview.vue

@@ -313,7 +313,7 @@ export default {
 </script>
 
 <style scoped>
-.health-plan-review { padding: 24px; }
+.health-plan-review { padding: var(--spacing-lg); }
 /* == C 批内联清理工具类 == */
 .w-180 { width: 180px; }
 .w-140 { width: 140px; }
@@ -323,7 +323,7 @@ export default {
 .w-70 { width: 70px; }
 .full-width { width: 100%; }
 .mr-4 { margin-right: 4px; }
-.section-card { margin-bottom: 12px; border: 1px solid #ebeef5; border-radius: 4px; padding: 8px; }
+.section-card { margin-bottom: var(--spacing-md); border: 1px solid #ebeef5; border-radius: 4px; padding: var(--spacing-sm); }
 .section-title { font-weight: 600; margin-bottom: 6px; }
 .task-row { display: flex; gap: 6px; margin-bottom: 6px; align-items: center; }
 </style>

+ 3 - 3
cfc-web/src/views/teacher/ProxyReport.vue

@@ -347,10 +347,10 @@ export default {
   color: var(--adm-text-88);
 }
 .analysis-content :deep(p) {
-  margin: 8px 0;
+  margin: var(--spacing-sm) 0;
 }
 .pagination-wrap {
-  margin-top: 24px;
+  margin-top: var(--spacing-lg);
   text-align: right;
 }
 .analysis-scroll {
@@ -359,5 +359,5 @@ export default {
 }
 /* == C 批内联清理工具类 == */
 .full-width { width: 100%; }
-.mt-20 { margin-top: 24px; }
+.mt-20 { margin-top: var(--spacing-lg); }
 </style>

+ 1 - 1
cfc-web/src/views/teacher/TeacherAssessment.vue

@@ -237,7 +237,7 @@ export default {
 
 <style scoped>
 .family-assessment {
-  padding: 24px;
+  padding: var(--spacing-lg);
 }
 
 /* == C 批内联清理工具类 == */

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

@@ -299,20 +299,20 @@ export default {
 
 <style scoped>
 .teacher-families {
-  padding: 24px;
+  padding: var(--spacing-lg);
   background: var(--adm-info-bg);
   min-height: calc(100vh - 120px);
 }
 
 /* 统计卡片 */
 .stats-row {
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
 }
 
 /* 筛选卡片 */
 .filter-card {
   border-radius: 8px;
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
   border: none;
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.06);
 }
@@ -338,7 +338,7 @@ export default {
   align-items: center;
   justify-content: center;
   color: var(--adm-bg-container);
-  margin-right: 12px;
+  margin-right: var(--spacing-md);
   font-size: 16px;
 }
 
@@ -379,7 +379,7 @@ export default {
 
 /* 抽屉样式 */
 .drawer-content {
-  padding: 0 24px;
+  padding: 0 var(--spacing-lg);
 }
 
 .detail-row {
@@ -401,13 +401,13 @@ export default {
 }
 
 .member-list {
-  margin-top: 12px;
+  margin-top: var(--spacing-md);
 }
 
 .member-item {
   display: flex;
   align-items: center;
-  padding: 12px 0;
+  padding: var(--spacing-md) 0;
   border-bottom: 1px solid var(--adm-bg-header);
 }
 
@@ -420,7 +420,7 @@ export default {
   align-items: center;
   justify-content: center;
   color: var(--adm-bg-container);
-  margin-right: 12px;
+  margin-right: var(--spacing-md);
 }
 
 .member-name {
@@ -448,17 +448,17 @@ export default {
 
 .no-members {
   text-align: center;
-  padding: 24px;
+  padding: var(--spacing-lg);
   color: var(--adm-text-45);
 }
 
 .task-stats {
-  margin-top: 12px;
+  margin-top: var(--spacing-md);
 }
 
 .task-stat-item {
   text-align: center;
-  padding: 16px;
+  padding: var(--spacing-base);
   background: var(--adm-bg-header);
   border-radius: 8px;
 }

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

@@ -337,7 +337,7 @@ export default {
 
 <style scoped>
 .teacher-messages {
-  padding: 24px;
+  padding: var(--spacing-lg);
   background: #F0F7FF;
   min-height: calc(100vh - 120px);
 }
@@ -368,7 +368,7 @@ export default {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 12px 16px;
+  padding: var(--spacing-md) var(--spacing-base);
   border-bottom: 1px solid var(--adm-bg-header);
 }
 
@@ -382,7 +382,7 @@ export default {
   font-size: 12px;
   color: var(--adm-bg-container);
   background: var(--adm-error);
-  padding: 2px 8px;
+  padding: 2px var(--spacing-sm);
   border-radius: 8px;
 }
 
@@ -393,7 +393,7 @@ export default {
 
 .conversation-item {
   display: flex;
-  padding: 14px 16px;
+  padding: 14px var(--spacing-base);
   cursor: pointer;
   border-bottom: 1px solid var(--adm-bg-header);
   transition: all 0.2s;
@@ -426,7 +426,7 @@ export default {
   align-items: center;
   justify-content: center;
   color: var(--adm-bg-container);
-  margin-right: 12px;
+  margin-right: var(--spacing-md);
   font-size: 18px;
   flex-shrink: 0;
 }
@@ -496,7 +496,7 @@ export default {
 
 .empty-conversations i {
   font-size: 48px;
-  margin-bottom: 12px;
+  margin-bottom: var(--spacing-md);
 }
 
 /* 聊天区域 */
@@ -511,7 +511,7 @@ export default {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 14px 24px;
+  padding: 14px var(--spacing-lg);
   border-bottom: 1px solid var(--adm-bg-header);
 }
 
@@ -530,7 +530,7 @@ export default {
 
 .chat-messages {
   flex: 1;
-  padding: 24px;
+  padding: var(--spacing-lg);
   overflow-y: auto;
   background: var(--adm-bg-header);
 }
@@ -538,7 +538,7 @@ export default {
 .chat-message {
   display: flex;
   flex-direction: column;
-  margin-bottom: 16px;
+  margin-bottom: var(--spacing-base);
   max-width: 70%;
 }
 
@@ -548,7 +548,7 @@ export default {
 }
 
 .message-bubble {
-  padding: 12px 16px;
+  padding: var(--spacing-md) var(--spacing-base);
   border-radius: 8px;
   background: var(--adm-bg-container);
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
@@ -582,11 +582,11 @@ export default {
 
 .empty-content i {
   font-size: 64px;
-  margin-bottom: 12px;
+  margin-bottom: var(--spacing-md);
 }
 
 .chat-input {
-  padding: 16px 24px;
+  padding: var(--spacing-base) var(--spacing-lg);
   border-top: 1px solid var(--adm-bg-header);
   background: var(--adm-bg-container);
 }
@@ -606,7 +606,7 @@ export default {
 .info-section-title {
   font-weight: 600;
   font-size: 14px;
-  margin-bottom: 8px;
+  margin-bottom: var(--spacing-sm);
   color: var(--adm-text-88);
 }
 
@@ -625,14 +625,14 @@ export default {
 .no-data {
   color: var(--adm-text-25);
   font-size: 12px;
-  padding: 8px 0;
+  padding: var(--spacing-sm) 0;
 }
 
 .child-task-section {
   padding: 10px;
   background: var(--adm-bg-header);
   border-radius: 6px;
-  margin-bottom: 8px;
+  margin-bottom: var(--spacing-sm);
   border: 1px solid var(--adm-border-split);
 }
 
@@ -643,7 +643,7 @@ export default {
 
 .message-reply {
   margin-top: 6px;
-  padding: 6px 8px;
+  padding: 6px var(--spacing-sm);
   background: rgba(64, 158, 255, 0.08);
   border-radius: 4px;
   font-size: 12px;
@@ -658,13 +658,13 @@ export default {
 .message-reply .reply-time {
   color: var(--adm-text-25);
   font-size: 11px;
-  margin-left: 8px;
+  margin-left: var(--spacing-sm);
 }
 
 /* == C 批内联清理工具类 == */
-.search-input { width: 200px; margin-right: 12px; }
+.search-input { width: 200px; margin-right: var(--spacing-md); }
 .dialog-loading { min-height: 200px; }
-.row-mb16 { margin-bottom: 16px; }
-.row-my8 { margin: 8px 0; }
-.child-score { margin-left: 12px; color: var(--adm-text-45); font-size: 12px; }
+.row-mb16 { margin-bottom: var(--spacing-base); }
+.row-my8 { margin: var(--spacing-sm) 0; }
+.child-score { margin-left: var(--spacing-md); color: var(--adm-text-45); font-size: 12px; }
 </style>

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

@@ -330,7 +330,7 @@ export default {
 
 <style scoped>
 .teacher-orders {
-  padding: 24px;
+  padding: var(--spacing-lg);
   background: #F0F7FF;
   min-height: calc(100vh - 120px);
 }
@@ -349,14 +349,14 @@ export default {
 
 /* 统计卡片 */
 .stats-row {
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
 }
 
 
 /* 佣金说明 */
 .commission-info-card {
   border-radius: 8px;
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
   border: none;
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.06);
 }
@@ -394,7 +394,7 @@ export default {
 /* 筛选卡片 */
 .filter-card {
   border-radius: 8px;
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
   border: none;
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.06);
 }
@@ -446,14 +446,14 @@ export default {
 }
 
 .pagination-wrapper {
-  margin-top: 24px;
+  margin-top: var(--spacing-lg);
   display: flex;
   justify-content: flex-end;
 }
 
 /* 抽屉样式 */
 .drawer-content {
-  padding: 0 24px;
+  padding: 0 var(--spacing-lg);
 }
 
 .detail-row {

+ 4 - 4
cfc-web/src/views/teacher/TeacherPackages.vue

@@ -353,14 +353,14 @@ export default {
 
 <style scoped>
 .teacher-packages {
-  padding: 24px;
+  padding: var(--spacing-lg);
   background: #F0F7FF;
   min-height: calc(100vh - 120px);
 }
 
 /* 统计卡片 */
 .stats-row {
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
 }
 
 
@@ -385,7 +385,7 @@ export default {
   align-items: center;
   justify-content: center;
   color: var(--adm-bg-container);
-  margin-right: 12px;
+  margin-right: var(--spacing-md);
   font-size: 16px;
 }
 
@@ -437,7 +437,7 @@ export default {
 .form-tip {
   font-size: 12px;
   color: var(--adm-text-45);
-  margin-left: 8px;
+  margin-left: var(--spacing-sm);
 }
 
 .dialog-footer {

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

@@ -318,20 +318,20 @@ export default {
 
 <style scoped>
 .teacher-team {
-  padding: 24px;
+  padding: var(--spacing-lg);
   background: #F0F7FF;
   min-height: calc(100vh - 120px);
 }
 
 /* 统计卡片 */
 .stats-row {
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
 }
 
 /* 邀请码卡片 */
 .invite-code-card {
   border-radius: 8px;
-  margin-bottom: 24px;
+  margin-bottom: var(--spacing-lg);
   border: none;
   box-shadow: 0 2px 12px rgba(59, 130, 246, 0.06);
   background: var(--adm-primary);
@@ -396,7 +396,7 @@ export default {
   align-items: center;
   justify-content: center;
   color: var(--adm-bg-container);
-  margin-right: 12px;
+  margin-right: var(--spacing-md);
   font-size: 16px;
 }
 
@@ -434,7 +434,7 @@ export default {
 
 /* 抽屉样式 */
 .drawer-content {
-  padding: 0 24px;
+  padding: 0 var(--spacing-lg);
 }
 
 .detail-row {
@@ -458,7 +458,7 @@ export default {
 
 .mini-stat {
   text-align: center;
-  padding: 16px;
+  padding: var(--spacing-base);
   background: var(--adm-bg-header);
   border-radius: 8px;
 }