AI-Health/docs/superpowers/specs/2026-07-17-doctor-admin-ui-unification-design.md

医生端与管理员端 UI 统一设计

目标

在不改变现有业务流程、接口协议和导航结构的前提下，使医生端与管理员端的全部现有页面统一到患者端当前的视觉语言，并在修改过程中进行源码级逻辑检查。

范围

• 覆盖 health_app/lib/pages/doctor/ 下全部现有页面。
• 覆盖 health_app/lib/pages/admin/ 下全部现有页面。
• 覆盖医生端和管理员端侧边栏及其直接使用的共用展示组件。
• 复用患者端已有的 AppColors、主题、卡片阴影、圆角、渐变和页面背景。
• 检查前端状态处理、异步调用、空数据、错误反馈、导航和字段映射中的明显逻辑错误。
• 检查后端与医生端、管理员端直接相关的鉴权、数据归属、参数验证和异常处理。

不在范围内

• 不新增医生端或管理员端业务功能。
• 不修改 API 协议、数据库结构或现有权限规则，除非发现明确的高风险缺陷并经用户另行确认。
• 不重做患者端。
• 不截图、不做视觉回归平台、不进行真机测试或发布。
• 不为了视觉统一进行无关的大规模重构。

视觉方案

页面骨架

• 页面使用患者端的浅灰背景和统一安全区处理。
• 顶部标题栏保持轻量、透明或白色表面，标题、返回和菜单图标统一使用患者端文字颜色。
• 页面内容统一使用 16 像素水平边距；主要区块之间保持稳定的 12–16 像素间距。

卡片与操作

• 内容容器统一为白色圆角卡片，使用 AppColors.borderLight 和轻阴影。
• 主操作使用患者端紫蓝主渐变；次操作使用浅色表面和边框；危险操作使用现有错误色。
• 列表项、统计卡片、筛选控件、表单和弹窗使用同一套圆角、文字层级和状态色。
• 医疗业务的警告、成功、待处理和异常状态继续保持语义颜色，不用装饰色覆盖含义。

状态反馈

• 加载状态保留明确进度反馈，避免空白页面。
• 空状态说明当前没有数据，并保留用户可执行的下一步操作（如果原流程已有操作）。
• 错误状态显示可理解的中文信息和重试入口（如果原页面已有重载能力）。
• 长文本和动态数据使用弹性布局与省略处理，降低窄屏溢出风险。

组件边界

• 优先使用现有 AppColors 和 AppTheme，不建立第二套颜色系统。
• 仅在多个医生端和管理员端页面确实重复时，新增小型共用展示组件，例如页面标题、区块卡片、状态占位和标签。
• 共用组件只负责展示与交互外观，不持有业务状态、不直接调用服务。
• 页面继续通过现有 Riverpod Provider 和 Service 获取数据，避免视觉改造改变数据流。

逻辑检查原则

• UI 改造过程中检查 mounted、重复提交、加载状态复位、空集合、空字段、分页/筛选和导航返回后的刷新。
• 检查医生与管理员 API 是否要求正确角色，并验证用户或患者数据归属。
• 明确的低风险页面错误可随 UI 修改修正；涉及鉴权、删除、隐私、医疗数据或接口行为的缺陷先记录并向用户说明，不擅自改变规则。
• 已知的全局上线风险单独列入最终检查报告，不与本次视觉修改混在一起扩大范围。

验证

• 运行 flutter analyze。
• 运行受修改页面影响的现有相关测试；不新增复杂测试框架。
• 运行一次 Android 编译验证，确认 Flutter 与原生依赖能完成编译。
• 不运行截图测试、真机测试、iOS 构建或发布流程。
• 最终说明修改过的页面、发现的逻辑问题、验证结果和仍需人工确认的事项。

完成标准

• 医生端和管理员端全部现有页面在颜色、卡片、间距、按钮、文字层级和状态反馈上与患者端一致。
• 原有页面入口、导航、数据加载和操作流程不被视觉改造改变。
• 修改代码通过静态分析、相关测试和一次 Android 编译验证。
• 逻辑检查结果按严重程度清晰列出，高风险业务问题没有未经确认的行为变更。