فهرست منبع

refactor(beautify): D17 report-confirm 报告确认页清理 (debt 69->~25)

- 与 report-detail 同色板:全局令牌 6 色(mat-amber/green + fortune-0-ink + uni-warning-light)
- 局部 \-rpcf-* 8 色(卡片灰白 + Material 橙红渐变档)
- hex 23->0(palette 声明除外);P1 7->6
liaoxg 5 روز پیش
والد
کامیت
df8452ccf9
2فایلهای تغییر یافته به همراه95 افزوده شده و 18 حذف شده
  1. 28 18
      cfc-frontend/pages/health/report-confirm.vue
  2. 67 0
      cfc-frontend/scripts/d17-report-confirm.js

+ 28 - 18
cfc-frontend/pages/health/report-confirm.vue

@@ -950,6 +950,16 @@ export default {
 </script>
 
 <style scoped lang="scss">
+// ===== 报告确认页专属色阶(与 report-detail 同族 Material 渐变;单页专用,约定见 uni.scss §14)=====
+$c-rpcf-line:      #E8EDF2; // 浅灰分隔线
+$c-rpcf-card:      #F8FAFB; // 卡片底(浅灰白)
+$c-rpcf-red-bg:    #FFF0F0; // 警示浅红底
+$c-rpcf-amber-deep:#FFC107; // Material 琥珀深档
+$c-rpcf-orange-1:  #FF8A65; // 低档渐变起
+$c-rpcf-orange-2:  #FF5722; // 低档渐变终
+$c-rpcf-red-1:     #EF9A9A; // 无档渐变起
+$c-rpcf-red-2:     #E53935; // 无档渐变终
+
 .confirm-container {
   min-height: 100vh;
   background: $app-bg;
@@ -972,13 +982,13 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
-  background: #FFF8E1;
+  background: $mat-amber-tint;
   margin: 0 30rpx 20rpx;
   padding: 20rpx 24rpx;
   border-radius: 16rpx;
 }
 .parsing-icon { font-size: 32rpx; margin-right: 16rpx; flex-shrink: 0; }
-.parsing-text { font-size: calc(24rpx * var(--font-scale, 1)); color: #F57F17; line-height: 1.5; }
+.parsing-text { font-size: calc(24rpx * var(--font-scale, 1)); color: $mat-amber-strong; line-height: 1.5; }
 
 .form-section { margin: 0 30rpx; }
 
@@ -1030,7 +1040,7 @@ export default {
 
 /* ===== 指标分组折叠 ===== */
 .indicator-group {
-  border: 2rpx solid #E8EDF2;
+  border: 2rpx solid $c-rpcf-line;
   border-radius: 12rpx;
   margin-bottom: 12rpx;
   overflow: hidden;
@@ -1136,7 +1146,7 @@ export default {
   flex-shrink: 0;
 }
 .member-panel {
-  background: #F8FAFB;
+  background: $c-rpcf-card;
   border-radius: 12rpx;
   padding: 16rpx;
   margin: 8rpx 0 16rpx;
@@ -1207,7 +1217,7 @@ export default {
 .member-name { font-size: calc(24rpx * var(--font-scale, 1)); color: $facade-text-strong; }
 
 .indicator-item {
-  background: #F8FAFB;
+  background: $c-rpcf-card;
   border-radius: 12rpx;
   padding: 16rpx;
   margin-bottom: 12rpx;
@@ -1303,7 +1313,7 @@ export default {
 .ind-name-high-risk, .ind-value-high-risk,
 .ind-name-low-risk, .ind-value-low-risk,
 .ind-name-not-detected, .ind-value-not-detected {
-  background: #FFF0F0;
+  background: $c-rpcf-red-bg;
   color: $status-danger-strong-2;
 }
 
@@ -1374,7 +1384,7 @@ export default {
 .help-desc {
   margin-top: 8rpx;
   padding: 20rpx;
-  background: #F8FAFB;
+  background: $c-rpcf-card;
   border-radius: 12rpx;
 }
 .help-desc-label {
@@ -1396,7 +1406,7 @@ export default {
   align-items: center;
   gap: 12rpx;
   padding: 12rpx 16rpx;
-  background: #F8FAFB;
+  background: $c-rpcf-card;
   border-radius: 10rpx;
   margin-bottom: 8rpx;
 }
@@ -1442,7 +1452,7 @@ export default {
   display: block;
   font-size: calc(24rpx * var(--font-scale, 1));
   font-weight: 500;
-  color: #D32F2F;
+  color: $fortune-0-ink;
   padding: 8rpx 4rpx 6rpx;
 }
 
@@ -1452,7 +1462,7 @@ export default {
   align-items: center;
   gap: 12rpx;
   padding: 12rpx 16rpx;
-  background: #F8FAFB;
+  background: $c-rpcf-card;
   border-radius: 10rpx;
   margin-bottom: 8rpx;
 }
@@ -1480,7 +1490,7 @@ export default {
   align-items: center;
   gap: 12rpx;
   padding: 12rpx 16rpx;
-  background: #F8FAFB;
+  background: $c-rpcf-card;
   border-radius: 10rpx;
   margin-bottom: 8rpx;
 }
@@ -1563,7 +1573,7 @@ export default {
   border-radius: 20rpx;
 }
 .badge-high { background: $mat-green-tint; color: $mat-green-strong; }
-.badge-medium { background: #FFF8E1; color: #F57F17; }
+.badge-medium { background: $mat-amber-tint; color: $mat-amber-strong; }
 .badge-low { background: $fortune-1-tint; color: $mat-orange-strong; }
 .badge-none { background: $fortune-0-tint; color: $status-danger-strong-2; }
 
@@ -1579,10 +1589,10 @@ export default {
   border-radius: 6rpx;
   transition: width 0.3s ease;
 }
-.fill-high { background: linear-gradient(90deg, #66BB6A, #43A047); }
-.fill-medium { background: linear-gradient(90deg, #FFD54F, #FFC107); }
-.fill-low { background: linear-gradient(90deg, #FF8A65, #FF5722); }
-.fill-none { background: linear-gradient(90deg, #EF9A9A, #E53935); }
+.fill-high { background: linear-gradient(90deg, $mat-green-light-2, $mat-green-base-2); }
+.fill-medium { background: linear-gradient(90deg, $uni-warning-light, $c-rpcf-amber-deep); }
+.fill-low { background: linear-gradient(90deg, $c-rpcf-orange-1, $c-rpcf-orange-2); }
+.fill-none { background: linear-gradient(90deg, $c-rpcf-red-1, $c-rpcf-red-2); }
 
 .confidence-desc {
   font-size: calc(22rpx * var(--font-scale, 1));
@@ -1606,7 +1616,7 @@ export default {
   align-items: center;
   justify-content: space-between;
   padding: 16rpx;
-  background: #F8FAFB;
+  background: $c-rpcf-card;
   border-radius: 12rpx;
   margin-bottom: 10rpx;
   border: 2rpx solid transparent;
@@ -1789,7 +1799,7 @@ export default {
 .tongue-summary {
   margin-top: 20rpx;
   padding: 20rpx 24rpx;
-  background: #FFF8E1;
+  background: $mat-amber-tint;
   border-radius: 16rpx;
 }
 .tongue-summary-title {

+ 67 - 0
cfc-frontend/scripts/d17-report-confirm.js

@@ -0,0 +1,67 @@
+#!/usr/bin/env node
+/**
+ * D17: report-confirm.vue 报告确认页清理 (debt 69)
+ * 与 report-detail 同色板:全局令牌 6 色 + 局部 $c-rpcf-* 8 色
+ */
+const fs = require('fs');
+const F = 'pages/health/report-confirm.vue';
+let src = fs.readFileSync(F, 'utf8');
+
+const styleIdx = src.indexOf('<style');
+const before = src.slice(0, styleIdx);
+let styleBody = src.slice(styleIdx);
+
+const GLOBAL = [
+  ['#D32F2F', '$fortune-0-ink'],
+  ['#FFF8E1', '$mat-amber-tint'],
+  ['#F57F17', '$mat-amber-strong'],
+  ['#66BB6A', '$mat-green-light-2'],
+  ['#43A047', '$mat-green-base-2'],
+  ['#FFD54F', '$uni-warning-light'],
+];
+for (const [f, t] of GLOBAL) {
+  const esc = f.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+  styleBody = styleBody.replace(new RegExp(esc + '(?![0-9a-fA-F])', 'gi'), t);
+}
+
+const PAL = [
+  ['#E8EDF2', '$c-rpcf-line'],
+  ['#F8FAFB', '$c-rpcf-card'],
+  ['#FFF0F0', '$c-rpcf-red-bg'],
+  ['#FFC107', '$c-rpcf-amber-deep'],
+  ['#FF8A65', '$c-rpcf-orange-1'],
+  ['#FF5722', '$c-rpcf-orange-2'],
+  ['#EF9A9A', '$c-rpcf-red-1'],
+  ['#E53935', '$c-rpcf-red-2'],
+];
+for (const [f, t] of PAL) {
+  const esc = f.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+  styleBody = styleBody.replace(new RegExp(esc + '(?![0-9a-fA-F])', 'gi'), t);
+}
+
+const palette = [
+  '// ===== 报告确认页专属色阶(与 report-detail 同族 Material 渐变;单页专用,约定见 uni.scss §14)=====',
+  '$c-rpcf-line:      #E8EDF2; // 浅灰分隔线',
+  '$c-rpcf-card:      #F8FAFB; // 卡片底(浅灰白)',
+  '$c-rpcf-red-bg:    #FFF0F0; // 警示浅红底',
+  '$c-rpcf-amber-deep:#FFC107; // Material 琥珀深档',
+  '$c-rpcf-orange-1:  #FF8A65; // 低档渐变起',
+  '$c-rpcf-orange-2:  #FF5722; // 低档渐变终',
+  '$c-rpcf-red-1:     #EF9A9A; // 无档渐变起',
+  '$c-rpcf-red-2:     #E53935; // 无档渐变终',
+  ''
+].join('\n');
+styleBody = styleBody.replace(/(<style[^>]*>\s*\n)/, '$1' + palette + '\n');
+
+fs.writeFileSync(F, before + styleBody);
+console.log('D17 done');
+
+// 重读校验
+const out = fs.readFileSync(F, 'utf8');
+const lines = out.split('\n');
+let n = 0;
+for (let i = 0; i < lines.length; i++) {
+  const L = lines[i].trim();
+  if (/#[0-9a-fA-F]{3,8}\b/.test(L) && L.charAt(0) !== '$') { console.log('HEX ' + (i + 1) + ': ' + L); n++; }
+}
+console.log('remaining non-palette hex:', n);