# 财富功能入口重构 实施计划
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
**Goal:** 将财富维度（富页面）的「财富服务」9宫格拆解，功能迁移到我的页面（成就区）、成长页（今日增长），并在富页面直接展示保单列表。
**Architecture:** 纯前端改动，3个 `.vue` 文件独立修改，不涉及后端、数据库或新增页面。每个文件可独立并行修改。
**Tech Stack:** uni-app Vue 2 (Options API)，微信小程序
**涉及文件:**
- `cfc-frontend/pages/profile-main/profile.vue` — 成就区增加「推广收益」图标
- `cfc-frontend/pages/wealth/index.vue` — 删除服务网格 + 新增保单列表
- `cfc-frontend/pages/growth-main/index.vue` — 今日成长增加记账打卡项
**API 依赖:**
- `getReferralSummary()` → `POST /api/invite/summary` — 返回 `{ totalEarnings, totalCount }`
- `getInsuranceList(data)` → `POST /api/wealth/insurance/list` — 返回保单列表
- `getCheckinList(data)` → `POST /api/wealth/checkin/list` — 返回打卡记录列表
## Global Constraints
- Vue 2 Options API，禁止 Composition API
- 禁止可选链 `?.`（用 `&&` 替代）
- 禁止 CSS Grid（用 flexbox）
- 禁止 `:key` 表达式（用方法调用代替）
- 禁止直接 `new Date(string)`（用 `parseDate()`）
- 统一 `@PostMapping` 风格（前端仅涉及页面组件，不涉及后端接口）
---
### Task 1: 我的页面 — 成就区增加「推广收益」图标
**Files:**
- Modify: `cfc-frontend/pages/profile-main/profile.vue` — 成就网格 + data + loadAllData + 导航方法
**Interfaces:**
- Consumes: `getReferralSummary` (already imported at line 253)
- Produces: 成就网格第9项「推广收益」，点击跳转 `/pages/promotion/index`
- [ ] **Step 1: 在 data 中增加 referralEarnings 字段**
在 `data()` 中 `totalPoints: 0` 行附近增加：
```javascript
referralEarnings: 0,
```
- [ ] **Step 2: 在 loadAllData 中加载推广收益**
在 `loadAllData()` 方法末尾增加：
```javascript
this.loadReferralEarnings()
```
- [ ] **Step 3: 实现 loadReferralEarnings 方法**
在 `loadProfileStats()` 方法之后增加：
```javascript
loadReferralEarnings() {
var self = this
getReferralSummary().then(function(res) {
if (res && res.code === 200 && res.data) {
self.referralEarnings = res.data.totalEarnings || 0
}
}).catch(function() {})
},
```
- [ ] **Step 4: 在成就网格中增加第9个图标**
在 `ach-item` 列表末尾（"上传报告"之后）增加：
```html
💰
{{ referralEarnings }}
推广收益
```
- [ ] **Step 5: 实现 goToWealthCenter 导航方法**
在 methods 中增加：
```javascript
goToWealthCenter: function() {
uni.navigateTo({ url: '/pages/promotion/index' })
},
```
- [ ] **Step 6: 验证 — lsp_diagnostics 检查**
Run: `lsp_diagnostics` on `cfc-frontend/pages/profile-main/profile.vue`
Expected: 无错误
---
### Task 2: 富页面 — 去掉财富服务卡片 + 新增保单列表
**Files:**
- Modify: `cfc-frontend/pages/wealth/index.vue` — 删除 service-grid 区块，新增保单列表区块，data 增加字段，加载保单数据
**Interfaces:**
- Consumes: `getInsuranceList` (已导入，见 api.js 1961)
- Produces: 保单摘要列表，最多3条，底部「查看更多」跳转
- [ ] **Step 1: 在 data 中增加保单相关字段**
在 `data()` 中 `guestProducts: []` 附近增加：
```javascript
// 保单列表
insuranceList: [],
insuranceLoaded: false,
```
- [ ] **Step 2: 在 onShow 中加载保单数据**
在 `onShow` 方法中 `this.loadFamilyMembersVisible()` 之后增加：
```javascript
this.loadInsuranceList()
```
- [ ] **Step 3: 实现 loadInsuranceList 方法**
在 methods 中增加：
```javascript
loadInsuranceList() {
var self = this
this.insuranceLoaded = false
getInsuranceList({}).then(function(res) {
if (res && res.code === 200) {
self.insuranceList = (res.data || []).slice(0, 3)
}
self.insuranceLoaded = true
}).catch(function() {
self.insuranceLoaded = true
})
},
```
- [ ] **Step 4: 实现 getStatusLabel 方法（保单状态中文）**
在 methods 中增加：
```javascript
getPolicyStatusLabel: function(status) {
var map = { active: '有效', expired: '已过期', cancelled: '已取消' }
return map[status] || status || '未知'
},
```
- [ ] **Step 5: 删除「财富服务」9宫格区块**
删除模板中 `service-grid` 整个区块（第 177-189 行）：
```html
...
```
- [ ] **Step 6: 在财富数据卡下方新增保单管理区块**
在财富数据卡（孩子/家长）和 `DimensionIntroCard` 之间增加：
```html
📋
暂无保单
保险公司
{{ item.insuranceCompany || '未知' }}
被保人
{{ item.insuredPerson }}
```
- [ ] **Step 7: 实现 goToInsuranceList 导航方法**
在 methods 中增加：
```javascript
goToInsuranceList: function() {
uni.navigateTo({ url: '/pages/wealth-sub/insurance-list' })
},
```
- [ ] **Step 8: 新增保单卡片样式**
在 `