cfc/cfc-frontend/.superpowers/sdd/task-5-report.md

任务 5 实现报告：多接口并发页面 FamilyEmptyState 改造

改造概览

对 6 个 uni-app (Vue 2) 小程序页面/组件进行改造，当家庭数据区（familyId 为空）时显示 FamilyEmptyState 占位组件。

改造文件列表

1. pages/home-pages/parent-index.vue

• 改动行数：+60 / -4
• 家庭数据区：5 个卡片区，每块独立 v-if/v-else，type="card"
  1. 家庭健康排行榜（FamilyHealthRanking，getFamilyRanking）
  2. 家庭挑战区域（getChallengeList）
  3. 健康圈入口（getCircleRanking）
  4. 成长数据卡片区（getEnergyOverview）
  5. 待处理事项卡片区（含 pendingReviewTasks + pendingReviewWishes/getPendingWishes）
• grep 验证：
  • FamilyEmptyState: 5 次
  • hasFamily: 9 次（computed 定义 1 + v-if 使用 5 + v-else 注释等）

2. pages/index-home/index.vue

• 改动行数：+29 / -5
• 家庭数据区：2 个卡片区，type="card"
  1. 能量沙盘（WuxingSandbox/getFamilyEnergySandbox）
  2. 家庭挑战任务（getChallengeList）
• grep 验证：
  • FamilyEmptyState: 2 次
  • hasFamily: 4 次

3. pages/health/challenge-manage.vue

• 改动行数：+19 / -2
• 家庭数据区：2 个区域，type="card"
  1. 模板推荐区（快速创建）
  2. 挑战列表（我的挑战）
• computed 追加：新建 computed 对象，追加 hasFamily 计算属性
• grep 验证：
  • FamilyEmptyState: 2 次
  • hasFamily: 4 次

4. pages/mind/index.vue

• 改动行数：+116 / -43
• 家庭数据区：3 个卡片区，type="card"
  1. 能量条 + 心理报告卡片（getEnergyOverview）
  2. EMI 心理测评报告卡片（getEmiReport）
  3. 肠脑轴情绪卡片（gutIndicators，通过 uni.request 调用）
• grep 验证：
  • FamilyEmptyState: 3 次
  • hasFamily: 5 次

5. components/member-detail-sections/mind-section.vue

• 改动行数：+11 / -3
• 家庭数据区：整段 section，type="block"
  • 亲密关系评分 + 联系人 + 健康告警 + 里程碑
• computed 追加：在现有 computed 对象中追加 hasFamily
• grep 验证：
  • FamilyEmptyState: 2 次（1 处 v-else + 1 处注释）
  • hasFamily: 3 次

6. pages/home-pages/child-index.vue

• 改动行数：+48 / -12
• 家庭数据区：2 个卡片区，type="card"
  1. 五维能量沙盘 + 家庭能量横条（getFamilyEnergySandbox / getEnergyOverview）
  2. 最近能量变动日志（getEnergyLogs）
• grep 验证：
  • FamilyEmptyState: 2 次
  • hasFamily: 4 次

验证结果

grep 验证（每个文件 FamilyEmptyState ≥ 2，hasFamily ≥ 2）

=== pages/home-pages/parent-index.vue ===
FamilyEmptyState: 5
hasFamily: 9

=== pages/index-home/index.vue ===
FamilyEmptyState: 2
hasFamily: 4

=== pages/health/challenge-manage.vue ===
FamilyEmptyState: 2
hasFamily: 4

=== pages/mind/index.vue ===
FamilyEmptyState: 3
hasFamily: 5

=== components/member-detail-sections/mind-section.vue ===
FamilyEmptyState: 2
hasFamily: 3

=== pages/home-pages/child-index.vue ===
FamilyEmptyState: 2
hasFamily: 4

git diff 验证（仅 6 个目标文件）

.../member-detail-sections/mind-section.vue        |  11 +-
cfc-frontend/pages/health/challenge-manage.vue     |  19 +++-
cfc-frontend/pages/home-pages/child-index.vue      |  48 +++++----
cfc-frontend/pages/home-pages/parent-index.vue     |  60 +++++++----
cfc-frontend/pages/index-home/index.vue            |  29 ++++--
cfc-frontend/pages/mind/index.vue                  | 116 ++++++++++++---------
6 files changed, 181 insertions(+), 102 deletions(-)

实现要点

1. computed.hasFamily：6 个文件均在现有（或新建）computed 对象中追加 hasFamily: function() { return this.$store.getters.hasFamily }
2. 模板改造：每块家庭数据区用 <view v-if="hasFamily">...</view><view v-else><FamilyEmptyState type="card" /></view> 包裹
3. type 参数：mind-section.vue 使用 type="block"，其余均使用 type="card"
4. 不改动：页头/导航/非家庭 UI、store/api.js/main.js/FamilyEmptyState 组件、showModal 等业务逻辑