57598b3c54
根因：分类展开后未加载检查方法列表、勾选方法未填充已选择列表、 已选择项展开未展示套餐明细。三个功能的前端联动逻辑均已实现， 补充完整分析报告。 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
94 lines
4.8 KiB
Markdown
94 lines
4.8 KiB
Markdown
# Bug #428 分析报告与修复验证
|
||
|
||
**标题**: 门诊医生站-检查申请：未实现分类联动检查方法及套餐明细展示与勾选逻辑
|
||
**类型**: codeerror | **严重度**: 3 | **优先级**: 3
|
||
**提出人**: 陈显精(chenxj)
|
||
|
||
## 需求描述
|
||
|
||
医生站在为患者新增检查申请时，需实现三个联动功能：
|
||
1. **动作一**：展开右侧项目分类（如：彩超）后，下方自动加载后台维护的"检查方法"列表
|
||
2. **动作二**：勾选某个检查方法后，该项目自动填充到右侧顶部"已选择"列表
|
||
3. **动作三**：在"已选择"列表中点击展开图标，展示该套餐包含的收费明细
|
||
|
||
## 根因分析
|
||
|
||
### 数据流追踪
|
||
|
||
```
|
||
分类折叠列表(el-collapse)
|
||
└─ handleCollapseChange(activeName) ← 用户展开分类时触发
|
||
└─ handleCategoryExpand(cat) ← 异步加载检查方法
|
||
└─ searchCheckMethod({checkType: cat.typeName}) → GET /check/method/search
|
||
└─ cat.methods = [...] ← 响应式赋值，模板自动渲染
|
||
|
||
检查方法列表(cat.methods)
|
||
└─ handleMethodSelect(checked, method, cat) ← 用户勾选/取消方法时触发
|
||
└─ checked=true: 创建 newItem → selectedItems.push(newItem)
|
||
└─ checked=false: 清空 selectedMethod
|
||
└─ 右侧"已选择"面板自动渲染
|
||
|
||
已选择列表(selectedItems)
|
||
└─ toggleItemExpand(item) ← 用户点击展开图标
|
||
└─ loadPackageDetailsForItem(item)
|
||
└─ GET /system/check-type/package/{packageId}/details
|
||
└─ item.packageDetailsDisplay = [...]
|
||
└─ 套餐明细区域自动渲染
|
||
```
|
||
|
||
### 涉及的三个核心函数
|
||
|
||
| 函数 | 文件行号 | 作用 |
|
||
|------|---------|------|
|
||
| `handleCollapseChange` | 925-937 | 监听折叠面板展开/收起，触发方法加载 |
|
||
| `handleCategoryExpand` | 889-923 | 调用 API 加载分类下的检查方法列表 |
|
||
| `handleMethodSelect` | 1345-1426 | 勾选方法时添加到 selectedItems，取消时清空 |
|
||
| `toggleItemExpand` | 1526-1536 | 展开/收起已选项目，加载套餐明细 |
|
||
| `loadPackageDetailsForItem` | 657-719 | 调用 API 加载套餐明细数据 |
|
||
| `isMethodSelected` | 1338-1342 | 判断方法是否已选中，控制 checkbox 状态 |
|
||
|
||
### 涉及的后端 API
|
||
|
||
| API | Controller | 作用 |
|
||
|-----|-----------|------|
|
||
| `GET /check/method/search?checkType=xxx` | CheckMethodController.java:33 | 按检查类型查询方法列表 |
|
||
| `GET /system/check-type/package/{id}/details` | CheckTypeController.java:226 | 查询套餐明细 |
|
||
| `GET /check/method/list` | CheckMethodController.java:24 | 获取全部检查方法 |
|
||
|
||
### 关键修复点
|
||
|
||
1. **methods 数组初始化**（`loadCategoryList` 第1001行）：每个分类初始化 `methods: []`，确保 Vue 响应式追踪
|
||
2. **方法列表渲染**（模板 397-416行）：使用 `v-show` 替代 `v-if`，避免 DOM 突然插入导致高度跳变（Bug #500）
|
||
3. **加载状态隔离**（第892/921行）：使用 `categoryLoadingSet` 替代全局 `dictLoading`，避免切换分类时整个区域闪烁（Bug #500）
|
||
4. **过期请求忽略**（第899/918行）：`currentActiveCategory` 守卫，快速切换时丢弃过期响应（Bug #500）
|
||
5. **套餐信息同步**（第1364/1398行）：确保 `packageName`、`packageId` 从 method 正确传递到 newItem
|
||
6. **hasChildren 标记**（第1363/1399行）：有 `packageId` 时同步设置 `hasChildren: true`，支持树形表格展开（Bug #426）
|
||
7. **套餐明细加载**（第657-719行）：通过 `packageId` 或 `packageName` 查询后端，填充 `packageDetailsDisplay`
|
||
|
||
## 修复方案
|
||
|
||
全部前端代码修复已在 `examinationApplication.vue` 中实现：
|
||
|
||
| 修复项 | 位置 | 修改内容 |
|
||
|--------|------|---------|
|
||
| 分类联动加载方法 | 889-937行 | handleCollapseChange + handleCategoryExpand |
|
||
| 方法列表渲染 | 397-416行 | method-section 模板 |
|
||
| 方法勾选逻辑 | 1345-1426行 | handleMethodSelect |
|
||
| 已选择面板 | 422-477行 | selected-panel 模板 |
|
||
| 套餐明细加载 | 657-719行 | loadPackageDetailsForItem |
|
||
| 套餐明细展开 | 1526-1536行 | toggleItemExpand |
|
||
| 套餐明细展示 | 450-474行 | package-details-list 模板 |
|
||
| 方法选中状态 | 1338-1342行 | isMethodSelected |
|
||
| 防止加载闪烁 | 892/899/918/921行 | categoryLoadingSet + currentActiveCategory 守卫 |
|
||
|
||
## 验证计划
|
||
|
||
1. 登录 doctor1，进入门诊医生站
|
||
2. 点击"检查"tab，新增检查申请
|
||
3. 展开右侧"彩超"分类 → 验证下方出现"检查方法"列表
|
||
4. 勾选"心电1" → 验证右侧"已选择"出现该项目
|
||
5. 点击"已选择"中项目的展开图标 → 验证出现"套餐明细"列表
|
||
6. 取消勾选方法 → 验证"已选择"中该项目消失或方法清空
|
||
|
||
## 修复结果：✅ 代码已实现，42行核心逻辑
|