# 五维页面与健康/成长页面登录前·登录后内容设计

> 设计日期：2026-08-10
> 依据：《家的算法》书稿（`book/` 目录）+ 现有系统结构

---

## 一、背景与目标

### 1.1 背景

系统当前为 **4+1 TabBar 结构**（首页 | 健康 | 成长 | 我的 + 中间⭐五维按钮）。五维通过中心按钮弹出浮层进入各维度详页。

经排查，各页面登录前/登录后内容覆盖不均衡：

| 页面 | 登录前 | 登录后 |
|:---:|:---:|:---:|
| 行（首页 index-home） | Splash闪屏 | ✅ 完整 |
| 身（body-detail/index） | ✅ 品牌语+雷达图 | ✅ 完整 |
| 心（mind-detail/index） | ❓ 待确认 | ❓ 待确认 |
| 智（wisdom-detail/index） | ❓ 待确认 | ❓ 待确认 |
| 富（wealth/index） | ✅ 品牌语+商品预览 | ✅ 完整 |
| 健康（health-main） | ✅ 有 LoginGuide | ✅ 完整 |
| 成长（growth-main） | ❌ **缺失** | ✅ 完整 |

### 1.2 目标

1. 统一五维详页（身/心/智/富）登录前的内容结构，让未登录用户在进入时产生共鸣并被引导注册
2. 补齐成长页登录前内容
3. 加强健康页登录前内容
4. 登录后内容保持现有的"看见→检测→行动→反馈"闭环能力

### 1.3 指导原则（来自书《家的算法》）

- **登录前**：让用户"看见"自己的问题，产生共鸣，而非硬推销
- **每页一句金句**作为"勾子"
- **最小输入展示**：让用户觉得"这个我也能做到"
- **登录后**：从"看见"自然过渡到"检测→行动→反馈"闭环

---

## 二、五维详页统一架构（身/心/智/富）

五个维度页面登录前采用统一结构，由 5 个区块组成：

```
┌─────────────────────────────────────┐
│  [1] 品牌词                          │  ← PageBanner
│  [2] 痛点场景（书中故事摘录）         │
│  [3] 最小输入卡（20秒启动法）        │
│  [4] 功能预览（3-4个入口）           │
│  [5] 引导注册（LoginGuideCard）      │
└─────────────────────────────────────┘
```

### 2.1 各维度内容对照表

| 维度 | 五行 | 品牌词 | 痛点摘录 | 最小输入 | 功能预览 |
|:---:|:---:|:---|:---|:---|:---|
| **身** 🟠 | 土 | 土厚德载物 · 主动健康，守住基本盘 | "年年体检正常，指标却标红三个" | 喝一杯温水 | 健康报告解析 · 打卡 · 体质测评 · 饮食 |
| **心** 🔥 | 火 | 火曰炎上 · 大爱相随，家是港湾 | "身体年年体检，你的心体检过吗？" | 一次深呼吸 | 情绪自评 · 情绪打卡 · 疏导工具 · 家庭天盘 |
| **智** ⚡ | 金 | 金曰从革 · 赋能未来，终身课题 | "你逼孩子学习，自己多久没学新东西了？" | 问一个开放题 | 认知测评 · 训练中心 · 自测 · 知识库 |
| **富** 💧 | 水 | 水善利万物 · 利他创富，第二曲线 | "工资到账那刻，幸福感却越来越少" | 记一笔账 | 财商打卡 · 保险规划 · 推广收益 · 商城 |

> 行（首页）已含完整内容，不在此统一架构内。

### 2.2 区块数据来源

| 区块 | 数据来源 |
|:---:|:---|
| 品牌词 | 书每章开篇（第三章~第七章） |
| 痛点场景 | 书序章/各章开篇故事摘录 |
| 最小输入 | 书第8章《最小输入》五维清单 |
| 功能预览 | 系统现有功能（各维度子页面） |
| 引导注册 | 统一 `LoginGuideCard` 组件 |

---

## 三、健康页（health-main）登录前内容

### 3.1 现状

已有简单 `LoginGuideCard`（`PageBanner: "科学管理全家健康" + LoginGuideCard`）。

