中医慢病管理平台项目文档

📋 项目概述

项目简介

本项目是一个基于 uni-app + Vue 3 + TypeScript 的移动端跨平台健康管理应用，旨在为用户提供全方位的数字化健康管理服务。平台集成了传统中医理论与现代医学技术，为用户提供个性化的健康管理解决方案。

核心价值

• 一站式健康管理：集成多种健康功能，提供完整的健康管理闭环
• 智能化数据分析：基于用户健康数据，提供个性化建议和预警
• 中西医结合：融合传统中医理论与现代医学检测技术
• 专业医疗服务：提供在线问诊、专家咨询等专业医疗服务
• 持续健康监测：长期跟踪用户健康状态，形成健康档案

目标用户

• 慢病患者：糖尿病、高血压等慢性疾病患者
• 健康管理爱好者：注重健康生活方式的用户
• 中老年群体：需要定期健康监测的用户
• 亚健康人群：工作压力大、生活不规律的都市人群
• 医疗专业人士：需要远程患者管理的医护人员

🛠 技术架构

技术栈

前端技术

• 框架: uni-app（支持多端发布）
• UI框架: Vue 3 Composition API
• 类型检查: TypeScript
• 状态管理: Pinia
• 样式处理: SCSS
• 图表组件: qiun-data-charts
• 工具库: lodash, dayjs

开发工具

• 开发环境: HBuilderX / VS Code
• 版本控制: Git
• 包管理: npm / yarn
• 代码规范: ESLint + Prettier
• API管理: 基于Promise的请求封装

部署平台

• APP: Android、iOS
• 小程序: 微信、支付宝、百度、字节跳动
• H5: 移动端浏览器

系统架构

┌─────────────────────────────────────┐
│          展示层 (Presentation)       │
├─────────────────────────────────────┤
│  Vue 3 + TypeScript + uni-app       │
│  ├─ 健康管理首页                      │
│  ├─ 在线问诊模块                      │
│  ├─ 健康检测模块                      │
│  ├─ 慢病管理模块                      │
│  ├─ 膳食管理模块                      │
│  ├─ 体质辩识模块                      │
│  ├─ 运动管理模块                      │
│  ├─ 中医百科模块                      │
│  ├─ 健康讲堂模块                      │
│  └─ 个人档案模块                      │
├─────────────────────────────────────┤
│            业务层 (Business)         │
├─────────────────────────────────────┤
│ 状态管理 (Pinia Store)               │
│  ├─ 用户状态管理                      │
│  ├─ 健康数据管理                      │
│  ├─ 咨询会话管理                      │
│  └─ 缓存数据管理                      │
├─────────────────────────────────────┤
│            数据层 (Data)             │
├─────────────────────────────────────┤
│  API接口服务                         │
│  ├─ RESTful API                     │
│  ├─ WebSocket (实时通信)             │
│  ├─ 文件上传服务                      │
│  └─ 数据同步服务                      │
├─────────────────────────────────────┤
│            工具层 (Utils)            │
├─────────────────────────────────────┤
│  ├─ 健康计算工具                      │
│  ├─ 数据验证工具                      │
│  ├─ 格式化工具                        │
│  ├─ 提醒服务                         │
│  └─ 缓存管理                         │
└─────────────────────────────────────┘

📁 项目结构

