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>

emergency-app/professional/doc/PRD.md

@@ -0,0 +1,292 @@
+# 专业人员端（健康应急APP）产品需求文档
+
+## 模块概述
+
+专业人员端为具备医学专业背景的应急人员提供移动端工作平台，负责在应急求助过程中提供专业医学指导，包括实时聊天沟通、给出救助意见、查看患者定位和周边医疗资源。专业人员通过聊天界面与操作人员、患者进行三方协作，是应急救助中的医学决策支撑角色。
+
+### 页面导航结构
+
+```
+专业人员端
+├── 工作台（底部Tab）
+│   ├── 进行中 → 应急聊天（进行中）
+│   │   ├── 救助意见表单
+│   │   ├── 患者定位地图
+│   │   └── 工单详情（进行中）
+│   └── 已结束 → 应急聊天（已结束）
+│       └── 工单详情（已完成）
+├── 知识库（底部Tab）
+│   ├── 知识文章（分类Tab）→ 知识详情
+│   └── 规章制度（PDF列表）
+├── AI助手（底部Tab）
+├── 消息（底部Tab）
+└── 我的（底部Tab）
+    ├── 值班信息
+    ├── 修改个人信息
+    ├── 修改密码
+    └── 退出登录（确认弹窗）
+```
+
+### 应急状态流转图
+
+```mermaid
+stateDiagram-v2
+    [*] --> 进行中 : 未结束的应急工单
+    进行中 --> 已结束 : 员工/操作人员/专业人员任意一方结束应急
+```
+
+## 页面清单
+
+| 序号 | 文件名 | 页面名称 | 所属模块 |
+|------|--------|----------|----------|
+| 1 | workbench/index.html | 工作台首页 | 工作台 |
+| 2 | workbench/emergency-chat-ongoing.html | 应急聊天（进行中） | 工作台·应急求助 |
+| 3 | workbench/emergency-chat-done.html | 应急聊天（已结束） | 工作台·应急求助 |
+| 4 | workbench/rescue-opinion.html | 救助意见表单 | 工作台·应急求助 |
+| 5 | workbench/patient-location.html | 患者定位地图 | 工作台·应急求助 |
+| 6 | workbench/work-order-detail-ongoing.html | 工单详情（进行中） | 工作台·应急求助 |
+| 7 | workbench/work-order-detail.html | 工单详情（已完成） | 工作台·应急求助 |
+| 8 | knowledge/index.html | 知识库首页 | 知识库 |
+| 9 | knowledge/article-detail.html | 知识详情 | 知识库 |
+| 10 | ../ai-assistant/index.html | AI 助手 | AI 助手 |
+| 11 | ../message/index.html | 消息列表 | 消息 |
+| 12 | profile/index.html | 个人中心主页 | 我的 |
+| 13 | profile/edit-profile.html | 修改个人信息 | 我的 |
+| 14 | profile/change-pwd.html | 修改密码 | 我的 |
+| 15 | profile/duty-schedule.html | 值班信息 | 我的 |
+
+## 逐页说明
+
+---
+
+## 一、工作台模块
+
+### 1. 工作台首页
+
+![页面截图](screenshots/index.jpg)
+
+**功能说明：** 专业人员工作台入口，展示当前参与的应急工单列表，按进行中/已结束分类管理。
+
+**业务规则：**
+- 二级 Tab 切换：进行中（含数量角标）/ 已结束（含数量角标）
+-  应急卡片展示：患者姓名、年龄、求助方式标签、求助时间
+- 应急求助方式分为“拨打120”、“应急视频”、“应急电话”、“线下应急”四种，“线下应急”为操作人员手动录入工单方式。
+- 已结束卡片额外展示结束时间
+
+**交互说明：**
+- 点击进行中卡片：求助方式如果是“应急视频”则跳转到应急聊天（进行中）页，其余跳转到工单详情(进行中)页
+- 点击已结束卡片：求助方式如果是“应急视频”则跳转到应急聊天（已结束）页，其余跳转到工单详情(已完成)页
+- 底部导航栏 5 个 Tab：工作台、知识库、AI 助手、消息、我的
+
+---
+
+## 二、应急求助业务线
+
+### 2. 应急聊天（进行中）
+
+![页面截图](screenshots/emergency-chat-ongoing.jpg)
+
+**功能说明：** 专业人员与患者、操作人员的实时三方聊天界面。
+
+**业务规则：**
+- 患者信息条（可折叠）展示：求助时间、患者姓名、年龄、所属单位、联系电话、求助方式、查看工单详情入口
+- 聊天区域展示三方消息：患者（左侧气泡）、专业人员（右侧气泡）、操作人员（左侧气泡）
+- 操作按钮栏提供 2 个功能入口：救助意见、患者定位
+- 输入区支持语音/文字模式切换和媒体选择面板，媒体选择支持拍照、图库、视频通话。
+
+**交互说明：**
+- 点击"查看工单"：跳转到工单详情（进行中）页
+- 点击"救助意见"：跳转到救助意见表单页，确认完后在聊天页发送一条自定义救助意见卡片消息
+- 点击"患者定位"：跳转到患者定位地图页
+- 点击"结束应急"：弹出二次确认弹窗，确认后发送一条结束应急的卡片消息，并跳转回工作台首页（已结束 Tab），
+- 点击"🎤"图标：切换语音/文字输入模式
+- 点击"+"图标：展开/收起媒体选择面板
+- 点击"➤"发送按钮：将输入框内容发送为专业人员消息气泡
+
+---
+
+### 3. 应急聊天（已结束）
+
+![页面截图](screenshots/emergency-chat-done.jpg)
+
+**功能说明：** 查看已结束应急的完整聊天记录，只读模式。
+
+**业务规则：**
+- 患者信息条（可折叠）展示患者基本信息
+- 聊天区域展示完整历史消息
+- 应急结束卡片以灰色样式展示结束时间
+- 底部固定提示条："本次应急已结束"
+
+**交互说明：**
+- 点击"查看工单"：跳转到工单详情（已完成）页
+- 点击返回：跳转回工作台首页（已结束 Tab）
+
+---
+
+### 4. 救助意见表单
+
+![页面截图](screenshots/rescue-opinion.jpg)
+
+**功能说明：** 专业人员填写救助意见，提交后意见将发送到聊天页面中。
+
+**业务规则：**
+- 患者信息展示区（只读）：患者姓名、性别、年龄、单位、部门
+- 救助意见输入区：多行文本输入
+
+**交互说明：**
+- 点击"提交"：提交救助意见，跳转回应急聊天页，发送救助意见卡片消息在聊天页中
+- 点击返回：返回应急聊天页
+
+**表单字段表：**
+
+| 字段名 | 类型 | 必填 | 校验规则     |
+|--------|------|----|----------|
+| 救助意见 | 多行文本 | 否  | 最大限制200字 |
+
+---
+
+### 5. 患者定位地图
+
+![页面截图](screenshots/patient-location.jpg)
+
+**功能说明：** 地图展示患者实时位置和周边医疗资源分布，功能与操作人员端一致。
+
+**业务规则：**
+- 地图中心展示患者位置标记
+- 资源类型 Tab 栏：油田医院、合作医院、医疗点、救护车、AED、急救包
+- 不同类型资源使用不同颜色标记
+- 资源卡片展示：点击资源图标后，底部弹窗显示资源卡片，显示资源图片、名称、所属单位/机构、距离、电话、地址
+
+**交互说明：**
+- 点击资源类型 Tab：切换显示对应类型的资源标记
+- 点击资源标记：底部弹出资源详情卡片
+- 点击地图空白处：关闭资源卡片
+
+---
+
+### 6. 工单详情（进行中）
+
+![页面截图](screenshots/work-order-detail-ongoing.jpg)
+
+**功能说明：** 展示进行中工单的完整信息。
+
+**业务规则：**
+- 四个可折叠卡片：基本信息、救助信息、派单信息、救护车支援
+- 基本信息：工单编号、类型、应急中心、求助员工、部门、求助方式、时间、位置、操作人员、专业人员、状态
+- 救助信息：救助意见、救助结果、相关照片、补充小结。除了应急视频，其余的求助方式可以编辑救助意见。在救助信息意见显示“编辑”按钮，参考已完成状态的工单详情
+- 派单信息和救护车支援：展示已有记录或空状态提示
+
+
+**交互说明：**
+- 点击卡片标题：折叠/展开卡片
+- 点击返回：返回应急聊天页
+
+---
+
+### 7. 工单详情（已完成）
+
+![页面截图](screenshots/work-order-detail.jpg)
+
+**功能说明：** 展示已完成工单的完整信息，所有卡片数据均已填充。
+
+**业务规则：**
+- 四个可折叠卡片结构同进行中版本
+- 救助信息展示完整的救助意见、救助结果、相关照片、补充小结
+- 派单信息展示完整派单历史
+- 救护车支援展示完整调度记录
+
+**交互说明：**
+- 点击卡片标题：折叠/展开卡片
+- 点击返回：返回应急聊天（已结束）页
+
+---
+
+## 三、知识库模块
+
+### 8. 知识库首页
+
+
+
+**功能说明：** 等待后续规划，提示“功能开发中，敬请期待~”
+
+
+### 9. 知识详情
+
+
+
+**功能说明：** 等待后续规划，提示“功能开发中，敬请期待~”
+
+
+## 四、个人中心模块
+
+### 10. 个人中心主页
+
+![页面截图](screenshots/profile-index.jpg)
+
+**功能说明：** 用户信息展示和功能菜单导航。
+
+**业务规则：**
+- 用户信息区：头像、姓名、角色（专业人员）、所属应急中心
+- 菜单项：值班信息、修改个人信息、修改密码、关于我们
+- 退出登录按钮
+
+**交互说明：**
+- 点击"值班信息"：跳转到值班信息页
+- 点击"修改个人信息"：跳转到修改个人信息页
+- 点击"修改密码"：跳转到修改密码页
+- 点击"退出登录"：弹出二次确认弹窗
+
+---
+
+### 11. 修改个人信息
+
+![页面截图](screenshots/edit-profile.jpg)
+
+**功能说明：** 编辑用户头像和姓名。
+
+**交互说明：**
+- 点击头像：弹出底部操作菜单（拍照/从相册选择）
+- 点击"保存"：验证姓名非空，显示保存成功提示
+
+**表单字段表：**
+
+| 字段名 | 类型 | 必填 | 校验规则 |
+|--------|------|------|----------|
+| 头像 | 图片选择 | 否 | 支持拍照或从相册选择 |
+| 姓名 | 单行文本 | 是 | 不能为空 |
+
+---
+
+### 12. 修改密码
+
+![页面截图](screenshots/change-pwd.jpg)
+
+**功能说明：** 修改用户登录密码。
+
+**交互说明：**
+- 点击"保存修改"：弹出修改成功确认弹窗，确认后跳转回个人中心
+
+**表单字段表：**
+
+| 字段名 | 类型 | 必填 | 校验规则 |
+|--------|------|------|----------|
+| 当前密码 | 密码输入 | 是 | 不能为空 |
+| 新密码 | 密码输入 | 是 | 不能为空 |
+| 确认新密码 | 密码输入 | 是 | 必须与新密码一致 |
+
+---
+
+### 13. 值班信息
+
+![页面截图](screenshots/duty-schedule.jpg)
+
+**功能说明：** 查看值班日历和当日值班人员安排。
+
+**业务规则：**
+- 日历网格展示当前月份，标记今天（蓝色背景）和排班日（浅蓝色背景+蓝色圆点）
+- 下方展示当日值班人员列表
+- 支持月份前后切换
+
+**交互说明：**
+- 点击月份导航箭头：切换上/下月
+- 点击返回：返回个人中心

