# 健康数据中心 — 看见 · 主动健康闭环

**版本:** v1.0
**日期:** 2026-08-08
**状态:** 设计稿

## 1. 概述

将身维度首页（body/index.vue）改造为"健康数据中心"，聚焦主动健康闭环中"看见"环节——用户上传报告、完成测评、查看数据、生成方案，形成"采集→看见→行动"的递进闭环。

## 2. 页面布局

```
┌──────────────────────────────────────┐
│  [🟠 健康] [认知] [心理] [社会性]     │  ← Tab栏，切换仅刷新数据图区
│  ┌──────────────────────────────┐   │
│  │       📊 维度数据图           │   │  ← 按Tab展示不同可视化
│  └──────────────────────────────┘   │
├──────────────────────────────────────┤
│  🏠 家庭成员选择条                   │  ← 不随Tab切换
├──────────────────────────────────────┤
│  🔍 看见 · 健康数据中心              │
│  ┌── 数据采集 ──────────────────┐  │
│  │ 📋 上传健康报告               │  │
│  │ 📝 在线测评（认知/心理/关系）  │  │
│  └──────────────────────────────┘  │
│              ↓                      │
│  ┌── 数据查看 ──────────────────┐  │
│  │ 最近报告/测评结果 · 查看全部   │  │
│  └──────────────────────────────┘  │
│              ↓                      │
│  ┌── 方案汇总 ──────────────────┐  │
│  │ 选维度+成员+目标→LangGraph生成 │  │
│  └──────────────────────────────┘  │
├──────────────────────────────────────┤
│  活动 / 商品 / 文章（弱化展示）       │
└──────────────────────────────────────┘
```

## 3. 顶部 Tab 栏

### 3.1 Tab 定义

| Tab | 维度 | 图标色 | 数据图类型 | 数据来源 |
|-----|------|--------|-----------|---------|
| 健康 | 身 | `#FF8C42` | 七维雷达图（保留现有） | `getDimensionOverview('body')` |
| 认知 | 智 | `#6366F1` | 五维蛛网图（新建） | 认知测评结果 |
| 心理 | 心 | `#FF6B9D` | 心理状态图（新建） | 心理测评结果 |
| 社会性 | 行 | `#10B981` | 关系质量图（新建） | 关系问卷结果 |

### 3.2 交互行为

- 默认选中"健康"Tab
- 点击 Tab 切换时，仅重新渲染数据图区域，页面其他部分不变
- 当前选中 Tab 配有对应维度色 + 下划线/高亮
- 数据图下方显示"无数据"提示（如"上传报告后显示个人数据"）

### 3.3 数据图实现

- **健康：** 保留现有 RadarChart 组件，七维标签
- **认知：** 复用 RadarChart 组件，标签改为：记忆力/注意力/逻辑推理/空间想象/语言表达，配色 `#6366F1`
- **心理：** 复用 RadarChart 组件，标签改为：情绪稳定性/抗压能力/自我认知/社交意愿/幸福感，配色 `#FF6B9D`
- **社会性：** 复用 RadarChart 组件，标签改为：亲子关系/夫妻关系/亲友关系/同事关系/社区参与，配色 `#10B981`

无数据时各图显示默认均值（灰色半透明），与现有健康雷达图行为一致。

## 4. 家庭成员选择条

保持现有 FamilyMemberStrip 组件，位置在数据图下方，不随 Tab 切换。

## 5. 看见 · 健康数据中心

### 5.1 数据采集区

两个卡片上下排列：

**卡片 1：上传健康报告**
- 图标 + 标题："上传健康报告"
- 描述："体检/肠道/舌诊报告 · AI智能解读"
- 点击跳转 `/pages/health/report-upload`

**卡片 2：在线测评**
- 标题："在线测评"
- 三个测评项，每行一个 + [开始] 按钮：
  - 认知能力测评 → `/pages/body-detail/dimension-questionnaire?dim=cognitive&memberId=xxx`
  - 心理健康测评 → `/pages/body-detail/dimension-questionnaire?dim=mental&memberId=xxx`
  - 关系质量测评 → `/pages/body-detail/dimension-questionnaire?dim=relationship&memberId=xxx`
- 已完成的测评显示分数（如"85分"）替代[开始]按钮

### 5.2 数据查看区

- 展示最近一份报告/测评结果的摘要卡片（类型图标 + 名称 + 日期 + 分数）
- 右侧箭头 → 跳转对应的详情页
- 底部"[查看全部 X 份报告]" → 跳转 `/pages/health/report-list?memberId=xxx`

无数据时显示空状态："暂无报告和测评结果，上传报告或完成测评开启健康之旅"

### 5.3 方案汇总区

- 展示上次方案摘要（如果有）或空状态
- 标题 + [生成新方案] 按钮
- 点击 → 跳转到方案汇总页（详见第7节）

