feat: 新增员工端应用主页与个人中心,优化应急三端页面

- 新增 employee-app/home/index.html 应用主页(功能按钮收起展开、体重管理、健康数据、智能监测24h曲线、膳食摄入)
- 新增 employee-app/profile/ 个人中心模块(16页:个人资料、头像、密码、手机号、紧急联系人、设置等)
- 修复 health-consult/index.html 返回导航逻辑
- 优化应急三端(驻场/操作/专业人员端)页面交互与截图
- 新增操作人员端、专业人员端 PRD 文档
- 更新 SITE_MAP 导航页
- 新增截图工具脚本(gen_screenshots.py、screenshot.js)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-29 09:55:33 +08:00
co-authored by Claude Opus 4.6
parent f8f710ad43
commit b8382c862f
40 changed files with 3026 additions and 234 deletions
+3 -20
View File
@@ -41,6 +41,7 @@ stateDiagram-v2
stateDiagram-v2
[*] --> 待处理 : 操作人员确认预约并派单
待处理 --> 已完成 : 驻场人员提交挂号结果
待处理 --> 待处理 : 驻场人员转单给其他驻场人员
```
## 页面清单
@@ -219,36 +220,18 @@ stateDiagram-v2
### 7. 知识库首页
![页面截图](screenshots/knowledge-index.jpg)
**功能说明:** 分类展示知识文章和规章制度。
**功能说明:** 等待后续规划,提示“功能开发中,敬请期待~”
**业务规则:**
- 一级 Tab:知识文章(默认)/ 规章制度
- 知识文章面板:二级 Tab 分类(调度流程、急救知识、沟通技巧),每个分类下展示知识卡片
- 规章制度面板:展示 PDF 文件列表
- 知识卡片展示:图标、标题、简要描述
**交互说明:**
- 点击一级 Tab:切换知识文章/规章制度面板
- 点击二级 Tab:切换知识分类
- 点击知识卡片:跳转到知识详情页
---
### 8. 知识详情
![页面截图](screenshots/knowledge-article-detail.jpg)
**功能说明:** 展示单篇知识文章的完整内容,根据 URL 参数动态渲染。
**业务规则**
- 通过 URL 参数 `?key=xxx` 获取知识条目标识
- 页面动态渲染:标题、分类标签、更新日期、概述、主要内容列表
- 内置 10 个知识条目数据
**功能说明** 等待后续规划,提示“功能开发中,敬请期待~”
**交互说明:**
- 点击返回:返回知识库首页
---
@@ -46,7 +46,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
.modal-center.active { display: flex; }
.modal-center.modal-bottom { align-items: flex-end; }
.modal-box { width: 280px; background: #fff; border-radius: 16px; overflow: hidden; }
.transfer-modal { width: calc(100% - 24px); max-width: 366px; height: 88vh; max-height: 88vh; border-radius: 20px 20px 0 0; overflow: visible; padding-bottom: 6px; display: flex; flex-direction: column; }
.transfer-modal { width: calc(100% - 24px); max-width: 366px; height: 50vh; max-height: 50vh; border-radius: 20px 20px 0 0; overflow: visible; padding-bottom: 6px; display: flex; flex-direction: column; }
.person-select { position: relative; padding: 0 16px; }
.person-select__input-wrap { position: relative; }
.person-select__input { width: 100%; height: 40px; border: 1px solid #e8e8e8; border-radius: 8px; padding: 0 38px 0 12px; font-size: 14px; outline: none; color: #1a1a1a; background: #fff; }
@@ -258,10 +258,6 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
<div class="person-info__row"><span class="person-info__label">联系方式</span><span id="info-phone" class="person-info__value">-</span></div>
<div class="person-info__row"><span class="person-info__label">当前状态</span><span id="info-status" class="person-info__value">-</span></div>
</div>
<div class="transfer-note">
<div class="transfer-note__label"><span class="required">*</span>转单说明</div>
<textarea class="transfer-note__textarea" placeholder="请输入转单原因或补充说明,如:当前医院距离较远,转交附近驻场人员接单处理"></textarea>
</div>
</div>
<div style="display:flex;border-top:1px solid #f0f0f0;margin-top:0;flex-shrink:0;background:#fff;">
<button onclick="closeTransferModal()" style="flex:1;padding:14px;font-size:16px;cursor:pointer;background:none;border:none;color:#666;border-right:1px solid #f0f0f0;">取消</button>
@@ -48,7 +48,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
.modal-center.active { display: flex; }
.modal-center.modal-bottom { align-items: flex-end; }
.modal-box { width: 280px; background: #fff; border-radius: 16px; overflow: hidden; }
.transfer-modal { width: calc(100% - 24px); max-width: 366px; height: 88vh; max-height: 88vh; border-radius: 20px 20px 0 0; overflow: visible; padding-bottom: 6px; display: flex; flex-direction: column; }
.transfer-modal { width: calc(100% - 24px); max-width: 366px; height: 50vh; max-height: 50vh; border-radius: 20px 20px 0 0; overflow: visible; padding-bottom: 6px; display: flex; flex-direction: column; }
.person-select { position: relative; padding: 0 16px; }
.person-select__input-wrap { position: relative; }
.person-select__input { width: 100%; height: 40px; border: 1px solid #e8e8e8; border-radius: 8px; padding: 0 38px 0 12px; font-size: 14px; outline: none; color: #1a1a1a; background: #fff; }
@@ -141,6 +141,14 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
<div class="desc-block__label">救助结果:</div>
<div class="desc-block__text" style="color:#999;">暂未填写</div>
</div>
<div class="desc-block">
<div class="desc-block__label">相关照片:</div>
<div class="desc-block__text" style="color:#999;">暂未上传</div>
</div>
<div class="desc-block">
<div class="desc-block__label">补充小结:</div>
<div class="desc-block__text" style="color:#999;">暂未填写</div>
</div>
</div>
</div>
@@ -252,10 +260,6 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
<div class="person-info__row"><span class="person-info__label">联系方式</span><span id="info-phone" class="person-info__value">-</span></div>
<div class="person-info__row"><span class="person-info__label">当前状态</span><span id="info-status" class="person-info__value">-</span></div>
</div>
<div class="transfer-note">
<div class="transfer-note__label"><span class="required">*</span>转单说明</div>
<textarea class="transfer-note__textarea" placeholder="请输入转单原因或补充说明,如:当前现场距离较远,转交附近驻场人员前往处理"></textarea>
</div>
</div>
<div style="display:flex;border-top:1px solid #f0f0f0;margin-top:0;flex-shrink:0;background:#fff;">
<button onclick="closeTransferModal()" style="flex:1;padding:14px;font-size:16px;cursor:pointer;background:none;border:none;color:#666;border-right:1px solid #f0f0f0;">取消</button>
@@ -36,6 +36,9 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
.desc-block__text { font-size: 13px; color: #333; line-height: 1.8; }
.photo-list { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.photo-item { width: 90px; height: 68px; border-radius: 8px; background: linear-gradient(135deg, #e6f7ff, #bae7ff); border: 1px solid #d9d9d9; display: flex; align-items: center; justify-content: center; font-size: 10px; color: #1677ff; }
.summary-list { display: flex; flex-direction: column; gap: 8px; }
.summary-item { font-size: 13px; color: #333; line-height: 1.8; padding: 8px 12px; background: #f7f8fa; border-radius: 8px; position: relative; padding-left: 22px; }
.summary-item::before { content: ''; position: absolute; left: 10px; top: 14px; width: 5px; height: 5px; border-radius: 50%; background: #1677ff; }
</style>
</head>
<body>
@@ -87,6 +90,21 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
<div class="desc-block__label">救助结果:</div>
<div class="desc-block__text">员工已送达长庆油田职工医院急诊科,完成头颅CT检查,排除脑出血,诊断为高血压引起的眩晕,已开具降压药物并留观。</div>
</div>
<div class="desc-block">
<div class="desc-block__label">相关照片:</div>
<div class="photo-list">
<div class="photo-item">照片 1</div>
<div class="photo-item">照片 2</div>
</div>
</div>
<div class="desc-block">
<div class="desc-block__label">补充小结:</div>
<div class="summary-list">
<div class="summary-item">患者血压已从180/110mmHg降至145/90mmHg,头晕症状明显缓解,意识清醒。</div>
<div class="summary-item">已与家属沟通病情,建议留院观察24小时,家属表示同意。</div>
<div class="summary-item">后续需定期监测血压,按时服用降压药物,一周后门诊复查。</div>
</div>
</div>
</div>
</div>