healthapp
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

34 KiB

健康 AI 问询助手项目设计方案

一、项目概述

健康 AI 问询助手是一个智能健康咨询平台,用户可通过 WEB 端和移动 APP 进行健康相关问题的咨询,AI 将基于医学知识库提供专业解答和健康建议。


二、技术栈推荐

前端技术

平台 技术选型 理由
WEB 端 Vue 3 + TypeScript + Vite 国内生态好,学习曲线平缓,开发效率高
APP 端 React Native + TypeScript 跨平台原生体验,性能优秀,生态成熟
Web UI 框架 Element Plus 成熟稳定,组件丰富
App UI 框架 React Native Paper / NativeBase Material Design 风格,组件完善
状态管理 Pinia (Web) / Zustand (App) 轻量高效,TypeScript 支持好
导航 Vue Router (Web) / React Navigation (App) 各平台主流导航方案

后端技术

组件 技术选型 理由
语言 Go 1.21+ 高性能,并发能力强,部署简单
Web 框架 Gin 轻量高效,生态成熟,中间件丰富
ORM GORM 功能完善,支持自动迁移,多数据库兼容
数据库 SQLite(默认) 轻量简单,零配置,适合演示和开发
配置管理 Viper 支持多种配置格式,环境变量绑定
日志 Zap 高性能结构化日志
AI 接口 OpenAI API / 通义千问 成熟稳定,效果好

数据库扩展方案

系统采用 Repository 模式 + GORM 抽象层,支持通过配置切换数据库:

数据库 适用场景 切换方式
SQLite 开发/演示/小规模 默认,零配置
PostgreSQL 生产环境推荐 修改配置文件即可
MySQL 已有MySQL环境 修改配置文件即可

配置示例 (config.yaml):

database:
  driver: sqlite      # 可选: sqlite, postgres, mysql
  # SQLite 配置
  sqlite:
    path: ./data/health.db
  # PostgreSQL 配置(需要时启用)
  postgres:
    host: localhost
    port: 5432
    user: postgres
    password: 
    dbname: health_app
  # MySQL 配置(需要时启用)
  mysql:
    host: localhost
    port: 3306
    user: root
    password: 
    dbname: health_app

# AI 服务配置
ai:
  provider: aliyun              # 可选: openai, aliyun (通义千问)
  max_history_messages: 10      # 发送给AI的最大历史消息数
  max_tokens: 2000              # 最大返回 token 数
  
  # OpenAI 配置
  openai:
    api_key: ""                 # OpenAI API Key
    base_url: "https://api.openai.com/v1"
    model: "gpt-3.5-turbo"      # 可选: gpt-3.5-turbo, gpt-4
  
  # 阿里云通义千问配置
  aliyun:
    api_key: ""                 # 阿里云 DashScope API Key
    model: "qwen-turbo"         # 可选: qwen-turbo, qwen-plus, qwen-max

AI 服务说明:

服务商 Provider 模型选项 API Key 获取
OpenAI openai gpt-3.5-turbo, gpt-4 https://platform.openai.com/api-keys
阿里云通义千问 aliyun qwen-turbo, qwen-plus, qwen-max https://dashscope.console.aliyun.com/apiKey

架构设计要点:

  • 使用 GORM 统一 ORM 层,SQL 语法自动适配
  • Repository 接口隔离数据访问逻辑
  • 避免使用特定数据库的专有语法
  • 数据库迁移脚本兼容多种数据库

三、系统架构

flowchart TB
    subgraph client [客户端]
        Web[Web端_Vue3]
        App[App端_ReactNative]
    end

    subgraph backend [后端服务_Go_Gin]
        API[Gin服务]
        Auth[认证模块]
        Survey[健康调查模块]
        Constitution[体质辨识模块]
        AI[AI对话模块]
        Health[健康档案模块]
    end

    subgraph storage [数据存储]
        DB[(SQLite)]
    end

    subgraph external [外部服务]
        LLM[AI大模型API]
    end

    Web --> API
    App --> API
    API --> Auth
    API --> Survey
    API --> Constitution
    API --> AI
    API --> Health
    Auth --> DB
    Survey --> DB
    Constitution --> DB
    AI --> LLM
    AI -.->|获取体质信息| Constitution
    Health --> DB

