5.5 KiB
5.5 KiB
页面重构进度台账
用途：记录哪些页面已并入暖橙体系、哪些还停在旧体系，以及下一步的推进顺序。 分工：配色标准、令牌表、状态色、回滚方法一律以 DESIGN.md 为准（本文不重复）；本文只管「进度 + 顺序 + 每页动作」。
一、已完成（6 页）
| 页面 | 完成 | 主要动作 |
|---|---|---|
home/index（首页） |
更早 | 暖白纸面 + 白卡语言重建：hero（大标题 / 场景行 / 通栏主 CTA）→ 陪诊服务（白卡宫格 + 浅橙介绍卡）→ 常用功能（青绿待服务条 + 双列 / 通栏卡）→ 页脚文字链。页内旧令牌副本已删 |
escort/itemlist（陪诊服务列表） |
更早 | 页首短横色标 + 引导，说明白卡（开通城市 / 费用披露 + 两个入口），三组「通栏白底 + 章线」价目表，空心环「预约」按钮，浅橙收口页脚卡。页内旧令牌副本已删 |
mine/mine（我的） |
2026-10-04 | 并入暖橙体系 + 首页白卡语言：纸面底、头像与昵称直接落纸面、菜单白卡（图标走 --brand-ink）、页脚细竖线分隔。默认头像改用暖墨品牌标记 images/home-ink.png。删掉一批死样式（.user-phone、.avatar-btn、昵称输入等） |
ai/aichat（AI 陪诊助手） |
2026-10-04 | 整页重设计：纸面底 + 消息列表（头像行在上、气泡在下，用户消息整条靠右并把时间镜像到头像左侧）；AI 与用户头像统一底座（浅橙底 + 暖橙描边），身份只由图形区分（品牌标记 / 人像）；AI 声明由页底常驻行改为挂在每条 AI 气泡下方；空态图标改用 images/ai-ink.png；清空入口移到输入框下方做成空心描边小按钮，并在其旁增加「常见问题」入口——点击把常见问题清单整块铺进会话流（行间以横线分隔，可重复点选），空会话欢迎区复用同一清单块样式；全页圆角统一 20rpx。附带修复滚动布局（.message-list 补 min-height: 0，消息超一屏后输入区不再被顶出视口） |
mine/profileedit（个人信息） |
2026-10-04 | 由 mine 页上的 comp_profile 浮层改为真页面（不再用 fixed 浮层，返回键交给页面栈）。表单沿用 mine 的通栏白块语言：标签左走 --muted、值右走 --ink，选中态用软橙底 + 实心橙描边；保存是本页唯一实心橙块 |
mine/addressedit（邮寄地址） |
2026-10-04 | 由 comp_address 浮层改为真页面，列表 / 表单两态同页切换并同步导航栏标题。地址卡走白卡 + chevron 点击暗示，默认地址用图形 + 文字双通道传达状态；表单态取消走空心、保存走实心橙 |
DESIGN.md §5.1 已登记
mine/mine.wxss、ai/aichat.wxss两页迁移完成；mine/profileedit.wxss、mine/addressedit.wxss待补登。
二、待重构（11 页 / 19 个文件）
按"离规范的距离"分三档，建议从上往下推进——同档内先易后难。
A. 旧暖橙副本（最接近，只差删副本 + 对值）｜4 页 8 文件
页内各带一份 page{} 令牌副本，停在 #C2410C / #9A3412；结构基本可用。
| 页面 | 文件 | 动作 |
|---|---|---|
escort/itemdetail |
.wxss .wxml |
删页内令牌副本（改读 app.wxss），t-icon 的 color 手改 #9B4508 |
attendant/attendantlist |
.wxss .wxml |
已完成（2026-10-06，见 DESIGN.md §5.1）；同目录新增 attendantdetail |
escort/guide |
.wxss .wxml |
同上 |
mine/contact |
.wxss .wxml |
同上 |
B. 旧金色体系（#D4A853 系，改动最大）｜7 页 + 1 组件/JS
| 页面 | 文件 | 动作 |
|---|---|---|
mine/about |
.wxss |
按 §5.3 映射表整体换色 |
health/profilelist |
.wxss .wxml .js（confirmColor） |
同上 |
health/profileedit |
.wxss |
同上 |
escort/recordlist |
.wxss |
换色 + 状态四档 |
escort/recorddetail |
.wxss .wxml |
换色 + 状态四档 |
escort/agreement |
.wxss |
底 #FAF6F1 → --paper，其余按映射表 |
C. 绿灰系（另一套冷色，需整体并入）｜2 页
| 页面 | 文件 | 动作 |
|---|---|---|
hospital/contact |
.wxss |
底 #F5F7F6、字 #1F2937、绿灰线一并换成纸面 / 暖墨 / 暖线 |
hospital/ranking |
.wxss |
同上 |
D. 无需处理
| 页面 | 说明 |
|---|---|
home/webview |
仅一个 <web-view>，无色值 |
组件与 JS 里的硬编码（易漏）
addressedit.wxml 的 switch 属性、profilelist.js 的 confirmColor 走的是属性值，读不到 CSS 变量，必须硬编码暖橙（mine/addressedit 迁移时已按此处理，health/profilelist 待处理）。
三、系统级收口（不属任何页面）
沿用 DESIGN.md §5.2，共 4 项：app.json 的 tabBar 绿色选中图标、tabBar color: #999999、app.wxss 里整套翠绿死代码（--td-brand-color-1..10、--c-ink）、custom-tab-bar 未选中灰 #7A7068。建议放在页面重构全部完成后一次做完，避免边改边漏。
四、每页收工自检
- 灰度化后层级是否仍清楚（去掉颜色不散架）。
- 色相数量：暖橙 + 暖墨 + 至多一个状态色。
- 最浅的那行字是否
--muted或更深。 - 中文最小 24rpx、正文对比度 ≥ 4.5:1（大字 ≥ 3:1）、图标 ≥ 3:1。
- 可点项是否有显性暗示，热区是否 ≥ 56rpx。
- 页面是否还有
page{}级令牌副本；有则删掉，回归 app.wxss 唯一来源。
详细判据见 DESIGN.md「六、一句话检验」。