Neo-ZQYY/docs/prd/Neo_Specs/review-audit/P9-NS1-03.md

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"：

result.append({
    "type": "table",  # 始终为 table，未区分 shop/recharge
    ...
})

前端 wxml 缺少 recharge 分支：

<view class="record-card" wx:if="{{item.type === 'table'}}">...</view>
<view class="record-card" wx:elif="{{item.type === 'shop'}}">...</view>
<!-- 缺少 wx:elif="{{item.type === 'recharge'}}" -->

建议（如未完全解决）

1. 后端：_build_consumption_records() 根据结算单类型字段区分 table/shop/recharge
2. 前端：添加 recharge 类型的渲染模板（建议橙色/金色 header，充值图标）
3. 设计规范：在 VI-DESIGN-SYSTEM.md 中添加消费记录类型映射表：
   • 台桌消费：🎱 蓝色（#3b82f6）
   • 商城消费：🛒 绿色（#22c55e）
   • 充值：💰 橙色/金色（#f59e0b）