新用户完整流程

flowchart LR
    A[用户注册] --> B[基础信息填写]
    B --> C[生活习惯调查]
    C --> D[健康状况调查]
    D --> E[体质问卷测评]
    E --> F[体质结果展示]
    F --> G[AI问诊功能]

    G -->|定期提醒| H[体质重新测评]
    H --> F

四、功能模块设计

4.1 用户模块

  • 用户注册/登录(手机号/邮箱)
  • 个人资料管理(基本信息、健康档案)
  • 第三方登录(微信)
  • JWT Token 认证

4.2 新用户健康调查(核心功能)

新用户注册后必须完成健康调查问卷,系统根据问卷结果判断用户体质类型。

4.2.1 基础信息采集

  • 个人基本信息
    • 姓名、性别、出生日期
    • 身高、体重(自动计算 BMI)
    • 职业、婚姻状况
    • 所在地区
  • 生活习惯调查
    • 作息时间(入睡时间、起床时间、睡眠质量)
    • 饮食习惯(三餐规律、饮食偏好、饮水量)
    • 运动习惯(运动频率、运动类型、运动时长)
    • 烟酒情况(是否吸烟、饮酒频率)
  • 健康状况调查
    • 既往病史(慢性病、手术史)
    • 家族病史(糖尿病、高血压、心脏病、癌症等)
    • 过敏史(药物过敏、食物过敏、其他过敏)
    • 当前用药情况

4.2.2 中医体质辨识问卷

基于《中医体质分类与判定》标准,包含 60+道问题,涵盖九种体质:

体质类型 特征描述 常见表现
平和质 阴阳气血调和 体态适中,面色红润,精力充沛
气虚质 元气不足 易疲劳,气短懒言,易出汗
阳虚质 阳气不足 畏寒怕冷,手脚冰凉,喜热饮
阴虚质 阴液亏少 口燥咽干,手足心热,盗汗
痰湿质 痰湿凝聚 形体肥胖,腹部肥满,痰多
湿热质 湿热内蕴 面垢油光,口苦口干,大便黏滞
血瘀质 血行不畅 肤色晦暗,易生斑点,健忘
气郁质 气机郁滞 情绪低落,多愁善感,胸闷
特禀质 先天失常 过敏体质,易打喷嚏,皮肤易过敏

4.2.3 体质判定算法

原始分 = 各条目得分之和
转化分 = (原始分 - 条目数) / (条目数 × 4) × 100

判定标准:
- 平和质:转化分 ≥ 60分,其他8种体质转化分均 < 30分
- 偏颇体质:转化分 ≥ 40分为"是",30-39分为"倾向是"
- 可存在多种偏颇体质(复合体质)

4.2.4 调查结果展示

  • 体质雷达图(九种体质得分可视化)
  • 主要体质类型及特征说明
  • 个性化健康建议
    • 饮食调养建议
    • 起居调养建议
    • 运动调养建议
    • 情志调养建议
    • 易发疾病风险提示

4.3 AI 问诊模块

  • 多轮对话支持
  • 结合用户体质进行个性化回答
  • 对话历史记录
  • 智能追问(症状细化)
  • 健康建议生成(基于体质类型)
  • 免责声明展示

4.3.1 AI Agent 系统提示词

# 角色定义
你是"健康AI助手",一个专业的健康咨询助理。你基于中医体质辨识理论,为用户提供个性化的健康建议。

