iven/hms

Files

iven df1d85bfde docs: T40 UI 审计报告 + wiki 更新 + Docker 配置

- T40 UI 审计计划和结果文档（docs/qa/）
- wiki 更新：miniprogram 设计系统合规审计记录 + index 关键数字更新
- 审计 V2 完整报告（docs/audits/v2/）
- 讨论记录文档（docs/discussions/）
- 设计规格和实施计划（docs/superpowers/）
- 角色测试计划和结果（docs/qa/role-test-*）
- Docker 生产部署配置

2026-05-13 23:29:42 +08:00

4.0 KiB

Raw Blame History

UX 一致性审计（Web vs 小程序）

审计范围：apps/web vs apps/miniprogram，基于代码审查

1. 日期格式化

维度	Web	小程序	一致性
库	`dayjs` v1.11（含 relativeTime 插件、zh-cn locale）	无第三方库，原生 `Date` + `toLocaleDateString('zh-CN')`	不一致
日期格式	`YYYY-MM-DD` / `YYYY-MM-DD HH:mm` / `fromNow()`	每个页面独立实现 `formatDate()`，输出不统一	不一致
空值处理	统一返回 `'--'`	无统一空值处理	不一致

问题：MP 端有 6+ 处独立的 formatDate 实现（orders/events/daily-monitoring/doctor-report/followup 等），格式各异。Web 端通过 utils/format.ts 统一。

2. 数字格式化

维度	Web	小程序
方式	`.toFixed(1)` / `.toFixed(2)` 散布在组件中	TrendChart 中 `val.toFixed(1)`
统一工具	无	无

问题：两端均无统一的数字格式化工具。体重/血压等健康数值没有统一的精度标准（如保留 1 位还是 2 位小数）。

3. 状态标签

状态	Web（Ant Tag）	MP（CSS class）	文案一致？
pending	`gold` "待确认"	`$wrn`(琥珀) "待确认"	是
confirmed	`blue` "已确认"	`$acc`(鼠尾草绿) "已确认"	色不同
completed	`green` "已完成"	`$pri`(赤土橙) "已完成"	色不同
cancelled	`default` "已取消"	`$tx3`(灰) "已取消"	是

问题：confirmed 和 completed 的语义色映射不一致。Web 用蓝/绿，MP 用绿/橙。MP 端无统一 StatusTag 组件，预约页和咨询页各自定义 STATUS_MAP。

4. 空状态

维度	Web	小程序
组件	Ant Design `<Empty>`	自研 `<EmptyState>` 组件
文案	"暂无数据"/"暂无消息"/"暂无待办" 等 10+ 种	"暂无预约"/"暂无报告" 等
图标	Ant 内置简单图标	Emoji（📭）
行动按钮	部分有	支持可选 `actionText` + `onAction`

结论：结构基本一致，但图标风格不统一（Ant 图标 vs Emoji）。

5. 加载状态

维度	Web	小程序
组件	Ant `<Spin>`	自研 `<Loading>` 组件
样式	Ant 旋转圆环 + 可选文字	自定义 spinner + "加载中..."
全局	Suspense fallback 用 Spin	无全局加载

结论：基本一致，均为旋转动画 + 文字。

6. 错误提示

场景	Web	小程序
403	`antMessage.error('权限不足')`	无 403 专用处理
404	静默（组件自行处理）	`<ErrorState text='未找到'>`
500	`antMessage.error('服务器异常')`	抛出 `'请求失败'`
运行时崩溃	`<ErrorBoundary>` → Ant `Result` 页面	`<ErrorBoundary>` → 自定义页面（emoji + 文字）

问题：MP 端 request.ts 无 HTTP 状态码分支处理，所有非成功统一 throw new Error(body.message)。

7. 适老化（MP 端）

MP 设计系统 variables.scss 已定义老年友好参数：

$touch-min: 48px — 满足 WCAG 最小触控
$btn-primary-h: 56px — 主按钮足够大
$font-min: 22px — 最小字号（约 11pt）

实际检测：部分页面存在 20px 以下字号（如 WeekCalendar 20px、appointment 20px），低于 $font-min 阈值。约 15 处 20-22px 的字号处于边界线。

建议：全局 audit 所有 < 22px 字号，确保不低于设计系统最低值。

优先修复建议

P0 — MP 端引入 dayjs 或抽取统一 formatDate 工具，消除 6+ 处重复实现
P1 — 统一状态标签色值：confirmed(completed) 应两端语义一致
P1 — MP request.ts 增加 403/500 分支处理
P2 — 抽取统一数字格式化工具（精度标准：体重 1 位、血压 0 位、血糖 1 位）
P2 — MP 端将 < 22px 字号提升至 22px 以上

4.0 KiB Raw Blame History Unescape Escape