## 6. 在线测评题库（dimension-questionnaire.vue 扩展）

### 6.1 新增维度

在现有 `dimensions` 数组新增：

```javascript
{ code: 'cognitive', label: '认知能力', icon: '🧠' },
{ code: 'mental', label: '心理健康', icon: '💖' },
{ code: 'relationship', label: '关系质量', icon: '🤝' }
```

### 6.2 认知能力题库（示例 8 题）

| # | 题目 | 选项 |
|---|------|------|
| 1 | 你能同时记住几件事而不遗漏？ | 1-2件/3-4件/5-6件/7件以上 |
| 2 | 解决复杂问题时你通常？ | 凭直觉/逐步分析/找人帮忙/回避 |
| 3 | 学习新技能的速度？ | 很快/一般/较慢/很困难 |
| 4 | 你能清晰地表达自己的想法吗？ | 非常清晰/基本可以/有时困难/很难 |
| 5 | 做决定时你会考虑多种可能性？ | 总是/经常/有时/很少 |
| 6 | 空间方向感如何？ | 很好/一般/较差/完全没有 |
| 7 | 你能快速发现事物之间的关联？ | 总是/经常/偶尔/很少 |
| 8 | 注意力集中的持续时间？ | 1小时+/30分钟/10分钟/几分钟 |

### 6.3 心理健康题库（示例 8 题）

| # | 题目 | 选项 |
|---|------|------|
| 1 | 最近一个月你感到心情愉快的频率？ | 经常/有时/偶尔/几乎没有 |
| 2 | 面对压力时你通常？ | 轻松应对/基本能处理/有些吃力/很难应对 |
| 3 | 你觉得自己了解自己的情绪吗？ | 非常了解/基本了解/不太了解/完全不了解 |
| 4 | 与人相处时你感到？ | 自在舒适/基本自在/有些不自在/很拘谨 |
| 5 | 你对目前的生活满意度？ | 很满意/比较满意/一般/不满意 |
| 6 | 遇到挫折后你多久能恢复？ | 很快/一两天/一周以上/很久 |
| 7 | 你觉得自己有价值感吗？ | 很有价值/有时有/很少/没有 |
| 8 | 你是否有固定的放松方式？ | 有且坚持/有时有/想过没做/没有 |

### 6.4 关系质量题库（示例 8 题）

| # | 题目 | 选项 |
|---|------|------|
| 1 | 你与家人的沟通频率？ | 每天/每周几次/每周一次/很少 |
| 2 | 遇到困难时你能找到人倾诉？ | 总是可以/经常/偶尔/很难 |
| 3 | 你觉得自己被家人理解？ | 非常理解/基本理解/不太理解/完全不理解 |
| 4 | 你与伴侣的关系满意度？ | 很满意/比较满意/一般/不满意 |
| 5 | 你与孩子的关系如何？ | 亲密/良好/一般/疏远 |
| 6 | 你在社交中感到？ | 轻松愉快/基本舒适/有些紧张/很焦虑 |
| 7 | 你愿意主动联系朋友吗？ | 经常/有时/被动/几乎不 |
| 8 | 你觉得家庭氛围如何？ | 温馨和谐/基本融洽/有些紧张/压抑 |

### 6.5 跳转逻辑

从数据中心跳转时，URL 带 `dim` 参数，页面直接跳过 Step 1（选维度），进入 Step 2（答题）。

```javascript
onLoad(options) {
  if (options.dim) {
    this.selectedDimension = options.dim
    this.step = 2 // 直接进入答题
  }
}
```

提交接口复用现有 `submitDimensionQuestionnaire`（后端需扩展支持新增维度）。

## 7. 方案汇总页（新建）

### 7.1 页面结构

```
┌──────────────────────────────┐
│  ← 方案汇总                  │
├──────────────────────────────┤
│  [历史方案]  Tab 切换          │
│                              │
│  ┌── 生成新方案 ──────────┐  │
│  │ 选择维度: [健康][认知].. │  │
│  │ 选择成员: [成员列表]     │  │
│  │ 目标设定: [输入框]       │  │
│  │ 例："改善孩子睡眠质量"   │  │
│  │ [生成方案]              │  │
│  └────────────────────────┘  │
│                              │
│  ┌── 方案结果 ────────────┐  │
│  │ (LangGraph 返回内容)    │  │
│  │ 富文本展示              │  │
│  │ [保存方案] [重新生成]   │  │
│  └────────────────────────┘  │
│                              │
│  ┌── 历史方案列表 ────────┐  │
│  │ 方案1 · 2026-08-07    │  │
│  │ 方案2 · 2026-08-01    │  │
│  └────────────────────────┘  │
└──────────────────────────────┘
```

### 7.2 功能流程

