## 报卡管理界面PRD文档

### 一、页面概述

**页面名称**：报卡管理界面
 **页面目标**：提供传染病报卡的审核、管理、筛选及批量操作功能，帮助疾控人员高效完成报卡审核工作
 **适用场景**：疾控中心工作人员日常审核医疗机构上报的传染病病例

- 医院CDC管理员日常审核传染病报卡
- 批量处理待审核/退回的报卡
- 按条件筛选统计报卡数据
       **页面类型**：数据管理列表页（含详情抽屉）

**核心功能**：

1. 报卡数据概览统计（今日待审/本月失败/本月成功/本月上报）
2. 多维度筛选报卡数据（时间/状态/科室/来源等）
3. 报卡列表展示与批量操作（审核/退回/导出）
4. 报卡详情查看与单条审核
5. 审核记录追溯与意见填写

**用户价值**：

- 疾控人员可快速处理待审报卡
- 支持批量审核提升工作效率
- 完整记录审核过程便于追溯
- 多维度筛选快速定位目标报卡
**原型图地址**：https://static.pm-ai.cn/prototype/20260206/cc9991b716df0303fa3459042e33a1ea/index.html
**流程图**：
```mermaid
flowchart TD
    A["进入报卡管理界面"] --> B["查看报卡概览统计"]
    B --> C["点击统计卡片"]
    C --> D["悬停统计卡片"]
    D --> E["自动设置筛选项"]
    B --> F["鼠标悬停"]
    F --> G["筛选报卡数据"]
    G --> H["卡片上浮+阴影"]
    E --> I["设置筛选条件"]
    I --> K["点击重置按钮"]
    K --> J["清空条件"]
    I --> L["点击查询按钮"]
    L --> M["触发筛选"]
    M --> N["操作报卡列表"]
    N --> O["勾选报卡"]
    N --> P["处理单条报卡"]
    O --> Q["批量操作报卡"]
    P --> R["点击单条审核"]
    P --> S["点击单条查看"]
    Q --> T["点击批量审核"]
    Q --> U["点击批量退回"]
    R --> V{"报卡状态"}
    S --> W{"报卡状态"}
    V -- 已审核 --> X["打开查看抽屉"]
    V -- 待审核/失败 --> Y["校验选择状态"]
    W -- 任意 --> X
    T --> Z["校验选择状态"]
    U --> AA["校验选择状态"]
    Y -- 选择有效 --> AB["打开审核抽屉"]
    AB-->AN["展示审核记录"]
    AB-->AO["展示审核记录"]
    Y -- 未选择 --> AC["提示请选择报卡"]
    Z -- 选择有效 --> AD{"包含已审核项"}
    Z -- 未选择 --> AE["提示请选择报卡"]
    AD -- 是 --> AF["提示只能选择待审核报卡"]
    AD -- 否 --> AG["弹出审核弹窗"]
    AA -- 选择有效 --> AH{"包含已审核项"}
    AA -- 未选择 --> AI["提示请选择报卡"]
    AH -- 是 --> AF
    AH -- 否 --> AJ["弹出退回弹窗"]
    AG --> AK["加载报卡详情"]
    AJ --> AL["加载报卡详情"]
    AK -- 加载失败 --> AM["提示数据加载失败"]
    AL -- 加载失败 --> AM
    AK -- 成功 --> AN["展示审核记录"]
    AL -- 成功 --> AO["展示审核记录"]
    AN --> AP["填写审核意见"]
    AO --> AQ["填写退回原因"]
    AP --> AR{"意见是否为空"}
    AQ --> AS{"原因是否为空"}
    AR -- 是 --> AT["红字提示必填"]
    AS -- 是 --> AU["红字提示必填"]
    AR -- 否 --> AV["点击确认审核"]
    AS -- 否 --> AW["点击确认退回"]
    AV --> AX["点击审核通过"]
    AW --> AY["点击退回修改"]
    AX --> AZ["更新报卡状态"]
    AY --> BA["更新报卡状态"]
    AZ --> BB["生成审核记录"]
    BA --> BC["生成审核记录"]
    BB --> BD["按钮置灰"]
    BC --> BD["按钮置灰"]
    AX --> BE["提示操作失败，请检查网络"]
    AY --> BE
    AZ --> BF["刷新表格数据"]
    BA --> BF
    BF --> BG["刷新行状态"]
    BG --> BH["结束"]
    BE --> BH
```