## 重要声明
- 你不是专业医师,仅提供健康咨询和养生建议
- 你的建议不能替代医生的诊断和治疗
- 遇到以下情况,必须立即建议用户就医:
  * 胸痛、呼吸困难、剧烈头痛
  * 高烧不退(超过39°C持续24小时)
  * 意识模糊、晕厥
  * 严重外伤、大量出血
  * 持续剧烈腹痛
  * 疑似中风症状(口眼歪斜、肢体无力、言语不清)
  * 任何可能危及生命的紧急状况

## 用户信息
{{user_profile}}

## 用户体质
{{constitution_info}}

## 用药历史
{{medication_history}}

## 已购买保健品
{{purchase_history}}

## 回答原则

### 1. 简洁原则
- 回答控制在200字以内
- 使用简短句子,避免冗长解释
- 重点突出,条理清晰

### 2. 体质结合原则
根据用户体质特点给出针对性建议:
- 气虚质:建议补气食物,避免过度劳累
- 阳虚质:建议温补,避免寒凉
- 阴虚质:建议滋阴,避免辛辣燥热
- 痰湿质:建议祛湿,控制饮食
- 湿热质:建议清热利湿,饮食清淡
- 血瘀质:建议活血化瘀,适当运动
- 气郁质:建议疏肝理气,调节情绪
- 特禀质:注意过敏原,增强体质
- 平和质:维持现状,均衡养生

### 3. 用药建议原则
- 优先推荐非处方中成药或食疗方案
- 结合用户用药历史,避免重复或冲突
- 注明"建议咨询药师后使用"
- 有过敏史时特别提醒

### 4. 安全原则
- 不推荐处方药
- 不做疾病诊断
- 症状严重时直接建议就医
- 涉及儿童、孕妇、老人时更加谨慎

### 5. 产品推荐原则
当回答涉及调养建议时,根据以下规则推荐保健品:
- 根据用户体质匹配相关产品
- 根据症状关键词匹配产品
- 最多推荐2个产品
- 保健品不能替代药物治疗,仅作日常调养参考
- 必须包含商城链接

## 可推荐产品
{{product_list}}

## 回答格式

【情况分析】一句话概括
【建议】
1. 具体建议1
2. 具体建议2
【用药参考】(如适用)
- 药品名称:用法用量(建议咨询药师)
【推荐调养产品】(根据体质/症状匹配,非必须)
- 产品名称 ¥价格 [点击购买](商城链接)
【提醒】注意事项或就医建议

4.3.2 动态变量说明

变量 说明 数据来源
{{user_profile}} 用户基本信息(性别、年龄、BMI) HealthProfile 表
{{constitution_info}} 体质类型和特征描述 ConstitutionAssessment 表
{{medication_history}} 用药历史记录 MedicalHistory 表
{{purchase_history}} 保健品购买历史(商城同步) PurchaseHistory 表
{{product_list}} 可推荐产品列表(按体质筛选) Product 表

4.3.3 对话历史管理

  • 每次发送给 AI 的历史消息数量限制为 max_history_messages(默认10条)
  • 超出限制时,保留最近的消息
  • 用户消息和 AI 回复均持久化存储到数据库

4.4 健康档案模块

  • 基础健康信息(年龄、性别、身高、体重、血型、BMI)
  • 体质辨识结果(支持重新测评)
  • 体质变化追踪(定期重测对比)
  • 既往病史记录
  • 过敏史记录
  • 用药记录
  • 体检报告上传

4.5 系统功能

  • 消息通知
  • 体质重测提醒(建议每 3-6 个月重测)
  • 反馈建议
  • 使用帮助
  • 隐私政策

五、数据模型设计