1. 用户进入页面 → 展示"生成新方案"表单 + 历史方案列表
2. 选择维度（多选：健康/认知/心理/社会性）
3. 选择成员（从家庭列表选取，可多选）
4. 输入目标（自由文本，如"改善孩子睡眠质量""提升夫妻关系亲密度"）
5. 点击[生成方案] → 调用 LangGraph `analysis/run` 接口
   - 请求体包含：维度、成员、目标、该成员最近的报告/测评数据
6. LangGraph 返回方案 → 格式化展示（富文本：标题 + 现状分析 + 具体建议 + 预期效果）
7. 用户可[保存方案]（写入 `health_plans` 表）或[重新生成]
8. 历史方案列表按时间倒序排列，点击查看详情

### 7.3 数据模型

**health_plans 表：**
```sql
CREATE TABLE IF NOT EXISTS health_plans (
  id BIGINT AUTO_INCREMENT PRIMARY KEY,
  family_id BIGINT NOT NULL COMMENT '家庭ID',
  member_ids VARCHAR(200) NOT NULL COMMENT '目标成员ID列表(逗号分隔)',
  dimensions VARCHAR(100) NOT NULL COMMENT '维度列表(逗号分隔)',
  goal TEXT NOT NULL COMMENT '用户输入的目标',
  plan_content TEXT COMMENT 'LangGraph生成的方案内容(JSON/HTML)',
  member_name VARCHAR(50) COMMENT '成员名称摘要',
  created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
  INDEX idx_family (family_id),
  INDEX idx_created (created_at)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='健康方案汇总记录';
```

### 7.4 历史方案

- 列表项：生成日期 + 维度标签 + 目标摘要 + 成员名称
- 点击展开/跳转详情
- 空状态："暂无历史方案，生成第一个方案"

## 8. 后端改动

### 8.1 新增表

`health_plans` 表（见 7.3）

### 8.2 迁移

DatabaseInitializer.runMigrations() 新增迁移194：

```java
// 迁移194: 创建 health_plans 表（健康方案汇总记录）
try {
    jdbcTemplate.execute("CREATE TABLE IF NOT EXISTS health_plans (" +
        "id BIGINT AUTO_INCREMENT PRIMARY KEY, " +
        "family_id BIGINT NOT NULL, " +
        "member_ids VARCHAR(200) NOT NULL, " +
        "dimensions VARCHAR(100) NOT NULL, " +
        "goal TEXT NOT NULL, " +
        "plan_content TEXT, " +
        "member_name VARCHAR(50), " +
        "created_at DATETIME DEFAULT CURRENT_TIMESTAMP, " +
        "INDEX idx_family (family_id), " +
        "INDEX idx_created (created_at)" +
        ") ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='健康方案汇总记录'");
    log.info("已创建health_plans表");
} catch (Exception e) {
    log.warn("创建health_plans表失败（可能已存在）: {}", e.getMessage());
}
```

### 8.3 新增接口

| 方法 | 路径 | 说明 |
|------|------|------|
| POST | `/api/health/plan/save` | 保存方案 plan_content |
| POST | `/api/health/plan/list` | 查询历史方案列表 |
| POST | `/api/health/plan/detail` | 查询方案详情 |
| POST | `/api/health/plan/generate` | 调用LangGraph生成方案 |

### 8.4 扩展 dimension-questionnaire 接口

确保 `submitDimensionQuestionnaire` 后端支持 `cognitive`/`mental`/`relationship` 维度（现有可能只处理了身维度，需确认和扩展）。

## 9. 前端改动清单

| 文件 | 改动内容 |
|------|---------|
| `pages/body/index.vue` | 新增Tab栏、数据图切换、替换功能入口网格为数据中心区块 |
| `pages/body-detail/dimension-questionnaire.vue` | 新增认知/心理/关系题库 + `dim` 参数锁定维度 |
| 新建 `pages/health/health-plan-summary.vue` | 方案汇总页（含历史记录） |
| `utils/api.js` | 新增方案汇总接口 |
| `pages.json` | 注册 health-plan-summary 页面 |

## 10. 页面注册

在 `pages.json` 的 `pages/health` 分包中新增：

```json
{
  "path": "health-plan-summary",
  "style": {
    "navigationBarTitleText": "方案汇总"
  }
}
```

## 11. 移除项

- 移除 body/index.vue 中现有的 `funcList` 功能入口网格（运动/饮食/作息/冥想/舌诊/健康维度）
- 移除 `DimensionTasks` 组件及引用
- 移除现有的"精准营养"区块（上传报告卡片保留并升级）

## 12. 保留项

- 七维雷达图（作为"健康"Tab 的数据图）
- FamilyMemberStrip 家庭成员选择条
- 活动/商品/文章推荐（视觉弱化，收窄宽度）
- AIFloatingAvatar