src/
├─ api/                           # API接口
│  ├─ auth/                       # 认证相关API
│  ├─ file/                       # 文件上传API
│  ├─ system/                     # 系统API
│  └─ health/                     # 健康管理API
│     ├─ consultation.ts          # 在线问诊API
│     ├─ detection.ts             # 健康检测API
│     ├─ chronic.ts               # 慢病管理API
│     ├─ diet.ts                  # 膳食管理API
│     ├─ constitution.ts          # 体质辩识API
│     ├─ exercise.ts              # 运动管理API
│     ├─ encyclopedia.ts          # 中医百科API
│     ├─ education.ts             # 健康讲堂API
│     └─ profile.ts               # 个人档案API
├─ components/                    # 组件库
│  ├─ health/                     # 健康管理组件
│  │  ├─ consultation-card/       # 咨询卡片组件
│  │  ├─ health-chart/            # 健康图表组件
│  │  ├─ diet-calendar/           # 饮食日历组件
│  │  ├─ exercise-tracker/        # 运动追踪组件
│  │  ├─ constitution-test/       # 体质测试组件
│  │  ├─ health-indicator/        # 健康指标组件
│  │  └─ medicine-reminder/       # 用药提醒组件
│
├─ pages/                         # 页面
│    |─ health/                     # 健康管理页面
│    ├─ index/                   # 健康首页
│    ├─ consultation/            # 在线问诊
│    │  ├─ index.vue             # 问诊首页
│    │  ├─ doctor-list.vue       # 医生列表
│    │  ├─ chat.vue              # 咨询聊天
│    │  └─ history.vue           # 咨询历史
│    ├─ detection/               # 健康检测
│    │  ├─ index.vue             # 检测首页
│    │  ├─ vitals.vue            # 生命体征
│    │  ├─ report.vue            # 健康报告
│    │  └─ history.vue           # 检测历史
│    ├─ chronic/                 # 慢病管理
│    │  ├─ index.vue             # 慢病首页
│    │  ├─ diabetes.vue          # 糖尿病管理
│    │  ├─ hypertension.vue      # 高血压管理
│    │  └─ medication.vue        # 用药管理
│    ├─ diet/                    # 膳食管理
│    │  ├─ index.vue             # 膳食首页
│    │  ├─ plan.vue              # 膳食计划
│    │  ├─ record.vue            # 饮食记录
│    │  └─ analysis.vue          # 营养分析
│    ├─ constitution/            # 体质辩识
│    │  ├─ index.vue             # 体质首页
│    │  ├─ test.vue              # 体质测试
│    │  ├─ result.vue            # 测试结果
│    │  └─ advice.vue            # 调理建议
│    ├─ exercise/                # 运动管理
│    │  ├─ index.vue             # 运动首页
│    │  ├─ plan.vue              # 运动计划
│    │  ├─ record.vue            # 运动记录
│    │  └─ analysis.vue          # 运动分析
│    ├─ encyclopedia/            # 中医百科
│    │  ├─ index.vue             # 百科首页
│    │  ├─ herbs.vue             # 中药材
│    │  ├─ acupoints.vue         # 穴位
│    │  └─ meridians.vue         # 经络
│    ├─ education/               # 健康讲堂
│    │  ├─ index.vue             # 讲堂首页
│    │  ├─ articles.vue          # 文章列表
│    │  ├─ videos.vue            # 视频列表
│    │  └─ courses.vue           # 课程列表
│    └─ profile/                 # 个人档案
│       ├─ index.vue             # 档案首页
│       ├─ basic-info.vue        # 基本信息
│       ├─ medical-history.vue   # 病史信息
│       └─ family-history.vue    # 家族史
│
├─ store/                         # 状态管理
│  └─ modules/
│    └─ health/                  # 健康管理状态
│      ├─ consultation.ts       # 咨询状态
│      ├─ detection.ts          # 检测状态
│      ├─ chronic.ts            # 慢病状态
│      ├─ diet.ts               # 膳食状态
│      ├─ constitution.ts       # 体质状态
│      ├─ exercise.ts           # 运动状态
│      ├─ encyclopedia.ts       # 百科状态
│      ├─ education.ts          # 讲堂状态
│      └─ profile.ts            # 档案状态
│
├─ types/                         # 类型定义
│   |─ health/                     # 健康管理类型
│   ├─ consultation.ts          # 咨询类型
│   ├─ detection.ts             # 检测类型
│   ├─ chronic.ts               # 慢病类型
│   ├─ diet.ts                  # 膳食类型
│   ├─ constitution.ts          # 体质类型
│   ├─ exercise.ts              # 运动类型
│   ├─ encyclopedia.ts          # 百科类型
│   ├─ education.ts             # 讲堂类型
│   └─ profile.ts               # 档案类型
│
├─ utils/                         # 工具函数
│  ├─ health/                     # 健康工具
│  │  ├─ calculation.ts           # 健康计算
│  │  ├─ validation.ts            # 数据验证
│  │  ├─ formatter.ts             # 数据格式化
│  │  └─ reminder.ts              # 提醒管理
│  └─
└─ static/                        # 静态资源
   ├─ health/                     # 健康相关图片
   ├─ icons/                      # 图标资源
   └─ images/                     # 图片资源

🚀 功能模块详述

1. 在线问诊模块

功能特性

• 医生筛选: 按科室、专业、评分筛选医生
• 多种咨询方式: 支持文字、语音、视频咨询
• 实时聊天: WebSocket实现实时通信
• 处方开具: 医生可开具电子处方
• 咨询记录: 完整的咨询历史管理

核心功能

// 主要API接口
- getDoctors(): 获取医生列表
- createConsultation(): 创建咨询
- sendMessage(): 发送消息
- endConsultation(): 结束咨询
- rateConsultation(): 评价咨询