### 二、整体布局分析

**页面宽度**：自适应布局
 **主要区域划分**：

1. **顶部导航栏**（固定高度60px）
2. **报卡管理概览区**（统计卡片+快捷操作，高度自适应）
3. **筛选控制区**（多条件组合筛选，折叠式布局）
4. **报卡列表区**（表格展示，占主体60%高度）
        **布局特点**：上下层级结构，筛选区支持折叠/展开
5. **抽屉详情区**



### 三、页面区域详细描述

#### 1. 顶部导航栏

**区域位置**：页面顶部固定
 **区域尺寸**：高度60px，100%宽度
 **区域功能**：展示系统标识和用户信息
 **包含元素**：

- **系统Logo** 

- - 元素类型：图标+文字组合
  - 显示内容："CDC"图标+"报卡管理"文字
  - 样式特征：蓝色主色调(#4a6fa5)，左侧对齐

#### 2. 报卡管理概览

**区域位置**：导航栏下方

**区域尺寸**：100%宽度，自适应高度
 **区域功能**：关键数据统计与快速操作入口
 **包含元素**：

- **统计卡片组**（4个） 

- - 展示方式：网格布局（4列）
  - 数据字段： 

| **字段名**   | **类型** | **示例值** | **可操作** | **计算逻辑**              |
| ------------ | -------- | ---------- | ---------- | ------------------------- |
| 今日待审核   | 数字     | 12         | 可点击     | 当天created_at+待审状态   |
| 本月审核失败 | 数字     | 3          | 可点击     | 当月created_at+失败状态   |
| 本月审核成功 | 数字     | 2          | 可点击     | 当月created_at+成功状态   |
| 本月已上报   | 数字     | 156        | 可点击     | 当月created_at+已上报状态 |

o  交互行为：

- - - 悬停：卡片上浮5px+阴影加深
    - 点击：自动设置对应筛选项

  - 样式特征：左侧状态色条（蓝/橙/红/绿）

#### 3. 筛选控制区

**区域功能**：多维度组合筛选报卡数据

**区域尺寸**：100%宽度，高度自适应（展开状态）
 **包含元素**：

- **筛选条件组**（横向排列→移动端垂直堆叠） 

- - 登记来源（下拉单选）：全部/门诊/住院/急诊/体检
  - 上报时间范围（双日期选择器）--默认值：最近一个月
  - 患者姓名（文本输入）
  - 审核状态（下拉单选）：全部/待审核/审核通过/审核失败/已上报
  - 上报科室（树形下拉多选）--全部科室/取值于《科室管理》adm_organization表

- **操作按钮**： 

- - “查询”（主按钮，触发筛选）
  - “重置”（次要按钮，清空条件）

#### 4. 报卡列表区

**区域功能**：展示报卡数据及操作入口
 **包含元素**：

- **表格头部** 

- - 全选复选框（联动所有行选择状态）
  - 列标题：报卡名称/病种名称/患者信息等11列

- **快捷操作按钮组** 

- - 包含按钮： 

  - - “批量审核”蓝色按钮，（需选择条目）点击弹出填写审核备注弹窗
    - “批量退回修改”橙色警示按钮，（需选择条目）点击弹出退回原因填写弹窗
    - “导出当前”（按筛选条件）

- **表格行** 

- - 数据字段：

取值于传染病报卡表（infectious_card）

| **列名** | **数据类型** | **示例值**       | **说明**        |
| -------- | ------------ | ---------------- | --------------- |
| 选择框   | boolean      | -                | 带全选功能      |
| 报卡名称 | string       | 传染病报告卡     | -               |
| 病种名称 | string       | 病毒性肝炎       | -               |
| 报卡编号 | string       | HOSP202601150001 | 唯一标识        |
| 患者姓名 | string       | 张某某           | 脱敏显示        |
| 性别     | enum         | 男               | 男/女/未知      |
| 年龄     | number       | 32               | -               |
| 上报科室 | string       | 儿科             | -               |
| 登记来源 | string       | 门诊             | -               |
| 上报时间 | datetime     | 2026-01-31 09:23 | -               |
| 状态     | badge        | 待审核           | 待审核<->已提交 |
| 操作     | button       | 审核/查看        | 根据状态禁用    |

 

- - 行操作按钮：      

  - - “审核”（主按钮，打开可编辑抽屉）
    - “查看”（次要按钮，打开只读抽屉）

  - 交互规则： 

  - - 已审核通过的报卡禁用"审核"按钮
    - 行hover时显示浅蓝色背景

  - 分页功能： 

  - - 实现分页功能（可以设置每页5/10/20条）

#### 5. 抽屉详情区

**区域位置**：右侧滑出
 **区域尺寸**：自适应布局
 **包含元素**：

·    **报卡表单（****根据具体报卡登记的界面内容，比如《中华人民共和国传染病报告卡》内容和功能与需求编号102界面保持一致，建议用同一个界面）**

- - 字段分组： 

  - 1. 患者基本信息（姓名、身份证等）
    2. 临床信息（发病日期、诊断分类等）
    3. 疾病选择（甲/乙/丙类传染病复选框）
    4. 上报信息（报告单位、医生等）

·    **审核记录**

- - 展示方式：时间轴列表
  - 数据字段：时间、操作人、操作类型、意见

·    **操作按钮组**

- - 主按钮：审核通过（绿色）
  - 次按钮：退回修改（橙色）



### 四、交互功能详细说明

#### 1. 批量审核流程

**触发条件**：勾选多行后点击"批量审核"
 **操作流程**：

1. 系统校验：至少选择1条非"已通过"状态的报卡

2. 弹出审核弹窗（500px居中模态框）

3. 填写审核意见（必填）

4. 点击"确认审核"： 

5. 批量更新状态为"审核通过"，（自动批量写入每一条审核记录(插入infectious_audit 字段详表②、更改表infectious_card. Statu= 2和infectious_card.     update_time= now()））

6. 刷新表格数据

7. - 成功：更新状态为"审核通过"，添加审核记录
   - 失败：提示"审核失败，请检查网络"
   - 包含已审核项：提示"只能选择待审核报卡"
   - 未填写意见：阻止提交并红字提示

#### 2. 批量退回修改操作

**触发方式**：勾选多选框后点击"批量退回"
 **前置校验**：

- 至少勾选一条非"已审核"状态报卡
- 选中已审核报卡时提示"只能操作待审核报卡"

**执行流程**：

1. 弹出模态框要求填写退回原因（必填）填写退回原因：阻止提交并红字提示
2. 提交后批量更新选中报卡状态
3. 每条生成审核记录（①、插入infectious_audit 字段详表②、更改表infectious_card. Statu=5和infectious_card. update_time= now()）

#### 3.单卡审核流程

**触发方式**：点击操作列"审核"按钮
 **状态控制**：

- 待审核/审核失败：可操作
- 审核通过：按钮禁用
       **执行流程**：

1. 右侧滑出审核抽屉
2. 从行数据获取报卡ID自动填充患者报卡信息（异步加载报卡详情数据）
3. 展示历史审核记录（如有）
4. 填写审核意见/退回原因
5. 点击"审核通过"或"退回修改"
6. 更新表格行状态（生成审核记录（①、插入infectious_audit     字段详表②、更改表infectious_card. Statu=2/5和infectious_card.     update_time= now()））

**异常处理**：

·    数据加载失败：提示"数据加载失败，请重试"

**·**    重复提交：按钮置灰防止重复点击

**状态变化**：

- 审核通过：表格行变绿色，按钮禁用，状态变成“审核通过”
- 退回修改：表格行变橙色，生成退回记录，状态变成“审核失败”审核失败<->退回

**数据校验**：

- 必填字段红框提示
- 身份证号格式校验
- 日期逻辑校验（发病日期≤诊断日期）

#### 4. 筛选查询功能

**触发方式**：点击"查询"按钮
 **查询逻辑**：

- 登记来源：精确匹配
- 患者姓名：模糊匹配
- 时间范围：闭区间查询
- 状态筛选：精确匹配
- 上报科室：多选
       **性能优化**：
- 500ms防抖处理
- 分页加载（可以设置每页5/10/20条）实现分页功能

#### 5. 报卡详情查看

**触发条件**：点击行"查看"按钮
 **抽屉内容**：

- 只读表单（包含所有报卡字段）
- 审核记录时间轴（倒序展示）
- 关闭按钮（右上角×图标）
       **数据加载**：根据行数据获取报卡ID自动填充患者报卡信息（异步加载报卡详情数据）

#### 6. 筛选联动逻辑

| **操作**               | **系统响应**                               |
| ---------------------- | ------------------------------------------ |
| 点击"今日待审核"统计卡 | 自动设置：   - 时间=当天   - 状态=待审核   |
| 本月审核失败           | 自动设置：   - 时间=本月   - 状态=审核失败 |
| 本月审核成功           | 自动设置：   - 时间=本月   - 状态=审核成功 |
| 本月已上报             | 自动设置：   - 时间=本月   - 状态=已上报   |



### 五、数据结构说明

**关键数据表**：

```
 
infectious_card 与报卡审核记录表（infectious_audit）采用 一对多 关联：
①  、一张报卡可经历多次审核（初审、复审、退回、重审等）。
②  、关联键：infectious_card.card_no → infectious_audit.card_id（FK）。
*infectious_card. Statu增加状态5退回=审核失败（当批量退回修改/退回修改时更改表infectious_card. Statu=5 and infectious_card. update_time= now()）
 
*infectious_audit 字段详表
```

| **字段名**        | **中文名称** | **取值说明**                                                 | **类型****(PG)** | **约束**                                 |
| ----------------- | ------------ | ------------------------------------------------------------ | ---------------- | ---------------------------------------- |
| audit_id          | 审核记录ID   | 主键，自增                                                   | BIGINT           | PRIMARY KEY                              |
| card_id           | 报卡ID       | 关联infectious_card.card_no                                  | BIGINT           | NOT NULL, FK                             |
| audit_seq         | 审核序号     | 第几次审核，从1开始                                          | SMALLINT         | NOT NULL, ≥1                             |
| audit_type        | 审核类型     | 1批量审核/2单审核通过/3批量退回修改/4单退回修改 /5其他       | CHAR(1)          | NOT NULL, IN('1','2','3','4','5')        |
| audit_status_from | 审核前状态   | 同infectious_card.status(0暂存/1已提交=待审核/2已审核=审核通过/3已上报/4失败/5退回=审核失败) | CHAR(1)          | NOT NULL, IN('0','1','2','3','4','5')    |
| audit_status_to   | 审核后状态   | 同上，审核后的新状态                                         | CHAR(1)          | NOT NULL, IN('0','1','2','3','4')        |
| audit_time        | 审核时间     | 精确到秒，当前时间戳                                         | TIMESTAMP        | NOT NULL, DEFAULT now()                  |
| auditor_id        | 审核人账号   | 登录账号                                                     | VARCHAR(20)      | NOT NULL                                 |
| auditor_name      | 审核人姓名   | 登录账号的姓名                                               | VARCHAR(50)      | NOT NULL                                 |
| audit_opinion     | 审核意见     | 审核意见简述                                                 | TEXT             |                                          |
| Reason_for_return | 退回原因     | 退回原因简述                                                 | TEXT             |                                          |
| fail_reason_code  | 失败原因码   | 字典：001必填项/002逻辑错误/003网络超时等                    | VARCHAR(20)      |                                          |
| fail_reason_desc  | 失败详情     | 详细描述，可空                                               | TEXT             |                                          |
| is_batch          | 是否批量     | 0单条审核/1批量审核                                          | BOOLEAN          | NOT NULL, DEFAULT false                  |
| batch_size        | 批量数量     | 批量时涉及报卡数                                             | INTEGER          | NOT NULL, DEFAULT 1, ≥1                  |
| created_time      | 记录创建时间 | 自动生成                                                     | TIMESTAMP        | NOT NULL, DEFAULT now()                  |
| updated_time      | 记录更新时间 | 自动更新                                                     | TIMESTAMP        | NOT NULL, DEFAULT now(), ON UPDATE now() |

```
 
```



### 六、开发实现要点

**样式规范**：

- **主色调**：`#4a6fa5`（导航栏/主按钮）

- **状态色**： 

- - 待审核：`rgba(74, 111, 165, 0.1)`
  - 审核失败：`rgba(231, 76, 60, 0.1)`

- **字体**： 

- - 标题：`16px/1.5 #333`
  - 表格内容：`14px/1.5 #666`

**注意事项**：

- 审核记录需永久保存不可删除



### 七、补充说明

1. **日期格式**：统一使用`YYYY/MM/DD`（符合医疗系统惯例）
2. **地址组件**：四级联动（省→市→区→街道）
3. **职业选项**：使用国家标准职业分类
4. **病种名称**：严格遵循《传染病报告卡》规范用词