# 实现计划:H5 → 微信小程序批量迁移 ## 概述 基于 33 条需求和技术设计文档,将 17 个 H5 原型页面迁移为原生微信小程序页面。按 A-G 七个批次执行,每页走完 7 步标准流程(含 Step 0 页面分析)。输入物分两批提供:第一批(结构迁移 Step 0-5)、第二批(像素精调 Step 6-7)。 ## 任务 - [x] 1. 全局基础设施搭建 - [x] 1.1 创建 AI 图标配色工具模块 - 文件:`utils/ai-color.ts` - 实现 `AI_COLOR_SCHEMES` 常量(6 种配色:red/orange/yellow/blue/indigo/purple) - 实现 `getRandomAiColor()` 函数,返回 `{ className, vars }` 对象 - _需求: 32.1, 32.3, 32.5_ - [x] 1.2 创建 AI 图标全局 WXSS 样式 - 在 `app.wxss` 中添加 `.ai-inline-icon`、`.ai-title-badge`、`.ai-color-*` 6 个配色类 - 实现 `ai-shimmer`(12s)和 `ai-pulse`(3s)两个 `@keyframes` 动画 - _需求: 32.1, 32.2_ - [x] 1.3 导出小系列机器人 SVG - 从 H5 源码提取白色填充版机器人 SVG,保存为 `assets/icons/ai-robot-sm.svg` - 复用已有 `assets/icons/ai-robot.svg`(大系列) - 更新 `docs/h5_ui/icon-mapping.md` - _需求: 32.6, 33.2, 33.3_ - [x] 1.4 创建中间生成物目录结构 - 创建 `docs/h5_ui/mp-screenshots/`(MP 截图,按页面分子目录) - 创建 `docs/h5_ui/diffs/`(像素对比结果,按页面分子目录) - 创建 `docs/h5_ui/h5-segments/`(H5 逐段截图,按页面分子目录) - 确认 `.gitignore` 不排除这些目录 - _需求: 33.1_ - [x] 1.5 验证全局基础设施 - 编译验证 `app.wxss` 无警告 - 在任意已有页面中测试 AI 配色工具模块可正常导入和调用 - _需求: 17.1_ - [ ] 2. A 批次 — board-finance(看板-财务) - [x] 2.1 Step 0: 页面分析 - 打开 H5 原型截图 + `interactions/board-finance.md` - 确认屏数(预计 6 段:经营一览/预收资产/应计收入/现金流入/现金流出/助教分析) - 列出所有交互态(时间筛选/区域筛选/指标弹窗/目录面板/长按菜单) - 输出工作量估算表 - _需求: 1.1, 1.3_ - [x] 2.2 Step 1-2: 输入物冻结 + 迁移审计 - 冻结第一批输入物(Playbook + design-tokens + icon-mapping + HTML + CSS + interactions) - 输出《迁移审计报告》7 项(页面结构/CSS 风险/样式映射/图标处理/交互映射/外部依赖/缺失信息) - _需求: 3.1, 3.2, 4.1, 4.2, 4.3_ - [x] 2.3 Step 3: 规则化转换(按屏逐个开发) - 创建四文件骨架 → .json 注册组件 → 按屏转换 WXML/WXSS/TS - 包含:filter-dropdown 复用、metric-card 复用、ai-float-button 集成 - filter-bar 高度统一 70 逻辑像素 - Mock 数据 + 三态处理 - _需求: 5, 6, 7, 8, 9, 10, 11, 12, 14, 15, 16, 21, 23.1, 32_ - [x] 2.4 Step 4-5: 编译验证 + 结构还原验证 - 7 项编译检查(WXML/WXSS/控制台/图片/组件/路由/TS 类型) - 9 项结构核对(按屏逐个验证) - _需求: 17, 18_ - [-] 2.5 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 1.1) - _需求: 3.3, 19, 20_ - [ ] 3. A 批次 — board-coach(看板-助教) - [x] 3.1 Step 0: 页面分析 - 确认屏数、交互态(排序筛选/擅长项目筛选/时间筛选) - _需求: 1.1, 1.3_ - [x] 3.2 Step 1-2: 输入物冻结 + 迁移审计 - _需求: 3.1, 3.2, 4_ - [x] 3.3 Step 3: 规则化转换 - P0: error 状态补充(WXML 分支 + TS onRetry + pageState 类型扩展) - P1: 卡片按压反馈(hover-class="coach-card--hover" 替代 :active) - P2: dev-fab 组件注册(JSON 补注册) - P3: 样式偏差修复 8 项(Tab 24rpx/36rpx/22rpx、salary-amount 32rpx、right-sub #a6a6a6 22rpx、right-text 24rpx、right-highlight 28rpx、filter-item--wide flex:2) - _需求: 5-16, 21, 23.2, 23.4, 23.5, 32_ - [x] 3.4 Step 4-5: 编译验证 + 结构还原验证 - 7/7 编译检查通过,9/9 结构核对通过 - _需求: 17, 18_ - [-] 3.5 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 1.2) - _需求: 19, 20_ - [x] 4. A 批次 — board-customer(看板-客户) - [x] 4.1 Step 0: 页面分析 - 确认屏数、交互态(客户类型筛选/偏爱项目筛选) - _需求: 1.1, 1.3_ - [x] 4.2 Step 1-2: 输入物冻结 + 迁移审计 - _需求: 3.1, 3.2, 4_ - [x] 4.3 Step 3: 规则化转换 - P0: error 状态补充(WXML + TS + WXSS) - P1: 卡片按压反馈(hover-class 替代 :active) - P2: dev-fab 组件注册 - P3: 16 项 Step 3 级别样式偏差修复(Tab/筛选栏/卡片圆角/头像/中间行/网格/柱状图/专一表等) - _需求: 5-16, 21, 23.3, 23.4, 23.5, 32_ - [x] 4.4 Step 4-5: 编译验证 + 结构还原验证 - 7/7 编译检查通过,11/11 结构核对通过 - _需求: 17, 18_ - [-] 4.5 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 1.3) - _需求: 19, 20_ - [x] 5. 检查点 A — 看板批次验收 - 3 个看板页面全部编译零错误 - 共享组件(filter-dropdown、board-tab-bar、ai-float-button、dev-fab、heart-icon)在所有页面中正确注册和引用 - 四态处理(loading/empty/error/normal)统一实现 - Tab 样式跨页面统一(24rpx/36rpx/22rpx) - Step 6-7 像素精调待第二批输入物 - [ ] 6. B 批次 — task-list(任务列表) - [x] 6.1 Step 0: 页面分析 - 确认屏数、交互态(长按菜单/备注弹窗/空状态) - 历史实现差异极大,接近全量重写(Banner 17%、交互 23%、列表分区 0%) - _需求: 1.1_ - [x] 6.2 Step 1-2: 输入物冻结 + 迁移审计 - 输出审计报告含 7 节(A-G)+ C 节 13 子节样式映射 - 识别 8 个 Step 3 工作项(P0-P7),2 个高复杂度 - _需求: 3, 4_ - [x] 6.3 Step 3: 规则化转换(全量重写 4 文件) - P0: Banner 业绩进度卡片(4 层:跳档提示 + 5 段进度条 + 课时红戳奖金 + 预计收入) - P1: 卡片内容改造(第二行→最近到店+余额、第三行→AI 图标+建议、箭头→t-icon) - P2: 列表三区分组(pinnedTasks/normalTasks/abandonedTasks + 分区标签) - P3: 自定义长按菜单(ctx-overlay + ctx-menu + 4 项 + 坐标定位 + 边界检测 + _longPressed 防冲突) - P4: 放弃弹窗(页面内实现,textarea 必填校验 + 红色按钮) - P5: error 状态 + dev-fab 注册 + hover-class - P6: 盖戳动画(@keyframes stampDown + setTimeout 触发) - P7: 样式偏差修复(C9-1 padding 28rpx、C9-2 shadow-sm、C10-1/C10-2 标签渐变、C11-3 line-height) - 移除 hobby-tag,新增 note-modal/dev-fab/t-icon 组件注册 - _需求: 5-16, 21, 24.1, 13, 32_ - [x] 6.4 Step 4-5: 编译验证 + 结构还原验证 - 7/7 编译检查通过(TS 零诊断、JSON 合法、WXML 闭合、WXSS 语法、组件/数据/事件一致性) - 13/13 结构核对通过(P0-P7 全部验证 + 放弃卡片灰化 + 置顶 amber 阴影 + 长按冲突处理) - _需求: 17, 18_ - [-] 6.5 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 2.1) - _需求: 19, 20_ - [ ] 7. B 批次 — my-profile(个人中心) - [x] 7.1 Step 0: 页面分析 - 1 屏、最简页面、100% 功能覆盖、21 处 WXSS 数值偏差 - _需求: 1.1_ - [x] 7.2 Step 1-2: 输入物冻结 + 迁移审计 - 审计报告 7 节(A-G),21 处偏差全部为数值微调,无结构性问题 - _需求: 3, 4_ - [x] 7.3 Step 3: 规则化转换 - P1: WXSS 数值校准 21 处(padding/gap/font-size/width/height/shadow/border) - P2: 补充 line-height: 1.5(name/store-name/menu-text) - P3: 边框宽度 1rpx → 2rpx - P4: 头像阴影参数修正为 design-tokens 标准值 - TabBar 页面路由配置已就绪 - _需求: 5-16, 21, 24.2, 24.3, 32_ - [x] 7.4 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,JSON 合法,WXML 闭合,WXSS 语法正确 - 21/21 偏差全部修正,图标 5/5,交互 6/6,外部依赖 0 - _需求: 17, 18_ - [-] 7.5 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 2.2) - _需求: 19, 20_ - [x] 8. 检查点 B — 核心批次验收 - ✅ task-list: 7/7 编译 + 13/13 结构验证通过 - ✅ my-profile: 0 诊断 + 21/21 偏差修正验证通过 - ✅ TabBar: 3 页面(task-list/board-finance/my-profile)路由+图标+文字配置正确 - ✅ 长按菜单: ctx-overlay + ctx-menu + _longPressed 防冲突机制已实现 - [ ] 9. C 批次 — task-detail(任务详情主页面) - [x] 9.1 Step 0: 页面分析 - 6 个内容区域 + 1 固定栏 + 3 弹窗 = 10 功能单元 - 已有实现覆盖率 45%,缺失维客线索、近期服务记录、话术气泡、放弃弹窗等 - 输出 `docs/h5_ui/analysis/task-detail-step0.md` - _需求: 1.1_ - [x] 9.2 Step 1-2: 输入物冻结 + 迁移审计 - 审计含在 Step 0 中,识别 11 个工作项(P0-P10) - _需求: 3, 4_ - [x] 9.3 Step 3: 规则化转换(11 项增量改造) - P0: 维客线索区(5 卡片,4 色标签,展开/收起描述) - P1: 近期服务记录区(3 格汇总 + 3 条记录 + 查看全部链接) - P2: 话术参考气泡(5 条话术 + AI 图标 + 复制/已复制切换 + 气泡尖角 view 模拟) - P3: 放弃弹窗改为自定义实现(遮罩 + textarea + 必填校验 + 红色确认) - P4: 删除备注(垃圾桶图标 + wx.showModal 确认) - P5: 错误态 + 重试(pageState 扩展 'error') - P6: 查看手机号(phoneVisible 切换) - P7: 储值等级标签(金色渐变) - P8: 样式校准(全部按 design-tokens 校准,2rpx 最小边框) - P9: 备注星级评分(star-rating readonly) - P10: 查看全部服务记录链接 - _需求: 5-16, 21, 25.1, 32_ - [x] 9.4 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,JSON 合法,WXML 完整,WXSS 语法正确 - P0-P10 全部验证通过 - _需求: 17, 18_ - [-] 9.5 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 3.1) - _需求: 19, 20_ - [x] 10. C 批次 — task-detail 三个变体 - [x] 10.1 复制 task-detail 生成 task-detail-callback - teal 主题,竖线话术,无放弃按钮,无服务记录区,"📞 常规回访要点" - 区域顺序:维客线索→关系→建议→备注 - _需求: 22.2, 22.3, 22.4, 25.2_ - [x] 10.2 复制 task-detail 生成 task-detail-priority - orange 主题,气泡话术(同主页面),有放弃按钮+服务记录,"💡 建议执行" - 区域顺序:关系→建议→维客线索→备注→服务记录(同 task-detail) - _需求: 22.2, 22.3, 22.4, 25.2_ - [x] 10.3 复制 task-detail 生成 task-detail-relationship - pink 主题,竖线话术,无放弃按钮,无服务记录区,"💝 关系构建重点" - 区域顺序:维客线索→关系→建议→备注 - _需求: 22.2, 22.3, 22.4, 25.2_ - [x] 10.4 三个变体编译验证 - 3 个变体 TS 零诊断,12 文件全部创建 - _需求: 17_ - [x] 11. 检查点 C — 任务批次验收 - ✅ 文件完整性:4 页面 × 4 文件 = 16 文件全部存在 - ✅ TS 编译:4 个 TS 文件零诊断 - ✅ app.json 路由:4 个页面路由已注册 - ✅ JSON 配置:4 页面均有 `navigationStyle: "custom"` + 组件注册 - ✅ 主题色差异:red/teal/orange/pink 四色正确区分 - ✅ 导航跳转:task-list → DETAIL_ROUTE_MAP 按 tasktype 分发到 4 个变体 - ⚠️ 修复:task-detail.wxss 内容丢失(0 字节),已恢复完整样式(14,879 字节) - [x] 12. D 批次 — coach-detail(助教详情) - [x] 12.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 7 个内容区域 + 1 固定栏 + 2 弹窗 = 10 功能单元 - 已有实现覆盖率 45%,识别 P0-P9 共 10 个工作项 - 输出 `docs/h5_ui/analysis/coach-detail-step0.md` - _需求: 1.1, 3, 4_ - [x] 12.2 Step 3: 规则化转换 - P0: 任务执行区(6 可见 + 3 隐藏 + 2 已放弃,展开/收起,备注图标弹窗) - P1: 客户关系 TOP5(5 卡片 + 渐变背景 + emoji + 跳转 customer-detail) - P2: 近期服务明细(4 条记录 + 查看更多) - P3: 更多信息(入职日期 + 5 行历史月份表格) - P4: 绩效档位进度条 - P5: 备注列表弹窗(底部弹出 + 动态渲染) - P6: 错误态 + 重试 - P7: hover-class 补充 - P8: safe-area-top + navigationStyle: custom - P9: 样式校准(design-tokens 对齐) - _需求: 5-16, 21, 26.1, 32_ - [x] 12.3 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,WXML class 全覆盖,JSON 组件注册完整,app.json 路由已注册 - _需求: 17, 18_ - [-] 12.4 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 4.1) - _需求: 19, 20_ - [x] 13. D 批次 — customer-detail(客户详情) - [x] 13.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 7 个内容区域 + 1 固定栏 = 8 功能单元 - 已有实现覆盖率高,消费记录三种样式(台桌/商城/充值)已实现 - 输出 `docs/h5_ui/analysis/customer-detail-step0.md` - _需求: 1.1, 3, 4_ - [x] 13.2 Step 3: 规则化转换 - 补充 error 态 + onRetry - 补充 safe-area-top + hover-class - 消费记录三种样式完整(台桌结账/商城订单/充值) - onReachBottom 懒加载分页 - note-modal 备注弹窗集成 - _需求: 5-16, 21, 26.2, 32_ - [x] 13.3 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,WXML class 全覆盖,JSON 组件注册完整,app.json 路由已注册 - _需求: 17, 18_ - [-] 13.4 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 4.2) - _需求: 19, 20_ - [x] 14. D 批次 — customer-service-records(客户服务记录) - [x] 14.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 1 屏页面,已有实现覆盖率 ~80%,识别 P0-P5 共 6 个工作项 - 输出 `docs/h5_ui/analysis/customer-service-records-step0.md` - _需求: 1.1, 3, 4_ - [x] 14.2 Step 3-5: 规则化转换 + 编译验证 + 结构还原验证 - P0: error 态 + onRetry(WXML 分支 + TS pageState 扩展 'error') - P1: hover-class 替代 :active(record-card--hover + nav-back--hover + retry-btn--hover) - P2: dev-fab 组件注册(JSON 补注册) - P3: navigationStyle: custom + safe-area-top - P4: WXSS 数值校准 12 处(record-card border-radius/padding、record-date/duration/type/income font-size、summary-label/value、footer-text、month-label、customer-name、phone-text/sub-stat/stat-highlight) - P5: 边框 1rpx → 2rpx(month-switcher、month-summary、summary-divider、record-card) - TS 零诊断,JSON 合法,WXML 完整,app.json 路由已注册 - _需求: 5-18, 21, 26.3, 32_ - [-] 14.3 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 4.3) - _需求: 19, 20_ - [x] 15. 检查点 D — 详情批次验收 - ✅ 文件完整性:3 页面 × 4 文件 = 12 文件全部存在 - ✅ TS 编译:3 个 TS 文件零诊断 - ✅ app.json 路由:coach-detail、customer-detail、customer-service-records 三个路由已注册 - ✅ 导航跳转:board-coach → coach-detail(onCoachTap)、board-customer → customer-detail(onCustomerTap)、customer-detail → customer-service-records(onViewAllRecords) - [x] 16. E 批次 — performance(业绩总览) - [x] 16.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 已有实现覆盖率 ~85%,识别 P0-P6 共 7 个工作项 - 输出 `docs/h5_ui/analysis/performance-step0.md` - _需求: 1.1, 3, 4_ - [x] 16.2 Step 3: 规则化转换 - P0: error 状态 + onRetry(WXML 分支 + TS pageState 扩展 'error' + try-catch) - P1: hover-class 按压反馈(customer-item + toggle-btn + view-all + income-card) - P2: dev-fab 组件注册 - P3: navigationStyle: custom + safe-area-top + 自定义导航栏 - P4: 日期分隔线增强(dd-line + dd-stats 每日汇总) - P5: WXSS 数值已合规,无需修改 - P6: 边框已是 2rpx,无需修改 - _需求: 5-16, 21, 27.1, 32_ - [x] 16.3 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,JSON 合法,WXML 完整,app.json 路由已注册 - _需求: 17, 18_ - [-] 16.4 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 5.1) - _需求: 19, 20_ - [x] 17. E 批次 — performance-records(业绩明细) - [x] 17.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 已有实现覆盖率 ~80%,识别 P0-P3 共 4 个工作项 - _需求: 1.1, 3, 4_ - [x] 17.2 Step 3-5: 规则化转换 + 编译验证 + 结构还原验证 - P0: error 状态 + onRetry(WXML 分支 + TS pageState 扩展 + try-catch) - P1: hover-class 按压反馈(month-btn) - P2: dev-fab 组件注册 - P3: navigationStyle: custom + safe-area-top + 自定义导航栏 - TS 零诊断,JSON 合法,WXML 完整,app.json 路由已注册 - _需求: 5-21, 27.2, 32_ - [-] 17.3 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 5.2) - _需求: 19, 20_ - [x] 18. 检查点 E — 绩效批次验收 - ✅ 文件完整性:2 页面 × 4 文件 = 8 文件全部存在 - ✅ TS 编译:2 个 TS 文件零诊断 - ✅ app.json 路由:performance 和 performance-records 两个路由已注册 - ✅ 导航跳转:task-list → performance(onPerformanceTap)、performance → performance-records(goToRecords) - [x] 19. F 批次 — chat(AI 对话) - [x] 19.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 已有实现覆盖率 ~85%,识别 6 个工作项 - _需求: 1.1, 3, 4_ - [x] 19.2 Step 3: 规则化转换 - P0: error 状态 + onRetry(pageState 扩展 'error'、WXML 错误分支、TS try-catch) - P1: hover-class 按压反馈(send-btn--hover) - P2: dev-fab 组件注册 - P3: navigationStyle: custom + safe-area-top + 自定义导航栏 - P4: border-top 1rpx → 2rpx(.input-bar) - _需求: 5-16, 21, 28.1, 32_ - [x] 19.3 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,JSON 合法,WXML 完整,app.json 路由已注册 - _需求: 17, 18_ - [-] 19.4 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 6.1) - _需求: 19, 20_ - [x] 20. F 批次 — chat-history(对话历史) - [x] 20.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 已有实现覆盖率 ~90%,识别 4 个工作项 - _需求: 1.1, 3, 4_ - [x] 20.2 Step 3: 规则化转换 - P0: error 状态 + onRetry(pageState 扩展 'error'、WXML 错误分支、TS try-catch) - P1: hover-class 按压反馈(chat-item--hover 替代 :active) - P2: dev-fab 组件注册 + navigationStyle: custom - P3: safe-area-top + 自定义导航栏 - P4: border-bottom 1rpx → 2rpx(.chat-item) - _需求: 5-16, 21, 28.2, 32_ - [x] 20.3 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,JSON 合法,WXML 完整,app.json 路由已注册 - _需求: 17, 18_ - [-] 20.4 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 6.2) - _需求: 19, 20_ - [x] 21. 检查点 F — 对话批次验收 - ✅ 文件完整性:2 页面 × 4 文件 = 8 文件全部存在且非空 - ✅ TS 编译:2 个 TS 文件零诊断 - ✅ app.json 路由:chat 和 chat-history 两个路由已注册 - ✅ JSON 配置:两页面均有 navigationStyle: custom + dev-fab 注册 - ✅ 导航跳转:ai-float-button → chat(携带 customerId)、chat-history → chat(携带 historyId) - ✅ 四态处理:两页面均有 loading/empty/error/normal 四态分支 - ⚠️ 备注:chat-history 传递 historyId 参数,chat.ts 当前未消费(Mock 阶段预期行为,TODO 标记) - [x] 22. G 批次 — notes(备忘录) - [x] 22.1 Step 0-2: 页面分析 + 输入物冻结 + 迁移审计 - 已有实现覆盖率 ~80%,识别 P1-1~P1-5 + P2-7~P2-8 共 7 个工作项 - Tab 切换:H5 HTML 原型无 Tab 结构(平铺列表),保持当前实现 - _需求: 1.1, 1.3, 3, 4_ - [x] 22.2 Step 3: 规则化转换 - P1-1/2: hover-class 按压反馈(nav-back--hover、retry-btn--hover) - P1-3: hover 对应 WXSS 样式 - P1-4: 启用下拉刷新(enablePullDownRefresh: true) - P1-5: onPullDownRefresh 方法 - P2-7: 统一 pageState 模式(loading/empty/error/normal 替代 loading+error boolean) - P2-8: 缩放值微调(padding 28rpx、margin-top 22rpx) - 补充:error/empty 态导航栏、ai-float-button、t-empty/ai-float-button/dev-fab 组件注册 - _需求: 5-16, 21, 29, 32_ - [x] 22.3 Step 4-5: 编译验证 + 结构还原验证 - TS 零诊断,JSON 合法,WXML 完整,app.json 路由已注册 - _需求: 17, 18_ - [-] 22.4 Step 6-7: 像素精调 + 验收签收 → 转入 `h5-miniprogram-migration-subsequent` spec(Task 7.1) - _需求: 19, 20_ - [x] 23. 检查点 G — 最终验收 - ✅ 文件完整性:1 页面 × 4 文件 = 4 文件全部存在且非空 - ✅ TS 编译:notes.ts 零诊断 - ✅ app.json 路由:pages/notes/notes 已注册 - ✅ JSON 配置:navigationStyle: custom + enablePullDownRefresh: true + 5 组件注册 - ✅ 导航跳转:my-profile → notes(通过 router.ts 映射) - ✅ 四态处理:pageState 统一模式(loading/empty/error/normal) - ✅ 统一规范:hover-class 4/4、safe-area-top 3 态、无 :active、无非标准灰色 - [x] 24. 全局收尾 - [x] 24.1 全量导航验证 - 验证所有页面间的跳转路径正确(TabBar 切换、navigateTo、navigateBack) - 验证认证守卫(未登录自动跳转登录页) - _需求: 7, 20, 30, 31_ - [x] 24.2 全量 AI 图标配色验证 - 抽查 3-5 个页面,确认 AI 图标随机配色正常 - 确认 ai-float-button 保持固定渐变(不参与随机) - _需求: 32_ - [x] 24.3 icon-mapping.md 最终更新 - 确认所有新导出的 SVG 已记录在 icon-mapping.md 中 - _需求: 33.3_ - [x] 24.4 中间生成物归档验证 - 确认所有 MP 截图按页面分目录存放在 `docs/h5_ui/mp-screenshots//` - 确认所有 diff 图和 report.md 按页面分目录存放在 `docs/h5_ui/diffs//` - 确认所有 H5 逐段截图按页面分目录存放在 `docs/h5_ui/h5-segments//` - 确认 `docs/h5_ui/screenshots/` 目录未被写入 MP 截图或 diff 图(只读输入物) - 清理可能遗留在项目根目录或其他位置的临时截图文件 - _需求: 33_ ## 备注 - 每个页面的 Step 0(页面分析)输出工作量估算表,用户确认后再开始 Step 1 - 输入物分两批:第一批(Step 0-5 结构迁移)、第二批(Step 6-7 像素精调) - 检查点任务用于批次间的质量门禁,确认通过后再进入下一批次 - 有历史实现的页面(board-coach/customer/finance/notes)走审计→对比→修复→验收流程 - task-detail 变体通过复制+替换主题色实现,不重复走完整流程 - 所有需求编号引用 `requirements.md` 中的需求序号 - 中间生成物(MP 截图/H5 逐段截图/diff 图)按页面分子目录存放,每轮覆盖更新,不保留历史版本 - `docs/h5_ui/screenshots/` 为只读输入物目录,禁止写入迁移过程生成的文件