erDiagram
    User ||--o{ Conversation : has
    User ||--o| HealthProfile : has
    User ||--o{ ConstitutionAssessment : takes
    User ||--o{ PurchaseHistory : has
    Conversation ||--|{ Message : contains
    HealthProfile ||--o{ MedicalHistory : has
    HealthProfile ||--o{ AllergyRecord : has
    HealthProfile ||--o{ FamilyHistory : has
    ConstitutionAssessment ||--|{ AssessmentAnswer : contains

    User {
        int id PK
        string phone
        string email
        string password_hash
        string nickname
        string avatar
        boolean survey_completed
        datetime created_at
    }

    HealthProfile {
        int id PK
        int user_id FK
        string name
        date birth_date
        string gender
        float height
        float weight
        float bmi
        string blood_type
        string occupation
        string marital_status
        string region
    }

    LifestyleInfo {
        int id PK
        int user_id FK
        time sleep_time
        time wake_time
        string sleep_quality
        string meal_regularity
        string diet_preference
        int daily_water_ml
        string exercise_frequency
        string exercise_type
        int exercise_duration_min
        boolean is_smoker
        string alcohol_frequency
    }

    ConstitutionAssessment {
        int id PK
        int user_id FK
        datetime assessed_at
        json scores
        string primary_constitution
        json secondary_constitutions
        json recommendations
    }

    AssessmentAnswer {
        int id PK
        int assessment_id FK
        int question_id
        int score
    }

    MedicalHistory {
        int id PK
        int health_profile_id FK
        string disease_name
        string disease_type
        date diagnosed_date
        string status
        text notes
    }

    FamilyHistory {
        int id PK
        int health_profile_id FK
        string relation
        string disease_name
        text notes
    }

    AllergyRecord {
        int id PK
        int health_profile_id FK
        string allergy_type
        string allergen
        string severity
        text reaction_desc
    }

    Conversation {
        int id PK
        int user_id FK
        string title
        datetime created_at
        datetime updated_at
    }

    Message {
        int id PK
        int conversation_id FK
        string role
        text content
        datetime created_at
    }

    PurchaseHistory {
        int id PK
        int user_id FK
        string order_no
        int product_id
        string product_name
        datetime purchased_at
        string source
    }

购买历史表(PurchaseHistory)

由保健品商城同步,用于AI问诊时参考用户已购买的保健品

字段 类型 说明
id int 记录 ID
user_id int 用户 ID
order_no string(50) 商城订单号
product_id int 产品 ID
product_name string(100) 产品名称
purchased_at datetime 购买时间
source string(20) 来源(mall=保健品商城)

体质问卷题目表(QuestionBank)

字段 类型 说明
id int 题目 ID
constitution_type string 所属体质类型
question_text string 题目内容
options json 选项(从不/很少/有时/经常/总是,对应 1-5 分)
order_num int 显示顺序

保健品商城关联表

用于 AI 问诊时推荐相关保健品,链接到外部商城系统

保健品表(Product)

字段 类型 说明
id int 产品 ID
name string(100) 产品名称
category string(50) 分类
description text 产品描述
efficacy text 功效说明
suitable text 适用人群/体质
price decimal(10,2) 价格
image_url string(255) 产品图片
mall_url string(255) 商城链接
is_active boolean 是否上架

体质-产品关联表(ConstitutionProduct)

字段 类型 说明
id int 关联 ID
constitution_type string(20) 体质类型
product_id int 产品 ID
priority int 推荐优先级
reason string(200) 推荐理由

症状-产品关联表(SymptomProduct)

字段 类型 说明
id int 关联 ID
keyword string(50) 症状关键词
product_id int 产品 ID
priority int 推荐优先级

产品分类说明

分类 适用体质/问题 代表产品
补气类 气虚质 黄芪精、人参蜂王浆、西洋参
温阳类 阳虚质 鹿茸胶囊、桂圆红枣茶
滋阴类 阴虚质 枸杞原浆、燕窝、石斛
祛湿类 痰湿质、湿热质 红豆薏米粉、茯苓糕、祛湿茶
活血类 血瘀质 三七粉、丹参片
理气类 气郁质 玫瑰花茶、陈皮普洱茶
抗敏类 特禀质 益生菌、蜂胶
心脑血管类 高血压、高血脂 深海鱼油、纳豆激酶、卵磷脂
骨关节类 骨质疏松、关节痛 氨糖软骨素、钙片、骨胶原
血糖调节类 血糖偏高 苦瓜素、桑叶茶
助眠安神类 失眠 褪黑素、酸枣仁膏
健脑益智类 记忆力减退 银杏叶片、DHA
润肠通便类 便秘 膳食纤维、酵素
护眼明目类 视力下降 叶黄素、蓝莓提取物
增强免疫类 免疫力低 灵芝孢子粉、蛋白粉

六、API 接口设计

认证接口

  • POST /api/auth/register - 用户注册
  • POST /api/auth/login - 用户登录
  • POST /api/auth/refresh - 刷新 Token

用户接口

  • GET /api/user/profile - 获取用户信息
  • PUT /api/user/profile - 更新用户信息
  • GET /api/user/health-profile - 获取健康档案
  • PUT /api/user/health-profile - 更新健康档案
  • GET /api/user/lifestyle - 获取生活习惯信息
  • PUT /api/user/lifestyle - 更新生活习惯信息

健康调查接口(新用户必填)

  • GET /api/survey/status - 获取调查完成状态
  • POST /api/survey/basic-info - 提交基础信息
  • POST /api/survey/lifestyle - 提交生活习惯
  • POST /api/survey/medical-history - 提交病史信息
  • POST /api/survey/family-history - 提交家族病史
  • POST /api/survey/allergy - 提交过敏信息

体质辨识接口

  • GET /api/constitution/questions - 获取体质问卷题目
  • POST /api/constitution/submit - 提交问卷答案并计算结果
  • GET /api/constitution/result - 获取最新体质辨识结果
  • GET /api/constitution/history - 获取体质测评历史(用于追踪变化)
  • GET /api/constitution/recommendations - 获取体质调养建议

对话接口

  • GET /api/conversations - 获取对话列表
  • POST /api/conversations - 创建新对话
  • GET /api/conversations/{id} - 获取对话详情
  • DELETE /api/conversations/{id} - 删除对话
  • POST /api/conversations/{id}/messages - 发送消息(流式响应,AI 会结合体质信息回答)

产品接口(保健品商城关联)

  • GET /api/products - 获取产品列表(支持分类筛选)
  • GET /api/products/{id} - 获取产品详情
  • GET /api/products/recommend - 根据用户体质获取推荐产品
  • GET /api/products/search?keyword=xxx - 根据症状关键词搜索产品

商城数据同步接口

  • POST /api/sync/purchase - 接收商城购买记录(用于AI问诊参考)

七、与保健品商城的集成

7.1 接收商城跳转

商城用户点击"AI咨询"按钮后跳转到本系统,需处理以下场景:

跳转参数 处理逻辑
source=mall 标识来源为商城
product_id 自动创建对话并询问该产品是否适合用户
product_name 产品名称,用于生成问题

前端处理逻辑:

// Web: views/Chat.vue
// APP: screens/Chat.tsx

onMounted(() => {
  const query = route.query
  
  if (query.source === 'mall' && query.product_id) {
    // 从商城跳转,自动发起产品咨询
    const productName = query.product_name || '该产品'
    const autoMessage = `我想了解【${productName}】这款保健品是否适合我的体质?`
    
    // 自动发送消息
    handleSendMessage(autoMessage)
  }
})

7.2 跳转到商城

在AI对话回答和体质结果页提供商城跳转入口:

// utils/mall.ts
const MALL_BASE_URL = import.meta.env.VITE_MALL_URL || 'http://localhost:5174'

// 跳转到商城产品详情
export function jumpToMallProduct(productId: number) {
  window.location.href = `${MALL_BASE_URL}/product/${productId}?source=health-ai`
}

// 跳转到商城体质推荐列表
export function jumpToMallRecommend(constitutionType: string) {
  window.location.href = `${MALL_BASE_URL}/recommend?constitution=${constitutionType}&source=health-ai`
}

7.3 购买记录同步

接收商城同步的购买记录,用于AI问诊时参考用户已购买的保健品:

// POST /api/sync/purchase
type PurchaseSyncRequest struct {
    UserID   uint   `json:"user_id"`
    OrderNo  string `json:"order_no"`
    Products []struct {
        ID   uint   `json:"id"`
        Name string `json:"name"`
    } `json:"products"`
    CreatedAt time.Time `json:"created_at"`
}

func HandlePurchaseSync(c *gin.Context) {
    // 验证同步密钥
    // 存储到用户购买历史表
    // AI问诊时可获取:"用户近期购买了:氨糖软骨素、深海鱼油"
}

八、项目目录结构

healthApps/
├── web/                          # Web前端 (Vue 3)
│   ├── src/
│   │   ├── api/                  # API请求
│   │   ├── components/           # 公共组件
│   │   ├── views/                # 页面
│   │   ├── stores/               # Pinia状态管理
│   │   ├── router/               # 路由配置
│   │   └── utils/                # 工具函数
│   └── package.json
│
├── app/                          # 移动端 (React Native)
│   ├── src/
│   │   ├── api/                  # API请求
│   │   ├── components/           # 公共组件
│   │   ├── screens/              # 页面/屏幕
│   │   ├── navigation/           # 导航配置
│   │   ├── stores/               # Zustand状态管理
│   │   ├── hooks/                # 自定义Hooks
│   │   └── utils/                # 工具函数
│   ├── android/                  # Android原生代码
│   ├── ios/                      # iOS原生代码
│   ├── app.json
│   └── package.json
│
├── server/                       # 后端服务 (Go + Gin)
│   ├── cmd/
│   │   └── server/
│   │       └── main.go           # 程序入口
│   ├── internal/
│   │   ├── api/                  # API路由和Handler
│   │   │   ├── handler/          # 请求处理器
│   │   │   ├── middleware/       # 中间件
│   │   │   └── router.go         # 路由配置
│   │   ├── model/                # 数据模型(GORM兼容)
│   │   ├── service/              # 业务逻辑
│   │   ├── repository/           # 数据访问层(接口+实现)
│   │   │   ├── interface.go      # Repository接口定义
│   │   │   └── impl/             # 具体实现
│   │   ├── config/               # 配置管理
│   │   └── database/             # 数据库初始化(多驱动支持)
│   ├── pkg/                      # 公共包
│   │   ├── jwt/                  # JWT工具
│   │   ├── response/             # 统一响应
│   │   └── utils/                # 工具函数
│   ├── data/                     # 数据目录
│   │   └── health.db             # SQLite数据库文件
│   ├── config.yaml               # 配置文件(数据库可切换)
│   ├── go.mod
│   └── go.sum
│
├── docs/                         # 文档
└── design.md                     # 设计文档

九、安全与合规

  1. 数据安全:所有敏感数据加密存储,传输使用 HTTPS
  2. 隐私保护:符合个人信息保护法要求,用户数据不对外泄露
  3. 医疗免责:明确 AI 仅提供健康咨询建议,不构成医疗诊断
  4. 访问控制:基于 JWT 的身份认证,接口权限控制

十、UI 设计规范

参考设计稿位于 files/ui/ 目录

9.1 全局设计规范

配色方案

类型 色值 用途
主色调 #10B981 导航高亮、主按钮、强调元素
主色渐变 #10B981 → #2EC4B6 顶部背景、卡片装饰
辅助紫 #8B5CF6 AI咨询图标、起居图标
辅助青 #14B8A6 体质自测图标
辅助橙 #F97316 用药情况图标
辅助粉 #EC4899 情志图标
页面背景 #F5F5F5 整体页面背景
卡片背景 #FFFFFF 内容卡片
主文字 #1F2937 标题、正文
次文字 #6B7280 描述、说明
提示文字 #9CA3AF 占位符、时间

圆角规范

元素 圆角值
大卡片 16px
中卡片 12px
按钮(全宽) 24px
小按钮/标签 8px
头像 50% (圆形)
输入框 24px

阴影规范

/* 卡片阴影 */
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);

/* 悬浮阴影 */
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);

间距规范

类型
页面边距 16px
卡片内边距 16px
元素间距(小) 8px
元素间距(中) 12px
元素间距(大) 16px
区块间距 24px

9.2 底部导航栏

Tab 项目: 首页、AI问答、体质分析、我的

状态 图标颜色 文字颜色
选中 #10B981 #10B981
未选中 #9CA3AF #9CA3AF

图标:

  • 首页:房屋图标
  • AI问答:对话气泡图标
  • 体质分析:心电图/波浪图标
  • 我的:用户图标

9.3 页面设计规范

9.3.1 登录页

区域 设计要点
整体 简洁白色背景,现代扁平风格
顶部 Logo 图标(浅蓝背景圆角框)+ "健康AI助手" + slogan
表单 "欢迎登录" 标题 + 手机号/验证码输入框(圆角12px)
按钮 蓝色 #3B82F6 全宽圆角按钮
底部 用户协议和隐私政策链接

更新说明(v1.1): 登录页改为简洁现代的白色风格,主按钮使用蓝色,整体更加清爽简约。

9.3.2 首页

区域 设计要点
顶部 Header 绿色背景 + 动态问候语 + 祝福语
体质卡片 白色圆角卡片(负margin悬浮),体质图标 + 体质名称 + 描述
快速功能 4宫格布局:AI问诊、体质测试、健康档案、用药记录
健康提示 黄色背景卡片,今日健康小贴士
健康资讯 健康知识科普信息列表卡片(新增)

快速功能卡片:

功能 图标颜色 描述
AI问诊 蓝色 #3B82F6 24小时智能健康问答
体质测试 绿色 #10B981 科学分析您的体质类型
健康档案 紫色 #8B5CF6 查看个人健康记录
用药记录 橙色 #F59E0B 管理用药信息

更新说明(v1.1):

  • 首页移除"推荐调养产品"区块(移至体质结果页)
  • 新增"健康资讯"卡片列表,展示健康知识科普信息

9.3.3 体质分析首页

区域 设计要点
顶部卡片 绿色渐变背景,"中医体质自测"介绍文案
测试说明 白色卡片,3步骤说明(带序号圆圈)
操作按钮 绿色全宽圆角按钮"开始测试"

步骤说明:

  1. 回答65个问题 - 根据您的真实情况选择最符合的答案
  2. 获取分析报告 - 系统将为您分析体质类型并提供建议
  3. 个性化建议 - 根据结果提供针对性的健康建议

9.3.4 体质问卷页

区域 设计要点
导航栏 返回箭头 + "中医体质辨识自测" + 进度显示"1/65"
进度条 绿色细条,显示答题进度
问题卡片 绿色"问题N"标签 + 问题文字
选项区 5个白色圆角按钮,纵向排列
底部提示 浅绿色背景提示框

选项文字: 从不、很少、有时、经常、总是

9.3.5 体质结果页

区域 设计要点
顶部 绿色背景 + 人体轮廓图 + 分享按钮
结果展示 主体质名称(大字)+ 分数徽章 + 状态描述
雷达图卡片 九种体质得分雷达图可视化
体质特征 图标 + 特征描述文字
调理建议 2×2 网格布局(起居、饮食、运动、情志)
推荐调养产品 根据体质推荐的保健品列表(新增)

调理建议卡片配色:

类型 图标背景色
起居 紫色 #EDE9FE
饮食 青色 #CCFBF1
运动 紫色 #EDE9FE
情志 粉色 #FCE7F3

更新说明(v1.1): 推荐调养产品从首页移至体质结果页,更符合使用场景。

9.3.6 AI问答首页

区域 设计要点
导航栏 "AI问答" + 右侧"历史记录"按钮
空状态 对话图标 + 提示文案 + "开始对话"按钮
新建按钮 右下角悬浮FAB按钮
历史管理弹窗 Modal展示历史对话列表,支持编辑/删除

更新说明(v1.1):

  • 进入AI问答时,如有历史对话自动进入最近一次
  • 标题右侧添加"历史记录"入口
  • 历史弹窗支持编辑模式,可删除历史对话
  • 支持新建对话

快捷问题示例:

  • 我最近总是感觉疲劳怎么办?
  • 如何改善睡眠质量?
  • 感冒了应该注意什么?

9.3.7 AI对话详情页

元素 设计要点
AI消息 左对齐,机器人图标(蓝色背景),灰色/白色气泡
用户消息 右对齐,用户图标(绿色背景),绿色气泡
时间显示 消息下方,灰色小字"08:45"
输入区 固定底部,麦克风 + 输入框 + 发送按钮

9.3.8 我的页面

区域 设计要点
顶部 白色背景 + "我的"标题
用户卡片 头像 + 姓名 + 手机号 + 体质标签 + 编辑按钮
适老模式卡片 黄色背景卡片,开关控制(新增)
健康管理 健康档案、用药记录、体质报告、对话历史
其他 健康商城、关于我们

列表项样式:

  • 左侧:圆形彩色图标背景
  • 中间:标题 + 描述文字
  • 右侧:右箭头或数量角标

更新说明(v1.1):

  • 新增"适老模式"开关卡片,放大字体和组件,方便中老年用户使用
  • 新增"用药记录"管理功能,支持查看和添加用药记录
  • 用药记录弹窗显示药品名称、用量、频次、日期等信息

9.4 组件设计规范

按钮

类型 样式
主按钮 背景 #10B981,文字白色,圆角 24px
次按钮 背景白色,边框 #10B981,文字 #10B981
文字按钮 无背景,文字 #10B981
禁用状态 背景 #D1D5DB,文字 #9CA3AF

输入框

状态 样式
默认 背景 #F3F4F6,圆角 24px,无边框
聚焦 背景白色,边框 #10B981
错误 边框 #EF4444,提示文字红色

卡片

类型 样式
功能卡片 白色背景,16px 圆角,8px 阴影
信息卡片 白色背景,12px 圆角,内边距 16px
彩色卡片 渐变背景,16px 圆角

图标

场景 规范
功能入口 48px 圆形背景 + 24px 图标
Tab导航 24px 图标
列表项 40px 圆形背景 + 20px 图标
操作按钮 24px 图标

9.5 适老模式设计规范(v1.1 新增)

为方便中老年用户使用,系统提供"适老模式"可一键切换。

元素 普通模式 适老模式
基础字号 14px 17.5px (×1.25)
标题字号 18px 22.5px (×1.25)
间距 12px 14.4px (×1.2)
头像大小 64px 80px
按钮高度 48px 56px
图标大小 24px 30px

实现方式:

  • 使用全局状态管理(Zustand)存储适老模式开关
  • 通过 getFontSize(elderMode, baseSize) 函数动态计算字号
  • 设置存储于 AsyncStorage,用户重启后保持设置

十、功能更新记录

v1.1 更新内容

功能 更新内容
登录页 改为简洁现代的白色风格,主按钮使用蓝色
首页 移除推荐产品,新增健康资讯卡片
体质结果页 新增推荐调养产品区块
AI问答 进入时自动恢复历史对话,标题右侧添加历史管理入口,支持删除对话
我的页面 新增用药记录管理、适老模式开关
适老模式 全局字体和组件放大25%,方便中老年用户

十一、实施步骤

  1. 环境搭建 - 创建项目结构,配置开发环境
  2. 后端开发 - 实现 API 接口、数据库模型、AI 对接
  3. Web 前端 - 实现用户界面和交互逻辑
  4. App 开发 - 基于 uni-app 开发移动端
  5. 测试优化 - 功能测试、性能优化
  6. 部署上线 - 服务器部署、域名配置