Главная Обзор Помощь
Вход
18307996893
/
kangshifu-board
1
0
Ответвить 0
Файлы Задачи 0 Запросы на слияние 0 Вики
Ветка: main
Ветки Метки
kangshifu-board
/
TASK-v13-fix.md

TASK-v13-fix.md 4.7 KB
Постоянная ссылка История Исходник

v13：收尾修复（三项）

上一版 13 项验收 11 项达标。本轮只修三处，不要改动已达标的部分，不要重新设计。

一、排序按钮过重（用户一眼能看出的问题）

现状：/pool 排序段（优先级 S→A→B / 综合评分 高→低 …）选中项是深色实底 rgb(24,24,27) + 白字， 在一片浅色的筛选区里像块黑砖，视觉重心过沉。未选中项是透明底 + 极淡描边，几乎看不见。

要求：

  1. 选中态改为 浅色实底：底 rgba(0,0,0,0.06)（暗色模式下对应 rgba(255,255,255,0.10)）， 文字用主文字色，不要白字；左/右边缘不给色条。
  2. 未选中态：透明底 + 1px 描边 rgba(0,0,0,0.10)，文字用次级色。
  3. 整个段选做成一整块（外层容器 --r-sm 圆角 + 1px 描边），内部按钮之间用 1px 分隔线， 不要每个按钮各带圆角（现在像 5 个独立按钮粘在一起）。
  4. 选中态与未选中态文字字号、行高完全一致（现在切换时会跳）。
  5. 段选整体高度 28px 不变（已达标，别动）。

验收：脚本量出选中项 background 的亮度值，必须比 rgb(24,24,27) 亮（即数值和 > 200 的分量至少一个）， 且选中/未选中 font-size 相等。

二、左卡描述为空（信息密度一空一满）

现状：/pool 卡片列表里，有的卡有描述文案、有的没有。虽然卡片已经等高（≤2px）， 但空描述的卡上半部是一整块空白，右边却是满的，看起来像「漏填了」。

要求（按此优先级实现，任选其一即可，但必须说明选了哪个、为什么）：

  • (a) 首选：无描述时不渲染描述区，把「指标区」上提，让卡内纵向分布重新均分 （不是留个空 div 占位）。卡仍是等高，靠 flex justify-content: space-between 撑开。
  • (b) 从数据里派生一句：用该卡的「痛点 + 机会点」字段拼一句 ≤30 字的摘要（只能从已有字段取，不许编）。
  • (c) 无描述时显示「待补充描述」+ 次级色，字号 12px（最次选，因为等于把空缺暴露出来）。

禁止：为了填满而塞占位符、假文案、或重复标题。

验收：脚本量每张卡「最大连续空白高度」≤ 24px（这条已达标，别破坏）； 另外量「有描述卡 / 无描述卡」的内容总高度差 ≤ 40px。

三、根因修复：/pool 的页脚借用别页 CSS（隐患）

我已定位，这是事实不是猜测：

src/pages/report-card.js:24      export const CARD_CSS = css`...`   ← 报告页专用
src/pages/view-reports.js:59     static styles = [VIEW_CSS, CARD_CSS, ...]  ← 有 import，正常
src/pages/view-report-type.js:46 static styles = [VIEW_CSS, CARD_CSS, ...]  ← 有 import，正常
src/pages/view-stages.js:44      static styles = [VIEW_CSS, CARD_CSS, ...]  ← 有 import，正常
src/pages/view-pool.js           **没有 import CARD_CSS**，但 :224 用了 cardFooter()

cardFooter() 产出的 DOM 依赖 CARD_CSS 里的类名。view-pool.js 没引这份 CSS， 所以类名匹配不上 → 页脚按钮退回浏览器原生外观。上一轮用共享 .kf-btn 绕过去了， 但 cardFooter() 的所有内层类名在 /pool 依然是失效的（只是没被注意到）。

要求：

  1. 二选一，并说明理由：
    • (A) 首选：给 view-pool.js 补 import { CARD_CSS } 并加进 static styles—— 最小改动，且页脚与报告中心视觉完全一致（本来就是照着对齐的）。
    • (B) 把 cardFooter() 的样式从 CARD_CSS 抽成独立的 FOOTER_CSS 导出， 三个页面都改引 FOOTER_CSS——更干净但改动面大。
  2. 修完后必须验证 /pool 页脚的所有类名都命中，不能只是按钮外观对了。 验证方法：脚本里取页脚内部元素，检查 getComputedStyle 的 padding / border / borderRadius 与 /reports 同名元素逐项相等（至少 3 个元素 × 3 个属性）。
  3. 在 docs/v13-report.md 写清根因与所选方案。

四、硬性纪律

  • 不要动已达标项：圆角（8/12）、卡片等高、hover、底部留白、筛选栏结构、工作台两栏， 一律不改。改前先跑 node scripts/verify-visual-v12.mjs 存一份基线，改后再跑，对比不能退步。
  • 不许改 src/core/。
  • 单测保持 46/46；check.mjs 保持 OK。
  • 扩展 scripts/verify-visual-v12.mjs（或新建 verify-visual-v13.mjs）量出本轮三项的实测值， 任一项不达标 exit 1。不要口述「已修复」。
  • 撞 turn 上限就按 一 → 二 → 三 顺序落盘，每项做完立刻存。