### 3.2 建议扩展

```
┌─ [1] 品牌词 ───────────────────────┐
│ "看见·主动健康闭环"                  │
│ 采集 → 看见 → 行动                   │
├─ [2] 痛点卡 ────────────────────────┤
│ "指标正常 ≠ 健康"                    │
│ 孩子反复生病，你扛了多少次了？         │
├─ [3] 功能预览 ──────────────────────┤
│ 健康报告 · 在线测评 · 打卡 · 方案     │
├─ [4] 健康自测入口 ──────────────────┤
│ [15题五维自检 · 身维度部分]           │
├─ [5] 引导注册 ──────────────────────┤
│ [登录后查看全家健康数据]              │
└─────────────────────────────────────┘
```

---

## 四、成长页（growth-main）登录前内容

### 4.1 现状

**登录前内容缺失**，直接暴露登录后数据。

### 4.2 建议新增

```
┌─ [1] 品牌词 ───────────────────────┐
│ "干预 · 记录 · 成长"                 │
│ 知行合一，每天进步一点点              │
├─ [2] 理念卡 ────────────────────────┤
│ "看见改变正在发生"（书第10章反馈校验）│
├─ [3] 示例展示 ──────────────────────┤
│ 脱敏案例：小明三个月成长记录          │
│ 身维度 +5分 · 智维度 +3分            │
├─ [4] 功能预览 ──────────────────────┤
│ 干预进度 · 追踪记录 · 里程碑 · 调研   │
├─ [5] 引导注册 ──────────────────────┤
│ [登录后查看完整成长档案]              │
└─────────────────────────────────────┘
```

---

## 五、登录后内容（保持现状 + 闭环引导）

登录后各页面保持现有功能，并在关键触点补充"看见→检测"引导（方案A，见下方）。

### 5.1 方案A：检测引导触点

| 触点 | 内容 |
|:---:|:---|
| 自检结果页 | 低分维度 → 显示"建议做专业测评" + 推荐测评类型 |
| 维度详情页 | 数据来源为自检时 → 显示"做专业测评获取精准评分"引导条 |
| 家庭天盘预警Tab | 能量偏低且无近期检测记录 → 自动生成"建议检测"项 |
| 健康预警横幅 | 可检测预警 → 增加"去检测"按钮 |

### 5.2 维度→测评映射

| 维度 | 对应测评 |
|:---:|:---|
| 身 | 健康报告/体检 |
| 心 | DAN测评（EMI心理子维度）+ 心理状态自评 |
| 智 | DAN测评（认知子维度）+ 认知测评 |
| 行 | DAN测评（部分）+ 关系问卷 |
| 富 | 财商打卡（自检级，无专业测评） |

---

## 六、角色与权限

- 登录前：游客可访问各维度详页、健康页、成长页的品牌展示内容
- 登录后：家长/孩子/规划师按现有角色权限展示对应数据
- 规划师 TabBar 保持现有 5 Tab 不变

---

## 七、实施范围与拆解

### 7.1 前端（cfc-frontend）

| 文件 | 改动 |
|:---|:---|
| `pages/body-detail/index.vue` | 登录前内容按统一架构重组 |
| `pages/mind-detail/index.vue` | 确认登录前现状，按统一架构补齐 |
| `pages/wisdom-detail/index.vue` | 确认登录前现状，按统一架构补齐 |
| `pages/wealth/index.vue` | 登录前内容按统一架构微调 |
| `pages/health-main/index.vue` | 登录前内容扩展（痛点卡+功能预览+自测入口） |
| `pages/growth-main/index.vue` | 登录前内容新增（理念卡+示例+功能预览） |
| 公共 | 痛点卡/功能预览区块可抽象为通用组件 |

### 7.2 后端（cfc-backend）

- 若"功能预览"需动态数据，新增聚合接口
- 若"维度→测评映射"需配置化，新增映射配置接口

---

## 八、暂不涉及（YAGNI）

- ❌ 不新增独立"五维启动器"页面（沿用现有中心浮层）
- ❌ 不重构登录后核心功能
- ❌ 不改变规划师 TabBar