应用首屏,通过蓝青色渐变背景与医疗科技元素传递专业可信赖的品牌印象,展示产品名称与核心服务概述,引导用户点击进入主服务。
| 元素 | 类型 | 说明 |
|---|---|---|
| 品牌标识 | 文字/Logo | 「新华保险」品牌名,位于顶部 |
| 主标题 | 文字 | 「肿瘤风险评估」 |
| 副标题 | 文字 | 核心服务概述:专业筛查 / 在线咨询 / 就医协助 |
| 进入服务按钮 | 按钮 | 主操作入口,跳转服务选择页 |
| 背景视觉 | 图形 | 蓝青色渐变 + 医疗科技装饰元素 |
| 状态 | 表现 |
|---|---|
| 加载 | 背景与按钮资源加载中,按钮置灰不可点 |
| 正常 | 资源加载完成,按钮高亮可点 |
| 异常 | 资源加载失败,展示骨架屏 + 重试入口 |
主服务导航中枢,以三张卡片入口展示线上咨询、线下就医协助、个人健康档案三项服务,同时承载肿瘤风险评估问卷的入口。用户根据需求选择对应服务。
| 元素 | 类型 | 说明 |
|---|---|---|
| 页面标题 | 文字 | 「选择服务」 |
| 线上咨询卡片 | 卡片 | 图标 + 标题 + 简介,点击进入医生列表 |
| 线下就医协助卡片 | 卡片 | 点击展示企微二维码 |
| 个人健康档案卡片 | 卡片 | 点击进入健康档案页 |
| 风险评估入口 | 卡片/按钮 | 进入问卷流程 |
| 状态 | 表现 |
|---|---|
| 加载 | 卡片骨架屏占位 |
| 空 | 服务未开通时卡片置灰,提示「敬请期待」 |
采集用户 10 项基本信息,作为风险评估的基础数据。年龄由出生日期自动计算,无需手动填写。
| 字段 | 类型 | 必填 | 校验规则 |
|---|---|---|---|
| 姓名 | 文本 | 是 | 2-20 字符,不含特殊符号 |
| 出生日期 | 日期选择 | 是 | 早于今天,晚于 1900-01-01 |
| 年龄 | 只读 | - | 由出生日期自动计算 |
| 身高 | 数字 | 是 | 范围 80-250 cm |
| 体重 | 数字 | 是 | 范围 20-300 kg |
| 籍贯 | 省市级联 | 是 | 下拉选择 |
| 身份证号 | 文本 | 是 | 18 位,校验位合法 |
| 联系电话 | 数字 | 是 | 11 位手机号格式 |
| 地址 | 文本 | 是 | 不少于 5 字符 |
| 工作单位 | 文本 | 是 | 不少于 2 字符 |
| 状态 | 表现 |
|---|---|
| 未填写 | 输入框占位符提示 |
| 校验失败 | 字段红框 + 行内错误文案 |
| 校验通过 | 下一步按钮高亮可点 |
分步采集生活方式信息:吸烟状态、饮酒习惯(含酒类多选、饮用量、时长)、职业暴露史。饮酒相关字段仅在用户选择饮酒时展开。
| 字段 | 类型 | 必填 | 说明 |
|---|---|---|---|
| 吸烟状态 | 单选 | 是 | 从不 / 偶尔 / 经常 |
| 饮酒习惯 | 单选 | 是 | 否 / 是 |
| 酒类 | 多选 | 条件 | 白酒 / 啤酒 / 红酒 / 其他,饮酒=是时展开 |
| 饮用量 | 数字 | 条件 | 饮酒=是时展开 |
| 饮酒年限 | 数字 | 条件 | 饮酒=是时展开 |
| 职业暴露史 | 单选 | 是 | 无 / 有 |
| 状态 | 表现 |
|---|---|
| 折叠 | 条件字段隐藏 |
| 展开 | 条件字段淡入显示 |
| 校验失败 | 展开字段缺失时红框提示 |
采集 HPV 检测情况,提供 5 个单选项。当用户选择「已有结果」时弹出上传弹窗支持上传报告;选择「无结果」时弹窗引导去购买检测试剂。
| 元素 | 类型 | 说明 |
|---|---|---|
| HPV 检测单选 | 单选(5项) | 已有结果 / 无结果 / 其他选项 |
| 上传报告弹窗 | 弹窗 | 已有结果触发:拍照/相册上传 + 取消/上传按钮 |
| 购买引导弹窗 | 弹窗 | 无结果触发:去购买检测试剂 + 稍后再说 |
| 下一步按钮 | 按钮 | 校验通过后跳转预览页 |
| 状态 | 表现 |
|---|---|
| 上传中 | 弹窗内进度条 + 百分比 |
| 上传成功 | 缩略图展示 + 删除按钮 |
| 上传失败 | 红色提示 + 重试按钮 |
以只读形式回显用户已填写的全部答案,供用户最终确认。支持返回修改或确认提交。
| 元素 | 类型 | 说明 |
|---|---|---|
| 答案回显区 | 列表 | 分组展示基本信息 / 生活方式 / HPV |
| 返回修改按钮 | 按钮 | 回到对应步骤 |
| 提交按钮 | 按钮 | 提交问卷至审核 |
| 状态 | 表现 |
|---|---|
| 提交中 | 按钮 loading,不可重复点击 |
| 提交成功 | 跳转审核中等待页 |
| 提交失败 | Toast 提示,按钮恢复可点 |
问卷提交成功后进入审核队列的等待页,告知用户审核进度,提供查看审核状态的入口。
| 元素 | 类型 | 说明 |
|---|---|---|
| 等待动画 | 动效 | 循环加载动画 + 审核中文案 |
| 预计说明 | 文字 | 预计时长与通知方式 |
| 查看审核状态按钮 | 按钮 | 轮询审核状态 |
| 状态 | 表现 |
|---|---|
| 审核中 | 等待动画持续 |
| 成功 | 自动跳转审核成功页 |
| 失败 | 自动跳转审核失败页 |
审核通过后的中间态页面,引导用户查看最终的肿瘤风险评估结果。
| 元素 | 类型 | 说明 |
|---|---|---|
| 成功标识 | 图标 | 绿色对勾 |
| 结果文案 | 文字 | 审核通过 + 报告已生成 |
| 查看评估结果按钮 | 按钮 | 跳转评估结果页 |
| 状态 | 表现 |
|---|---|
| 成功 | 绿色主题,按钮高亮 |
| 加载中 | 结果数据加载中 loading |
审核未通过页面,告知失败原因,引导用户修改上传结果重新提交,或联系客服。
| 元素 | 类型 | 说明 |
|---|---|---|
| 失败标识 | 图标 | 红色警告 |
| 失败原因 | 文字 | 报告不清晰 / 信息不符 / 关键字段缺失 |
| 修改上传结果按钮 | 按钮 | 回到上传步骤 |
| 联系客服按钮 | 按钮 | 次要操作 |
| 状态 | 表现 |
|---|---|
| 失败 | 红色主题 + 原因说明 |
| 重新审核 | 跳回审核中等待页 |
展示肿瘤风险评估结果。半圆仪表盘呈现总体风险等级(高/中/低),下方分解各器官风险(肺癌/肝癌/胃癌/结直肠癌等),底部 CTA 按钮根据等级引导不同后续动作。
| 元素 | 类型 | 说明 |
|---|---|---|
| 半圆仪表盘 | 图形 | 绿→黄→红渐变,指针指向总体等级 |
| 总体风险等级 | 文字 | 高 / 中 / 低 |
| 器官风险列表 | 列表 | 各器官独立等级标签 |
| CTA 按钮 | 按钮 | 按等级动态变化 |
| 状态 | 表现 |
|---|---|
| 高风险 | 仪表盘红色区 + 专项服务 CTA |
| 中风险 | 仪表盘橙色区 + 咨询 CTA |
| 低风险 | 仪表盘绿色区 + 随访 CTA |
展示可咨询的医生列表,每项含头像、姓名、职称、科室、医院等关键信息,点击进入医生详情。
| 元素 | 类型 | 说明 |
|---|---|---|
| 医生卡片 | 列表项 | 头像 + 姓名 + 职称 + 科室 + 医院 |
| 筛选/搜索 | 控件 | 按科室、职称筛选 |
| 状态 | 表现 |
|---|---|
| 空 | 「暂无可咨询医生」插画 |
| 加载 | 骨架屏 |
| 错误 | 「加载失败」+ 重试 |
医生详情页展示头像、姓名、职称、科室、医院、擅长、简介等信息,用户确认后发起咨询进入 IM 聊天页。聊天页采用气泡式交互,患者气泡靠右、医生气泡靠左。
| 元素 | 类型 | 说明 |
|---|---|---|
| 医生信息头 | 区 | 头像 + 姓名 + 职称 + 科室 + 医院 |
| 擅长 | 文字 | 医生擅长领域 |
| 简介 | 文字 | 医生简介 |
| 发起咨询按钮 | 按钮 | 创建会话进入聊天 |
| 消息气泡 | 列表 | 患者右 / 医生左,支持图文 |
| 输入框 | 控件 | 进行中可用,已结束隐藏 |
| 状态 | 表现 |
|---|---|
| 进行中 | 输入框可用,在线状态指示 |
| 已结束 | 输入框隐藏,只读模式 |
| 发送中 | 气泡旁 loading 圈 |
| 发送失败 | 气泡旁红色感叹号,点击重发 |
展示企业微信二维码,引导用户添加专属健康管家,建立一对一服务关系,提供线下就医协助。
| 元素 | 类型 | 说明 |
|---|---|---|
| 引导文案 | 文字 | 说明服务内容 |
| 企微二维码 | 图片 | 长按识别或保存 |
| 保存二维码按钮 | 按钮 | 保存到相册 |
| 复制微信号按钮 | 按钮 | 复制微信号便于搜索添加 |
| 状态 | 表现 |
|---|---|
| 未添加 | 展示二维码与引导 |
| 已添加 | 展示「已添加,专属管家将联系您」 |
汇聚用户的线上咨询记录与随访计划。咨询记录以卡片展示并提供查看入口;随访计划以时间线呈现(肺结节 CT 复查、结肠镜检查等),帮助用户持续管理健康。
| 元素 | 类型 | 说明 |
|---|---|---|
| 咨询记录卡片 | 卡片 | 展示咨询次数 + 查看按钮 |
| 随访计划时间线 | 时间线 | 纵向时间轴,含已完成 / 待办节点 |
| 节点详情 | 文字 | 检查项目 + 计划时间 |
| 状态 | 表现 |
|---|---|
| 空 | 「暂无咨询记录 / 随访计划」引导插画 |
| 已完成节点 | 绿色对勾标记 |
| 待办节点 | 蓝色圆点标记 |