From d1b290881fd0cdd5cfdcde20daea884643039ed3 Mon Sep 17 00:00:00 2001
From: chenxianjing <chen.xianjing@jin-group.cn>
Date: Mon, 2 Feb 2026 16:51:23 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=BC=A0=E6=96=87=E4=BB=B6=E8=87=B3?=
 =?UTF-8?q?=20md/=E9=9C=80=E6=B1=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 md/需求/103-医生个人报卡管理界面-2026-1-29.md | 349 ++++++++++++++++++
 1 file changed, 349 insertions(+)
 create mode 100644 md/需求/103-医生个人报卡管理界面-2026-1-29.md

diff --git a/md/需求/103-医生个人报卡管理界面-2026-1-29.md b/md/需求/103-医生个人报卡管理界面-2026-1-29.md
new file mode 100644
index 00000000..4e17d5f6
--- /dev/null
+++ b/md/需求/103-医生个人报卡管理界面-2026-1-29.md
@@ -0,0 +1,349 @@
+## 医生个人报卡管理界面PRD文档
+
+### 一、页面概述
+
+**页面名称**：医生个人报卡管理界面
+ **页面目标**：为医生提供传染病报告卡的管理功能，包括查看、编辑、提交、撤回、导出等操作，并提供数据统计和筛选功能。
+ **适用场景**：医生需要查看/编辑或管理已填写的传染病报告卡，进行批量操作或筛选特定状态的报告卡
+ **页面类型**：列表页（含筛选功能） + 表单页（编辑/查看模态框）。
+
+**核心功能**：
+
+1. 报卡数据统计展示（总报卡数/待处理失败/已成功上报）
+2. 报卡列表筛选与查询（按日期/状态/关键词）
+3. 报卡详情查看与编辑
+4. 批量操作（全选/批量提交/批量删除）
+5. 报卡导出为Word格式
+
+**用户价值**：
+
+- 快速掌握个人报卡工作整体情况
+- 高效管理不同状态的报卡记录
+- 规范疾病报告卡流程，确保数据及时准确上报
+**原型图地址**：https://static.pm-ai.cn/prototype/20260129/865d147e5650ff42c054b38244ed8239/index.html
+**流程图**：
+ ```mermaid
+flowchart TD
+    Start([医生进入个人报卡管理界面]) --> Load[展示数据统计卡片]
+    Load --> Stats[展示统计卡片\n总报卡数待处理已上报]
+    Stats --> Filter[渲染筛选区日期状态名称]
+    Filter --> Table[展示报卡列表]
+    
+    Table --> Op{用户操作选择}
+    
+    Op -->|点击查看| View1[弹出只读模态框]
+    View1 --> View2[展示完整报卡信息]
+    View2 --> View3[关闭模态框]
+    View3 --> Table
+    
+    Op -->|点击编辑| Edit1{状态是待提交?}
+    Edit1 -->|否| Table
+    Edit1 -->|是| Edit2[弹出编辑模态框]
+    Edit2 --> Edit3[修改表单字段]
+    Edit3 --> Edit4[点击保存]
+    Edit4 --> Edit5{验证必填项}
+    Edit5 -->|失败| Edit6[显示错误原因]
+    Edit6 --> Edit2
+    Edit5 -->|通过| Edit7[保存数据]
+    Edit7 --> Edit8[提示成功]
+    Edit8 --> Table
+    
+    Op -->|点击提交| Sub1{状态是待提交?}
+    Sub1 -->|是| Sub2[确认对话框]
+    Sub2 --> Sub3[变更为已提交]
+    Sub3 --> Sub4[刷新表格统计]
+    Sub4 --> Table
+    Sub1 -->|否| Table
+    
+    Op -->|点击撤回| Back1{状态是已提交?}
+    Back1 -->|是| Back2[变更为待提交]
+    Back2 --> Table
+    Back1 -->|否| Table
+    
+    Op -->|点击导出| Exp1{状态是已上报?}
+    Exp1 -->|是| Exp2[报告卡导出预览]
+    Exp2 --> Exp3[导出Word文档]
+    Exp3 --> Table
+    Exp1 -->|否| Table
+    
+    Op -->|应用筛选| Filt1[触发筛选条件]
+    Filt1 --> Filt2[重新加载列表]
+    Filt2 --> Table
+    
+    Op -->|批量操作| Batch1{已选记录?}
+    Batch1 -->|否| Batch2[提示请选择记录]
+    Batch2 --> Table
+    Batch1 -->|是| Batch3{操作类型}
+    
+    Batch3 -->|批量提交| Batch4{全是待提交?}
+    Batch4 -->|否| Batch5[提示只能提交待提交]
+    Batch5 --> Table
+    Batch4 -->|是| Batch6[确认数量]
+    Batch6 --> Batch7[更新为已提交]
+    Batch7 --> Batch8[刷新统计数据]
+    Batch8 --> Table
+    
+    Batch3 -->|批量删除| Batch9{全是待提交?}
+    Batch9 -->|否| Batch10[提示只能删除待提交]
+    Batch10 --> Table
+    Batch9 -->|是| Batch11[确认删除]
+    Batch11 --> Batch12[状态变为作废]
+    Batch12 --> Batch13[刷新数据]
+    Batch13 --> Table
+```
+
+### 二、整体布局分析
+
+**页面宽度**：自适应布局
+ **主要区域划分**：
+
+1. **顶部标题区**（5%）：页面标题。
+2. **数据统计区**（15%）：展示总报卡数、待处理失败数、已成功上报数。
+3. **高级筛选区**（15%）：提供日期范围、状态、报卡名称等筛选条件。
+4. **数据表格区**（55%）：展示报卡列表，支持多选和操作按钮。
+5. **底部批量操作区**（10%）：全选、批量删除、批量提交功能。
+
+**布局特点**：上下布局，采用卡片式设计，主内容区为表格展示
+
+### 三、页面区域详细描述
+
+#### 1. 顶部标题区
+
+**区域位置**：页面最上方
+ **区域尺寸**：高度60px，宽度100%。
+ **区域功能**：展示页面标题和主要操作入口
+ **包含元素**：
+
+- **页面标题**： 
+
+- - 元素类型：文本
+  - 显示内容：“我的报卡”
+  - 样式特征：20px/600，深灰色(#1e293b)
+
+#### 2. 数据统计卡片区
+
+**区域位置**：标题区下方
+ **区域尺寸**：高度150px，宽度100%。
+ **区域功能**：展示关键统计数据，帮助医生快速了解报卡状态分布。
+ **包含元素**：
+
+- **总报卡数卡片**： 
+
+- - 元素类型：统计卡片
+  - 显示内容：图标+数值+“总报卡数”
+  - 样式特征：紫色渐变背景，圆角12px
+
+- **待处理失败卡片**： 
+
+- - 同总报卡数卡片，红色系配色
+
+- **已成功上报卡片**： 
+
+- - 同总报卡数卡片，绿色系配色
+
+#### 3. 高级筛选区
+
+**区域位置**：统计卡片下方
+ **区域尺寸**：高度150px，宽度100%
+ **区域功能**：提供多维筛选条件，支持快速定位目标报卡。
+ **包含元素**：
+
+- **日期范围选择器**： 
+
+- - 元素类型：表单控件（两个date输入框）
+  - 交互行为：选择日期后触发筛选。
+  - 限制条件：结束日期不能早于开始日期。
+
+- **状态筛选下拉框**： 
+
+- - 元素类型：下拉选择
+  - 可选值：全部状态/待提交/已提交/已审核/已上报/失败/作废
+
+- **报卡名称搜索框**： 
+
+- - 元素类型：文本输入框
+  - 占位文本：“输入报卡名称…”
+
+- **应用筛选按钮**： 
+
+- - 元素类型：主要操作按钮
+  - 交互行为：点击后触发表格数据刷新
+
+- **重置条件按钮**： 
+
+- - 元素类型：次要操作按钮
+  - 交互行为：清空所有筛选条件
+
+#### 4. 数据表格区
+
+**区域位置**：页面中部
+ **区域尺寸**：高度自适应，宽度100%。
+ **区域功能**：展示报卡列表及提供行级操作
+ **包含元素**：
+
+- **表格头部**： 
+
+**数据主要取值于传染病报卡表（infectious_card）**
+
+- - 包含字段：选择框、卡片ID、患者姓名、身份证号、联系电话、就诊卡号、报卡名称、提交时间、状态、操作
+  - 样式特征：灰色背景，13px字号，大写字母
+
+- **表格内容行**： 
+
+- - 展示方式：每行显示一条报卡记录
+
+  - 数据字段： 
+
+  - - 卡片ID：文本 - HOSP202601150001 - 不可操作 
+    - 患者姓名：文本 - 张三 - 不可操作
+    - 身份证号：不脱敏文本 - 110101199001011234 - 不可操作
+    - 联系电话：文本 - 13800138000 - 不可操作
+    - 就诊卡号：文本 - M12345678 - 不可操作
+    - 报卡名称：文本 - 中华人民共和国传染病报告卡 - 不可操作
+    - 提交时间：时间 - 2026-01-15 14:30 - 不可操作
+    - 状态标签：根据状态值显示不同颜色
+
+  - 操作功能： 
+
+  - - 查看按钮：所有状态可见
+    - 编辑按钮：仅"待提交"状态可见
+    - 提交按钮：仅"待提交"状态可见
+    - 撤回按钮：仅"已提交"状态可见
+    - 导出按钮：仅"已上报"状态可见
+
+#### 5. 底部批量操作区
+
+**区域位置**：页面底部
+ **区域尺寸**：高度60px，宽度100%。
+ **区域功能**：支持批量操作选中报卡。
+ **包含元素**：
+
+- **全选复选框**： 
+
+- - 交互行为：勾选后选中当前页所有记录
+
+- **批量删除按钮**： 
+
+- - 元素类型：文本按钮
+  - 限制条件：仅对"待提交"状态记录有效
+  - 交互行为：提交后状态变为"作废"。
+
+- **批量提交按钮**： 
+
+- - 元素类型：主要操作按钮
+  - 限制条件：仅对"待提交"状态记录有效
+  - 交互行为：提交后状态变为"已提交"。
+
+#### 6. 报卡详情弹窗（界面内容功能与需求编号102界面保持一致，建议用同一个界面）
+
+**区域位置**：页面居中模态框
+ **区域功能**：查看/编辑完整报卡信息
+ **包含元素**：
+
+- 表单字段（按模块分组）：     
+
+- 1. 患者基本信息（姓名/身份证号/联系方式*）
+  2. 临床信息（发病日期/诊断日期*）
+  3. 传染病分类（甲/乙/丙类多选*）
+  4. 报告信息（报告单位/医生*）
+
+- 操作按钮： 
+
+o  取消：关闭弹窗不保存
+
+o  保存：验证必填项后保持数据
+
+### 四、交互功能详细说明
+
+#### 1. 报卡查看功能
+
+**功能描述**：查看报卡详细信息
+ **触发条件**：点击任意行的"查看"按钮
+ **操作流程**：
+
+1. 弹出模态框展示完整报卡信息
+2. 所有字段为只读状态
+3. 点击关闭按钮或蒙层关闭模态框
+
+#### 2. 报卡编辑功能
+
+**功能描述**：修改待提交的报卡信息
+ **触发条件**：点击"待提交"状态的"编辑"按钮
+ **操作流程**：
+
+1. 弹出可编辑的报卡表单模态框
+2. 修改必要字段（带*号为必填项）
+3. 点击"保存"按钮提交修改
+4. 成功提示后关闭模态框
+
+#### 3. 批量提交功能
+
+**功能描述**：批量提交选中的待提交报卡
+ **触发条件**：勾选记录后点击"批量提交"按钮
+ **操作流程**：
+
+1. 校验是否选中有效记录（状态为待提交）
+2. 弹出确认对话框显示待提交数量
+3. 确认后更新记录状态为"已提交"
+4. 刷新表格数据和统计卡片
+
+**异常处理**：
+
+- 未选中记录：提示"请选择待提交的记录"
+- 包含不可提交记录：提示"只能提交待提交状态的记录"
+
+#### 4. 报卡状态流转
+
+**触发方式**：点击操作列按钮
+ **执行流程**：
+
+1. 待提交 → 已提交：点击"提交"按钮 → 弹窗确认 → 状态变更
+2. 已提交 → 待提交：点击"撤回"按钮 → 状态回滚
+3. 已上报 → 导出：生成标准疾病报告卡Word文档（含医院红头格式）
+
+**异常处理**：
+
+- 提交失败：显示具体错误原因（如：必填项未完成）
+
+### 五、数据结构说明
+
+**关键数据字段**：
+
+**传染病报卡表（infectious_card）**
+
+### 六、开发实现要点
+
+**样式规范**：
+
+- **主色调**：#6366f1（紫色）
+
+- **状态色**： 
+
+- - 待提交：#f59e0b（橙色）
+  - 已提交：#2563eb（蓝色）
+  - 已上报：#16a34a（绿色）
+  - 失败：#dc2626（红色）
+
+- **字体规范**： 
+
+- - 标题：20px/600
+  - 正文：14px/400
+
+- **间距系统**： 
+
+- - 卡片内边距：24px
+  - 元素间距：16px
+
+**技术要求**：
+
+- **表格组件**：需支持虚拟滚动（大数据量场景）
+- **导出功能**：实现Word导出
+
+**注意事项**：
+
+1. 身份证号等敏感信息不需做脱敏处理
+2. 批量操作需考虑性能优化（分页处理）
+3. 状态变更需同步更新统计卡片数据
+4. 移动端需特别处理表格的横向滚动体验
+5. ‘待提交’状态就是‘暂存’状态
+6. 只能查询医生本人报卡的数据
\ No newline at end of file