# 任务 7 实现报告 — 单接口页面家庭数据区改造（批次 B）

## 概览

改造 9 个 uni-app（Vue 2）小程序页面，为每个页面的家庭数据区添加 `v-if="hasFamily"` / `v-else` 渲染 `FamilyEmptyState type="card"` 的条件包裹。

- 基准提交：`7b4c3eea`
- 改动文件：仅上述 9 个页面文件
- 不动文件：`store/index.js` / `utils/api.js` / `main.js` / `FamilyEmptyState.vue` / 其他页面（均为任务 1-4 遗留改动）

## 改动明细

| 文件 | FamilyEmptyState | hasFamily | 改动说明 |
|---|---:|---:|---|
| `pages/growth/create.vue` | 1 | 3 | 已在上游任务改造，本次确认无重复改动 |
| `pages/growth/index.vue` | 1 | 5 | 新增 `hasFamily` computed；children-list / records-section / footer-btn 加 `v-if="hasFamily"`，v-else 渲染 FamilyEmptyState |
| `pages/health/gut-index.vue` | 1 | 3 | 新增 computed 块含 `hasFamily`；scroll-view 内容加 `v-if="hasFamily"`，v-else 渲染 FamilyEmptyState |
| `pages/mind-detail/member-mind-detail.vue` | 1 | 3 | 在现有 computed 对象中追加 `hasFamily`；能量条至底部占位区域加 `v-if="hasFamily"`，v-else 渲染 FamilyEmptyState |
| `pages/mind/member-mind-detail.vue` | 1 | 3 | 同上 |
| `pages/parent/child-detail.vue` | 1 | 3 | 在现有 computed 对象中追加 `hasFamily`；加载状态 + template 内容区加 `v-if="hasFamily"`，v-else 渲染 FamilyEmptyState |
| `pages/parent/plans/index.vue` | 1 | 3 | 新增 computed 块含 `hasFamily`；header 至 plan-list 区域加 `v-if="hasFamily"`，v-else 渲染 FamilyEmptyState |
| `pages/parent/wishes/index.vue` | 1 | 3 | 在现有 computed 对象中追加 `hasFamily`；整个 wish-list 内容区加 `v-if="hasFamily"`，v-else 渲染 FamilyEmptyState |
| `pages/rewards/badge.vue` | 1 | 3 | 在现有 computed 对象中追加 `hasFamily`；stats-card 至底部弹窗区域加 `v-if="hasFamily"`，v-else 渲染 FamilyEmptyState |

## 验证输出

### grep 验证

```
=== pages/growth/create.vue ===
FamilyEmptyState: 1
hasFamily: 3

=== pages/growth/index.vue ===
FamilyEmptyState: 1
hasFamily: 5

=== pages/health/gut-index.vue ===
FamilyEmptyState: 1
hasFamily: 3

=== pages/mind-detail/member-mind-detail.vue ===
FamilyEmptyState: 1
hasFamily: 3

=== pages/mind/member-mind-detail.vue ===
FamilyEmptyState: 1
hasFamily: 3

=== pages/parent/child-detail.vue ===
FamilyEmptyState: 1
hasFamily: 3

=== pages/parent/plans/index.vue ===
FamilyEmptyState: 1
hasFamily: 3

=== pages/parent/wishes/index.vue ===
FamilyEmptyState: 1
hasFamily: 3

=== pages/rewards/badge.vue ===
FamilyEmptyState: 1
hasFamily: 3
```

所有文件均满足：`grep -c "FamilyEmptyState" ≥ 1` 且 `grep -c "hasFamily" ≥ 2`。

### git diff --stat（仅任务 7 改动）

```
 cfc-frontend/pages/growth/create.vue               | 67 +++++++++++++---------
 cfc-frontend/pages/growth/index.vue                | 12 +++-
 cfc-frontend/pages/health/gut-index.vue            | 11 +++-
 .../pages/mind-detail/member-mind-detail.vue       |  8 +++
 cfc-frontend/pages/mind/member-mind-detail.vue     |  8 +++
 cfc-frontend/pages/parent/child-detail.vue         |  9 +++
 cfc-frontend/pages/parent/plans/index.vue          | 11 ++++
 cfc-frontend/pages/parent/wishes/index.vue         |  8 +++
 cfc-frontend/pages/rewards/badge.vue               |  8 +++
 9 files changed, 110 insertions(+), 32 deletions(-)
```

## 改造模式

每个文件均按以下模式改造：

1. **computed**：组件已有 computed 对象则在现有对象中追加 `hasFamily`；无 computed 对象则新建：
   ```js
   hasFamily: function() {
     return this.$store.getters.hasFamily
   }
   ```

2. **模板**：在接口成功回调渲染的家庭数据区外层加 `v-if="hasFamily"`，末尾补 `v-else` 块：
   ```html
   <view v-if="hasFamily">
     <!-- 原有内容一字不动 -->
   </view>
   <view v-else>
     <FamilyEmptyState type="card" />
   </view>
   ```

3. **FamilyEmptyState** 已通过 `main.js` 全局注册，各组件无需 import 或 components 注册。

## 注意事项

- `pages/growth/create.vue` 在本次任务开始前已由上游任务改造完成，本次确认其状态正确，未做额外改动。
- `pages/growth/index.vue` 的 `hasFamily` 计数为 5（computed 定义 1 + v-if 模板 2 + footer-btn 条件 2），其余文件均为 3（computed 定义 1 + v-if 模板 1 + v-else 模板 1）。
- 未触碰 `store/index.js`、`utils/api.js`、`main.js`、`FamilyEmptyState.vue` 及其他非目标页面。
- 未使用 `?.`、`:key` 表达式、中文 CSS 类名、`new Date(string)`、`uni.getSystemInfoSync()`、CSS Grid。
- 未 commit 任何更改。