# P9→NS1/RNS1 缺失项 #14：客户详情页维客线索的展示规范

## 简要结论
- 状态：✅ 已解决
- 风险等级：🟢 低
- clue-card 组件已实现完整的卡片布局和 category 颜色映射（6 种配色），后端从 `member_retention_clue` 表查询数据

## 详细审查

### 审查范围
- `apps/backend/app/services/customer_service.py` — `_build_retention_clues()`
- `apps/miniprogram/miniprogram/pages/customer-detail/customer-detail.wxml` — 维客线索区域
- `apps/miniprogram/miniprogram/components/clue-card/clue-card.ts` — 组件属性
- `apps/miniprogram/miniprogram/components/clue-card/clue-card.wxml` — 组件模板
- `apps/miniprogram/miniprogram/components/clue-card/clue-card.wxss` — 组件样式

### 发现
1. 后端 `_build_retention_clues()` 从 `public.member_retention_clue` 表查询 `clue_type` 和 `clue_text`，按 `created_at` 倒序
2. 前端 `clue-card` 组件接收 `tag`、`category`（颜色类名）、`emoji`、`title`、`source`、`content` 六个属性
3. WXSS 中定义了 VI 规范 2.1 的六种客户标签配色：
   - `clue-tag-primary`：蓝色（客户基础）
   - `clue-tag-success`：绿色（消费习惯）
   - `clue-tag-orange`：橙色（玩法偏好）
   - `clue-tag-gold` / `clue-tag-warning`：金色（促销偏好）
   - `clue-tag-purple`：紫色（社交关系）
   - `clue-tag-error`：红色（重要反馈）
   - `clue-tag-pink`：粉色（社交关系别名）
4. 卡片布局包含：标签方块（72rpx×72rpx）、文本内容区、来源标注、可选详情描述

### 证据
```html
<!-- customer-detail.wxml -->
<clue-card
  wx:for="{{clues}}" wx:key="index"
  tag="{{item.category}}"
  category="{{item.categoryColor}}"
  emoji=""
  title="{{item.text}}"
  source="By:{{item.source}}"
  content="{{item.detail}}"
/>
```

```css
/* clue-card.wxss — VI 规范 2.1 六种配色 */
.clue-tag-primary { background: rgba(0, 82, 217, 0.10); color: #0052d9; }
.clue-tag-success { background: rgba(0, 168, 112, 0.10); color: #00a870; }
.clue-tag-orange  { background: rgba(237, 123, 47, 0.12); color: #ed7b2f; }
.clue-tag-purple  { background: rgba(123, 97, 255, 0.10); color: #7b61ff; }
.clue-tag-error   { background: rgba(227, 77, 89, 0.10); color: #e34d59; }
```

### 建议
- 后端 `_build_retention_clues()` 当前仅返回 `type` 和 `text`，未返回 `category`（颜色类名）和 `source`。前端 `customer-detail.ts` 中 `clues` 数据目前是 mock 硬编码的 `categoryColor`。建议后端补充 `clue_type → categoryColor` 的映射逻辑，或在前端建立映射表。
