fix: 修复健康咨询模块导航交互问题及新增体检报告卡片功能
- 修复5个弹窗dialog关闭后空白页问题,改为history.back()返回上一页 - 补充text-chat和video-success缺失的返回按钮 - 修复rate-doctor与text-chat返回按钮死循环跳转 - text-chat返回按钮支持?from参数动态返回来源页 - expert-profile返回按钮移除history.back()避免跳回聊天页 - index.html入口页返回按钮取消点击事件 - 聊天页新增内嵌体检报告选择弹窗及报告卡片气泡展示 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -103,10 +103,9 @@
|
||||
<script>
|
||||
/* ===== 交互逻辑 ===== */
|
||||
|
||||
/** 取消按钮 - 关闭弹窗并提示 */
|
||||
/** 取消按钮 - 返回上一页 */
|
||||
function handleCancel() {
|
||||
document.getElementById('modalOverlay').style.display = 'none';
|
||||
alert('您已取消咨询');
|
||||
history.back();
|
||||
}
|
||||
|
||||
/** 同意按钮 - 跳转到图文咨询页面 */
|
||||
|
||||
@@ -4,6 +4,34 @@
|
||||
|
||||
---
|
||||
|
||||
## [2026-04-10] fix: 修复返回按钮死循环跳转问题
|
||||
|
||||
**涉及文件(2个):**
|
||||
- `rate-doctor.html` — 返回按钮移除 `?from=text-chat` 路由逻辑,统一返回 `my-records.html`,避免评价页与聊天页互相跳转死循环
|
||||
- `text-chat.html` — 返回按钮从硬编码 `index.html` 改为根据 `?from` 参数动态返回来源页(`record-detail` → 咨询详情页,`expert-profile` → 专家主页,默认 → 首页)
|
||||
|
||||
---
|
||||
|
||||
## [2026-04-10] feat: 聊天页发送体检报告时在对话中显示报告卡片
|
||||
|
||||
**涉及文件(1个):**
|
||||
- `text-chat.html` — 体检报告选择弹窗从外部跳转改为内嵌弹窗;点击发送后在聊天区域插入体检报告卡片气泡(含报告名称、来源机构、日期、标签),医生自动回复确认收到
|
||||
|
||||
---
|
||||
|
||||
## [2026-04-10] fix: 修复弹窗关闭后空白页问题,补充缺失的返回按钮
|
||||
|
||||
**涉及文件(7个):**
|
||||
- `consult-notice-dialog.html` — 取消按钮从隐藏弹窗改为 `history.back()` 返回上一页
|
||||
- `end-consult-dialog.html` — 继续咨询按钮从隐藏弹窗改为 `history.back()` 返回上一页
|
||||
- `rate-dialog.html` — 取消按钮从隐藏弹窗改为 `history.back()` 返回上一页
|
||||
- `select-person-dialog.html` — 关闭按钮从隐藏弹窗改为 `history.back()` 返回上一页
|
||||
- `select-report-dialog.html` — 关闭按钮从隐藏弹窗改为 `history.back()` 返回上一页
|
||||
- `text-chat.html` — 聊天头部左侧新增返回按钮,跳转到健康咨询首页
|
||||
- `video-success.html` — 导航栏左侧新增返回按钮,跳转到我的咨询页
|
||||
|
||||
---
|
||||
|
||||
## [2026-04-10] feat: 新增视频咨询四种状态详情页,完善视频咨询列表
|
||||
|
||||
**涉及文件(5个):**
|
||||
|
||||
@@ -89,9 +89,9 @@
|
||||
<script>
|
||||
/* ===== 交互逻辑 ===== */
|
||||
|
||||
/** 继续咨询 - 关闭弹窗 */
|
||||
/** 继续咨询 - 返回上一页 */
|
||||
function handleCancel() {
|
||||
document.getElementById('modalOverlay').style.display = 'none';
|
||||
history.back();
|
||||
}
|
||||
|
||||
/** 确认结束 - 跳转到评价页面 */
|
||||
|
||||
@@ -541,8 +541,6 @@
|
||||
window.location.href = 'index.html';
|
||||
} else if (from === 'expert-list') {
|
||||
window.location.href = 'expert-list.html';
|
||||
} else if (history.length > 1) {
|
||||
history.back();
|
||||
} else {
|
||||
window.location.href = 'index.html';
|
||||
}
|
||||
|
||||
@@ -140,7 +140,7 @@
|
||||
|
||||
<!-- [交互] 导航栏:返回按钮 + 标题 + 右侧消息图标 -->
|
||||
<div class="nav-bar">
|
||||
<a class="nav-back" onclick="goBack()">← 返回</a>
|
||||
<span class="nav-back" style="cursor:default;color:#999;">← 返回</span>
|
||||
<span class="nav-title">健康咨询</span>
|
||||
<span class="nav-right">💬</span>
|
||||
</div>
|
||||
@@ -248,13 +248,6 @@
|
||||
<div class="bottom-spacer"></div>
|
||||
|
||||
</div><!-- /.phone-shell -->
|
||||
<script>
|
||||
function goBack() {
|
||||
if (history.length > 1) {
|
||||
history.back();
|
||||
}
|
||||
// index.html 是入口页,无需 fallback 跳转
|
||||
}
|
||||
</script>
|
||||
<!-- index.html 是模块入口页,返回按钮仅作占位,无点击事件 -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -111,9 +111,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
/** 取消 - 关闭弹窗 */
|
||||
/** 取消 - 返回上一页 */
|
||||
function handleCancel() {
|
||||
document.getElementById('modalOverlay').style.display = 'none';
|
||||
history.back();
|
||||
}
|
||||
|
||||
/** 提交评价 */
|
||||
|
||||
@@ -160,15 +160,7 @@
|
||||
* 返回上一页:读取 ?from 参数决定目标页
|
||||
*/
|
||||
function goBack() {
|
||||
var params = new URLSearchParams(window.location.search);
|
||||
var from = params.get('from');
|
||||
if (from === 'text-chat') {
|
||||
window.location.href = 'text-chat.html';
|
||||
} else if (history.length > 1) {
|
||||
history.back();
|
||||
} else {
|
||||
window.location.href = 'my-records.html';
|
||||
}
|
||||
window.location.href = 'my-records.html';
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
@@ -175,9 +175,9 @@
|
||||
<script>
|
||||
/* ===== 交互逻辑 ===== */
|
||||
|
||||
/** 关闭弹窗 */
|
||||
/** 关闭弹窗 - 返回上一页 */
|
||||
function closeSheet() {
|
||||
document.getElementById('sheetOverlay').style.display = 'none';
|
||||
history.back();
|
||||
}
|
||||
|
||||
/** 选中咨询人卡片 - 切换高亮状态 */
|
||||
|
||||
@@ -99,9 +99,9 @@
|
||||
<script>
|
||||
/* ===== 交互逻辑 ===== */
|
||||
|
||||
/** 关闭弹窗 */
|
||||
/** 关闭弹窗 - 返回上一页 */
|
||||
function closeSheet() {
|
||||
document.getElementById('sheetOverlay').style.display = 'none';
|
||||
history.back();
|
||||
}
|
||||
|
||||
/** 发送报告 - 提示已发送 */
|
||||
|
||||
@@ -79,6 +79,31 @@
|
||||
.plus-item .pi-icon { width: 52px; height: 52px; border-radius: 14px; background: #f5f5f5; display: flex; align-items: center; justify-content: center; font-size: 24px; }
|
||||
.plus-item .pi-label { font-size: 11px; color: #666; }
|
||||
|
||||
/* ===== 体检报告卡片气泡 ===== */
|
||||
.bubble-report { max-width: 240px; border-radius: 18px; overflow: hidden; background: #fff; border: 1px solid #e8e8e8; }
|
||||
.msg-row.mine .bubble-report { border-bottom-right-radius: 4px; }
|
||||
.bubble-report__header { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: linear-gradient(135deg, #fff7e6, #ffd591); }
|
||||
.bubble-report__icon { width: 32px; height: 32px; border-radius: 8px; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
|
||||
.bubble-report__title { font-size: 13px; font-weight: 600; color: #333; line-height: 1.4; }
|
||||
.bubble-report__body { padding: 8px 12px 10px; }
|
||||
.bubble-report__meta { font-size: 11px; color: #999; }
|
||||
.bubble-report__tag { display: inline-block; font-size: 10px; color: #1677ff; background: #e8f4ff; padding: 2px 6px; border-radius: 4px; margin-top: 4px; }
|
||||
|
||||
/* ===== 报告选择弹窗 ===== */
|
||||
.report-sheet-overlay { display: none; position: absolute; inset: 0; background: rgba(0,0,0,0.5); z-index: 100; align-items: flex-end; justify-content: center; }
|
||||
.report-sheet-overlay.show { display: flex; }
|
||||
.report-sheet { background: #fff; border-radius: 24px 24px 0 0; width: 100%; max-height: 70%; display: flex; flex-direction: column; }
|
||||
.report-sheet__header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px 12px; border-bottom: 1px solid #f0f0f0; flex-shrink: 0; }
|
||||
.report-sheet__header h3 { font-size: 16px; font-weight: 700; color: #333; }
|
||||
.report-sheet__close { font-size: 22px; color: #999; cursor: pointer; background: none; border: none; line-height: 1; }
|
||||
.report-sheet__body { flex: 1; overflow-y: auto; padding: 12px 16px; }
|
||||
.report-sheet__card { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; border: 1.5px solid #e8e8e8; margin-bottom: 10px; }
|
||||
.report-sheet__card-icon { width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg,#fff7e6,#ffd591); display: flex; align-items: center; justify-content: center; font-size: 22px; flex-shrink: 0; }
|
||||
.report-sheet__card-info { flex: 1; }
|
||||
.report-sheet__card-title { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.report-sheet__card-meta { font-size: 12px; color: #999; margin-top: 3px; }
|
||||
.report-sheet__send-btn { margin-left: auto; font-size: 12px; background: #1677ff; color: #fff; padding: 4px 12px; border-radius: 20px; white-space: nowrap; cursor: pointer; border: none; }
|
||||
|
||||
/* ===== 模态弹窗 ===== */
|
||||
.modal-overlay { display: none; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); z-index: 100; justify-content: center; align-items: center; }
|
||||
.modal-overlay.show { display: flex; }
|
||||
@@ -102,8 +127,9 @@
|
||||
<span>🔋</span>
|
||||
</span>
|
||||
</div>
|
||||
<!-- [交互] 聊天头部:无返回键,通过"结束咨询"按钮离开 -->
|
||||
<!-- [交互] 聊天头部:左侧返回按钮返回首页,右侧结束咨询按钮 -->
|
||||
<div class="chat-header">
|
||||
<a class="back-btn" id="backBtn" href="index.html">‹</a>
|
||||
<div class="chat-avatar">👨⚕️</div>
|
||||
<div class="chat-info">
|
||||
<span class="chat-name">张建国医生</span>
|
||||
@@ -148,8 +174,8 @@
|
||||
<div class="plus-panel" id="plusPanel">
|
||||
<div class="plus-item"><div class="pi-icon">🖼️</div><div class="pi-label">图片</div></div>
|
||||
<div class="plus-item"><div class="pi-icon">📷</div><div class="pi-label">拍摄</div></div>
|
||||
<!-- [交互] 跳转到选择体检报告弹窗页 -->
|
||||
<div class="plus-item" onclick="location.href='select-report-dialog.html'"><div class="pi-icon">📋</div><div class="pi-label">体检报告</div></div>
|
||||
<!-- [交互] 点击打开体检报告选择弹窗 -->
|
||||
<div class="plus-item" onclick="openReportSheet()"><div class="pi-icon">📋</div><div class="pi-label">体检报告</div></div>
|
||||
<!-- [交互] 跳转到选择档案弹窗页 -->
|
||||
<div class="plus-item" onclick="location.href='select-person-dialog.html'"><div class="pi-icon">📁</div><div class="pi-label">选择档案</div></div>
|
||||
<!-- [交互] 点击结束咨询弹出确认弹窗 -->
|
||||
@@ -170,9 +196,53 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- [交互] 选择体检报告弹窗 - 内嵌在聊天页,点击发送后插入报告卡片到对话 -->
|
||||
<div class="report-sheet-overlay" id="reportSheet">
|
||||
<div class="report-sheet">
|
||||
<div class="report-sheet__header">
|
||||
<h3>选择体检报告</h3>
|
||||
<button class="report-sheet__close" onclick="closeReportSheet()">×</button>
|
||||
</div>
|
||||
<div class="report-sheet__body">
|
||||
<div class="report-sheet__card" data-title="2026年度综合体检报告" data-meta="2026-03-15 · 北京协和医院">
|
||||
<div class="report-sheet__card-icon">📄</div>
|
||||
<div class="report-sheet__card-info"><div class="report-sheet__card-title">2026年度综合体检报告</div><div class="report-sheet__card-meta">2026-03-15 · 北京协和医院</div></div>
|
||||
<button class="report-sheet__send-btn" onclick="sendReport(this)">发送</button>
|
||||
</div>
|
||||
<div class="report-sheet__card" data-title="心内科专项检查报告" data-meta="2025-11-20 · 北京天坛医院">
|
||||
<div class="report-sheet__card-icon">📄</div>
|
||||
<div class="report-sheet__card-info"><div class="report-sheet__card-title">心内科专项检查报告</div><div class="report-sheet__card-meta">2025-11-20 · 北京天坛医院</div></div>
|
||||
<button class="report-sheet__send-btn" onclick="sendReport(this)">发送</button>
|
||||
</div>
|
||||
<div class="report-sheet__card" data-title="2025年度综合体检报告" data-meta="2025-03-10 · 上海瑞金医院">
|
||||
<div class="report-sheet__card-icon">📄</div>
|
||||
<div class="report-sheet__card-info"><div class="report-sheet__card-title">2025年度综合体检报告</div><div class="report-sheet__card-meta">2025-03-10 · 上海瑞金医院</div></div>
|
||||
<button class="report-sheet__send-btn" onclick="sendReport(this)">发送</button>
|
||||
</div>
|
||||
<div class="report-sheet__card" data-title="血液常规检验报告" data-meta="2025-08-05 · 广州中山医院">
|
||||
<div class="report-sheet__card-icon">📄</div>
|
||||
<div class="report-sheet__card-info"><div class="report-sheet__card-title">血液常规检验报告</div><div class="report-sheet__card-meta">2025-08-05 · 广州中山医院</div></div>
|
||||
<button class="report-sheet__send-btn" onclick="sendReport(this)">发送</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
/** 根据 ?from 参数设置返回按钮目标 */
|
||||
(function() {
|
||||
var params = new URLSearchParams(window.location.search);
|
||||
var from = params.get('from');
|
||||
var backBtn = document.getElementById('backBtn');
|
||||
if (from === 'record-detail') {
|
||||
backBtn.href = 'record-detail.html';
|
||||
} else if (from === 'expert-profile') {
|
||||
backBtn.href = 'expert-profile.html';
|
||||
}
|
||||
})();
|
||||
|
||||
/**
|
||||
* 切换展开面板的显示/隐藏
|
||||
*/
|
||||
@@ -236,6 +306,66 @@
|
||||
div.appendChild(document.createTextNode(str));
|
||||
return div.innerHTML;
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开体检报告选择弹窗,同时收起+面板
|
||||
*/
|
||||
function openReportSheet() {
|
||||
document.getElementById('plusPanel').classList.remove('show');
|
||||
document.getElementById('reportSheet').classList.add('show');
|
||||
}
|
||||
|
||||
/**
|
||||
* 关闭体检报告选择弹窗
|
||||
*/
|
||||
function closeReportSheet() {
|
||||
document.getElementById('reportSheet').classList.remove('show');
|
||||
}
|
||||
|
||||
/**
|
||||
* 发送体检报告:关闭弹窗,在聊天区插入报告卡片气泡,医生自动回复
|
||||
*/
|
||||
function sendReport(btn) {
|
||||
var card = btn.closest('.report-sheet__card');
|
||||
var title = card.getAttribute('data-title');
|
||||
var meta = card.getAttribute('data-meta');
|
||||
|
||||
// 按钮变为已发送状态
|
||||
btn.textContent = '已发送';
|
||||
btn.style.background = '#52c41a';
|
||||
btn.disabled = true;
|
||||
|
||||
// 关闭弹窗
|
||||
closeReportSheet();
|
||||
|
||||
var container = document.getElementById('chatMessages');
|
||||
|
||||
// 插入报告卡片气泡(用户侧)
|
||||
var myRow = document.createElement('div');
|
||||
myRow.className = 'msg-row mine';
|
||||
myRow.innerHTML = '<div class="msg-avatar">😊</div>'
|
||||
+ '<div class="bubble-report">'
|
||||
+ ' <div class="bubble-report__header">'
|
||||
+ ' <div class="bubble-report__icon">📄</div>'
|
||||
+ ' <div class="bubble-report__title">' + escapeHtml(title) + '</div>'
|
||||
+ ' </div>'
|
||||
+ ' <div class="bubble-report__body">'
|
||||
+ ' <div class="bubble-report__meta">' + escapeHtml(meta) + '</div>'
|
||||
+ ' <span class="bubble-report__tag">体检报告</span>'
|
||||
+ ' </div>'
|
||||
+ '</div>';
|
||||
container.appendChild(myRow);
|
||||
container.scrollTop = container.scrollHeight;
|
||||
|
||||
// 1.2秒后医生自动回复
|
||||
setTimeout(function() {
|
||||
var docRow = document.createElement('div');
|
||||
docRow.className = 'msg-row';
|
||||
docRow.innerHTML = '<div class="msg-avatar">👨⚕️</div><div class="bubble">已收到您的「' + escapeHtml(title) + '」,我仔细看一下,稍后给您反馈。</div>';
|
||||
container.appendChild(docRow);
|
||||
container.scrollTop = container.scrollHeight;
|
||||
}, 1200);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -27,9 +27,10 @@
|
||||
/* 导航栏 */
|
||||
.nav-bar {
|
||||
height: 44px; display: flex; align-items: center; justify-content: center;
|
||||
background: #fff; border-bottom: 1px solid #f0f0f0; flex-shrink: 0;
|
||||
background: #fff; border-bottom: 1px solid #f0f0f0; flex-shrink: 0; position: relative;
|
||||
}
|
||||
.nav-title { font-size: 17px; font-weight: 600; color: #1a1a1a; }
|
||||
.nav-back { position: absolute; left: 16px; font-size: 22px; color: #333; text-decoration: none; cursor: pointer; }
|
||||
/* 内容区 */
|
||||
.content { flex: 1; overflow-y: auto; padding: 32px 20px 20px; }
|
||||
.content::-webkit-scrollbar { display: none; }
|
||||
@@ -72,6 +73,7 @@
|
||||
</div>
|
||||
<!-- 导航栏 -->
|
||||
<div class="nav-bar">
|
||||
<a class="nav-back" href="my-records.html">‹</a>
|
||||
<span class="nav-title">预约详情</span>
|
||||
</div>
|
||||
<!-- 内容区 -->
|
||||
|
||||
Reference in New Issue
Block a user