复诊管理设计.md 6.9 KB

复诊管理(Follow-up)前端设计提取

本文档从当前项目代码中提取并集中说明与“复诊管理”相关的前端页面、导航、交互与现状(哪些页面已实现、哪些页面为占位/待实现),并给出必要的接口建议与 UI 行为说明,方便前后端对齐与产品设计对接。


概览

当前仓库涉及与“复诊/预约/随访”相关的前端位置:

  • 医生侧

    • pages/doctor/index/index.vue(医生首页)
    • 功能入口:功能卡片 -> “复诊管理”(点击跳转 /pages/doctor/manage/followup
    • 今日提醒卡片展示 todayReminders.followUpCount(待处理复诊数量)
    • 活动区展示 patientActivities,其中某些项描述会提到“完成了今日复诊”作为活动示例
    • pages/doctor/index/my-patients.vue(我的病人)
    • 为每个病人提供 “邀请复诊” 按钮(当前为占位,弹窗提示“邀请复诊功能开发中”)
    • pages/doctor/manage/index.vue(后台管理)
    • 菜单项包含健康资讯 / 快捷问题 / 药品管理,暂无具体复诊管理页面(仅占位)
  • 患者侧

    • pages/patient/index/my-doctor.vue(我的医生)
    • 提供“预约复诊”按钮(当前占位,弹窗提示“预约功能开发中”)
    • pages/patient/index/index.vue(患者首页)
    • 页面卡片中有“医生预约 / 一键预约复诊”入口(多为占位)
  • 家属

    • pages/patient-family/index/my-family.vue(我的家人)
    • 提供“邀请复诊”按钮(占位)
  • 健康数据提醒触发

    • pages/patient/health/details/*(血压 / 血糖 / 心率 / 体格)
    • 当用户把某些指标值录入超阈值时,会通过 uni.showModal 弹窗建议“建议尽快复诊” —— 这是在数据输入端触发复诊建议的逻辑点。

现有 UI 元素与交互(逐页面细节)

1. pages/doctor/index/index.vue(医生首页)

  • 位置/导航
    • 功能卡片(右侧): 点击 复诊管理 调用 onItemClick('复诊管理') 并导航至 '/pages/doctor/manage/followup'
    • 卡片内文字:"复诊管理" / 子标题:"安排复诊随访"
  • 今日提醒(左上)
    • 显示 todayReminders.followUpCount(数字)与标签 "待处理复诊"
    • 点击该提醒也会跳转 /pages/doctor/manage/followup
  • 活动卡
    • patientActivities list,示例中包含描述如 "患者李四完成了今日复诊"。这是显示最近复诊/活动的 UI 区块。

2. pages/doctor/index/my-patients.vue(我的病人)

  • 每个病人条目(.patient-card)中的操作按钮:
    • "健康数据" -> 跳转 /pages/public/health/index?patientId=...&bindingType=DOCTOR
    • "健康动态" -> 占位
    • "发送提醒" -> 占位
    • "邀请复诊" -> 占位(弹窗提示)
  • Invite 按钮逻辑
    • 目前 inviteRevisit(patient) 仅调用 uni.showToast({ title: '邀请复诊功能开发中' }),无后端调用或模态输入。

3. pages/patient/index/my-doctor.vue(我的医生)

  • 操作按钮:
    • "预约复诊" -> makeAppointment() -> 占位(弹窗)
    • "联系医生" -> 占位
    • "绑定医生" -> 占位(但绑定可由 userBinding.create 实现)
  • 用户故事期望:点击预约 -> 打开预约表单/选择时间 -> 提交 -> 后端创建预约 -> 跳转到预约详情或显示成功消息

4. pages/patient-family/index/my-family.vue(我的家人)

  • my-patients.vue:提供 "邀请复诊" 按钮 -> 目前为占位

5. pages/patient/health/details/*(指标页面)

  • confirmAdd() 或提交数据时:
    • 对异常阈值(如 血压 > 140/90、空腹血糖 > 7.0)弹窗 uni.showModal({title: '异常', content: '建议尽快复诊'}) 提醒病人。
    • 该弹窗仅提示,不包含直接预约/联系医生按钮。

推荐复诊流程(前端设计建议)

为了把现有占位功能逐步实现,建议采用以下最小可用流程:

  1. 医生端:复诊管理 列表
    • 页面 URL:/pages/doctor/manage/followup(当前缺失,需创建)
    • 列表展示:待处理/已完成的复诊邀请(字段:id、patientName、patientAvatar、status, scheduledTime, createdAt)
    • 操作:查看 -> 详情页(可触发: 同意、拒绝、变更时间、发送消息)
    • 新增:医生可以手动发起 邀请复诊(直接从 我的病人 发起),或基于预设规则(异常数据触发复诊建议)创建新的复诊任务
  2. 医生向患者发起复诊邀请
    • 弹窗表单:选择患者、选择/输入时间、可选备注
    • 后端:POST /followup/invite
    • 前端:调用后刷新 followup 列表并更新 todayReminders.followUpCount
  3. 患者端:预约/接收复诊邀请
    • 患者接收邀请后:可接受/拒绝或重新选择时间
    • 管理患者预约列表:/pages/patient/appointments(未来新增)
  4. 健康数据自动建议复诊
    • confirmAdd() 检测到异常时,除了 showModal,增加 "现在预约" 按钮或 "联系医生",直接跳转到 my-doctor -> 预约交互,或弹出预约表单

已知数据/接口(前端已使用或建议)

  • 已在页面调用但未封装到 src/api
    • GET https://wx.baiyun.work/doctor/today_reminders —— 返回 { followUpCount, abnormalCount }
    • GET https://wx.baiyun.work/doctor/patient_activities —— 返回列表活动
  • 建议新增(后端与前端协作)接口:
    • GET /followup/list?doctorUserId=...&status=... -- 复诊列表
    • POST /followup/invite -- 邀请复诊(doctor -> patient)
    • body: { patientUserId, scheduledTime, remark }
    • POST /followup/accept -- 病人接受邀请
    • POST /followup/decline -- 病人拒绝邀请
    • GET /appointment/list?userId=... -- 患者预约列表
    • POST /appointment/create -- 患者创建预约

UI/UX 注意点与改进建议

  • inviteRevisit / makeAppointment 的占位按钮应支持模态表单输入(时间、备注),并在提交成功后把患者活动和医生 todayReminders.followUpCount 更新。
  • user-binding 集成:邀请/预约时须确保 patientUserId 的可用性与安全权限(仅当医生与患者绑定时允许邀请)。
  • 在异常值提示中(showModal),建议加入可操作按钮(如“现在预约”)以提升转化。

当前缺失/待实现要点(行动项)

  • 创建 pages/doctor/manage/followup.vue 页面骨架,并实现最小列表展示及跳转功能。
  • src/api 中新增 followup.ts,封装 list/invite/accept/decline 接口并使用统一请求包装 src/api/request.ts
  • my-patientsmy-family 中把 inviteRevisit 从占位修改为调用 followup/invite,并添加预约对话框(time picker)
  • 在患者my-doctor 页面实现预约交互:打开选择时间 -> POST /appointment/create
  • 在异常检测逻辑(数据页)添加“立即预约”动作:跳转到预约流程或直接发起