FE-01 至 FE-04 前端只读对账原型交付

article
2026年7月20日1 min read78 words

Updated 2026年7月20日

FE-01 至 FE-04 前端只读对账原型交付

日期:2026-07-20

范围

  • 完成 FE-01 至 FE-04。
  • FE-05 仍阻塞:原型仅使用本地只读演示数据;未实现 HTTP、URL、鉴权、轮询、自动重试或写操作。

交付

  • frontend/src/reconciliation/types.ts 定义前端内部展示类型;cases.ts 提供四条固定 ISO-8601 演示数据,且仅 EXPLICIT_NO_BOOKING_CREATEDsafeToCreateAgaintrue
  • frontend/src/main.ts 使用语义化表格、稳定订单号、中文枚举标签和原生 <details> 渲染只读结论;空状态和展示数据格式错误状态独立,错误显示事实而不伪造空列表。
  • 每条记录都有文本安全结论;结果数量使用实时状态区域,错误状态使用 role="alert",原生 <summary> 支持键盘展开。
  • frontend/src/styles.css 使用项目蓝灰 B 端色板与 640px 响应式断点;窄屏转为标签/值布局,长订单号、原因码和英文枚举可换行,焦点可见。

验证

  • cd frontend; npm run build 通过:tsc --noEmit && vite build
  • 浏览器在 1440px 检查四条结论、标签、下次查询时间和只读安全结论均可见。
  • 浏览器在 320px 检查字段标签垂直布局、长英文标识换行和可达性均正常。
  • 键盘 TabEnter 实际展开首条原生详情,暴露排查事实、查询次数、标识和更新时间;浏览器控制台无错误。

风险

真实 API 接入必须等 FE-05 契约获批,并明确分页、鉴权、稳定错误码及 traceId 行为。