yixiong/platform-prototype
17
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 专业人员端工单详情支持编辑救助意见并更新截图

Browse Source 
- 工单详情页不再限制求助方式，始终展示编辑按钮
- 编辑弹窗可修改救助意见并回写展示
- 重新截图work-order-detail页面并更新PRD引用的截图文件

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
liuyunqin
2026-04-29 09:55:33 +08:00
co-authored by Claude Haiku 4.5
parent d5c7cabc70
commit f8f710ad43
2 changed files with 71 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
emergency-app/professional/doc/screenshots/work-order-detail.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 42 KiB

emergency-app/professional/workbench/work-order-detail.html
+71 -5
View File
@@ -35,6 +35,19 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
.summary-item__idx { color: #999; flex-shrink: 0; }
.footer-bar { padding: 12px 16px 18px; background: #fff; border-top: 1px solid #f0f0f0; flex-shrink: 0; }
.action-btn { width: 100%; height: 44px; border: none; border-radius: 10px; background: #1677ff; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
/* 编辑按钮 */
.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; }
</style>
</head>
<body>
@@ -45,8 +58,8 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
</div>
<div class="nav-bar">
<!-- [交互] 点击返回: ./emergency-chat-done.html -->
<button class="back-btn" onclick="location.href='./emergency-chat-done.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>
@@ -63,7 +76,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">王旭（EMP-56985）</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-03-21 15:12:21</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>陕西省西安市雁塔区电子一路56号</span></span></div>
<div class="info-item"><span class="info-item__label">操作人员</span><span class="info-item__value">刘旭</span></div>
@@ -76,8 +89,11 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
<div class="card">
<div class="card__title">救助信息</div>
<div class="desc-block">
<div class="desc-block__label">救助意见：</div>
<div class="desc-block__text">建议立即送往最近医院急诊科进行头颅CT检查，排除脑血管意外可能。</div>
<div style="display: flex; align-items: center; justify-content: space-between;">
<div class="desc-block__label">救助意见：</div>
<button class="edit-btn" id="edit-advice-btn" onclick="openEditAdvice()">编辑</button>
</div>
<div class="desc-block__text" id="advice-text">建议立即送往最近医院急诊科进行头颅CT检查，排除脑血管意外可能。</div>
</div>
<div class="desc-block">
<div class="desc-block__label">救助结果：</div>
@@ -138,10 +154,60 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
<!-- &lt;!&ndash; [交互] 点击跳转至: ./emergency-chat.html &ndash;&gt;-->
<!-- <button class="action-btn" onclick="location.href='./emergency-chat.html'">进入应急会话</button>-->
<!-- </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>
<script>
sessionStorage.setItem('appRole', 'professional');
function goBackToSource() {
var src = sessionStorage.getItem('professionalWorkOrderDetailSource');
if (src) {
location.href = src;
return;
}
location.href = './index.html';
}
// 读取并显示求助方式
var method = sessionStorage.getItem('professionalWorkOrderMethod');
if (method) {
document.getElementById('help-method').textContent = method;
}
function openEditAdvice() {
var text = document.getElementById('advice-text').textContent;
document.getElementById('edit-textarea').value = 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();
}
</script>
</body>
</html>