页面流程

问诊首页 → 选择医生 → 发起咨询 → 实时聊天 → 咨询结束 → 评价反馈

2. 健康检测模块

功能特性

• 生命体征监测: 血压、心率、体温、血氧等
• 健康报告生成: 基于检测数据自动生成报告
• 趋势分析: 长期健康数据趋势分析
• 异常预警: 健康指标异常及时提醒

核心算法

// BMI计算
export const calculateBMI = (weight: number, height: number): number => {
  const heightInMeters = height / 100;
  return Number((weight / (heightInMeters * heightInMeters)).toFixed(1));
};

// 基础代谢率计算
export const calculateBMR = (
  weight: number,
  height: number,
  age: number,
  gender: "male" | "female"
): number => {
  if (gender === "male") {
    return Math.round(88.362 + 13.397 * weight + 4.799 * height - 5.677 * age);
  } else {
    return Math.round(447.593 + 9.247 * weight + 3.098 * height - 4.33 * age);
  }
};

3. 慢病管理模块

功能特性

• 疾病档案管理: 糖尿病、高血压等慢病档案
• 数据监测: 血糖、血压等关键指标监测
• 用药管理: 药物提醒、用药记录
• 目标管理: 设置和跟踪健康目标

数据验证

// 血糖数据验证
export const validateBloodSugar = (value: number, mealRelation: string) => {
  let level: "normal" | "low" | "high" = "normal";

  switch (mealRelation) {
    case "fasting":
      if (value < 3.9) level = "low";
      else if (value > 6.1) level = "high";
      break;
    case "after_meal":
      if (value < 3.9) level = "low";
      else if (value > 11.1) level = "high";
      break;
  }

  return { level, isValid: value >= 2 && value <= 30 };
};

4. 膳食管理模块

功能特性

• 营养计算: 自动计算食物营养成分
• 膳食计划: 个性化膳食计划制定
• 饮食记录: 详细的饮食记录和分析
• 食谱推荐: 基于用户需求的食谱推荐

营养计算

// 每日热量需求计算
export const calculateTDEE = (bmr: number, activityLevel: string): number => {
  const activityFactors = {
    sedentary: 1.2, // 久坐
    light: 1.375, // 轻度运动
    moderate: 1.55, // 中度运动
    active: 1.725, // 重度运动
    very_active: 1.9, // 极重度运动
  };

  return Math.round(bmr * (activityFactors[activityLevel] || 1.2));
};

5. 体质辩识模块

功能特性

• 中医体质测试: 标准化体质辩识问卷
• 体质分析: 详细的体质分析报告
• 调理建议: 个性化的调理建议
• 体质跟踪: 体质变化趋势跟踪

体质类型

// 九种体质类型
const constitutionTypes = [
  "平和质",
  "气虚质",
  "阳虚质",
  "阴虚质",
  "痰湿质",
  "湿热质",
  "血瘀质",
  "气郁质",
  "特禀质",
];

6. 运动管理模块

功能特性

• 运动计划: 个性化运动计划制定
• 运动记录: 详细的运动数据记录
• 卡路里计算: 精准的运动消耗计算
• 目标跟踪: 运动目标设置和跟踪

卡路里计算

// 运动消耗卡路里计算
export const calculateCaloriesBurned = (
  activity: string,
  weight: number,
  duration: number
): number => {
  const metValues: Record<string, number> = {
    walking: 3.5,
    running: 8.0,
    cycling: 6.0,
    swimming: 8.0,
    // ...更多运动类型
  };

  const met = metValues[activity] || 3.0;
  return Math.round(met * weight * (duration / 60));
};

7. 中医百科模块

功能特性

• 中药材查询: 详细的中药材信息
• 穴位定位: 穴位位置和功效介绍
• 经络系统: 经络走向和功能说明
• 中医理论: 中医基础理论学习

8. 健康讲堂模块

功能特性

• 健康文章: 专业的健康科普文章
• 视频讲座: 专家健康讲座视频
• 在线课程: 系统化的健康教育课程
• 学习跟踪: 学习进度和成果跟踪

9. 个人档案模块

功能特性

• 基本信息: 个人基本健康信息
• 病史管理: 详细的病史记录
• 家族史: 家族遗传病史管理
• 健康目标: 个人健康目标设置

📱 界面设计

设计原则

1. 用户体验优先

• 简洁直观: 界面设计简洁明了，操作流程直观
• 响应迅速: 页面加载和交互响应快速
• 个性化: 根据用户偏好提供个性化界面

