# 报告上传页购买链接 实施计划

> **For agentic workers:** Use subagent-driven-development or executing-plans to implement this plan task-by-task.

**Goal:** 在报告上传页面（健康报告 + DAN 测评）的类型选择区下方添加同类检测服务购买推荐

**Architecture:** 前端调用已有 `POST /api/product/list` API（支持 `domain` + `productType` 过滤），展示匹配维度的测评商品卡片。无需后端改动。

**Tech Stack:** uni-app Vue 2 (Options API), 微信小程序

## Global Constraints

- 禁止可选链 `?.`（用 `&&` 替代）
- 禁止 CSS Grid（用 flexbox）
- Vue 2 Options API
- 调用 `POST /api/product/list` 传入 `{ domain, productType: 'assessment', size: 4 }`
- 报告类型→domain 映射: `physical_exam/gut_flora/tongue → body`, `mind → mind`, `wisdom → wisdom`
- 商品卡片点击跳转 `/pages/discover/product-detail/product-detail?id={id}`

---

### Task 1: health/report-upload.vue 添加购买推荐

**Files:**
- Modify: `cfc-frontend/pages/health/report-upload.vue`

**Interfaces:**
- Consumes: `productList` from `../../utils/api.js`
- Produces: 类型选择器下方出现 "为家人购买检测服务" 推荐区

- [x] **Step 1: 在 import 中添加 productList**
- [x] **Step 2: 在 data() 中添加推荐商品状态**
- [x] **Step 3: 添加报告类型→domain 映射常量**
- [x] **Step 4: 添加 loadRecommendProducts 方法**
- [x] **Step 5: 在 selectType 中触发推荐加载**
- [x] **Step 6: 在 onLoad 中加载初始推荐**
- [x] **Step 7: 在模板中添加推荐商品卡片区**
- [x] **Step 8: 添加 goToProduct 方法和 formatPriceWithSymbol**
- [x] **Step 9: 添加推荐区样式**
- [x] **Step 10: 验证无语法错误**

### Task 2: dan-assessment/report-upload.vue 添加购买推荐

**Files:**
- Modify: `cfc-frontend/pages/dan-assessment/report-upload.vue`

**Interfaces:**
- Consumes: `productList` from `../../utils/api.js`
- Produces: 维度选择器下方出现 "为家人购买检测服务" 推荐区

- [ ] **Step 1: 在 import 中添加 productList**
- [ ] **Step 2: 在 data() 中添加推荐商品状态**
- [ ] **Step 3: 添加 REPORT_DOMAIN_MAP 常量和 loadRecommendProducts**
- [ ] **Step 4: 在 dimension 选择时触发推荐**
- [ ] **Step 5: 在 onLoad 中加载初始推荐**
- [ ] **Step 6: 在 Step 1 的模板中插入推荐卡片区**
- [ ] **Step 7: 添加 goToProduct 方法和 formatPriceWithSymbol**
- [ ] **Step 8: 添加推荐区样式**
- [ ] **Step 9: 验证无语法错误**