82 lines
2.6 KiB
Markdown
82 lines
2.6 KiB
Markdown
|
# 医疗问诊 Agent Vue Demo
|
|||
|
|
|
|||
|
|
这是第一版 Demo 的 Vue 3 测试前端，用于展示和验证当前 FastAPI 后端已实现的问诊训练闭环。它不是最终生产 UI，但页面结构、接口封装和状态管理已按后续正式前端扩展保留边界。
|
|||
|
|
|
|||
|
|
## 技术栈
|
|||
|
|
|
|||
|
|
- Vue 3 + Vite + TypeScript
|
|||
|
|
- Pinia
|
|||
|
|
- Vue Router
|
|||
|
|
- Axios + Fetch SSE
|
|||
|
|
- 原生 CSS，移动端优先
|
|||
|
|
|
|||
|
|
## 启动
|
|||
|
|
|
|||
|
|
```powershell
|
|||
|
|
cd D:\Code\newfounder\medical-consultation-agent\frontend
|
|||
|
|
npm.cmd install
|
|||
|
|
npm.cmd run dev -- --host 127.0.0.1 --port 5173
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
访问：
|
|||
|
|
|
|||
|
|
```text
|
|||
|
|
http://127.0.0.1:5173
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
构建：
|
|||
|
|
|
|||
|
|
```powershell
|
|||
|
|
npm.cmd run build
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 后端配置
|
|||
|
|
|
|||
|
|
默认 API：
|
|||
|
|
|
|||
|
|
```text
|
|||
|
|
http://127.0.0.1:8000/api/v1
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
所有业务请求都会携带：
|
|||
|
|
|
|||
|
|
- `X-User-Id`
|
|||
|
|
- `X-Entry-Scene`
|
|||
|
|
|
|||
|
|
入口页可修改 `user_id`、API Base 和入口场景。默认 `user_id` 为 `demo_user_001`。
|
|||
|
|
|
|||
|
|
## 页面与功能
|
|||
|
|
|
|||
|
|
| 页面 | 路由 | 主要功能 |
|
|||
|
|
|---|---|---|
|
|||
|
|
| 入口 | `#/` | 配置 user_id/API Base，调用 Agent Hello |
|
|||
|
|
| 病例 | `#/cases` | 病例列表、病例详情、开始训练 |
|
|||
|
|
| 病例导入 | `#/import` | 上传接口解析后的 SQL，预检并确认写入病例源表 |
|
|||
|
|
| 会话配置 | `#/session` | 选择模式、评分类型并创建会话 |
|
|||
|
|
| 问诊 | `#/chat` | 普通/流式 Chat、查看提示、检查申请、完成问诊 |
|
|||
|
|
| 提交 | `#/submit` | 提交诊断和治疗方案 |
|
|||
|
|
| 报告 | `#/report` | 生成评价、查看评分、导出 PDF |
|
|||
|
|
| 历史 | `#/history` | 查询当前 user_id 的历史评价 |
|
|||
|
|
| LLM 测试 | `#/llm-test` | 测试 Fast/Reason 模型耗时 |
|
|||
|
|
|
|||
|
|
## 测试流程
|
|||
|
|
|
|||
|
|
1. 入口页确认连接成功。
|
|||
|
|
2. 需要新增病例时进入 `#/import`，上传 `.sql` 文件并先执行“解析检查”，确认通过后再“确认导入”。
|
|||
|
|
3. 病例页选择“支气管肺炎 - 6岁男性患儿”或刚导入的新病例。
|
|||
|
|
4. 点击“开始训练”，创建练习模式会话。
|
|||
|
|
5. Chat 中提问并查看 AI 病人流式回复。
|
|||
|
|
6. 点击“查看提示”验证 Hint Agent。
|
|||
|
|
7. 申请血常规、CRP、胸片、血氧饱和度、肺部体格检查。
|
|||
|
|
8. 完成问诊，提交诊断和治疗方案。
|
|||
|
|
9. 生成 AI 评价报告并导出 PDF。
|
|||
|
|
10. 历史页刷新并查看报告详情。
|
|||
|
|
|
|||
|
|
## 交互边界
|
|||
|
|
|
|||
|
|
- 前端不保存长期聊天历史。
|
|||
|
|
- Chat 消息只保存在 Pinia 当前状态中，刷新页面后以当前后端会话状态为准。
|
|||
|
|
- 诊断和治疗表单默认清空；演示模板需要手动点击填入。
|
|||
|
|
- 检查项目按 `item_code` 去重，同一会话不会重复申请同一检查。
|
|||
|
|
- 真实模型、mock 和 fallback 状态由后端 `.env` 决定，前端只展示后端返回结果。
|