2. 健康主题

• 色彩搭配: 以绿色、蓝色为主色调，体现健康主题
• 图标设计: 使用直观的健康相关图标
• 数据可视化: 通过图表展示健康数据趋势

3. 移动端适配

• 响应式设计: 适配不同屏幕尺寸
• 触摸友好: 按钮大小适合手指操作
• 手势支持: 支持常见的移动端手势操作

关键页面设计

健康管理首页

// 渐变背景设计
.health-dashboard {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

  // 卡片式布局
  .health-header {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border-radius: 20rpx;
  }
}

数据可视化

• 环形进度条: 显示健康评分和目标完成度
• 趋势图表: 展示健康数据变化趋势
• 状态指示器: 直观显示健康状态

🔧 开发指南

环境准备

1. 开发工具安装

# 安装Node.js (推荐v16+)
node --version

# 安装HBuilderX或配置VS Code
# HBuilderX: https://www.dcloud.io/hbuilderx.html
# VS Code + uni-app插件

# 安装依赖
npm install
# 或
yarn install

2. 项目配置

// manifest.json配置
{
  "name": "健康管理平台",
  "appid": "__UNI__XXXXXX",
  "description": "专业的移动端健康管理应用",
  "versionName": "1.0.0",
  "versionCode": "100"
}

开发规范

1. 代码规范

// 组件命名规范
export default defineComponent({
  name: "HealthDashboard",
  // ...
});

// API接口规范
const HealthAPI = {
  getHealthData(): Promise<HealthDataResult> {
    return request<HealthDataResult>({
      url: "/api/v1/health/data",
      method: "GET",
    });
  },
};

2. 样式规范

// 使用SCSS变量
$primary-color: #007aff;
$success-color: #34c759;
$warning-color: #ff9500;
$danger-color: #ff3b30;

// 组件样式命名
.health-component {
  &__header {
  }
  &__content {
  }
  &__footer {
  }
}

3. 类型定义规范

// 接口定义
export interface HealthData {
  id: string;
  userId: string;
  measureTime: string;
  indicators: HealthIndicator[];
}

// 响应数据格式
export interface ApiResponse<T> {
  code: number;
  message: string;
  data: T;
}

状态管理

Pinia Store使用

// store/modules/health/detection.ts
export const useDetectionStore = defineStore("detection", {
  state: () => ({
    vitalSigns: [] as VitalSigns[],
    loading: false,
    error: null as string | null,
  }),

  getters: {
    latestVitalSigns: (state) => state.vitalSigns[0],
    healthTrend: (state) => {
      // 计算健康趋势逻辑
    },
  },

  actions: {
    async fetchVitalSigns() {
      this.loading = true;
      try {
        const response = await DetectionAPI.getVitalSignsHistory();
        this.vitalSigns = response.list;
      } catch (error) {
        this.error = "获取数据失败";
      } finally {
        this.loading = false;
      }
    },
  },
});

API接口开发

请求封装

// utils/request.ts
const request = <T = any>(config: RequestConfig): Promise<T> => {
  return new Promise((resolve, reject) => {
    uni.request({
      url: baseURL + config.url,
      method: config.method || "GET",
      data: config.data,
      header: {
        Authorization: getToken(),
        "Content-Type": "application/json",
        ...config.header,
      },
      success: (res) => {
        if (res.statusCode === 200) {
          resolve(res.data);
        } else {
          reject(new Error(`请求失败: ${res.statusCode}`));
        }
      },
      fail: reject,
    });
  });
};

🚀 部署指南

多端发布

1. 微信小程序

# 编译微信小程序
npm run build:mp-weixin

# 上传代码
# 使用微信开发者工具上传

2. APP发布

# Android打包
npm run build:app-android

# iOS打包
npm run build:app-ios

3. H5发布

# H5编译
npm run build:h5

# 部署到服务器
# 将dist/build/h5目录上传到Web服务器

服务器部署

1. Nginx配置