emergency-app/professional/workbench/emergency-chat-ongoing.html

@@ -82,7 +82,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
         <span style="font-size:11px;color:#666;">求助时间：2026-04-24 09:15</span>
       </div>
       <!-- [交互] 点击跳转至: ./work-order-detail-ongoing.html -->
-      <button onclick="location.href='./work-order-detail-ongoing.html'" style="font-size:12px;color:#fa8c16;background:none;border:1px solid #fa8c16;border-radius:6px;padding:4px 10px;cursor:pointer;">查看工单</button>
+      <button onclick="sessionStorage.setItem('professionalWorkOrderOngoingSource','./emergency-chat-ongoing.html');sessionStorage.setItem('professionalWorkOrderMethod','应急视频');location.href='./work-order-detail-ongoing.html'" style="font-size:12px;color:#fa8c16;background:none;border:1px solid #fa8c16;border-radius:6px;padding:4px 10px;cursor:pointer;">查看工单</button>
     </div>
     <div id="emergency-info-detail" class="info-detail">
       <div class="info-avatar">👩</div>

emergency-app/professional/workbench/index.html

@@ -31,6 +31,8 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
 .tag-blue { background: #e6f4ff; color: #1677ff; }
 .tag-green { background: #f6ffed; color: #52c41a; }
 .tag-gray { background: #f5f5f5; color: #999; }
+.tag-purple { background: #f9f0ff; color: #722ed1; }
+.tag-orange { background: #fff7e6; color: #fa8c16; }
 /* 应急卡片 */
 .emergency-card { background: #fff; border-radius: 12px; margin: 10px 16px 0; padding: 14px; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,0.06); transition: transform 0.15s; }
 .emergency-card:active { transform: scale(0.98); }
@@ -70,7 +72,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
 
   <!-- 二级Tab：进行中 / 已结束 -->
   <div class="seg-tabs" style="flex-shrink:0;">
-    <div class="seg-tab active" onclick="switchTab(this,'panel-ongoing')">进行中<span class="badge" style="background:#fa8c16;">2</span></div>
+    <div class="seg-tab active" onclick="switchTab(this,'panel-ongoing')">进行中<span class="badge" style="background:#fa8c16;">3</span></div>
     <div class="seg-tab" onclick="switchTab(this,'panel-done')">已结束</div>
   </div>
 
@@ -85,20 +87,34 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
           <div class="ec-avatar">🚑</div>
           <div class="ec-info">
             <div class="ec-name">陈伟<span class="age">47岁</span></div>
+            <div class="ec-time">求助方式：<span class="tag tag-blue">应急视频</span></div>
             <div class="ec-time">求助时间：2026-04-23 14:30</div>
           </div>
-          <span class="tag tag-blue">进行中</span>
+          <span class="tag tag-red">进行中</span>
         </div>
       </div>
-      <!-- [交互] 点击跳转至: ./emergency-chat-ongoing.html -->
-      <div class="emergency-card" onclick="location.href='./emergency-chat-ongoing.html'">
+      <!-- [交互] 点击跳转至: ./work-order-detail-ongoing.html -->
+      <div class="emergency-card" onclick="sessionStorage.setItem('professionalWorkOrderOngoingSource','./index.html');sessionStorage.setItem('professionalWorkOrderMethod','应急电话');location.href='./work-order-detail-ongoing.html'">
         <div class="ec-top">
           <div class="ec-avatar">🚑</div>
           <div class="ec-info">
             <div class="ec-name">刘海波<span class="age">55岁</span></div>
+            <div class="ec-time">求助方式：<span class="tag tag-purple">应急电话</span></div>
             <div class="ec-time">求助时间：2026-04-23 10:20</div>
           </div>
-          <span class="tag tag-blue">进行中</span>
+          <span class="tag tag-red">进行中</span>
+        </div>
+      </div>
+      <!-- [交互] 点击跳转至: ./work-order-detail-ongoing.html -->
+      <div class="emergency-card" onclick="sessionStorage.setItem('professionalWorkOrderOngoingSource','./index.html');sessionStorage.setItem('professionalWorkOrderMethod','拨打120');location.href='./work-order-detail-ongoing.html'">
+        <div class="ec-top">
+          <div class="ec-avatar">🚑</div>
+          <div class="ec-info">
+            <div class="ec-name">王建国<span class="age">38岁</span></div>
+            <div class="ec-time">求助方式：<span class="tag tag-orange">拨打120</span></div>
+            <div class="ec-time">求助时间：2026-04-23 08:15</div>
+          </div>
+          <span class="tag tag-red">进行中</span>
         </div>
       </div>
       <div style="height:16px;"></div>
@@ -106,24 +122,26 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
 
     <!-- 已结束列表 -->
     <div id="panel-done" style="display:none;">
-      <!-- [交互] 点击跳转至: ./emergency-chat-done.html -->
-      <div class="emergency-card" onclick="location.href='./emergency-chat-done.html'">
+      <!-- [交互] 点击跳转至: ./work-order-detail.html -->
+      <div class="emergency-card" onclick="sessionStorage.setItem('professionalWorkOrderDetailSource','./index.html');sessionStorage.setItem('professionalWorkOrderMethod','应急视频');location.href='./work-order-detail.html'">
         <div class="ec-top">
           <div class="ec-avatar">🚑</div>
           <div class="ec-info">
             <div class="ec-name">孙丽<span class="age">41岁</span></div>
+            <div class="ec-time">求助方式：<span class="tag tag-blue">应急视频</span></div>
             <div class="ec-time">求助时间：2026-04-22 16:00</div>
             <div class="ec-time">结束时间：2026-04-22 17:35</div>
           </div>
           <span class="tag tag-green">已结束</span>
         </div>
       </div>
-      <!-- [交互] 点击跳转至: ./emergency-chat-done.html -->
-      <div class="emergency-card" onclick="location.href='./emergency-chat-done.html'">
+      <!-- [交互] 点击跳转至: ./work-order-detail.html -->
+      <div class="emergency-card" onclick="sessionStorage.setItem('professionalWorkOrderDetailSource','./index.html');sessionStorage.setItem('professionalWorkOrderMethod','线下应急');location.href='./work-order-detail.html'">
         <div class="ec-top">
           <div class="ec-avatar">🚑</div>
           <div class="ec-info">
             <div class="ec-name">周明<span class="age">33岁</span></div>
+            <div class="ec-time">求助方式：<span class="tag tag-orange">线下应急</span></div>
             <div class="ec-time">求助时间：2026-04-21 09:45</div>
             <div class="ec-time">结束时间：2026-04-21 11:20</div>
           </div>

emergency-app/professional/workbench/work-order-detail-ongoing.html

@@ -16,8 +16,15 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
 .nav-title { position: absolute; left: 50%; transform: translateX(-50%); font-size: 17px; font-weight: 600; color: #1a1a1a; white-space: nowrap; }
 .scroll-content { flex: 1; overflow-y: auto; background: #f7f8fa; }
 .scroll-content::-webkit-scrollbar { display: none; }
-.card { background: #fff; border-radius: 12px; margin: 12px 16px 0; padding: 16px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
-.card__title { font-size: 15px; font-weight: 700; color: #1a1a1a; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid #f0f0f0; }
+.card { background: #fff; border-radius: 12px; margin: 12px 16px 0; box-shadow: 0 1px 4px rgba(0,0,0,0.06); overflow: hidden; }
+.card__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; border-bottom: 1px solid #f0f0f0; cursor: pointer; }
+.card__title { font-size: 15px; font-weight: 700; color: #1a1a1a; }
+.card__toggle { display: inline-flex; align-items: center; gap: 4px; color: #1677ff; font-size: 12px; font-weight: 600; }
+.card__arrow { width: 14px; height: 14px; transition: transform .2s ease; }
+.card__body { padding: 0 16px 16px; }
+.card--collapsed .card__body { display: none; }
+.card--collapsed .card__arrow { transform: rotate(-90deg); }
+.card--collapsed .card__header { border-bottom: none; }
 .info-item { display: flex; font-size: 13px; line-height: 1.6; padding: 5px 0; }
 .info-item__label { color: #999; min-width: 72px; flex-shrink: 0; }
 .info-item__value { color: #333; flex: 1; word-break: break-all; }
@@ -36,6 +43,33 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
 .empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px 0 12px; }
 .empty-state__icon { font-size: 36px; margin-bottom: 8px; opacity: .35; }
 .empty-state__text { font-size: 13px; color: #bbb; }
+/* 编辑按钮 */
+.edit-btn { background: none; border: none; color: #1677ff; font-size: 13px; cursor: pointer; padding: 0; margin-left: 8px; }
+/* 编辑弹窗 */
+.edit-mask { position: absolute; inset: 0; background: rgba(0,0,0,0.45); display: none; align-items: center; justify-content: center; z-index: 30; padding: 24px; }
+.edit-mask.show { display: flex; }
+.edit-dialog { width: 100%; background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,0.2); max-height: 80vh; display: flex; flex-direction: column; }
+.edit-dialog__head { padding: 18px 20px; font-size: 17px; font-weight: 700; color: #1a1a1a; border-bottom: 1px solid #f0f0f0; }
+.edit-dialog__body { flex: 1; overflow-y: auto; padding: 20px; }
+.edit-dialog__textarea { width: 100%; min-height: 120px; padding: 12px; border: 1px solid #d9d9d9; border-radius: 8px; font-size: 14px; font-family: inherit; resize: vertical; }
+.edit-dialog__actions { display: flex; gap: 8px; padding: 16px 20px; border-top: 1px solid #f0f0f0; }
+.edit-dialog__btn { flex: 1; height: 40px; border: none; border-radius: 8px; font-size: 15px; cursor: pointer; font-weight: 600; }
+.edit-dialog__btn--cancel { background: #f5f5f5; color: #666; }
+.edit-dialog__btn--confirm { background: #1677ff; color: #fff; }
+/* 底部结束应急按钮 */
+.end-bar { padding: 12px 16px; background: #fff; border-top: 1px solid #f0f0f0; flex-shrink: 0; display: none; }
+.end-btn { width: 100%; height: 44px; border: none; border-radius: 10px; background: #ff4d4f; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
+/* 二次确认弹窗 */
+.confirm-mask { position: absolute; inset: 0; background: rgba(0,0,0,0.45); display: none; align-items: center; justify-content: center; z-index: 30; padding: 24px; }
+.confirm-mask.show { display: flex; }
+.confirm-dialog { width: 100%; background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,0.2); }
+.confirm-dialog__head { padding: 18px 20px 8px; font-size: 17px; font-weight: 700; color: #1a1a1a; text-align: center; }
+.confirm-dialog__body { padding: 0 20px 20px; font-size: 14px; line-height: 1.7; color: #666; text-align: center; }
+.confirm-dialog__actions { display: flex; border-top: 1px solid #f0f0f0; }
+.confirm-dialog__btn { flex: 1; height: 48px; border: none; background: #fff; font-size: 15px; cursor: pointer; }
+.confirm-dialog__btn + .confirm-dialog__btn { border-left: 1px solid #f0f0f0; }
+.confirm-dialog__btn--cancel { color: #666; }
+.confirm-dialog__btn--confirm { color: #ff4d4f; font-weight: 600; }
 </style>
 </head>
 <body>
@@ -46,8 +80,8 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
   </div>
 
   <div class="nav-bar">
-    <!-- [交互] 点击返回: ./emergency-chat-ongoing.html -->
-    <button class="back-btn" onclick="location.href='./emergency-chat-ongoing.html'">
+    <!-- [交互] 点击返回: 来源页面（无来源则 ./index.html） -->
+    <button class="back-btn" onclick="goBackToSource()">
       <svg width="10" height="16" viewBox="0 0 10 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M8 1L2 8l6 7"/></svg>返回
     </button>
     <span class="nav-title">工单详情</span>
@@ -55,28 +89,39 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
 
   <div class="scroll-content">
     <!-- 基本信息 -->
-    <div class="card">
-      <div class="card__title">基本信息</div>
+    <div class="card" id="basic-info-card">
+      <div class="card__header" onclick="toggleCard('basic-info-card', this)">
+        <div class="card__title">基本信息</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="info-item"><span class="info-item__label">工单编号</span><span class="info-item__value">YJ5633280</span></div>
       <div class="info-item"><span class="info-item__label">工单类型</span><span class="info-item__value">正常派单</span></div>
       <div class="info-item"><span class="info-item__label">应急中心</span><span class="info-item__value">西安应急中心</span></div>
       <div class="info-item"><span class="info-item__label">求助员工</span><span class="info-item__value">陈伟（EMP-71023）</span></div>
       <div class="info-item"><span class="info-item__label">所属单位</span><span class="info-item__value">采油一厂</span></div>
       <div class="info-item"><span class="info-item__label">所属部门</span><span class="info-item__value">第一作业区</span></div>
-      <div class="info-item"><span class="info-item__label">求助方式</span><span class="info-item__value">应急视频</span></div>
+      <div class="info-item"><span class="info-item__label">求助方式</span><span class="info-item__value" id="help-method">应急视频</span></div>
       <div class="info-item"><span class="info-item__label">求助时间</span><span class="info-item__value">2026-04-23 14:30:00</span></div>
       <div class="info-item"><span class="info-item__label">位置信息</span><span class="info-item__value"><span class="location-link"><svg width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M8 1C5.24 1 3 3.24 3 6c0 3.75 5 7 5 7s5-3.25 5-7c0-2.76-2.24-5-5-5z" stroke="currentColor" stroke-width="1.4"/><circle cx="8" cy="6" r="1.5" stroke="currentColor" stroke-width="1.2"/></svg>陕西省庆阳市华池县采油一厂作业区</span></span></div>
       <div class="info-item"><span class="info-item__label">操作人员</span><span class="info-item__value">刘旭</span></div>
       <div class="info-item"><span class="info-item__label">专业人员</span><span class="info-item__value">张旭</span></div>
       <div class="info-item"><span class="info-item__label">工单状态</span><span class="info-item__value"><span class="tag tag-blue">进行中</span></span></div>
+      </div>
     </div>
 
     <!-- 救助信息 -->
-    <div class="card">
-      <div class="card__title">救助信息</div>
+    <div class="card" id="rescue-info-card">
+      <div class="card__header" onclick="toggleCard('rescue-info-card', this)">
+        <div class="card__title">救助信息</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="desc-block">
-        <div class="desc-block__label">救助意见：</div>
-        <div class="desc-block__text">-</div>
+        <div style="display: flex; align-items: center; justify-content: space-between;">
+          <div class="desc-block__label">救助意见：</div>
+        </div>
+        <div class="desc-block__text" id="advice-text">-</div>
       </div>
       <div class="desc-block">
         <div class="desc-block__label">救助结果：</div>
@@ -96,33 +141,142 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
           <li class="summary-item"><span class="summary-item__idx">2.</span><span>已联系操作人员安排驻场人员前往现场协助转运</span></li>
         </ul>
       </div>
+      </div>
     </div>
 
     <!-- 派单信息 -->
-    <div class="card">
-      <div class="card__title">派单信息</div>
+    <div class="card" id="dispatch-info-card">
+      <div class="card__header" onclick="toggleCard('dispatch-info-card', this)">
+        <div class="card__title">派单信息</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="empty-state">
         <div class="empty-state__icon">📋</div>
         <div class="empty-state__text">暂无派单信息</div>
       </div>
+      </div>
     </div>
 
     <!-- 救护车支援 -->
-    <div class="card">
-      <div class="card__title">救护车支援</div>
+    <div class="card" id="ambulance-card">
+      <div class="card__header" onclick="toggleCard('ambulance-card', this)">
+        <div class="card__title">救护车支援</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="empty-state">
         <div class="empty-state__icon">🚑</div>
         <div class="empty-state__text">暂无救护车支援信息</div>
       </div>
+      </div>
     </div>
 
     <div style="height:16px;"></div>
   </div>
 
+  <!-- 编辑弹窗 -->
+  <div id="edit-mask" class="edit-mask" onclick="closeEditAdvice(event)">
+    <div class="edit-dialog">
+      <div class="edit-dialog__head">编辑救助意见</div>
+      <div class="edit-dialog__body">
+        <textarea id="edit-textarea" class="edit-dialog__textarea" placeholder="请输入救助意见..."></textarea>
+      </div>
+      <div class="edit-dialog__actions">
+        <button class="edit-dialog__btn edit-dialog__btn--cancel" onclick="closeEditAdvice(event)">取消</button>
+        <button class="edit-dialog__btn edit-dialog__btn--confirm" onclick="saveEditAdvice(event)">保存</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- 底部结束应急按钮 -->
+  <div id="end-bar" class="end-bar">
+    <button class="end-btn" onclick="openEndConfirm()">结束应急</button>
+  </div>
+
+  <!-- 结束应急确认弹窗 -->
+  <div id="confirm-mask" class="confirm-mask" onclick="closeEndConfirm(event)">
+    <div class="confirm-dialog">
+      <div class="confirm-dialog__head">是否确认结束应急</div>
+      <div class="confirm-dialog__body">结束后本次应急工单将更改为"已完成"状态。</div>
+      <div class="confirm-dialog__actions">
+        <button class="confirm-dialog__btn confirm-dialog__btn--cancel" onclick="closeEndConfirm(event)">取消</button>
+        <button class="confirm-dialog__btn confirm-dialog__btn--confirm" onclick="confirmEndEmergency(event)">确认结束</button>
+      </div>
+    </div>
+  </div>
 </div>
 
 <script>
 sessionStorage.setItem('appRole', 'professional');
+
+function goBackToSource() {
+  var src = sessionStorage.getItem('professionalWorkOrderOngoingSource');
+  if (src) {
+    location.href = src;
+    return;
+  }
+  location.href = './index.html';
+}
+
+// 读取并显示求助方式
+var method = sessionStorage.getItem('professionalWorkOrderMethod');
+if (method) {
+  document.getElementById('help-method').textContent = method;
+  // 如果求助方式是"应急电话"或"拨打120"，显示结束应急按钮
+  if (method === '应急电话' || method === '拨打120') {
+    document.getElementById('end-bar').style.display = 'block';
+  }
+}
+
+function toggleCard(cardId, headerEl) {
+  var card = document.getElementById(cardId);
+  if (!card) return;
+  card.classList.toggle('card--collapsed');
+
+  var isCollapsed = card.classList.contains('card--collapsed');
+  var toggle = headerEl ? headerEl.querySelector('.card__toggle span') : null;
+  if (toggle) toggle.textContent = isCollapsed ? '展开' : '收起';
+}
+
+function openEditAdvice() {
+  var text = document.getElementById('advice-text').textContent;
+  document.getElementById('edit-textarea').value = text === '-' ? '' : text;
+  document.getElementById('edit-mask').classList.add('show');
+}
+
+function closeEditAdvice(event) {
+  if (event) {
+    event.stopPropagation();
+    if (event.currentTarget !== event.target && !event.target.classList.contains('edit-dialog__btn--cancel')) return;
+  }
+  document.getElementById('edit-mask').classList.remove('show');
+}
+
+function saveEditAdvice(event) {
+  event.stopPropagation();
+  var text = document.getElementById('edit-textarea').value.trim();
+  document.getElementById('advice-text').textContent = text || '-';
+  closeEditAdvice();
+}
+
+function openEndConfirm() {
+  document.getElementById('confirm-mask').classList.add('show');
+}
+
+function closeEndConfirm(event) {
+  if (event) {
+    event.stopPropagation();
+    if (event.currentTarget !== event.target && !event.target.classList.contains('confirm-dialog__btn--cancel')) return;
+  }
+  document.getElementById('confirm-mask').classList.remove('show');
+}
+
+function confirmEndEmergency(event) {
+  event.stopPropagation();
+  sessionStorage.setItem('professionalWorkbenchTab', 'done');
+  location.href = './index.html';
+}
 </script>
 </body>
 </html>

emergency-app/professional/workbench/work-order-detail.html

@@ -16,8 +16,15 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
 .nav-title { position: absolute; left: 50%; transform: translateX(-50%); font-size: 17px; font-weight: 600; color: #1a1a1a; white-space: nowrap; }
 .scroll-content { flex: 1; overflow-y: auto; background: #f7f8fa; }
 .scroll-content::-webkit-scrollbar { display: none; }
-.card { background: #fff; border-radius: 12px; margin: 12px 16px 0; padding: 16px; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
-.card__title { font-size: 15px; font-weight: 700; color: #1a1a1a; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid #f0f0f0; }
+.card { background: #fff; border-radius: 12px; margin: 12px 16px 0; box-shadow: 0 1px 4px rgba(0,0,0,0.06); overflow: hidden; }
+.card__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; border-bottom: 1px solid #f0f0f0; cursor: pointer; }
+.card__title { font-size: 15px; font-weight: 700; color: #1a1a1a; }
+.card__toggle { display: inline-flex; align-items: center; gap: 4px; color: #1677ff; font-size: 12px; font-weight: 600; }
+.card__arrow { width: 14px; height: 14px; transition: transform .2s ease; }
+.card__body { padding: 0 16px 16px; }
+.card--collapsed .card__body { display: none; }
+.card--collapsed .card__arrow { transform: rotate(-90deg); }
+.card--collapsed .card__header { border-bottom: none; }
 .info-item { display: flex; font-size: 13px; line-height: 1.6; padding: 5px 0; }
 .info-item__label { color: #999; min-width: 72px; flex-shrink: 0; }
 .info-item__value { color: #333; flex: 1; word-break: break-all; }
@@ -68,8 +75,12 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
   <div class="scroll-content">
 
     <!-- 基本信息 -->
-    <div class="card">
-      <div class="card__title">基本信息</div>
+    <div class="card" id="basic-info-card">
+      <div class="card__header" onclick="toggleCard('basic-info-card', this)">
+        <div class="card__title">基本信息</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="info-item"><span class="info-item__label">工单编号</span><span class="info-item__value">YJ5633256</span></div>
       <div class="info-item"><span class="info-item__label">工单类型</span><span class="info-item__value">正常派单</span></div>
       <div class="info-item"><span class="info-item__label">应急中心</span><span class="info-item__value">西安应急中心</span></div>
@@ -83,11 +94,16 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
       <div class="info-item"><span class="info-item__label">专业人员</span><span class="info-item__value">刘旭</span></div>
       <div class="info-item"><span class="info-item__label">工单状态</span><span class="info-item__value"><span class="tag tag-green">已完成</span></span></div>
       <div class="info-item"><span class="info-item__label">完成时间</span><span class="info-item__value">2026-03-21 16:45:00</span></div>
+      </div>
     </div>
 
     <!-- 救助信息 -->
-    <div class="card">
-      <div class="card__title">救助信息</div>
+    <div class="card" id="rescue-info-card">
+      <div class="card__header" onclick="toggleCard('rescue-info-card', this)">
+        <div class="card__title">救助信息</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="desc-block">
         <div style="display: flex; align-items: center; justify-content: space-between;">
           <div class="desc-block__label">救助意见：</div>
@@ -115,11 +131,16 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
           <li class="summary-item"><span class="summary-item__idx">3.</span><span>已完成头颅CT检测，员工由同事留守陪护，已告知家属及部门负责人</span></li>
         </ul>
       </div>
+      </div>
     </div>
 
     <!-- 派单信息 -->
-    <div class="card">
-      <div class="card__title">派单信息</div>
+    <div class="card" id="dispatch-info-card">
+      <div class="card__header" onclick="toggleCard('dispatch-info-card', this)">
+        <div class="card__title">派单信息</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="info-item"><span class="info-item__label">派单时间</span><span class="info-item__value">2026-03-21 15:18:00</span></div>
       <div class="info-item"><span class="info-item__label">驻场人员</span><span class="info-item__value">王希（138-9201-3001）</span></div>
       <div class="info-item"><span class="info-item__label">派单状态</span><span class="info-item__value"><span class="tag tag-green">已完成</span></span></div>
@@ -132,11 +153,16 @@ 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>
     </div>
 
     <!-- 救护车支援 -->
-    <div class="card">
-      <div class="card__title">救护车支援</div>
+    <div class="card" id="ambulance-card">
+      <div class="card__header" onclick="toggleCard('ambulance-card', this)">
+        <div class="card__title">救护车支援</div>
+        <div class="card__toggle"><span>收起</span><svg class="card__arrow" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 6l5 5 5-5"/></svg></div>
+      </div>
+      <div class="card__body">
       <div class="info-item"><span class="info-item__label">车牌号</span><span class="info-item__value">陕A·120-01</span></div>
       <div class="info-item"><span class="info-item__label">所属医疗点</span><span class="info-item__value">长庆油田职工医疗点</span></div>
       <div class="info-item"><span class="info-item__label">所属机构</span><span class="info-item__value">长庆油田职工医院</span></div>
@@ -144,6 +170,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
       <div class="info-item"><span class="info-item__label">驾驶人电话</span><span class="info-item__value">138-9101-2001</span></div>
       <div class="info-item"><span class="info-item__label">随行人</span><span class="info-item__value">张伟</span></div>
       <div class="info-item"><span class="info-item__label">随行人电话</span><span class="info-item__value">138-9201-5001</span></div>
+      </div>
     </div>
 
     <div style="height:16px;"></div>
@@ -202,6 +229,16 @@ function closeEditAdvice(event) {
   document.getElementById('edit-mask').classList.remove('show');
 }
 
+function toggleCard(cardId, headerEl) {
+  var card = document.getElementById(cardId);
+  if (!card) return;
+  card.classList.toggle('card--collapsed');
+
+  var isCollapsed = card.classList.contains('card--collapsed');
+  var toggle = headerEl ? headerEl.querySelector('.card__toggle span') : null;
+  if (toggle) toggle.textContent = isCollapsed ? '展开' : '收起';
+}
+
 function saveEditAdvice(event) {
   event.stopPropagation();
   var text = document.getElementById('edit-textarea').value.trim();