# P9→NS1/RNS1 缺失项 #3:消费记录 3 种类型的图标/颜色/标签样式映射 ## 简要结论 - 状态:⚠️ 部分解决 - 风险等级:🔴 高 - 台桌消费和商城消费有颜色区分(蓝色/绿色 header + 圆点),但充值类型在客户详情页 wxml 中缺少渲染模板;设计规范文档中无消费记录类型的视觉映射定义。 ## 详细审查 ### 审查范围 - `apps/backend/app/schemas/xcx_customers.py` — `ConsumptionRecord.type` 字段 - `apps/backend/app/services/customer_service.py` — `_build_consumption_records()` 实现 - `apps/miniprogram/miniprogram/pages/customer-detail/customer-detail.wxml` — 消费记录展示 - `apps/miniprogram/miniprogram/pages/customer-detail/customer-detail.wxss` — 消费记录样式 - `docs/miniprogram-dev/design-system/` — 设计规范文档 ### 发现 1. **后端:type 字段已定义但实际只返回 "table"** - Schema 定义 `type: str # table / shop / recharge` - `_build_consumption_records()` 硬编码 `"type": "table"`,未根据实际数据区分商城/充值类型 - 前端 TypeScript 接口定义了 `type: "table" | "shop" | "recharge"` 三种类型 2. **前端:台桌和商城有视觉区分,充值缺失** - 台桌消费(`type === 'table'`):蓝色 header(`record-header-blue`)+ 蓝色圆点(`record-dot-blue`) - 商城消费(`type === 'shop'`):绿色 header(`record-header-green`)+ 绿色圆点(`record-dot-green`) - 充值(`type === 'recharge'`):**wxml 中无对应的渲染模板**(`wx:elif` 链中缺少 recharge 分支) - Mock 数据中有 `{ type: 'recharge', rechargeAmount: 0 }` 但无对应 UI 3. **设计规范文档中无消费记录类型映射** - `VI-DESIGN-SYSTEM.md` 和 `DISPLAY-STANDARDS.md` 中未定义消费记录类型的图标/颜色/标签映射 - 无统一的类型→视觉映射表 ### 证据 后端硬编码 type 为 "table": ```python result.append({ "type": "table", # 始终为 table,未区分 shop/recharge ... }) ``` 前端 wxml 缺少 recharge 分支: ```html ... ... ``` ### 建议(如未完全解决) 1. **后端**:`_build_consumption_records()` 根据结算单类型字段区分 table/shop/recharge 2. **前端**:添加 recharge 类型的渲染模板(建议橙色/金色 header,充值图标) 3. **设计规范**:在 `VI-DESIGN-SYSTEM.md` 中添加消费记录类型映射表: - 台桌消费:🎱 蓝色(`#3b82f6`) - 商城消费:🛒 绿色(`#22c55e`) - 充值:💰 橙色/金色(`#f59e0b`)