server {
    listen 80;
    server_name your-domain.com;

    location / {
        root /var/www/health-app/h5;
        index index.html;
        try_files $uri $uri/ /index.html;
    }

    location /api {
        proxy_pass http://backend-server:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
}

2. HTTPS配置

server {
    listen 443 ssl;
    server_name your-domain.com;

    ssl_certificate /path/to/cert.pem;
    ssl_certificate_key /path/to/key.pem;

    # 其他配置...
}

📊 性能优化

1. 代码分割

// 路由懒加载
const routes = [
  {
    path: "/health/consultation",
    component: () => import("@/pages/health/consultation/index.vue"),
  },
];

2. 图片优化

<!-- 使用适当的图片格式和尺寸 -->
<image :src="imageUrl" mode="aspectFill" lazy-load @error="handleImageError" />

3. 数据缓存

// 使用Pinia持久化
import { createPinia } from "pinia";
import { createPersistedState } from "pinia-plugin-persistedstate";

const pinia = createPinia();
pinia.use(createPersistedState());

🔒 安全措施

1. 数据加密

// 敏感数据加密存储
const encryptData = (data: string): string => {
  // 使用AES等加密算法
  return encrypt(data, SECRET_KEY);
};

2. API安全

// JWT Token验证
const getAuthHeader = (): Record<string, string> => {
  const token = getToken();
  return token ? { Authorization: `Bearer ${token}` } : {};
};

3. 输入验证

// 严格的输入验证
export const validateHealthData = (data: any): ValidationResult => {
  const errors: string[] = [];

  if (!data.bloodPressure || !isValidBloodPressure(data.bloodPressure)) {
    errors.push("血压数据格式错误");
  }

  return {
    isValid: errors.length === 0,
    errors,
  };
};

🧪 测试策略

1. 单元测试

// 健康计算函数测试
describe("Health Calculations", () => {
  test("BMI calculation should be correct", () => {
    const bmi = calculateBMI(70, 175);
    expect(bmi).toBe(22.9);
  });
});

2. 集成测试

// API接口测试
describe("Health API", () => {
  test("should fetch vital signs data", async () => {
    const data = await DetectionAPI.getVitalSignsHistory({
      page: 1,
      pageSize: 10,
    });
    expect(data.list).toBeDefined();
  });
});

3. E2E测试

// 用户流程测试
describe("Health Management Flow", () => {
  test("user can record vital signs", async () => {
    // 模拟用户操作流程
  });
});

📈 监控与分析

1. 错误监控

// 全局错误处理
uni.onError((error) => {
  console.error("应用错误:", error);
  // 上报错误信息到监控平台
  reportError(error);
});

2. 性能监控

// 页面性能监控
const performanceObserver = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    console.log("性能指标:", entry);
  });
});

3. 用户行为分析

// 埋点统计
const trackUserAction = (action: string, params: any) => {
  // 发送用户行为数据
  analytics.track(action, params);
};

🔮 扩展功能

1. AI智能推荐

• 健康风险评估: 基于AI模型评估用户健康风险
• 个性化建议: 机器学习生成个性化健康建议
• 疾病预测: 基于历史数据预测疾病风险

2. IoT设备集成

• 智能硬件对接: 支持智能手环、血压计等设备
• 数据自动同步: 设备数据自动同步到应用
• 实时监控: 24小时健康数据监控

3. 社交健康

• 健康社区: 用户健康经验分享社区
• 家庭健康: 家庭成员健康管理
• 健康挑战: 健康目标挑战活动

4. 医疗服务扩展

• 预约挂号: 在线预约医院挂号
• 体检预约: 体检项目预约和管理
• 健康保险: 健康保险产品推荐

❓ 常见问题

Q1: 如何处理跨平台兼容性问题？

A: 使用uni-app的条件编译功能，针对不同平台编写特定代码：

<!-- #ifdef MP-WEIXIN -->
<!-- 微信小程序特有功能 -->
<!-- #endif -->

<!-- #ifdef APP-PLUS -->
<!-- APP特有功能 -->
<!-- #endif -->

Q2: 健康数据的隐私保护如何处理？

A:

1. 数据加密存储和传输
2. 用户隐私权限控制
3. 数据访问日志记录
4. 符合GDPR等隐私法规

Q3: 如何保证健康数据的准确性？

A:

1. 多重数据验证机制
2. 异常数据检测和提醒
3. 专业医疗团队审核
4. 用户反馈和纠错机制

Q4: 离线功能如何实现？

A:

1. 关键数据本地缓存
2. 离线操作队列管理
3. 网络恢复后数据同步
4. 离线提醒功能

Q5: 如何处理大量健康数据？

A:

1. 数据分页加载
2. 虚拟滚动优化
3. 数据压缩和缓存
4. 后台数据清理

更新日志**: [更新日志地址]

开源协议

本项目采用 MIT 开源协议，欢迎贡献代码和提出改进建议。

---

版本: v1.0.0
更新时间: 2024年12月
文档维护: 开发团队