feat: 医疗点PAD端细节优化与管理端体检统计二级/三级单位切换
医疗点PAD端（other-module/medical-pad/）： - 退出登录统一加二次确认（confirm弹窗后再回登录页） - 全站字段名规范：工号统一为员工编号 - 随访抽屉：新增/编辑双模式，任务中心带参进入编辑态隐藏搜索并回填员工信息、标题联动编辑随访 - 健康宣教抽屉：签字方式改为手写签名/签字图片二选一（图片上传预览），去掉负责人字段，活动资料加文件不超过10M提示 - 报告解读抽屉：新增查看详情模式（?view=1纯显示只读，隐藏删除/重新解读，签字静态化） - 非员工就诊抽屉：手机号改联系电话、去掉身份证自动解析的性别/年龄只读字段 - 员工档案详情：新增体检历史/分析报告/就诊记录/随访记录/就医推荐Tab，体检报告查看弹窗，就医推荐地图医疗点卡片 - 健康监测页：事件列表由表格改为双列卡片按事件类型着色，新增定位地图，搜索栏改为更多筛选展开收起，移除仅A01A34医疗点可见提示 - 床头呼叫等页面搜索栏统一重构为更多筛选展开收起 管理端健康体检（web-admin/health-checkup/）： - 冠脉CTA/胃肠镜统计页新增二级/三级单位切换TAB，二级按单位聚合并隐藏部门列与部门筛选，三级按部门展示 - 新增受检率/检出率/患病率三列，表头问号悬浮气泡说明计算口径
This commit is contained in:
liuyunqin
@@ -39,14 +39,19 @@
|
||||
.back { font-size: 13px; color: #1890ff; cursor: pointer; text-decoration: none; margin-bottom: 12px; display: inline-block; }
|
||||
/* 呼叫头 */
|
||||
.call-head { background: #fff; border-radius: 14px; padding: 18px 22px; box-shadow: 0 2px 8px rgba(74,90,127,.06); display: flex; align-items: center; gap: 16px; }
|
||||
.call-head__icon { width: 52px; height: 52px; border-radius: 14px; background: rgba(253,33,33,.08); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.call-head__icon svg { width: 28px; height: 28px; stroke: #fd2121; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
|
||||
.call-head__main { flex: 1; }
|
||||
.call-head__title { font-size: 18px; font-weight: 700; color: #333; }
|
||||
.ctag { display: inline-block; font-size: 13px; font-weight: 600; padding: 2px 10px; border-radius: 5px; margin-right: 10px; vertical-align: 2px; }
|
||||
.ctag--bed { background: #e7f4ff; color: #1890ff; }
|
||||
.ctag--dorm { background: #f4ecff; color: #722ed1; }
|
||||
.call-head__title .caps { margin-left: 10px; vertical-align: 2px; }
|
||||
.call-head__sub { font-size: 12px; color: #969eb0; margin-top: 4px; }
|
||||
.call-head__addr { font-size: 12px; color: #969eb0; margin-top: 4px; line-height: 1.6; }
|
||||
.caps { display: inline-block; padding: 3px 14px; border-radius: 14px; font-size: 12px; }
|
||||
.caps--no { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.caps--yes { background: #7adb7f; color: #098a2d; }
|
||||
.pill--wait { background: rgba(253,33,33,.08); color: #fd2121; padding: 3px 14px; border-radius: 14px; font-size: 12px; }
|
||||
.pill--done { background: #f0f2f5; color: #969eb0; padding: 3px 14px; border-radius: 14px; font-size: 12px; }
|
||||
/* 分区卡 */
|
||||
.sec { background: #fff; border-radius: 14px; padding: 16px 22px; margin-top: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 12px; display: flex; align-items: center; }
|
||||
@@ -54,17 +59,39 @@
|
||||
.kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 22px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.kv b { color: #333; font-weight: 500; }
|
||||
.kv .unknown { color: #b7bfcc; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 26px; }
|
||||
.fld { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.kv.kv--empty { display: flex; align-items: center; justify-content: center; min-height: 60px; color: #b7bfcc; font-size: 13px; background: #fafbfd; border-radius: 8px; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 40px; }
|
||||
.fld { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #4a5a7f; }
|
||||
.fld--full { grid-column: 1 / -1; }
|
||||
.fld__label { width: 84px; text-align: right; flex-shrink: 0; }
|
||||
.fld__label { width: 96px; text-align: right; flex-shrink: 0; }
|
||||
.fld__req { color: #fd2121; }
|
||||
.fld input, .fld textarea { flex: 1; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; outline: none; min-width: 0; font-family: inherit; }
|
||||
.fld input:focus, .fld textarea:focus { border-color: #1890ff; }
|
||||
.fld textarea { height: 66px; padding: 8px 10px; resize: none; }
|
||||
.radio { display: flex; gap: 18px; align-items: center; font-size: 13px; color: #333; flex: 1; }
|
||||
.fld input, .fld textarea, .fld select { flex: 1; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; outline: none; min-width: 0; font-family: inherit; background: #fff; }
|
||||
.fld input:focus, .fld textarea:focus, .fld select:focus { border-color: #1890ff; }
|
||||
.fld textarea { height: 120px; padding: 8px 10px; resize: none; width: 100%; display: block; }
|
||||
.radio { display: flex; gap: 24px; align-items: center; font-size: 13px; color: #333; flex: 1; }
|
||||
.radio input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
.counter { text-align: right; font-size: 11px; color: #b7bfcc; margin-top: 4px; }
|
||||
.sec__foot { display: flex; justify-content: flex-end; margin-top: 14px; }
|
||||
/* 随车医护：搜索下拉多选 */
|
||||
.msel-fld { align-items: flex-start; position: relative; }
|
||||
.msel-fld .fld__label { padding-top: 7px; }
|
||||
.msel { flex: 1; position: relative; min-width: 0; }
|
||||
.msel__box { min-height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 3px 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; cursor: pointer; background: #fff; }
|
||||
.msel__box:focus-within { border-color: #1890ff; }
|
||||
.msel__tags { display: flex; flex-wrap: wrap; gap: 4px; }
|
||||
.msel__tag { display: inline-flex; align-items: center; gap: 2px; background: #e7f4ff; color: #1890ff; font-size: 12px; padding: 2px 5px 2px 8px; border-radius: 4px; }
|
||||
.msel__x { cursor: pointer; font-size: 14px; line-height: 1; color: #1890ff; padding: 0 3px; }
|
||||
.msel__x:hover { color: #fd2121; }
|
||||
.msel .msel__input { flex: 1; min-width: 120px; height: 22px; border: none; outline: none; font-size: 13px; color: #333; background: transparent; padding: 0; }
|
||||
.msel__arrow { color: #969eb0; font-size: 12px; }
|
||||
.msel__panel { position: absolute; top: calc(100% + 4px); left: 0; width: 480px; background: #fff; border: 1px solid #d9d9d9; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12); z-index: 20; display: none; max-height: 240px; overflow-y: auto; }
|
||||
.msel__panel.open { display: block; }
|
||||
.msel__opt { display: flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 13px; color: #333; cursor: pointer; border-bottom: 1px solid #f0f2f5; }
|
||||
.msel__opt:hover { background: #f2f6ff; }
|
||||
.msel .msel__opt input[type="checkbox"] { accent-color: #1890ff; width: 15px; height: 15px; flex: none; border: none; padding: 0; margin: 0; background: #fff; }
|
||||
.msel__opt-name { font-weight: 500; color: #333; }
|
||||
.msel__opt-phone { margin-left: auto; font-size: 12px; color: #4a5a7f; }
|
||||
.msel__empty { padding: 14px; text-align: center; color: #b7bfcc; font-size: 13px; }
|
||||
/* 页内弹窗：选择员工（700） */
|
||||
.overlay { position: absolute; inset: 0; background: rgba(15,23,42,.45); z-index: 50; display: none; align-items: center; justify-content: center; }
|
||||
.overlay.open { display: flex; }
|
||||
@@ -100,7 +127,7 @@
|
||||
<a class="nav__item nav__item--active" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -129,13 +156,14 @@
|
||||
<a class="back" href="bed.html">‹ 返回床头呼叫</a>
|
||||
|
||||
<div class="call-head">
|
||||
<div class="call-head__icon"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg></div>
|
||||
<div class="call-head__main">
|
||||
<div class="call-head__title">床头呼叫 · 三号宿舍楼 5号床</div>
|
||||
<div class="call-head__sub">呼叫器 BJ-03-05 发起时间 2026-09-04 09:47:22 等待时长 4 分 18 秒</div>
|
||||
<div class="call-head__title">
|
||||
<span class="ctag ctag--bed" id="typeTag">床头呼叫</span><span id="locText">三号宿舍楼 · 3层305室 · 5号床</span><span class="caps caps--no" id="answerCaps">未接听</span>
|
||||
</div>
|
||||
<div class="call-head__sub" id="timeLine">呼叫时间 2026-09-09 09:47:32</div>
|
||||
<div class="call-head__addr" id="stationLine">站点信息：管理四中心站点（陕西省榆林市定边县安边镇兴隆路18号）</div>
|
||||
</div>
|
||||
<span class="pill--wait">待处理</span>
|
||||
<span class="caps caps--no">未接听</span>
|
||||
<span class="pill--wait" id="donePill">待处理</span>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
@@ -143,41 +171,65 @@
|
||||
<div class="ops">
|
||||
<!-- [交互] 床位未登记人员时手动关联，打开页内「选择员工」弹窗 -->
|
||||
<button class="btn" onclick="openModal('empModal')">关联员工</button>
|
||||
<!-- [交互] 跳转员工档案详情: employee-file-detail.html -->
|
||||
<a class="btn" style="line-height:30px;text-decoration:none;display:inline-block" href="employee-file-detail.html">查看档案</a>
|
||||
<!-- [交互] 员工信息存在时显示，跳转员工档案详情: employee-file-detail.html -->
|
||||
<a class="btn" id="viewArchiveBtn" style="line-height:30px;text-decoration:none;display:inline-block" href="employee-file-detail.html">查看档案</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="kv">
|
||||
<div>姓名：<b>岳春生</b></div><div>性别/年龄：<b>男 · 54岁</b></div><div>工号：<b>1035678</b></div>
|
||||
<div>单位/部门：<b>陕E作业区 / 管理四中心</b></div><div>联系电话：<b>139****2214</b></div><div>慢病：<b>高血压、糖尿病</b></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">宿舍信息</div>
|
||||
<div class="kv">
|
||||
<div>宿舍楼：<b>三号宿舍楼</b></div><div>房间号：<b>302</b></div><div>床位号：<b>5号床（下铺）</b></div>
|
||||
<div>呼叫器编号：<b>BJ-03-05</b></div><div>责任人：<b>宿管 温桂英 133****2067</b></div><div>同室人数：<b>6 人</b></div>
|
||||
<div class="kv" id="empKv">
|
||||
<div>姓名：<b>岳春生</b></div><div>性别/年龄：<b>男 · 54岁</b></div><div>员工编号：<b>1035678</b></div>
|
||||
<div>单位/部门：<b>陕E作业区 / 管理四中心</b></div><div>联系电话：<b>13991232214</b></div><div>慢病干预：<b>高血压、糖尿病</b></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec" style="margin-bottom:8px">
|
||||
<div class="sec__title">急救信息<span style="font-size:12px;font-weight:400;color:#969eb0;margin-left:10px">待处理状态填写出勤与救助信息后点击「处理完成」</span></div>
|
||||
<div class="form-grid">
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>是否出勤</span>
|
||||
<span class="radio"><label><input type="radio" name="go" checked>已出勤</label><label><input type="radio" name="go">未出勤</label></span>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>是否派救护车</span>
|
||||
<span class="radio"><label><input type="radio" name="amb">是</label><label><input type="radio" name="amb" checked>否</label></span>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>随车医护</span><input placeholder="请输入随车医护人员" value="韩丽平"></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>出勤日期</span><input value="2026-09-04 09:52"></div>
|
||||
<div class="fld fld--full" style="align-items:flex-start"><span class="fld__label" style="padding-top:8px"><span class="fld__req">*</span>救助信息</span>
|
||||
<div style="flex:1">
|
||||
<textarea placeholder="请输入现场处置与救助情况（300字以内）">09:52 到达宿舍，员工自述头晕无胸痛；现场测血压 162/100mmHg，心率 84 次/分。嘱其卧床休息，口服氨氯地平 1 片，观察 30 分钟后血压降至 148/92mmHg。已与家属电话沟通，如夜间症状反复立即呼叫值班医。</textarea>
|
||||
<div class="counter">118 / 300</div>
|
||||
<div class="sec__title">急救信息</div>
|
||||
<!-- 未处理：填写状态 -->
|
||||
<div id="rescueFill">
|
||||
<div class="form-grid">
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>是否出勤</span>
|
||||
<span class="radio"><label><input type="radio" name="go" checked onclick="toggleDispatch(false)">已出勤</label><label><input type="radio" name="go" onclick="toggleDispatch(true)">未出勤</label></span>
|
||||
</div>
|
||||
<!-- [交互] 选择「未出勤」时隐藏救护车/随车医护/出勤日期，仅保留救助信息 -->
|
||||
<div class="fld" id="ambFld"><span class="fld__label"><span class="fld__req">*</span>救护车</span>
|
||||
<select>
|
||||
<option value="">请选择救护车</option>
|
||||
<option>陕E·救护车001</option>
|
||||
<option>陕E·救护车002</option>
|
||||
<option>陕E·救护车003</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="fld" id="dateFld"><span class="fld__label"><span class="fld__req">*</span>出勤日期</span><input type="date" value="2026-09-04"></div>
|
||||
<!-- [交互] 随车医护：搜索下拉多选，展示姓名（岗位：医生/护士）+ 联系电话 -->
|
||||
<div class="fld fld--full msel-fld" id="medFld">
|
||||
<span class="fld__label"><span class="fld__req">*</span>随车医护</span>
|
||||
<div class="msel">
|
||||
<div class="msel__box" onclick="toggleMedPanel()">
|
||||
<div class="msel__tags" id="medTags"></div>
|
||||
<input class="msel__input" id="medSearch" placeholder="输入姓名或电话搜索" onclick="event.stopPropagation()" onfocus="openMedPanel()" oninput="filterMed()">
|
||||
<span class="msel__arrow">▾</span>
|
||||
</div>
|
||||
<div class="msel__panel" id="medPanel">
|
||||
<div class="msel__list" id="medList"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fld fld--full" style="align-items:flex-start"><span class="fld__label" style="padding-top:8px"><span class="fld__req">*</span>救助信息</span>
|
||||
<div style="flex:1">
|
||||
<textarea placeholder="请输入现场处置与救助情况（300字以内）">09:52 到达宿舍，员工自述头晕无胸痛；现场测血压 162/100mmHg，心率 84 次/分。嘱其卧床休息，口服氨氯地平 1 片，观察 30 分钟后血压降至 148/92mmHg。已与家属电话沟通，如夜间症状反复立即呼叫值班医。</textarea>
|
||||
<div class="counter">118 / 300</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec__foot"><button class="btn btn--primary" onclick="alert('处理完成（原型演示）')">处理完成</button></div>
|
||||
</div>
|
||||
<!-- 已处理：纯显示状态 -->
|
||||
<div id="rescueView" style="display:none">
|
||||
<div class="kv">
|
||||
<div>是否出勤：<b>已出勤</b></div><div>救护车：<b>陕E·救护车001</b></div><div>随车医护：<b>韩丽平</b></div>
|
||||
<div>出勤日期：<b>2026-09-04</b></div><div>处理时间：<b>2026-09-04 10:06</b></div><div>处理人：<b>石维国</b></div>
|
||||
<div style="grid-column:1/-1">救助信息：<b>09:52 到达宿舍，员工自述头晕无胸痛；现场测血压 162/100mmHg，心率 84 次/分。嘱其卧床休息，口服氨氯地平 1 片，观察 30 分钟后血压降至 148/92mmHg。已与家属电话沟通，如夜间症状反复立即呼叫值班医。</b></div>
|
||||
</div>
|
||||
<div class="sec__foot"><button class="btn" onclick="alert('编辑（原型演示）')">编 辑</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -189,11 +241,11 @@
|
||||
<div class="modal__head"><span class="modal__title">关联员工</span><button class="modal__close" onclick="closeModal('empModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div class="search-line">
|
||||
<input placeholder="请输入姓名或工号查询">
|
||||
<input placeholder="请输入姓名或员工编号查询">
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>工号</th><th>单位</th><th>部门</th></tr>
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>员工编号</th><th>单位</th><th>部门</th></tr>
|
||||
<!-- [交互] 点击行选中员工并关闭弹窗，回填员工信息区 -->
|
||||
<tr class="row" onclick="pickEmp(this)"><td>齐俊峰</td><td>男</td><td>38</td><td>1051128</td><td>陕E作业区</td><td>转运站</td></tr>
|
||||
<tr class="row" onclick="pickEmp(this)"><td>龚春兰</td><td>女</td><td>42</td><td>1050367</td><td>陕E作业区</td><td>供电大队</td></tr>
|
||||
@@ -213,17 +265,145 @@
|
||||
// 选中员工：回填员工信息区并收起弹窗
|
||||
function pickEmp(tr) {
|
||||
var tds = tr.querySelectorAll('td');
|
||||
var kv = document.querySelector('.sec .kv');
|
||||
kv.children[0].innerHTML = '姓名：<b>' + tds[0].textContent + '</b>';
|
||||
kv.children[1].innerHTML = '性别/年龄：<b>' + tds[1].textContent + ' · ' + tds[2].textContent + '岁</b>';
|
||||
kv.children[2].innerHTML = '工号：<b>' + tds[3].textContent + '</b>';
|
||||
kv.children[3].innerHTML = '单位/部门：<b>' + tds[4].textContent + ' / ' + tds[5].textContent + '</b>';
|
||||
kv.children[4].innerHTML = '联系电话：<b>—</b>';
|
||||
kv.children[5].innerHTML = '慢病：<b>—</b>';
|
||||
var kv = document.getElementById('empKv');
|
||||
kv.classList.remove('kv--empty');
|
||||
document.getElementById('viewArchiveBtn').style.display = '';
|
||||
kv.innerHTML =
|
||||
'<div>姓名：<b>' + tds[0].textContent + '</b></div>' +
|
||||
'<div>性别/年龄：<b>' + tds[1].textContent + ' · ' + tds[2].textContent + '岁</b></div>' +
|
||||
'<div>员工编号：<b>' + tds[3].textContent + '</b></div>' +
|
||||
'<div>单位/部门：<b>' + tds[4].textContent + ' / ' + tds[5].textContent + '</b></div>' +
|
||||
'<div>联系电话：<b>—</b></div>' +
|
||||
'<div>慢病干预：<b>—</b></div>';
|
||||
closeModal('empModal');
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
// 是否出勤切换：未出勤时仅保留救助信息，隐藏救护车/随车医护/出勤日期
|
||||
function toggleDispatch(isNotDispatch) {
|
||||
var ids = ['ambFld', 'medFld', 'dateFld'];
|
||||
for (var i = 0; i < ids.length; i++) {
|
||||
document.getElementById(ids[i]).style.display = isNotDispatch ? 'none' : '';
|
||||
}
|
||||
}
|
||||
// 随车医护：搜索下拉多选
|
||||
var medStaff = [
|
||||
{ name: '韩丽平', pos: '医生', phone: '13956282214' },
|
||||
{ name: '石维国', pos: '医生', phone: '13809123302' },
|
||||
{ name: '张丽华', pos: '护士', phone: '13709124521' },
|
||||
{ name: '王小燕', pos: '护士', phone: '13609127815' },
|
||||
{ name: '李建国', pos: '医生', phone: '13909124567' }
|
||||
];
|
||||
var selectedMed = ['韩丽平'];
|
||||
function renderMedList(kw) {
|
||||
var list = document.getElementById('medList');
|
||||
var keyword = (kw || '').trim();
|
||||
var html = '';
|
||||
var hit = false;
|
||||
for (var i = 0; i < medStaff.length; i++) {
|
||||
var s = medStaff[i];
|
||||
if (keyword && s.name.indexOf(keyword) < 0 && s.phone.indexOf(keyword) < 0) continue;
|
||||
hit = true;
|
||||
var checked = selectedMed.indexOf(s.name) >= 0;
|
||||
html += '<label class="msel__opt"><input type="checkbox" value="' + s.name + '"' + (checked ? ' checked' : '') + ' onchange="onMedToggle(this)">' +
|
||||
'<span class="msel__opt-name">' + s.name + '（' + s.pos + '）</span>' +
|
||||
'<span class="msel__opt-phone">' + s.phone + '</span></label>';
|
||||
}
|
||||
if (!hit) html = '<div class="msel__empty">未查询到医护人员</div>';
|
||||
list.innerHTML = html;
|
||||
}
|
||||
function renderMedTags() {
|
||||
var html = '';
|
||||
for (var i = 0; i < selectedMed.length; i++) {
|
||||
var name = selectedMed[i];
|
||||
var s = null;
|
||||
for (var j = 0; j < medStaff.length; j++) { if (medStaff[j].name === name) { s = medStaff[j]; break; } }
|
||||
html += '<span class="msel__tag">' + name + (s ? '（' + s.pos + '）' : '') + '<span class="msel__x" onclick="removeMed(event,\'' + name + '\')">×</span></span>';
|
||||
}
|
||||
document.getElementById('medTags').innerHTML = html;
|
||||
}
|
||||
function onMedToggle(cb) {
|
||||
var idx = selectedMed.indexOf(cb.value);
|
||||
if (cb.checked && idx < 0) selectedMed.push(cb.value);
|
||||
if (!cb.checked && idx >= 0) selectedMed.splice(idx, 1);
|
||||
renderMedTags();
|
||||
}
|
||||
function removeMed(e, name) {
|
||||
e.stopPropagation();
|
||||
var idx = selectedMed.indexOf(name);
|
||||
if (idx >= 0) selectedMed.splice(idx, 1);
|
||||
renderMedTags();
|
||||
renderMedList(document.getElementById('medSearch').value);
|
||||
}
|
||||
function toggleMedPanel() {
|
||||
document.getElementById('medPanel').classList.toggle('open');
|
||||
}
|
||||
function openMedPanel() {
|
||||
document.getElementById('medPanel').classList.add('open');
|
||||
}
|
||||
function filterMed() {
|
||||
renderMedList(document.getElementById('medSearch').value);
|
||||
openMedPanel();
|
||||
}
|
||||
renderMedList('');
|
||||
renderMedTags();
|
||||
// 根据 URL 参数渲染页面状态（来自 bed.html 卡片跳转）
|
||||
(function () {
|
||||
var q = location.search.replace(/^\?/, '');
|
||||
var p = {};
|
||||
if (q) {
|
||||
q.split('&').forEach(function (s) {
|
||||
var kv = s.split('=');
|
||||
if (kv.length === 2) p[decodeURIComponent(kv[0])] = decodeURIComponent(kv[1]);
|
||||
});
|
||||
}
|
||||
// 呼叫类型标签
|
||||
var typeTag = document.getElementById('typeTag');
|
||||
if (p.type === 'dorm') { typeTag.textContent = '宿舍呼叫'; typeTag.className = 'ctag ctag--dorm'; }
|
||||
else { typeTag.textContent = '床头呼叫'; typeTag.className = 'ctag ctag--bed'; }
|
||||
// 位置
|
||||
if (p.loc) document.getElementById('locText').textContent = p.loc;
|
||||
// 站点信息
|
||||
if (p.station) document.getElementById('stationLine').textContent = '站点信息：' + p.station + (p.stationAddr ? '（' + p.stationAddr + '）' : '');
|
||||
// 接听状态
|
||||
var answered = p.answered === '1';
|
||||
var answerCaps = document.getElementById('answerCaps');
|
||||
answerCaps.textContent = answered ? '已接听' : '未接听';
|
||||
answerCaps.className = 'caps ' + (answered ? 'caps--yes' : 'caps--no');
|
||||
// 时间行：呼叫时间 + （已接听时）接听时间 + 通话时长
|
||||
var timeLine = document.getElementById('timeLine');
|
||||
var t = '呼叫时间 ' + (p.time || '—');
|
||||
if (answered) t += ' 接听时间 ' + (p.answerTime || '—') + ' 通话时长 ' + (p.duration || '—');
|
||||
timeLine.textContent = t;
|
||||
// 处理状态
|
||||
var done = p.done === '1';
|
||||
var donePill = document.getElementById('donePill');
|
||||
donePill.textContent = done ? '已处理' : '待处理';
|
||||
donePill.className = done ? 'pill--done' : 'pill--wait';
|
||||
document.getElementById('rescueFill').style.display = done ? 'none' : 'block';
|
||||
document.getElementById('rescueView').style.display = done ? 'block' : 'none';
|
||||
// 员工信息：存在 / 未知
|
||||
var hasEmp = p.hasEmp === '1';
|
||||
var empKv = document.getElementById('empKv');
|
||||
var viewArchiveBtn = document.getElementById('viewArchiveBtn');
|
||||
if (hasEmp) {
|
||||
viewArchiveBtn.style.display = '';
|
||||
empKv.classList.remove('kv--empty');
|
||||
empKv.innerHTML =
|
||||
'<div>姓名：<b>' + (p.name || '—') + '</b></div>' +
|
||||
'<div>性别/年龄：<b>' + (p.sex || '—') + ' · ' + (p.age || '—') + '岁</b></div>' +
|
||||
'<div>员工编号：<b>' + (p.empno || '—') + '</b></div>' +
|
||||
'<div>单位/部门：<b>' + (p.unit || '—') + '</b></div>' +
|
||||
'<div>联系电话：<b>' + (p.phone || '—') + '</b></div>' +
|
||||
'<div>慢病干预：<b>' + (p.disease || '—') + '</b></div>';
|
||||
} else {
|
||||
viewArchiveBtn.style.display = 'none';
|
||||
empKv.classList.add('kv--empty');
|
||||
empKv.innerHTML = '员工信息未知（未跟踪到员工信息）';
|
||||
}
|
||||
})();
|
||||
document.addEventListener('click', function (e) {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
var mp = document.getElementById('medPanel');
|
||||
if (mp && !(e.target.closest && e.target.closest('.msel'))) mp.classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@@ -34,33 +34,42 @@
|
||||
.panel__btn { flex: 1; text-align: center; padding: 7px 0; border-radius: 14px; background: #e7f4ff; color: #1890ff; font-size: 12px; cursor: pointer; border: none; }
|
||||
.content { flex: 1; overflow-y: auto; padding: 16px 20px; scrollbar-width: none; }
|
||||
.content::-webkit-scrollbar { display: none; }
|
||||
.adv-note { font-size: 12px; color: #fa8c16; background: rgba(252,163,24,.08); border-radius: 8px; padding: 8px 12px; margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
|
||||
.adv-note svg { width: 15px; height: 15px; stroke: #fa8c16; fill: none; stroke-width: 2; flex-shrink: 0; }
|
||||
/* 待处理/已处理 单选切换（带计数） */
|
||||
.seg { background: #fff; border-radius: 12px; padding: 12px 16px; display: flex; align-items: center; gap: 26px; box-shadow: 0 2px 8px rgba(74,90,127,.06); font-size: 13px; color: #4a5a7f; }
|
||||
.seg label { display: flex; align-items: center; gap: 7px; cursor: pointer; }
|
||||
.seg input { accent-color: #1890ff; width: 15px; height: 15px; }
|
||||
.seg .cnt { background: #f0f2f5; border-radius: 10px; padding: 0 8px; font-size: 11px; color: #4a5a7f; }
|
||||
.seg .cnt--red { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
/* 筛选条件 */
|
||||
.search-bar { background: #fff; border-radius: 12px; padding: 14px 16px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.search-bar__item { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.search-bar__input { height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; min-width: 150px; outline: none; background: #fff; }
|
||||
.search-bar__input:focus { border-color: #1890ff; }
|
||||
.search-bar__input--range { min-width: 190px; }
|
||||
.btn { height: 32px; padding: 0 16px; border-radius: 6px; border: 1px solid #d9dee8; background: #fff; color: #4a5a7f; font-size: 13px; cursor: pointer; }
|
||||
.btn--primary { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* 待处理/已处理 选项卡切换（带计数） */
|
||||
.tabs { background: #fff; border-radius: 12px; padding: 12px 16px; display: flex; align-items: center; gap: 8px; box-shadow: 0 2px 8px rgba(74,90,127,.06); font-size: 13px; color: #4a5a7f; margin-top: 14px; }
|
||||
.tab { display: flex; align-items: center; gap: 7px; padding: 7px 18px; border-radius: 8px; cursor: pointer; color: #4a5a7f; }
|
||||
.tab:hover { background: #f2f6ff; }
|
||||
.tab--active { background: #1890ff; color: #fff; }
|
||||
.tab .cnt { background: #f0f2f5; border-radius: 10px; padding: 0 8px; font-size: 11px; color: #4a5a7f; }
|
||||
.tab .cnt--red { background: rgba(253,33,33,.1); color: #fd2121; }
|
||||
.tab--active .cnt, .tab--active .cnt--red { background: rgba(255,255,255,.25); color: #fff; }
|
||||
/* 呼叫卡片 */
|
||||
.bgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 14px; }
|
||||
.bcard { background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; display: flex; gap: 14px; align-items: center; }
|
||||
.bcard { background: #fff; border-radius: 16px; padding: 16px 18px; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; display: flex; gap: 14px; align-items: flex-start; }
|
||||
.bcard:hover { box-shadow: 0 8px 20px rgba(74,90,127,.16); }
|
||||
.bcard--urgent { border: 1.5px solid #fd2121; }
|
||||
.bicon { width: 46px; height: 46px; border-radius: 12px; background: rgba(253,33,33,.08); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.bicon svg { width: 24px; height: 24px; stroke: #fd2121; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
|
||||
.bicon--done { background: #f0f2f5; }
|
||||
.bicon--done svg { stroke: #969eb0; }
|
||||
.bcard__mid { flex: 1; min-width: 0; }
|
||||
.bcard__bed { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.bcard__bed small { font-weight: 400; color: #969eb0; font-size: 12px; margin-left: 8px; }
|
||||
.bcard__emp { font-size: 12px; color: #4a5a7f; margin-top: 4px; }
|
||||
.bcard__emp b { color: #333; font-weight: 500; }
|
||||
.bcard__emp .unknown { color: #b7bfcc; }
|
||||
.bcard__right { text-align: right; flex-shrink: 0; }
|
||||
.btime { font-size: 11px; color: #969eb0; margin-bottom: 6px; }
|
||||
.bcard__bed { font-size: 14px; font-weight: 600; color: #333; line-height: 1.4; }
|
||||
.ctag { display: inline-block; font-size: 11px; font-weight: 500; padding: 1px 8px; border-radius: 4px; margin-right: 8px; vertical-align: 1px; }
|
||||
.ctag--bed { background: #e7f4ff; color: #1890ff; }
|
||||
.ctag--dorm { background: #f4ecff; color: #722ed1; }
|
||||
.bcard__info { background: #f5f7fa; border-radius: 8px; padding: 8px 12px; margin-top: 8px; }
|
||||
.bcard__emp { font-size: 13px; color: #4a5a7f; line-height: 1.5; }
|
||||
.bcard__emp b { color: #333; font-weight: 600; }
|
||||
.bcard__emp .unknown { color: #b7bfcc; font-weight: 400; }
|
||||
.bcard__unit { font-size: 12px; color: #4a5a7f; margin-top: 3px; line-height: 1.5; }
|
||||
.bcard__addr { font-size: 12px; color: #969eb0; margin-top: 5px; line-height: 1.6; }
|
||||
.bcard__right { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; padding-top: 2px; }
|
||||
.btime { font-size: 11px; color: #969eb0; white-space: nowrap; }
|
||||
/* 接听状态胶囊 */
|
||||
.caps { display: inline-block; padding: 2px 12px; border-radius: 12px; font-size: 11px; }
|
||||
.caps { display: inline-block; padding: 2px 12px; border-radius: 12px; font-size: 11px; white-space: nowrap; }
|
||||
.caps--no { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.caps--yes { background: #7adb7f; color: #098a2d; }
|
||||
.panel { display: none; }
|
||||
@@ -83,7 +92,7 @@
|
||||
<a class="nav__item nav__item--active" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -108,44 +117,57 @@
|
||||
</header>
|
||||
|
||||
<div class="content">
|
||||
<!-- [状态] 床头呼叫依赖宿舍呼叫器改造，仅 A01A34 医疗点开通 -->
|
||||
<div class="adv-note"><svg viewBox="0 0 24 24"><path d="M12 9v4M12 17h.01M10.3 3.9L1.8 18a2 2 0 001.7 3h17a2 2 0 001.7-3L13.7 3.9a2 2 0 00-3.4 0z" stroke-linecap="round" stroke-linejoin="round"/></svg>本页面依赖宿舍床头呼叫器接入，仅 A01A34（定边第一医疗点）可见。</div>
|
||||
<div class="search-bar">
|
||||
<div class="search-bar__item">姓名<input class="search-bar__input" placeholder="请输入姓名"></div>
|
||||
<div class="search-bar__item">员工编号<input class="search-bar__input" placeholder="请输入员工编号"></div>
|
||||
<div class="search-bar__item">日期范围<input class="search-bar__input search-bar__input--range" placeholder="开始日期 ~ 结束日期"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
|
||||
<div class="seg">
|
||||
<!-- [交互] 单选切换呼叫记录状态列表 -->
|
||||
<label><input type="radio" name="st" checked onclick="switchState('wait')">待处理<span class="cnt cnt--red">3</span></label>
|
||||
<label><input type="radio" name="st" onclick="switchState('done')">已处理<span class="cnt">12</span></label>
|
||||
<div class="tabs">
|
||||
<!-- [交互] 选项卡切换呼叫记录状态列表 -->
|
||||
<div class="tab tab--active" id="tab-wait" onclick="switchState('wait')">待处理<span class="cnt cnt--red">3</span></div>
|
||||
<div class="tab" id="tab-done" onclick="switchState('done')">已处理<span class="cnt">12</span></div>
|
||||
<span style="margin-left:auto;font-size:12px;color:#969eb0">呼叫超时 5 分钟未接听将升级推送至作业区值班领导</span>
|
||||
</div>
|
||||
|
||||
<!-- 待处理 -->
|
||||
<div class="panel on" id="p-wait">
|
||||
<div class="bgrid">
|
||||
<!-- [交互] 点击进入呼叫处理详情: bed-detail.html -->
|
||||
<div class="bcard bcard--urgent" onclick="location.href='bed-detail.html'">
|
||||
<div class="bicon"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg></div>
|
||||
<!-- [交互] 点击进入呼叫处理详情，携带卡片状态: bed-detail.html -->
|
||||
<div class="bcard bcard--urgent" onclick="goBedDetail({type:'bed',loc:'三号宿舍楼 · 3层305室 · 5号床',name:'岳春生',sex:'男',age:'54',empno:'1035678',unit:'陕E作业区 / 管理四中心',phone:'13991232214',disease:'高血压、糖尿病',station:'管理四中心站点',stationAddr:'陕西省榆林市定边县安边镇兴隆路18号',answered:0,done:0,hasEmp:1,time:'2026-09-09 09:47:32'})">
|
||||
<div class="bcard__mid">
|
||||
<div class="bcard__bed">三号宿舍楼 · 5号床<small>呼叫器 BJ-03-05</small></div>
|
||||
<div class="bcard__emp">岳春生 · 男 · 54岁 <b>陕E作业区 / 管理四中心</b></div>
|
||||
<div class="bcard__bed"><span class="ctag ctag--bed">床头呼叫</span>三号宿舍楼 · 3层305室 · 5号床</div>
|
||||
<div class="bcard__info">
|
||||
<div class="bcard__emp"><b>岳春生</b> 男 · 54岁 · 员工编号 1035678</div>
|
||||
<div class="bcard__unit">陕E作业区 / 管理四中心</div>
|
||||
</div>
|
||||
<div class="bcard__addr">站点信息：管理四中心站点（陕西省榆林市定边县安边镇兴隆路18号）</div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">今天 09:47</div><span class="caps caps--no">未接听</span></div>
|
||||
<div class="bcard__right"><div class="btime">2026-09-09 09:47:32</div><span class="caps caps--no">未接听</span></div>
|
||||
</div>
|
||||
<div class="bcard" onclick="location.href='bed-detail.html'">
|
||||
<div class="bicon"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg></div>
|
||||
<div class="bcard" onclick="goBedDetail({type:'dorm',loc:'一号宿舍楼 · 2层201室',station:'安边集输站点',stationAddr:'陕西省榆林市定边县安边镇北郊工业园区',answered:1,done:0,hasEmp:0,time:'2026-09-09 08:31:05',answerTime:'2026-09-09 08:32:10',duration:'1 分 05 秒'})">
|
||||
<div class="bcard__mid">
|
||||
<div class="bcard__bed">一号宿舍楼 · 2号床<small>呼叫器 BJ-01-02</small></div>
|
||||
<div class="bcard__bed"><span class="ctag ctag--dorm">宿舍呼叫</span>一号宿舍楼 · 2层201室</div>
|
||||
<!-- [状态] 员工信息未知：床位未登记人员时呼叫无法关联员工 -->
|
||||
<div class="bcard__emp"><span class="unknown">员工信息未知（该床位未登记人员）</span></div>
|
||||
<div class="bcard__info">
|
||||
<div class="bcard__emp"><span class="unknown">员工信息未知（未跟踪到员工信息）</span></div>
|
||||
</div>
|
||||
<div class="bcard__addr">站点信息：安边集输站点（陕西省榆林市定边县安边镇北郊工业园区）</div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">今天 08:31</div><span class="caps caps--no">未接听</span></div>
|
||||
<div class="bcard__right"><div class="btime">2026-09-09 08:31:05</div><span class="caps caps--yes">已接听</span></div>
|
||||
</div>
|
||||
<div class="bcard" onclick="location.href='bed-detail.html'">
|
||||
<div class="bicon"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg></div>
|
||||
<div class="bcard" onclick="goBedDetail({type:'bed',loc:'二号宿舍楼 · 1层103室 · 3号床',name:'付桂荣',sex:'女',age:'52',empno:'1044518',unit:'采油二大队',phone:'13709122418',disease:'糖尿病',station:'采油二大队站点',stationAddr:'陕西省榆林市定边县砖井镇南大街36号',answered:0,done:0,hasEmp:1,time:'2026-09-09 06:12:41'})">
|
||||
<div class="bcard__mid">
|
||||
<div class="bcard__bed">二号宿舍楼 · 3号床<small>呼叫器 BJ-02-03</small></div>
|
||||
<div class="bcard__emp">付桂荣 · 女 · 52岁 <b>采油二大队</b></div>
|
||||
<div class="bcard__bed"><span class="ctag ctag--bed">床头呼叫</span>二号宿舍楼 · 1层103室 · 3号床</div>
|
||||
<div class="bcard__info">
|
||||
<div class="bcard__emp"><b>付桂荣</b> 女 · 52岁 · 员工编号 1044518</div>
|
||||
<div class="bcard__unit">采油二大队</div>
|
||||
</div>
|
||||
<div class="bcard__addr">站点信息：采油二大队站点（陕西省榆林市定边县砖井镇南大街36号）</div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">今天 06:12</div><span class="caps caps--no">未接听</span></div>
|
||||
<div class="bcard__right"><div class="btime">2026-09-09 06:12:41</div><span class="caps caps--no">未接听</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -153,29 +175,38 @@
|
||||
<!-- 已处理 -->
|
||||
<div class="panel" id="p-done">
|
||||
<div class="bgrid">
|
||||
<div class="bcard" onclick="location.href='bed-detail.html'">
|
||||
<div class="bicon bicon--done"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg></div>
|
||||
<div class="bcard" onclick="goBedDetail({type:'bed',loc:'三号宿舍楼 · 3层305室 · 5号床',name:'岳春生',sex:'男',age:'54',empno:'1035678',unit:'陕E作业区 / 管理四中心',phone:'13991232214',disease:'高血压、糖尿病',station:'管理四中心站点',stationAddr:'陕西省榆林市定边县安边镇兴隆路18号',answered:1,done:1,hasEmp:1,time:'2026-09-08 21:03:18',answerTime:'2026-09-08 21:03:40',duration:'2 分 15 秒'})">
|
||||
<div class="bcard__mid">
|
||||
<div class="bcard__bed">三号宿舍楼 · 5号床<small>呼叫器 BJ-03-05</small></div>
|
||||
<div class="bcard__emp">岳春生 · 男 · 54岁 <b>陕E作业区 / 管理四中心</b></div>
|
||||
<div class="bcard__bed"><span class="ctag ctag--bed">床头呼叫</span>三号宿舍楼 · 3层305室 · 5号床</div>
|
||||
<div class="bcard__info">
|
||||
<div class="bcard__emp"><b>岳春生</b> 男 · 54岁 · 员工编号 1035678</div>
|
||||
<div class="bcard__unit">陕E作业区 / 管理四中心</div>
|
||||
</div>
|
||||
<div class="bcard__addr">站点信息：管理四中心站点（陕西省榆林市定边县安边镇兴隆路18号）</div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">昨天 21:03</div><span class="caps caps--yes">已接听</span></div>
|
||||
<div class="bcard__right"><div class="btime">2026-09-08 21:03:18</div><span class="caps caps--yes">已接听</span></div>
|
||||
</div>
|
||||
<div class="bcard" onclick="location.href='bed-detail.html'">
|
||||
<div class="bicon bicon--done"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg></div>
|
||||
<div class="bcard" onclick="goBedDetail({type:'dorm',loc:'一号宿舍楼 · 3层308室',name:'戴文广',sex:'男',age:'58',empno:'1031002',unit:'采油一大队',phone:'13609123076',disease:'高血压',station:'采油一大队站点',stationAddr:'陕西省榆林市定边县白泥井镇东环路12号',answered:1,done:1,hasEmp:1,time:'2026-09-08 15:40:52',answerTime:'2026-09-08 15:41:08',duration:'3 分 42 秒'})">
|
||||
<div class="bcard__mid">
|
||||
<div class="bcard__bed">一号宿舍楼 · 8号床<small>呼叫器 BJ-01-08</small></div>
|
||||
<div class="bcard__emp">戴文广 · 男 · 58岁 <b>采油一大队</b></div>
|
||||
<div class="bcard__bed"><span class="ctag ctag--dorm">宿舍呼叫</span>一号宿舍楼 · 3层308室</div>
|
||||
<div class="bcard__info">
|
||||
<div class="bcard__emp"><b>戴文广</b> 男 · 58岁 · 员工编号 1031002</div>
|
||||
<div class="bcard__unit">采油一大队</div>
|
||||
</div>
|
||||
<div class="bcard__addr">站点信息：采油一大队站点（陕西省榆林市定边县白泥井镇东环路12号）</div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">昨天 15:40</div><span class="caps caps--yes">已接听</span></div>
|
||||
<div class="bcard__right"><div class="btime">2026-09-08 15:40:52</div><span class="caps caps--yes">已接听</span></div>
|
||||
</div>
|
||||
<div class="bcard" onclick="location.href='bed-detail.html'">
|
||||
<div class="bicon bicon--done"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg></div>
|
||||
<div class="bcard" onclick="goBedDetail({type:'bed',loc:'二号宿舍楼 · 1层101室 · 1号床',name:'曲志明',sex:'男',age:'45',empno:'1037781',unit:'输气作业区',phone:'13809122845',disease:'冠心病、高血压',station:'输气作业区站点',stationAddr:'陕西省榆林市定边县杨井镇创业路28号',answered:1,done:1,hasEmp:1,time:'2026-09-01 23:18:07',answerTime:'2026-09-01 23:18:30',duration:'5 分 08 秒'})">
|
||||
<div class="bcard__mid">
|
||||
<div class="bcard__bed">二号宿舍楼 · 1号床<small>呼叫器 BJ-02-01</small></div>
|
||||
<div class="bcard__emp"><span class="unknown">员工信息未知</span> <a class="link" style="color:#1890ff;font-size:12px" onclick="event.stopPropagation();alert('在呼叫详情中关联员工（原型演示）')">去关联</a></div>
|
||||
<div class="bcard__bed"><span class="ctag ctag--bed">床头呼叫</span>二号宿舍楼 · 1层101室 · 1号床</div>
|
||||
<div class="bcard__info">
|
||||
<div class="bcard__emp"><b>曲志明</b> 男 · 45岁 · 员工编号 1037781</div>
|
||||
<div class="bcard__unit">输气作业区</div>
|
||||
</div>
|
||||
<div class="bcard__addr">站点信息：输气作业区站点（陕西省榆林市定边县杨井镇创业路28号）</div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">09-01 23:18</div><span class="caps caps--yes">已接听</span></div>
|
||||
<div class="bcard__right"><div class="btime">2026-09-01 23:18:07</div><span class="caps caps--yes">已接听</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -187,6 +218,14 @@
|
||||
function switchState(name) {
|
||||
document.querySelectorAll('.panel').forEach(function (p) { p.classList.remove('on'); });
|
||||
document.getElementById('p-' + name).classList.add('on');
|
||||
document.querySelectorAll('.tab').forEach(function (t) { t.classList.remove('tab--active'); });
|
||||
document.getElementById('tab-' + name).classList.add('tab--active');
|
||||
}
|
||||
// 跳转呼叫处理详情，携带卡片状态信息
|
||||
function goBedDetail(d) {
|
||||
var parts = [];
|
||||
for (var k in d) parts.push(encodeURIComponent(k) + '=' + encodeURIComponent(d[k]));
|
||||
location.href = 'bed-detail.html?' + parts.join('&');
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
|
||||
@@ -46,6 +46,24 @@
|
||||
.tag { display: inline-block; padding: 2px 10px; border-radius: 4px; font-size: 11px; margin-right: 6px; }
|
||||
.tag--ht { background: rgba(24,144,255,.2); color: #1890ff; }
|
||||
.tag--dm { background: rgba(42,193,139,.2); color: #2ac18b; }
|
||||
/* 慢病类型色块（更换疾病弹窗） */
|
||||
.type-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
|
||||
.type-opt { position: relative; height: 62px; border-radius: 10px; border: 1.5px solid transparent; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; cursor: pointer; transition: all .15s; }
|
||||
.type-opt .chk { position: absolute; top: -7px; right: -7px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.18); display: none; align-items: center; justify-content: center; }
|
||||
.type-opt .chk svg { width: 13px; height: 13px; }
|
||||
.type-opt.on .chk { display: flex; }
|
||||
.t-ht { background: rgba(24,144,255,.1); color: #1890ff; }
|
||||
.t-chd { background: rgba(0,195,195,.1); color: #00c3c3; }
|
||||
.t-ob { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
.t-dm { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.t-over { background: rgba(238,101,87,.12); color: #EE6557; }
|
||||
.t-oth { background: rgba(104,98,214,.12); color: #6862D6; }
|
||||
.type-opt.on.t-ht { border-color: #1890ff; }
|
||||
.type-opt.on.t-chd { border-color: #00c3c3; }
|
||||
.type-opt.on.t-ob { border-color: #fca318; }
|
||||
.type-opt.on.t-dm { border-color: #2ac18b; }
|
||||
.type-opt.on.t-over { border-color: #EE6557; }
|
||||
.type-opt.on.t-oth { border-color: #6862D6; }
|
||||
/* Tab */
|
||||
.tabs { background: #fff; border-radius: 14px; margin-top: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.tabs__head { display: flex; gap: 30px; padding: 0 20px; border-bottom: 1px solid #f0f2f5; }
|
||||
@@ -103,7 +121,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -134,49 +152,68 @@
|
||||
<div class="top-card">
|
||||
<span class="avatar">岳</span>
|
||||
<div class="top-card__info">
|
||||
<b>岳春生</b><small>男 · 54岁 · 工号 1035678</small><span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span><br>
|
||||
单位/部门：陕E作业区 / 管理四中心 联系电话：139****2214 确诊时间：2019-06（高血压）/ 2022-03（糖尿病）
|
||||
<b>岳春生</b><small>男 · 54岁 · 员工编号 1035678</small><span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span><br>
|
||||
单位部门：陕E作业区-管理四中心 联系电话：13956282214 入组时间：2025-03-12
|
||||
</div>
|
||||
<div style="text-align:right;font-size:12px;color:#4a5a7f;line-height:2.1">
|
||||
干预周期：<b style="color:#333">每季度1次</b><br>下次随访：<span class="pill pill--wait">2026-10-04 · 还剩30天</span><br>
|
||||
<!-- [交互] 编辑打开慢病干预抽屉（回填数据）: chronic-disease-drawer.html -->
|
||||
<button class="btn btn--primary" onclick="location.href='chronic-disease-drawer.html'">编辑干预</button>
|
||||
<!-- [交互] 编辑干预：打开更换疾病弹窗，仅可调整慢病类型 -->
|
||||
<button class="btn btn--primary" onclick="openModal('diseaseModal')">编辑干预</button><br>
|
||||
<!-- [交互] 跳转员工档案详情: employee-file-detail.html -->
|
||||
<button class="btn" style="margin-top:8px" onclick="location.href='employee-file-detail.html'">员工档案</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tabs__head">
|
||||
<!-- [交互] Tab 切换下方内容区 -->
|
||||
<span class="tabs__item on" onclick="switchTab('med',this)">用药方案<small>(3)</small></span>
|
||||
<span class="tabs__item" onclick="switchTab('follow',this)">随访记录<small>(3)</small></span>
|
||||
<span class="tabs__item on" onclick="switchTab('follow',this)">随访记录<small>(3)</small></span>
|
||||
<span class="tabs__item" onclick="switchTab('visit',this)">就诊记录<small>(3)</small></span>
|
||||
<span class="tabs__item" onclick="switchTab('med',this)">用药方案<small>(3)</small></span>
|
||||
</div>
|
||||
<div class="tabs__body">
|
||||
<!-- 用药方案 -->
|
||||
<div class="panel on" id="p-med">
|
||||
<table class="table">
|
||||
<tr><th>药品名称</th><th>规格</th><th>用法用量</th><th>生效日期</th><th>状态</th><th style="width:80px">操作</th></tr>
|
||||
<tr><td>苯磺酸氨氯地平片</td><td>5mg×7片</td><td>口服，一日1次，一次1片</td><td>2026-06-01</td><td><span class="pill pill--on">使用中</span></td><td><a class="link" onclick="openModal('medModal')">查看</a></td></tr>
|
||||
<tr><td>二甲双胍缓释片</td><td>0.5g×30片</td><td>口服，一日2次，一次1片</td><td>2026-03-15</td><td><span class="pill pill--on">使用中</span></td><td><a class="link" onclick="openModal('medModal')">查看</a></td></tr>
|
||||
<tr><td>硝苯地平控释片</td><td>30mg×7片</td><td>口服，一日1次，一次1片</td><td>2024-09-01</td><td><span class="pill pill--off">已停用</span></td><td><a class="link" onclick="openModal('medModal')">查看</a></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<!-- 随访记录 -->
|
||||
<div class="panel" id="p-follow">
|
||||
<div class="panel on" id="p-follow">
|
||||
<div style="display:flex;gap:10px;align-items:center;margin-bottom:12px">
|
||||
<span style="font-size:13px;color:#4a5a7f">随访日期</span>
|
||||
<input style="width:220px;height:32px;border:1px solid #d9dee8;border-radius:6px;padding:0 10px;font-size:13px;outline:none" placeholder="开始日期 ~ 结束日期">
|
||||
<button class="btn">搜 索</button>
|
||||
<span style="flex:1"></span>
|
||||
<button class="btn btn--primary">＋ 新增随访</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>随访日期</th><th>随访形式</th><th>症状</th><th>血压(mmHg)</th><th>血糖(mmol/L)</th><th>效果评价</th><th>随访医生</th><th style="width:50px">操作</th></tr>
|
||||
<tr><td>2026-08-20</td><td>门诊随访</td><td>偶有头晕，血压波动</td><td>158/98</td><td>8.2</td><td>一般</td><td>石维国</td><td><a class="link" href="follow-records.html">查看</a></td></tr>
|
||||
<tr><td>2026-05-18</td><td>门诊随访</td><td>症状平稳</td><td>148/92</td><td>7.6</td><td>良好</td><td>石维国</td><td><a class="link" href="follow-records.html">查看</a></td></tr>
|
||||
<tr><td>2026-02-10</td><td>电话随访</td><td>自述服药不规律</td><td>—</td><td>—</td><td>一般</td><td>韩丽平</td><td><a class="link" href="follow-records.html">查看</a></td></tr>
|
||||
<tr><th style="width:50px">序号</th><th>随访日期</th><th>随访医生</th><th>症状</th><th>下次随访日期</th><th style="width:60px">操作</th></tr>
|
||||
<tr><td>1</td><td>2026-08-20</td><td>石维国</td><td>偶有头晕，血压波动</td><td>2026-09-20</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>2</td><td>2026-05-18</td><td>石维国</td><td>症状平稳</td><td>2026-06-18</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>3</td><td>2026-02-10</td><td>韩丽平</td><td>自述服药不规律</td><td>2026-03-12</td><td><a class="link">详情</a></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<!-- 就诊记录 -->
|
||||
<div class="panel" id="p-visit">
|
||||
<div style="display:flex;gap:10px;align-items:center;margin-bottom:12px">
|
||||
<span style="font-size:13px;color:#4a5a7f">就诊日期</span>
|
||||
<input style="width:220px;height:32px;border:1px solid #d9dee8;border-radius:6px;padding:0 10px;font-size:13px;outline:none" placeholder="开始日期 ~ 结束日期">
|
||||
<button class="btn">搜 索</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>就诊日期</th><th>主诉</th><th>诊断</th><th>接诊医生</th><th style="width:50px">操作</th></tr>
|
||||
<tr><td>2026-08-21</td><td>晨起后头晕、后颈部发紧</td><td>原发性高血压3级（很高危）；2型糖尿病</td><td>石维国</td><td><a class="link" onclick="openModal('visitModal')">详情</a></td></tr>
|
||||
<tr><td>2026-07-14</td><td>血压偶有偏高</td><td>血压偏高，建议复查</td><td>韩丽平</td><td><a class="link" onclick="openModal('visitModal')">详情</a></td></tr>
|
||||
<tr><td>2026-05-09</td><td>血糖控制欠佳</td><td>2型糖尿病复查，血糖控制一般</td><td>石维国</td><td><a class="link" onclick="openModal('visitModal')">详情</a></td></tr>
|
||||
<tr><th style="width:50px">序号</th><th>就诊日期</th><th>就诊医疗点</th><th>就诊医生</th><th>就诊疾病</th><th style="width:60px">操作</th></tr>
|
||||
<tr><td>1</td><td>2026-08-21</td><td>定边第一医疗点</td><td>石维国</td><td>原发性高血压3级（很高危）；2型糖尿病</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>2</td><td>2026-07-14</td><td>定边第一医疗点</td><td>韩丽平</td><td>血压偏高，建议复查</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>3</td><td>2026-05-09</td><td>定边第一医疗点</td><td>石维国</td><td>2型糖尿病复查，血糖控制一般</td><td><a class="link">详情</a></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<!-- 用药方案 -->
|
||||
<div class="panel" id="p-med">
|
||||
<div style="display:flex;gap:10px;align-items:center;margin-bottom:12px">
|
||||
<input style="width:240px;height:32px;border:1px solid #d9dee8;border-radius:6px;padding:0 10px;font-size:13px;outline:none" placeholder="请输入药物名称搜索">
|
||||
<button class="btn">搜 索</button>
|
||||
<span style="flex:1"></span>
|
||||
<button class="btn btn--primary" onclick="openModal('addMedModal')">＋ 新增用药</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>药物名称</th><th>规格</th><th>用法用量</th><th>服用开始日期</th><th>服用结束日期</th><th style="width:110px">操作</th></tr>
|
||||
<tr><td>苯磺酸氨氯地平片</td><td>5mg×7片</td><td>口服，一日1次，一次1片</td><td>2026-06-01</td><td>长期</td><td><a class="link" onclick="openModal('medModal')">编辑</a><a class="link" style="color:#f5222d" onclick="openModal('delMedModal')">删除</a></td></tr>
|
||||
<tr><td>二甲双胍缓释片</td><td>0.5g×30片</td><td>口服，一日2次，一次1片</td><td>2026-03-15</td><td>长期</td><td><a class="link" onclick="openModal('medModal')">编辑</a><a class="link" style="color:#f5222d" onclick="openModal('delMedModal')">删除</a></td></tr>
|
||||
<tr><td>硝苯地平控释片</td><td>30mg×7片</td><td>口服，一日1次，一次1片</td><td>2024-09-01</td><td>2025-08-31</td><td><a class="link" onclick="openModal('medModal')">编辑</a><a class="link" style="color:#f5222d" onclick="openModal('delMedModal')">删除</a></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
@@ -214,6 +251,60 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：新增用药 -->
|
||||
<div class="overlay" id="addMedModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head"><span class="modal__title">新增用药</span><button class="modal__close" onclick="closeModal('addMedModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div class="fld"><span class="fld__label"><span style="color:#fd2121">*</span>药物名称</span><input id="medDrugName" placeholder="请输入或搜索药物名称"></div>
|
||||
<div class="fld"><span class="fld__label">规格</span><input placeholder="如 5mg×7片"></div>
|
||||
<div class="fld"><span class="fld__label"><span style="color:#fd2121">*</span>用法用量</span><input id="medUsage" placeholder="如 口服，一日1次，一次1片"></div>
|
||||
<div class="fld"><span class="fld__label">服用开始日期</span><input placeholder="YYYY-MM-DD"></div>
|
||||
<div class="fld"><span class="fld__label">服用结束日期</span><input placeholder="长期可留空"></div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('addMedModal')">取 消</button>
|
||||
<button class="btn btn--primary" onclick="saveMed()">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：删除用药确认 -->
|
||||
<div class="overlay" id="delMedModal">
|
||||
<div class="modal" style="width:400px">
|
||||
<div class="modal__head"><span class="modal__title">删除用药方案</span><button class="modal__close" onclick="closeModal('delMedModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<p style="font-size:13px;color:#4a5a7f;line-height:1.8">确认删除该用药方案吗？删除后不可恢复。</p>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('delMedModal')">取 消</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('delMedModal')">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：更换疾病 -->
|
||||
<div class="overlay" id="diseaseModal">
|
||||
<div class="modal" style="width:620px">
|
||||
<div class="modal__head"><span class="modal__title">更换疾病</span><button class="modal__close" onclick="closeModal('diseaseModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div style="font-size:13px;font-weight:600;color:#333;border-left:3px solid #1890ff;padding-left:8px;margin-bottom:12px">慢病类型<span style="font-size:12px;font-weight:400;color:#969eb0;margin-left:10px">可多选</span></div>
|
||||
<div class="type-grid">
|
||||
<div class="type-opt t-ht on" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#1890ff"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>高血压</div>
|
||||
<div class="type-opt t-chd" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#00c3c3"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>冠心病</div>
|
||||
<div class="type-opt t-ob" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#fca318"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>肥胖</div>
|
||||
<div class="type-opt t-dm on" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#2ac18b"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>糖尿病</div>
|
||||
<div class="type-opt t-over" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#EE6557"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>超重</div>
|
||||
<div class="type-opt t-oth" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#6862D6"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>其他</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('diseaseModal')">取 消</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('diseaseModal')">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：就诊详情 -->
|
||||
<div class="overlay" id="visitModal">
|
||||
<div class="modal modal--760">
|
||||
@@ -250,6 +341,16 @@
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
// 新增用药：药物名称、用法用量为必填
|
||||
function saveMed() {
|
||||
var name = document.getElementById('medDrugName').value.trim();
|
||||
var usage = document.getElementById('medUsage').value.trim();
|
||||
if (!name) { alert('请输入药物名称'); return; }
|
||||
if (!usage) { alert('请输入用法用量'); return; }
|
||||
closeModal('addMedModal');
|
||||
}
|
||||
// 更换疾病：色块选中切换
|
||||
function toggleDisease(el) { el.classList.toggle('on'); }
|
||||
// Tab 切换
|
||||
function switchTab(name, el) {
|
||||
document.querySelectorAll('.tabs__item').forEach(function (t) { t.classList.remove('on'); });
|
||||
|
||||
@@ -66,38 +66,38 @@
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回慢病干预列表: chronic-disease.html -->
|
||||
<a class="drawer__back" href="chronic-disease.html">‹ 返回</a>
|
||||
<span class="drawer__title">新增慢病干预</span>
|
||||
<span class="drawer__title" id="drawerTitle">新增慢病干预</span>
|
||||
</div>
|
||||
|
||||
<div class="drawer__body">
|
||||
<div class="sec">
|
||||
<div class="sec__title">员工查询</div>
|
||||
<div class="inquiry">
|
||||
<select><option>姓名</option><option>工号</option></select>
|
||||
<select><option>姓名</option><option>员工编号</option></select>
|
||||
<input placeholder="请输入姓名后搜索" value="岳春生">
|
||||
<!-- [交互] 点击搜索显示员工结果浮层；选中员工后加载其慢病与就诊记录 -->
|
||||
<button class="btn btn--primary" onclick="document.getElementById('iqResult').style.display='block'">搜 索</button>
|
||||
<button class="btn">重 置</button>
|
||||
<div class="iq-result" id="iqResult">
|
||||
<table>
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>工号</th><th>单位</th><th>部门</th></tr>
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>员工编号</th><th>单位</th><th>部门</th></tr>
|
||||
<tr class="row" onclick="pickEmp()"><td>岳春生</td><td>男</td><td>54</td><td>1035678</td><td>陕E作业区</td><td>管理四中心</td></tr>
|
||||
<tr class="row" onclick="pickEmp()"><td>岳春明</td><td>男</td><td>49</td><td>1035921</td><td>陕E作业区</td><td>注水大队</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-grid" style="margin-top:14px">
|
||||
<div class="fld"><span class="fld__label">姓名</span><input value="岳春生" readonly></div>
|
||||
<div class="fld"><span class="fld__label">性别</span><input value="男" readonly></div>
|
||||
<div class="fld"><span class="fld__label">年龄</span><input value="54" readonly></div>
|
||||
<div class="fld"><span class="fld__label">工号</span><input value="1035678" readonly></div>
|
||||
<div class="fld"><span class="fld__label">联系电话</span><input value="139****2214" readonly></div>
|
||||
<div class="fld"><span class="fld__label">身份证号</span><input value="612427********3417" readonly></div>
|
||||
<div class="fld"><span class="fld__label">姓名</span><input id="empName" value="岳春生" readonly></div>
|
||||
<div class="fld"><span class="fld__label">性别</span><input id="empGender" value="男" readonly></div>
|
||||
<div class="fld"><span class="fld__label">年龄</span><input id="empAge" value="54" readonly></div>
|
||||
<div class="fld"><span class="fld__label">员工编号</span><input id="empNo" value="1035678" readonly></div>
|
||||
<div class="fld"><span class="fld__label">联系电话</span><input id="empPhone" value="13956282214" readonly></div>
|
||||
<div class="fld"><span class="fld__label">单位部门</span><input id="empUnitDept" value="陕E作业区-管理四中心" readonly></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">慢病类型<span class="sec__tip">可多选；选择「其他」需填写具体病名</span></div>
|
||||
<div class="sec__title">慢病类型<span class="sec__tip">可多选</span></div>
|
||||
<!-- [交互] 点击色块切换选中态（右上角出现 ✓ 徽标） -->
|
||||
<div class="type-grid">
|
||||
<div class="type-opt t-ht on" onclick="toggleType(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#1890ff"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>高血压</div>
|
||||
@@ -107,32 +107,17 @@
|
||||
<div class="type-opt t-over" onclick="toggleType(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#EE6557"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>超重</div>
|
||||
<div class="type-opt t-oth" id="othOpt" onclick="toggleType(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#6862D6"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>其他</div>
|
||||
</div>
|
||||
<div class="fld oth-row" id="othRow">
|
||||
<span class="fld__label" style="width:88px"><span style="color:#fd2121">*</span>其他慢病</span>
|
||||
<input placeholder="请填写具体慢病名称，如支气管哮喘">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">就诊记录<span class="sec__tip">自动带出该员工在医疗点的就诊诊断，可勾选作为确诊依据</span></div>
|
||||
<div class="sec__title">就诊记录</div>
|
||||
<table class="table">
|
||||
<tr><th style="width:36px"><input type="checkbox" checked style="accent-color:#1890ff"></th><th>就诊日期</th><th>诊断结论</th><th>接诊医生</th></tr>
|
||||
<tr><td><input type="checkbox" checked style="accent-color:#1890ff"></td><td>2026-08-21</td><td>原发性高血压3级（很高危）；2型糖尿病</td><td>石维国</td></tr>
|
||||
<tr><td><input type="checkbox" style="accent-color:#1890ff"></td><td>2026-07-14</td><td>血压偏高，建议复查</td><td>韩丽平</td></tr>
|
||||
<tr><td><input type="checkbox" style="accent-color:#1890ff"></td><td>2026-05-09</td><td>2型糖尿病复查，血糖控制一般</td><td>石维国</td></tr>
|
||||
<tr><th>就诊日期</th><th>诊断结论</th><th>接诊医生</th></tr>
|
||||
<tr><td>2026-08-21</td><td>原发性高血压3级（很高危）；2型糖尿病</td><td>石维国</td></tr>
|
||||
<tr><td>2026-07-14</td><td>血压偏高，建议复查</td><td>韩丽平</td></tr>
|
||||
<tr><td>2026-05-09</td><td>2型糖尿病复查，血糖控制一般</td><td>石维国</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">干预配置</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld"><span class="fld__label">干预周期</span>
|
||||
<select><option>每月1次</option><option selected>每季度1次</option><option>每半年1次</option></select>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label">首次随访</span><input value="2026-10-04"></div>
|
||||
<div class="fld"><span class="fld__label">干预医生</span><input value="石维国（当前登录）" readonly></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="drawer__foot">
|
||||
@@ -144,11 +129,24 @@
|
||||
|
||||
<script>
|
||||
function pickEmp() { document.getElementById('iqResult').style.display = 'none'; }
|
||||
// 色块选中切换；「其他」选中时显示病名输入行
|
||||
// 新增/编辑模式：?mode=edit 进入编辑态，隐藏搜索并回填固定员工信息
|
||||
(function () {
|
||||
var p = new URLSearchParams(location.search);
|
||||
if (p.get('mode') !== 'edit') return;
|
||||
document.getElementById('drawerTitle').textContent = '编辑慢病干预';
|
||||
document.title = '编辑慢病干预 | 医疗点PAD端';
|
||||
document.querySelector('.inquiry').style.display = 'none';
|
||||
document.getElementById('empName').value = p.get('name') || '';
|
||||
document.getElementById('empGender').value = p.get('gender') || '';
|
||||
document.getElementById('empAge').value = p.get('age') || '';
|
||||
document.getElementById('empNo').value = p.get('empno') || '';
|
||||
document.getElementById('empPhone').value = p.get('phone') || '';
|
||||
var unit = p.get('unit') || '', dept = p.get('dept') || '';
|
||||
document.getElementById('empUnitDept').value = dept ? (unit + '-' + dept) : unit;
|
||||
})();
|
||||
// 色块选中切换
|
||||
function toggleType(el) {
|
||||
el.classList.toggle('on');
|
||||
var show = document.getElementById('othOpt').classList.contains('on');
|
||||
document.getElementById('othRow').classList.toggle('show', show);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
@@ -68,6 +68,24 @@
|
||||
.tag--dm { background: rgba(42,193,139,.2); color: #2ac18b; }
|
||||
.tag--over { background: rgba(238,101,87,.2); color: #EE6557; }
|
||||
.tag--oth { background: rgba(104,98,214,.2); color: #6862D6; }
|
||||
/* 慢病类型色块（更换疾病弹窗） */
|
||||
.type-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
|
||||
.type-opt { position: relative; height: 62px; border-radius: 10px; border: 1.5px solid transparent; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; cursor: pointer; transition: all .15s; }
|
||||
.type-opt .chk { position: absolute; top: -7px; right: -7px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.18); display: none; align-items: center; justify-content: center; }
|
||||
.type-opt .chk svg { width: 13px; height: 13px; }
|
||||
.type-opt.on .chk { display: flex; }
|
||||
.t-ht { background: rgba(24,144,255,.1); color: #1890ff; }
|
||||
.t-chd { background: rgba(0,195,195,.1); color: #00c3c3; }
|
||||
.t-ob { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
.t-dm { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.t-over { background: rgba(238,101,87,.12); color: #EE6557; }
|
||||
.t-oth { background: rgba(104,98,214,.12); color: #6862D6; }
|
||||
.type-opt.on.t-ht { border-color: #1890ff; }
|
||||
.type-opt.on.t-chd { border-color: #00c3c3; }
|
||||
.type-opt.on.t-ob { border-color: #fca318; }
|
||||
.type-opt.on.t-dm { border-color: #2ac18b; }
|
||||
.type-opt.on.t-over { border-color: #EE6557; }
|
||||
.type-opt.on.t-oth { border-color: #6862D6; }
|
||||
/* 卡片右上更多操作 */
|
||||
.more { position: absolute; top: 12px; right: 12px; width: 24px; height: 24px; border-radius: 6px; display: flex; align-items: center; justify-content: center; color: #969eb0; font-size: 16px; font-weight: bold; }
|
||||
.more:hover { background: #f0f2f5; }
|
||||
@@ -106,7 +124,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -131,14 +149,13 @@
|
||||
</header>
|
||||
|
||||
<div class="content">
|
||||
<div style="display:flex;gap:14px;align-items:center">
|
||||
<div class="search-bar" style="flex:1">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar__item">姓名<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">工号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">员工编号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">慢病类型
|
||||
<!-- [交互] 慢病类型多选下拉，勾选后点「确定」按类型过滤列表 -->
|
||||
<div class="msel">
|
||||
<button class="msel__btn" onclick="event.stopPropagation();document.getElementById('typePanel').classList.toggle('open')">请选择 <span class="cnt" id="typeCnt" style="display:none">0</span></button>
|
||||
<button class="msel__btn" onclick="event.stopPropagation();document.getElementById('typePanel').classList.toggle('open')"><span id="typeLabel">请选择</span></button>
|
||||
<div class="msel__panel" id="typePanel" onclick="event.stopPropagation()">
|
||||
<label class="msel__opt"><input type="checkbox" value="高血压">高血压</label>
|
||||
<label class="msel__opt"><input type="checkbox" value="冠心病">冠心病</label>
|
||||
@@ -150,11 +167,13 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-bar__item">入组日期<input class="search-bar__input" style="min-width:200px" placeholder="开始日期 ~ 结束日期"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
<!-- [交互] 点击打开新增慢病干预抽屉: chronic-disease-drawer.html -->
|
||||
<button class="btn btn--primary" style="height:36px;padding:0 20px;flex-shrink:0" onclick="location.href='chronic-disease-drawer.html'">＋ 新增干预</button>
|
||||
</div>
|
||||
<!-- [交互] 点击打开新增慢病干预抽屉: chronic-disease-drawer.html -->
|
||||
<div style="margin-top:14px">
|
||||
<button class="btn btn--primary" style="height:36px;padding:0 20px" onclick="location.href='chronic-disease-drawer.html?mode=add'">＋ 新增慢病人员</button>
|
||||
</div>
|
||||
|
||||
<div class="fgrid">
|
||||
@@ -162,48 +181,48 @@
|
||||
<div class="fcard" onclick="location.href='chronic-disease-detail.html'">
|
||||
<div class="more" onclick="event.stopPropagation();toggleMenu('m1')">⋯
|
||||
<div class="more__menu" id="m1">
|
||||
<!-- [交互] 编辑打开慢病干预抽屉（回填已有数据）: chronic-disease-drawer.html -->
|
||||
<a onclick="event.stopPropagation();location.href='chronic-disease-drawer.html'">编辑</a>
|
||||
<!-- [交互] 编辑打开更换疾病弹窗，回填员工姓名与单位部门 -->
|
||||
<a onclick="event.stopPropagation();openDiseaseModal('岳春生', '陕E作业区-管理四中心')">编辑</a>
|
||||
<a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fcard__top"><span class="avatar">岳</span><span class="fcard__name">岳春生<small>男 · 54岁</small></span></div>
|
||||
<div class="fcard__lines">工号：1035678 <br>单位/部门：<b>陕E作业区 / 管理四中心</b><br>慢病：<span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span><br>最近随访：2026-08-20 · 第3次</div>
|
||||
<div class="fcard__lines">员工编号：1035678 <br>单位部门：<b>陕E作业区-管理四中心</b><br>入组时间：<b>2025-03-12</b><br><span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='chronic-disease-detail.html'">
|
||||
<div class="more" onclick="event.stopPropagation();toggleMenu('m2')">⋯
|
||||
<div class="more__menu" id="m2"><a onclick="event.stopPropagation();location.href='chronic-disease-drawer.html'">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
<div class="more__menu" id="m2"><a onclick="event.stopPropagation();openDiseaseModal('田淑珍', '陕E作业区-转运站')">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
</div>
|
||||
<div class="fcard__top"><span class="avatar">田</span><span class="fcard__name">田淑珍<small>女 · 61岁</small></span></div>
|
||||
<div class="fcard__lines">工号：1042237<br>单位/部门：<b>陕E作业区 / 转运站</b><br>慢病：<span class="tag tag--chd">冠心病</span><span class="tag tag--ht">高血压</span><br>最近随访：2026-08-18 · 第5次</div>
|
||||
<div class="fcard__lines">员工编号：1042237<br>单位部门：<b>陕E作业区-转运站</b><br>入组时间：<b>2024-11-05</b><br><span class="tag tag--chd">冠心病</span><span class="tag tag--ht">高血压</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='chronic-disease-detail.html'">
|
||||
<div class="more" onclick="event.stopPropagation();toggleMenu('m3')">⋯
|
||||
<div class="more__menu" id="m3"><a onclick="event.stopPropagation();location.href='chronic-disease-drawer.html'">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
<div class="more__menu" id="m3"><a onclick="event.stopPropagation();openDiseaseModal('尹立春', '陕E作业区-注水大队')">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
</div>
|
||||
<div class="fcard__top"><span class="avatar">尹</span><span class="fcard__name">尹立春<small>男 · 47岁</small></span></div>
|
||||
<div class="fcard__lines">工号：1028945<br>单位/部门：<b>陕E作业区 / 注水大队</b><br>慢病：<span class="tag tag--ob">肥胖</span><span class="tag tag--over">超重</span><br>最近随访：2026-08-15 · 第2次</div>
|
||||
<div class="fcard__lines">员工编号：1028945<br>单位部门：<b>陕E作业区-注水大队</b><br>入组时间：<b>2025-06-18</b><br><span class="tag tag--ob">肥胖</span><span class="tag tag--over">超重</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='chronic-disease-detail.html'">
|
||||
<div class="more" onclick="event.stopPropagation();toggleMenu('m4')">⋯
|
||||
<div class="more__menu" id="m4"><a onclick="event.stopPropagation();location.href='chronic-disease-drawer.html'">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
<div class="more__menu" id="m4"><a onclick="event.stopPropagation();openDiseaseModal('戴文广', '采油一厂-作业一大队')">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
</div>
|
||||
<div class="fcard__top"><span class="avatar">戴</span><span class="fcard__name">戴文广<small>男 · 58岁</small></span></div>
|
||||
<div class="fcard__lines">工号：1031002<br>单位/部门：<b>采油一大队</b><br>慢病：<span class="tag tag--ht">高血压</span><br>最近随访：2026-08-12 · 第4次</div>
|
||||
<div class="fcard__lines">员工编号：1031002<br>单位部门：<b>采油一厂-作业一大队</b><br>入组时间：<b>2025-01-22</b><br><span class="tag tag--ht">高血压</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='chronic-disease-detail.html'">
|
||||
<div class="more" onclick="event.stopPropagation();toggleMenu('m5')">⋯
|
||||
<div class="more__menu" id="m5"><a onclick="event.stopPropagation();location.href='chronic-disease-drawer.html'">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
<div class="more__menu" id="m5"><a onclick="event.stopPropagation();openDiseaseModal('付桂荣', '采油二厂-作业二大队')">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
</div>
|
||||
<div class="fcard__top"><span class="avatar">付</span><span class="fcard__name">付桂荣<small>女 · 52岁</small></span></div>
|
||||
<div class="fcard__lines">工号：1044518<br>单位/部门：<b>采油二大队</b><br>慢病：<span class="tag tag--dm">糖尿病</span><br>最近随访：2026-08-10 · 第1次</div>
|
||||
<div class="fcard__lines">员工编号：1044518<br>单位部门：<b>采油二厂-作业二大队</b><br>入组时间：<b>2026-02-09</b><br><span class="tag tag--dm">糖尿病</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='chronic-disease-detail.html'">
|
||||
<div class="more" onclick="event.stopPropagation();toggleMenu('m6')">⋯
|
||||
<div class="more__menu" id="m6"><a onclick="event.stopPropagation();location.href='chronic-disease-drawer.html'">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
<div class="more__menu" id="m6"><a onclick="event.stopPropagation();openDiseaseModal('曲志明', '输气厂-输气作业区')">编辑</a><a class="del" onclick="event.stopPropagation();openModal('delModal')">删除</a></div>
|
||||
</div>
|
||||
<div class="fcard__top"><span class="avatar">曲</span><span class="fcard__name">曲志明<small>男 · 45岁</small></span></div>
|
||||
<div class="fcard__lines">工号：1037781<br>单位/部门：<b>输气作业区</b><br>慢病：<span class="tag tag--oth">支气管哮喘</span><br>最近随访：2026-08-06 · 第2次</div>
|
||||
<div class="fcard__lines">员工编号：1037781<br>单位部门：<b>输气厂-输气作业区</b><br>入组时间：<b>2025-09-14</b><br><span class="tag tag--dm">糖尿病</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -214,6 +233,30 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：更换疾病 -->
|
||||
<div class="overlay" id="diseaseModal">
|
||||
<div class="modal" style="width:620px">
|
||||
<div style="display:flex;align-items:center;margin-bottom:16px">
|
||||
<span style="font-size:15px;font-weight:600;color:#333">更换疾病</span>
|
||||
<button style="margin-left:auto;color:#999;font-size:18px;border:none;background:none;cursor:pointer" onclick="closeModal('diseaseModal')">✕</button>
|
||||
</div>
|
||||
<div style="font-size:13px;color:#4a5a7f;line-height:1.8;margin-bottom:14px;padding:10px 14px;background:#f8fafc;border-radius:8px">姓名：<b id="disName" style="color:#333;font-weight:500">—</b> 单位部门：<b id="disUnitDept" style="color:#333;font-weight:500">—</b></div>
|
||||
<div style="font-size:13px;font-weight:600;color:#333;border-left:3px solid #1890ff;padding-left:8px;margin-bottom:12px">慢病类型<span style="font-size:12px;font-weight:400;color:#969eb0;margin-left:10px">可多选</span></div>
|
||||
<div class="type-grid">
|
||||
<div class="type-opt t-ht on" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#1890ff"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>高血压</div>
|
||||
<div class="type-opt t-chd" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#00c3c3"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>冠心病</div>
|
||||
<div class="type-opt t-ob" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#fca318"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>肥胖</div>
|
||||
<div class="type-opt t-dm on" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#2ac18b"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>糖尿病</div>
|
||||
<div class="type-opt t-over" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#EE6557"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>超重</div>
|
||||
<div class="type-opt t-oth" onclick="toggleDisease(this)"><span class="chk"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="#6862D6"/><path d="M7.5 12.5l3 3 6-6.5" stroke="#fff" stroke-width="2.4" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg></span>其他</div>
|
||||
</div>
|
||||
<div style="display:flex;justify-content:flex-end;gap:10px;margin-top:20px">
|
||||
<button class="btn" onclick="closeModal('diseaseModal')">取 消</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('diseaseModal')">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：删除确认 -->
|
||||
<div class="overlay" id="delModal">
|
||||
<div class="modal">
|
||||
@@ -231,23 +274,32 @@
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
// 更换疾病：色块选中切换
|
||||
function toggleDisease(el) { el.classList.toggle('on'); }
|
||||
// 更换疾病：打开弹窗并回填员工姓名与单位部门
|
||||
function openDiseaseModal(name, unitDept) {
|
||||
document.getElementById('disName').textContent = name || '—';
|
||||
document.getElementById('disUnitDept').textContent = unitDept || '—';
|
||||
openModal('diseaseModal');
|
||||
}
|
||||
// 更多操作菜单：同时只展开一个
|
||||
function toggleMenu(id) {
|
||||
document.querySelectorAll('.more__menu').forEach(function (m) {
|
||||
m.classList.toggle('open', m.id === id && !m.classList.contains('open'));
|
||||
});
|
||||
}
|
||||
// 慢病类型多选：确定后在按钮上显示已选数量
|
||||
// 慢病类型多选：确定后将已选类型名称回填到选择框
|
||||
function applyType() {
|
||||
var n = document.querySelectorAll('#typePanel input:checked').length;
|
||||
var cnt = document.getElementById('typeCnt');
|
||||
cnt.style.display = n ? 'inline-block' : 'none';
|
||||
cnt.textContent = n;
|
||||
var checked = document.querySelectorAll('#typePanel input:checked');
|
||||
var label = document.getElementById('typeLabel');
|
||||
label.textContent = checked.length
|
||||
? Array.prototype.map.call(checked, function (c) { return c.value; }).join('、')
|
||||
: '请选择';
|
||||
document.getElementById('typePanel').classList.remove('open');
|
||||
}
|
||||
function clearType() {
|
||||
document.querySelectorAll('#typePanel input').forEach(function (c) { c.checked = false; });
|
||||
document.getElementById('typeCnt').style.display = 'none';
|
||||
document.getElementById('typeLabel').textContent = '请选择';
|
||||
}
|
||||
// 点击空白处收起浮层
|
||||
document.addEventListener('click', function () {
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<title>新增就诊（职工） | 医疗点PAD端</title>
|
||||
<title>编辑就诊（职工） | 医疗点PAD端</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body { font-family: -apple-system, "Microsoft YaHei", "PingFang SC", sans-serif; background: #05080f; min-height: 840px; min-width: 1320px; display: grid; place-items: center; padding: 20px; }
|
||||
@@ -80,41 +80,53 @@
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回日常诊疗列表（未保存退出时旧系统弹确认）: daily.html -->
|
||||
<a class="drawer__back" href="daily.html">‹ 返回</a>
|
||||
<span class="drawer__title">新增就诊 · 职工</span>
|
||||
<span class="drawer__title" id="drawerTitle">编辑就诊 · 职工</span>
|
||||
</div>
|
||||
|
||||
<div class="drawer__body">
|
||||
<!-- 员工查询 -->
|
||||
<div class="sec">
|
||||
<div class="sec__title">基本信息</div>
|
||||
<div class="inquiry">
|
||||
<select><option>姓名</option><option>工号</option></select>
|
||||
<input placeholder="请输入姓名后搜索" value="岳春生">
|
||||
<!-- [交互] 点击搜索显示员工结果浮层；提示「未查询到此员工信息」为无结果态 -->
|
||||
<button class="btn btn--primary" onclick="document.getElementById('iqResult').style.display='block'">搜 索</button>
|
||||
<button class="btn">重 置</button>
|
||||
<!-- 搜索结果浮层（点击行回填下方表单并收起） -->
|
||||
<div class="iq-result" id="iqResult">
|
||||
<table>
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>工号</th><th>单位</th><th>部门</th></tr>
|
||||
<tr class="row" onclick="pickEmp()"><td>岳春生</td><td>男</td><td>54</td><td>1035678</td><td>陕E作业区</td><td>管理四中心</td></tr>
|
||||
<tr class="row" onclick="pickEmp()"><td>岳春明</td><td>男</td><td>49</td><td>1035921</td><td>陕E作业区</td><td>注水大队</td></tr>
|
||||
</table>
|
||||
<!-- [交互] 新增就诊：员工查询选中后回填只读信息并回显慢病标签（参考 follow-drawer） -->
|
||||
<div id="basicAdd" style="display:none">
|
||||
<div class="inquiry">
|
||||
<select id="inqType"><option>姓名</option><option>员工编号</option></select>
|
||||
<input id="inqKw" placeholder="请输入姓名后搜索">
|
||||
<!-- [交互] 点击搜索显示员工结果浮层；无结果时提示「未查询到此员工信息」 -->
|
||||
<button class="btn btn--primary" onclick="document.getElementById('iqResult').style.display='block'">搜 索</button>
|
||||
<button class="btn" onclick="resetInquiry()">重 置</button>
|
||||
<div class="iq-result" id="iqResult">
|
||||
<table>
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>员工编号</th><th>单位</th><th>部门</th></tr>
|
||||
<tr class="row" data-tags="高血压,糖尿病" onclick="pickEmpRow(this)"><td>岳春生</td><td>男</td><td>54</td><td>1035678</td><td>陕E作业区</td><td>管理四中心</td></tr>
|
||||
<tr class="row" data-tags="高血压" onclick="pickEmpRow(this)"><td>岳春明</td><td>男</td><td>49</td><td>1035921</td><td>陕E作业区</td><td>注水大队</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-grid" style="margin-top:14px">
|
||||
<div class="fld"><span class="fld__label">姓名</span><input id="empName" readonly></div>
|
||||
<div class="fld"><span class="fld__label">性别</span><input id="empGender" readonly></div>
|
||||
<div class="fld"><span class="fld__label">年龄</span><input id="empAge" readonly></div>
|
||||
<div class="fld"><span class="fld__label">员工编号</span><input id="empNo" readonly></div>
|
||||
<div class="fld"><span class="fld__label">联系电话</span><input id="empPhone" readonly></div>
|
||||
<div class="fld"><span class="fld__label">单位/部门</span><input id="empUnitDept" readonly></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-grid" style="margin-top:14px">
|
||||
<div class="fld"><span class="fld__label">姓名</span><input value="岳春生" readonly></div>
|
||||
<div class="fld"><span class="fld__label">性别</span><input value="男" readonly></div>
|
||||
<div class="fld"><span class="fld__label">年龄</span><input value="54" readonly></div>
|
||||
<div class="fld"><span class="fld__label">联系电话</span><input value="139****2214" readonly></div>
|
||||
<div class="fld"><span class="fld__label">身份证号</span><input value="612427********3417" readonly></div>
|
||||
<div class="fld"><span class="fld__label">工号</span><input value="1035678" readonly></div>
|
||||
<div class="fld"><span class="fld__label">所属单位</span><input value="CQ能源陕E作业区" readonly></div>
|
||||
<div class="fld"><span class="fld__label">所属部门</span><input value="管理四中心" readonly></div>
|
||||
<!-- 编辑态：静态只读 -->
|
||||
<div id="basicEdit">
|
||||
<div class="form-grid">
|
||||
<div class="fld"><span class="fld__label">姓名</span><input value="岳春生" readonly></div>
|
||||
<div class="fld"><span class="fld__label">性别</span><input value="男" readonly></div>
|
||||
<div class="fld"><span class="fld__label">年龄</span><input value="54" readonly></div>
|
||||
<div class="fld"><span class="fld__label">联系电话</span><input value="139****2214" readonly></div>
|
||||
<div class="fld"><span class="fld__label">身份证号</span><input value="612427********3417" readonly></div>
|
||||
<div class="fld"><span class="fld__label">员工编号</span><input value="1035678" readonly></div>
|
||||
<div class="fld"><span class="fld__label">所属单位</span><input value="CQ能源陕E作业区" readonly></div>
|
||||
<div class="fld"><span class="fld__label">所属部门</span><input value="管理四中心" readonly></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec" id="secVisit">
|
||||
<div class="sec__title">就诊信息</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld"><span class="fld__label">就诊医生</span><input value="石维国（当前登录）" readonly></div>
|
||||
@@ -131,21 +143,21 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec" id="secMed">
|
||||
<div class="sec__title">医药信息</div>
|
||||
<div class="med-grid">
|
||||
<div class="med-card"><b>苯磺酸氨氯地平片</b>（5mg×7片 · 23.80元）<br>数量：2盒 用法用量：口服，一日1次，一次1片
|
||||
<div class="med-card__ops"><a class="op-del">删除</a><a class="op-back">撤回</a></div>
|
||||
<div class="med-card__ops"><a class="op-del">删除</a></div>
|
||||
</div>
|
||||
<div class="med-card med-mine"><b>硝苯地平控释片</b>（30mg×7片 · 34.20元）<br>数量：1盒 用法用量：口服，一日1次，一次1片
|
||||
<div class="med-card__ops"><a class="op-back">已撤回</a></div>
|
||||
<div class="med-card"><b>硝苯地平控释片</b>（30mg×7片 · 34.20元）<br>数量：1盒 用法用量：口服，一日1次，一次1片
|
||||
<div class="med-card__ops"><a class="op-del">删除</a></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- [交互] 点击打开页内「新增用药」弹窗 -->
|
||||
<button class="add-med-btn" onclick="openModal('medModal')">＋ 新增用药</button>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec" id="secLife">
|
||||
<div class="sec__title">生活建议</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld fld--full"><span class="fld__label">医嘱</span><textarea placeholder="请输入医嘱建议">规律服药，每日早晚监测血压并记录，2周后复查。</textarea></div>
|
||||
@@ -205,8 +217,35 @@
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
// 搜索结果回填：收起浮层
|
||||
function pickEmp() { document.getElementById('iqResult').style.display = 'none'; }
|
||||
// 新增/编辑模式：?mode=add 进入新增（空表单+员工查询），否则进入编辑（回填）
|
||||
(function () {
|
||||
var isAdd = new URLSearchParams(location.search).get('mode') === 'add';
|
||||
if (!isAdd) return;
|
||||
document.getElementById('drawerTitle').textContent = '新增就诊 · 职工';
|
||||
document.title = '新增就诊（职工） | 医疗点PAD端';
|
||||
document.getElementById('basicAdd').style.display = 'block';
|
||||
document.getElementById('basicEdit').style.display = 'none';
|
||||
// 清空就诊信息 / 医药信息 / 生活建议
|
||||
document.querySelectorAll('#secVisit input:not([readonly]):not([type="radio"]), #secVisit textarea').forEach(function (el) { el.value = ''; });
|
||||
var re = document.querySelectorAll('#secVisit input[name="re"]');
|
||||
if (re.length >= 2) { re[0].checked = true; re[1].checked = false; }
|
||||
document.querySelector('#secMed .med-grid').innerHTML = '';
|
||||
document.querySelectorAll('#secLife textarea').forEach(function (el) { el.value = ''; });
|
||||
})();
|
||||
// 员工查询：选中行回填只读信息并回显慢病标签
|
||||
function pickEmpRow(tr) {
|
||||
var tds = tr.querySelectorAll('td');
|
||||
document.getElementById('empName').value = tds[0].textContent;
|
||||
document.getElementById('empGender').value = tds[1].textContent;
|
||||
document.getElementById('empAge').value = tds[2].textContent;
|
||||
document.getElementById('empNo').value = tds[3].textContent;
|
||||
document.getElementById('empUnitDept').value = tds[4].textContent + ' / ' + tds[5].textContent;
|
||||
document.getElementById('iqResult').style.display = 'none';
|
||||
}
|
||||
function resetInquiry() {
|
||||
document.getElementById('inqKw').value = '';
|
||||
document.getElementById('iqResult').style.display = 'none';
|
||||
}
|
||||
// 药品选中：隐藏结果浮层
|
||||
function pickDrug(tr) {
|
||||
document.querySelector('.drug-list').style.display = 'none';
|
||||
|
||||
@@ -52,12 +52,8 @@
|
||||
<div class="sec__title">基本信息（手工登记）</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>姓名</span><input value="冯大勇"></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>手机号</span><input value="150****7781"><span class="fld__hint">格式校验 11 位手机号</span></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>联系电话</span><input value="15029807781"></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>身份证号</span><input value="612427********1135"></div>
|
||||
<!-- [交互] 身份证校验通过后自动解析回填性别与年龄 -->
|
||||
<div class="fld"><span class="fld__label">性别</span><input value="男（身份证自动解析）" readonly></div>
|
||||
<div class="fld"><span class="fld__label">年龄</span><input value="40（自动计算）" readonly></div>
|
||||
<div class="fld"><span class="fld__label">关系/备注</span><input placeholder="如：职工家属"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -106,7 +106,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -132,8 +132,8 @@
|
||||
|
||||
<div class="content">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar__item">就诊员工<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">工号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">员工姓名<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">员工编号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">就诊日期<input class="search-bar__input" style="min-width:200px" placeholder="开始日期 ~ 结束日期"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
@@ -152,39 +152,39 @@
|
||||
<div class="grid" id="panelStaff">
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard__top"><span class="avatar">岳</span><span class="dcard__name">岳春生<small>男 · 54岁</small></span><span class="pill pill--first">初诊</span></div>
|
||||
<div class="dcard__lines">工号：1035678 <span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span><br>就诊疾病：头晕、血压升高<br>就诊医生：石维国 就诊日期：2026-09-03<br>联系电话：139****2214</div>
|
||||
<div class="dcard__lines">员工编号：1035678<br>单位：采油一厂-信息部<br>就诊疾病：头晕、血压升高<br>联系电话：13956282214<br>就诊医生：石维国 就诊日期：2026-09-03</div>
|
||||
</div>
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard__top"><span class="avatar">田</span><span class="dcard__name">田淑珍<small>女 · 61岁</small></span><span class="pill pill--re">复诊</span></div>
|
||||
<div class="dcard__lines">工号：1042237 <span class="tag" style="background:rgba(0,195,195,.12);color:#00c3c3">冠心病</span><br>就诊疾病：胸闷复查<br>就诊医生：石维国 就诊日期：2026-09-02<br>联系电话：137****8852</div>
|
||||
<div class="dcard__lines">员工编号：1042237<br>单位：采油一厂-转运站<br>就诊疾病：胸闷复查<br>联系电话：13759028852<br>就诊医生：石维国 就诊日期：2026-09-02</div>
|
||||
</div>
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard__top"><span class="avatar">尹</span><span class="dcard__name">尹立春<small>男 · 47岁</small></span><span class="pill pill--first">初诊</span></div>
|
||||
<div class="dcard__lines">工号：1028945 <span class="tag" style="background:rgba(252,163,24,.12);color:#fca318">肥胖</span><br>就诊疾病：膝关节疼痛<br>就诊医生：韩丽平 就诊日期：2026-09-02<br>联系电话：158****3307</div>
|
||||
<div class="dcard__lines">员工编号：1028945<br>单位：采油一厂-注水大队<br>就诊疾病：膝关节疼痛<br>联系电话：15829153307<br>就诊医生：韩丽平 就诊日期：2026-09-02</div>
|
||||
</div>
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard__top"><span class="avatar">戴</span><span class="dcard__name">戴文广<small>男 · 58岁</small></span><span class="pill pill--re">复诊</span></div>
|
||||
<div class="dcard__lines">工号：1031002 <span class="tag tag--ht">高血压</span><br>就诊疾病：血压控制不佳<br>就诊医生：石维国 就诊日期：2026-09-01<br>联系电话：136****9021</div>
|
||||
<div class="dcard__lines">员工编号：1031002<br>单位：采油一厂-作业一大队<br>就诊疾病：血压控制不佳<br>联系电话：13659219021<br>就诊医生：石维国 就诊日期：2026-09-01</div>
|
||||
</div>
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard__top"><span class="avatar">付</span><span class="dcard__name">付桂荣<small>女 · 52岁</small></span><span class="pill pill--first">初诊</span></div>
|
||||
<div class="dcard__lines">工号：1044518 <span class="tag tag--dm">糖尿病</span><br>就诊疾病：口渴、乏力<br>就诊医生：韩丽平 就诊日期：2026-08-31<br>联系电话：135****4478</div>
|
||||
<div class="dcard__lines">员工编号：1044518<br>单位：采油二厂-作业二大队<br>就诊疾病：口渴、乏力<br>联系电话：13572914478<br>就诊医生：韩丽平 就诊日期：2026-08-31</div>
|
||||
</div>
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard__top"><span class="avatar">曲</span><span class="dcard__name">曲志明<small>男 · 45岁</small></span><span class="pill pill--re">复诊</span></div>
|
||||
<div class="dcard__lines">工号：1037781 <span class="tag" style="background:rgba(0,195,195,.12);color:#00c3c3">冠心病</span><span class="tag tag--ht">高血压</span><br>就诊疾病：心悸<br>就诊医生：石维国 就诊日期：2026-08-30<br>联系电话：186****6633</div>
|
||||
<div class="dcard__lines">员工编号：1037781<br>单位：输气厂-输气作业区<br>就诊疾病：心悸<br>联系电话：18629506633<br>就诊医生：石维国 就诊日期：2026-08-30</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 非职工就诊卡片（默认隐藏） -->
|
||||
<div class="grid" id="panelOuter" style="display:none">
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard" onclick="openModal('detailModalOuter')">
|
||||
<div class="dcard__top"><span class="avatar">冯</span><span class="dcard__name">冯大勇<small>男 · 40岁</small></span><span class="pill pill--first">初诊</span></div>
|
||||
<div class="dcard__lines">证件号：612427********1135<br>就诊疾病：急性胃肠炎<br>就诊医生：韩丽平 就诊日期：2026-09-02<br>联系电话：150****7781</div>
|
||||
<div class="dcard__lines">就诊疾病：急性胃肠炎<br>联系电话：15029807781<br>就诊医生：韩丽平 就诊日期：2026-09-02</div>
|
||||
</div>
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<div class="dcard" onclick="openModal('detailModalOuter')">
|
||||
<div class="dcard__top"><span class="avatar">钟</span><span class="dcard__name">钟小雅<small>女 · 34岁</small></span><span class="pill pill--re">复诊</span></div>
|
||||
<div class="dcard__lines">证件号：612427********2246<br>就诊疾病：上呼吸道感染复查<br>就诊医生：石维国 就诊日期：2026-08-29<br>联系电话：151****2094</div>
|
||||
<div class="dcard__lines">就诊疾病：上呼吸道感染复查<br>联系电话：15137182094<br>就诊医生：石维国 就诊日期：2026-08-29</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -210,9 +210,8 @@
|
||||
</div>
|
||||
<div class="kv">
|
||||
<div>姓名：<b>岳春生</b></div><div>性别：<b>男</b></div>
|
||||
<div>年龄：<b>54 岁</b></div><div>工号：<b>1035678</b></div>
|
||||
<div>联系电话：<b>139****2214</b></div><div>慢病：<span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span></div>
|
||||
<div class="kv--full">所属单位：<b>CQ能源陕E作业区管理四中心</b></div>
|
||||
<div>年龄：<b>54 岁</b></div><div>员工编号：<b>1035678</b></div>
|
||||
<div>联系电话：<b>13956282214</b></div><div>单位部门：<b>采油一厂-信息部</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
@@ -229,8 +228,8 @@
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">医药信息</div>
|
||||
<div class="med-card"><b>苯磺酸氨氯地平片</b>（5mg×7片 · 23.80元）<br>数量：2盒 用法用量：口服，一日1次，一次1片</div>
|
||||
<div class="med-card"><b>盐酸二甲双胍缓释片</b>（0.5g×30片 · 31.50元）<br>数量：1盒 用法用量：口服，一日2次，一次1片</div>
|
||||
<div class="med-card"><b>苯磺酸氨氯地平片</b> 用法用量：口服，一日1次，一次1片</div>
|
||||
<div class="med-card"><b>盐酸二甲双胍缓释片</b> 用法用量：口服，一日2次，一次1片</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活建议</div>
|
||||
@@ -245,7 +244,58 @@
|
||||
<span class="modal__tip">仅就诊时间 24 小时以内可编辑或删除</span>
|
||||
<div style="display:flex;gap:10px">
|
||||
<button class="btn btn--danger">删 除</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('detailModal');location.href='daily-drawer.html'">编 辑</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('detailModal');location.href='daily-drawer.html?mode=edit'">编 辑</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：就诊详情（非职工） -->
|
||||
<div class="overlay" id="detailModalOuter">
|
||||
<div class="modal">
|
||||
<div class="modal__head">
|
||||
<span class="modal__title">就诊详情</span>
|
||||
<button class="modal__close" onclick="closeModal('detailModalOuter')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<!-- [交互] 非职工无档案，基本信息仅展示姓名/联系电话/身份证号，不提供「查看员工档案」入口 -->
|
||||
<div class="sec">
|
||||
<div class="sec__title">基本信息</div>
|
||||
<div class="kv">
|
||||
<div>姓名：<b>冯大勇</b></div><div>联系电话：<b>15029807781</b></div>
|
||||
<div>身份证号：<b>612427198602151135</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">就诊信息</div>
|
||||
<div class="kv">
|
||||
<div>就诊医生：<b>韩丽平</b></div><div>就诊日期：<b>2026-09-02 10:40</b></div>
|
||||
<div class="kv--full">主诉：<b>腹痛、腹泻半天，呕吐2次</b></div>
|
||||
<div class="kv--full">查体：<b>T 37.6℃，脐周压痛，肠鸣音活跃。</b></div>
|
||||
<div class="kv--full">现病史：<b>进食隔夜饭菜后出现症状。</b></div>
|
||||
<div class="kv--full">过敏史：<b>无</b></div>
|
||||
<div class="kv--full">诊断：<b>急性胃肠炎</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">医药信息</div>
|
||||
<div class="med-card"><b>蒙脱石散</b> 用法用量：口服，一日3次，一次1袋</div>
|
||||
<div class="med-card"><b>左氧氟沙星片</b> 用法用量：口服，一日1次，一次1片</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活建议</div>
|
||||
<div class="kv">
|
||||
<div class="kv--full">医嘱：<b>清淡饮食，多饮水补充电解质，症状加重及时转诊。</b></div>
|
||||
<div class="kv--full">运动处方：<b>休息为主，暂缓体力活动。</b></div>
|
||||
<div class="kv--full">膳食处方：<b>小米粥、面条等易消化食物，忌生冷油腻。</b></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<span class="modal__tip">仅就诊时间 24 小时以内可编辑或删除</span>
|
||||
<div style="display:flex;gap:10px">
|
||||
<button class="btn btn--danger">删 除</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('detailModalOuter');location.href='daily-nonstaff-drawer.html'">编 辑</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -267,7 +317,7 @@
|
||||
}
|
||||
// 新增就诊：按当前 Tab 打开对应抽屉
|
||||
function gotoAdd() {
|
||||
location.href = curTab === 'staff' ? 'daily-drawer.html' : 'daily-nonstaff-drawer.html';
|
||||
location.href = (curTab === 'staff' ? 'daily-drawer.html' : 'daily-nonstaff-drawer.html') + '?mode=add';
|
||||
}
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
|
||||
@@ -65,10 +65,14 @@
|
||||
/* 分析报告：左树右卡 */
|
||||
.analysis { display: flex; gap: 16px; min-height: 420px; }
|
||||
.tree { width: 240px; flex-shrink: 0; border-right: 1px solid #f0f2f5; padding-right: 10px; }
|
||||
.tree__item { padding: 10px 12px; font-size: 13px; color: #4a5a7f; border-radius: 8px; cursor: pointer; display: flex; justify-content: space-between; }
|
||||
.tree__item { padding: 10px 12px; font-size: 13px; color: #4a5a7f; border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; }
|
||||
.tree__item small { color: #b7bfcc; }
|
||||
.tree__item:hover { background: #f5f7fa; }
|
||||
.tree__item.on { background: #e7f4ff; color: #1890ff; font-weight: 600; }
|
||||
.tree__caret { display: inline-block; width: 14px; color: #969eb0; font-size: 11px; transition: transform .15s; flex-shrink: 0; }
|
||||
.tree__group:not(.open) .tree__caret { transform: rotate(-90deg); }
|
||||
.tree__group:not(.open) .tree__sub { display: none; }
|
||||
.tree__sub .tree__item { padding-left: 34px; font-size: 12px; }
|
||||
.ind-grid { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-content: start; }
|
||||
.ind-card { border: 1px solid #eef1f6; border-radius: 12px; padding: 12px 14px; }
|
||||
.ind-card__head { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: #333; font-weight: 600; }
|
||||
@@ -86,22 +90,69 @@
|
||||
/* 页内弹窗：查看体检报告 */
|
||||
.overlay { position: absolute; inset: 0; background: rgba(15,23,42,.45); z-index: 50; display: none; align-items: center; justify-content: center; }
|
||||
.overlay.open { display: flex; }
|
||||
.modal { background: #fff; border-radius: 12px; width: 820px; max-height: 690px; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
|
||||
.modal { background: #fff; border-radius: 12px; width: 960px; max-height: 690px; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
|
||||
.modal__head { padding: 15px 20px; border-bottom: 1px solid #f0f2f5; display: flex; align-items: center; }
|
||||
.modal__title { font-size: 15px; font-weight: 600; color: #333; flex: 1; }
|
||||
.modal__close { cursor: pointer; color: #999; font-size: 18px; border: none; background: none; }
|
||||
.modal__body { flex: 1; overflow-y: auto; padding: 16px 20px; scrollbar-width: none; }
|
||||
.modal__body::-webkit-scrollbar { display: none; }
|
||||
.modal__foot { padding: 13px 20px; border-top: 1px solid #f0f2f5; display: flex; justify-content: flex-end; gap: 10px; }
|
||||
.rp__bar { border-radius: 6px; padding: 9px 14px; font-size: 12px; line-height: 1.8; margin-bottom: 10px; }
|
||||
.rp__concl { background: #e3cb2c; color: #4a4007; }
|
||||
.rp__advice { background: #fff7d6; color: #6b5d10; }
|
||||
.rp__cat { background: #f6f6f6; border-radius: 6px; padding: 8px 14px; font-size: 13px; font-weight: 600; color: #333; margin: 12px 0 8px; }
|
||||
.rp__sub { background: #02c2a6; color: #fff; border-radius: 4px; padding: 4px 12px; font-size: 12px; display: inline-block; margin-bottom: 6px; }
|
||||
.rp table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.rp th { background: #f0f2ff; color: #4a5a7f; font-weight: 500; padding: 7px 10px; text-align: left; }
|
||||
.rp td { padding: 7px 10px; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.rp .abn { color: #fd2121; font-weight: 600; }
|
||||
/* 体检报告弹窗内容（参考 web-admin 体检报告弹窗样式） */
|
||||
.report-section { margin-bottom: 24px; }
|
||||
.report-section:last-child { margin-bottom: 0; }
|
||||
.report-section__title { font-size: 15px; font-weight: 600; color: #333; padding-left: 10px; border-left: 3px solid #1890ff; margin-bottom: 12px; line-height: 1.4; }
|
||||
.report-note { border-radius: 4px; padding: 12px 16px; font-size: 13px; line-height: 1.9; margin-bottom: 16px; }
|
||||
.report-note--conclusion { border: 1px solid #FFD591; background: #FFF7E6; color: #873800; }
|
||||
.report-note--advice { border: 1px solid #B7EB8F; background: #F6FFED; color: #389E0D; }
|
||||
.report-sub__title { font-size: 13px; font-weight: 600; color: #333; margin: 14px 0 8px; }
|
||||
.report-sub:first-of-type .report-sub__title { margin-top: 0; }
|
||||
.report-table { width: 100%; border-collapse: collapse; }
|
||||
.report-table th { background: #FAFAFA; padding: 9px 12px; text-align: left; font-size: 13px; color: #666; font-weight: 500; border-bottom: 1px solid #e8e8e8; white-space: nowrap; }
|
||||
.report-table td { padding: 10px 12px; font-size: 13px; color: #333; border-bottom: 1px solid #e8e8e8; }
|
||||
.report-table tbody tr:last-child td { border-bottom: none; }
|
||||
.result-abnormal { color: #FF4D4F; font-weight: 600; }
|
||||
/* 就医推荐：地图 + 医疗资源导航 */
|
||||
.map-wrap { display: flex; gap: 16px; align-items: stretch; }
|
||||
.map-side { width: 264px; flex-shrink: 0; background: #fff; border-radius: 12px; padding: 12px; box-shadow: 0 2px 8px rgba(74,90,127,.06); max-height: 500px; overflow-y: auto; scrollbar-width: none; }
|
||||
.map-side::-webkit-scrollbar { display: none; }
|
||||
.map-side__title { font-size: 13px; font-weight: 600; color: #333; padding: 2px 4px 10px; }
|
||||
.map-side__group { margin-bottom: 4px; }
|
||||
.map-side__head { display: flex; align-items: center; gap: 6px; padding: 9px 8px; font-size: 13px; color: #333; cursor: pointer; border-radius: 8px; user-select: none; }
|
||||
.map-side__head:hover { background: #f5f7fa; }
|
||||
.map-side__head small { color: #b7bfcc; margin-left: auto; }
|
||||
.map-side__caret { display: inline-block; width: 12px; color: #969eb0; font-size: 11px; transition: transform .15s; }
|
||||
.map-side__group:not(.open) .map-side__caret { transform: rotate(-90deg); }
|
||||
.map-side__group:not(.open) .map-side__body { display: none; }
|
||||
.map-side__body { padding: 4px 0 6px; }
|
||||
.map-card { padding: 9px 10px 9px 22px; border-radius: 8px; cursor: pointer; border: 1px solid transparent; }
|
||||
.map-card:hover { background: #f5f7fa; }
|
||||
.map-card.on { background: #e7f4ff; border-color: #bae0ff; }
|
||||
.map-card__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
|
||||
.map-card__name { font-size: 13px; color: #333; font-weight: 500; }
|
||||
.map-card__dist { font-size: 11px; color: #1890ff; font-weight: 600; flex-shrink: 0; }
|
||||
.map-card__addr, .map-card__tel { font-size: 11px; color: #b7bfcc; margin-top: 2px; }
|
||||
.map-card__addr span, .map-card__tel span { color: #4a5a7f; }
|
||||
.map-area { flex: 1; position: relative; height: 500px; border-radius: 12px; overflow: hidden; background: #eef1f6; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.map-bg { position: absolute; inset: 0; width: 100%; height: 100%; }
|
||||
.map-route { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
|
||||
.map-pin { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; cursor: pointer; z-index: 5; }
|
||||
.map-pin__badge { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; box-shadow: 0 2px 6px rgba(0,0,0,.25); }
|
||||
.map-pin__badge svg { width: 15px; height: 15px; }
|
||||
.map-pin__label { margin-top: 4px; font-size: 11px; color: #333; background: rgba(255,255,255,.92); padding: 1px 6px; border-radius: 4px; white-space: nowrap; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
|
||||
.map-pin--cur .map-pin__badge { background: #1890ff; position: relative; }
|
||||
.map-pin--cur .map-pin__badge::after { content: ''; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid rgba(24,144,255,.4); animation: pulse 1.6s infinite; }
|
||||
@keyframes pulse { 0% { transform: scale(.8); opacity: 1; } 100% { transform: scale(1.5); opacity: 0; } }
|
||||
.map-pin--mp .map-pin__badge { background: #02c2a6; }
|
||||
.map-pin--hos .map-pin__badge { background: #f5222d; }
|
||||
.map-nav { position: absolute; right: 12px; top: 12px; width: 252px; max-height: calc(100% - 24px); background: #fff; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.2); display: none; z-index: 10; overflow: hidden; }
|
||||
.map-nav.open { display: block; }
|
||||
.map-nav__head { display: flex; align-items: center; padding: 12px 14px; border-bottom: 1px solid #f0f2f5; font-size: 14px; font-weight: 600; color: #333; }
|
||||
.map-nav__close { margin-left: auto; cursor: pointer; color: #999; font-size: 16px; border: none; background: none; }
|
||||
.map-nav__body { padding: 12px 14px; overflow-y: auto; max-height: 420px; }
|
||||
.map-nav__dest { font-size: 14px; font-weight: 600; color: #1890ff; }
|
||||
.map-nav__info { font-size: 12px; color: #4a5a7f; margin: 4px 0 10px; }
|
||||
.map-nav__step { display: flex; gap: 8px; font-size: 12px; color: #4a5a7f; line-height: 1.7; margin-bottom: 8px; }
|
||||
.map-nav__idx { flex-shrink: 0; width: 18px; height: 18px; border-radius: 50%; background: #e7f4ff; color: #1890ff; font-size: 11px; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -120,7 +171,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -151,28 +202,36 @@
|
||||
<div class="top-card">
|
||||
<span class="avatar">岳</span>
|
||||
<div class="top-card__info">
|
||||
<b>岳春生</b><small>男 · 54岁 · 工号 1035678</small><span class="ftag">b-慢病人群</span><br>
|
||||
单位/部门：CQ能源陕E作业区 / 管理四中心 岗位：班长 联系电话：139****2214 身份证：612427********3417<br>
|
||||
慢病：<span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span> 最近随访：2026-08-20（第3次）
|
||||
<b>岳春生</b><small>男 · 54岁 · 员工编号 1035678</small><span class="ftag">b-慢病人群</span><br>
|
||||
单位/部门：CQ能源陕E作业区 / 管理四中心 联系电话：13982342214 身份证：612427197111253417<br>
|
||||
慢病干预：<span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span> 慢病入组日期：2025-03-12
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tabs__head">
|
||||
<!-- [交互] Tab 切换体检历史 / 分析报告 / 就医推荐 -->
|
||||
<!-- [交互] Tab 切换体检历史 / 分析报告 / 就诊记录 / 随访记录 / 就医推荐 -->
|
||||
<span class="tabs__item on" onclick="switchTab('hx',this)">体检历史</span>
|
||||
<span class="tabs__item" onclick="switchTab('fx',this)">分析报告</span>
|
||||
<span class="tabs__item" onclick="switchTab('visit',this)">就诊记录</span>
|
||||
<span class="tabs__item" onclick="switchTab('follow',this)">随访记录</span>
|
||||
<span class="tabs__item" onclick="switchTab('tj',this)">就医推荐</span>
|
||||
</div>
|
||||
<div class="tabs__body">
|
||||
<!-- 体检历史 -->
|
||||
<div class="panel on" id="p-hx">
|
||||
<div style="display:flex;gap:10px;align-items:center;margin-bottom:12px">
|
||||
<span style="font-size:13px;color:#4a5a7f">体检年份</span>
|
||||
<select style="width:150px;height:32px;border:1px solid #d9dee8;border-radius:6px;padding:0 10px;font-size:13px;outline:none">
|
||||
<option>全部年份</option><option>2026</option><option>2025</option><option>2024</option><option>2023</option>
|
||||
</select>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>体检年份</th><th>体检机构</th><th>体检日期</th><th>结论摘要</th><th>解读状态</th><th style="width:130px">操作</th></tr>
|
||||
<tr><td>2026</td><td>CQ能源职工医院</td><td>2026-05-18</td><td>血压偏高、空腹血糖及血脂异常</td><td><span class="pill pill--ok">已解读</span></td><td><a class="link" onclick="openModal('reportModal')">查看报告</a><a class="link" href="interpret-drawer.html">重新解读</a></td></tr>
|
||||
<tr><td>2025</td><td>CQ能源职工医院</td><td>2025-05-12</td><td>血脂边缘升高，建议复查</td><td><span class="pill pill--ok">已解读</span></td><td><a class="link" onclick="openModal('reportModal')">查看报告</a><a class="link" href="interpret-drawer.html">重新解读</a></td></tr>
|
||||
<tr><td>2024</td><td>定边县人民医院</td><td>2024-05-20</td><td>未见明显异常</td><td><span class="pill pill--wait">待解读</span></td><td><a class="link" onclick="openModal('reportModal')">查看报告</a><a class="link" href="interpret-drawer.html">去解读</a></td></tr>
|
||||
<tr><td>2023</td><td>CQ能源职工医院</td><td>2023-05-15</td><td>轻度脂肪肝</td><td><span class="pill pill--ok">已解读</span></td><td><a class="link" onclick="openModal('reportModal')">查看报告</a><a class="link" href="interpret-drawer.html">重新解读</a></td></tr>
|
||||
<tr><th style="width:50px">序号</th><th>体检年度</th><th>体检日期</th><th>体检医院</th><th>报告上传日期</th><th style="width:90px">操作</th></tr>
|
||||
<tr><td>1</td><td>2026</td><td>2026-05-18</td><td>CQ能源职工医院</td><td>2026-05-22</td><td><a class="link" onclick="openModal('reportModal')">查看报告</a></td></tr>
|
||||
<tr><td>2</td><td>2025</td><td>2025-05-12</td><td>CQ能源职工医院</td><td>2025-05-16</td><td><a class="link" onclick="openModal('reportModal')">查看报告</a></td></tr>
|
||||
<tr><td>3</td><td>2024</td><td>2024-05-20</td><td>定边县人民医院</td><td>2024-05-24</td><td><a class="link" onclick="openModal('reportModal')">查看报告</a></td></tr>
|
||||
<tr><td>4</td><td>2023</td><td>2023-05-15</td><td>CQ能源职工医院</td><td>2023-05-19</td><td><a class="link" onclick="openModal('reportModal')">查看报告</a></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
@@ -180,17 +239,55 @@
|
||||
<div class="panel" id="p-fx">
|
||||
<div class="analysis">
|
||||
<div class="tree">
|
||||
<!-- [交互] 点击类别切换右侧指标趋势卡 -->
|
||||
<div class="tree__item on" onclick="pickCat(this,'cat-all')">全部<small>5</small></div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-one')">一般检查<small>2</small></div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-lab')">实验室检查<small>3</small></div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-fn')">功能检查<small>0</small></div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-img')">影像检查<small>0</small></div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-int')">内科<small>0</small></div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-srg')">外科<small>0</small></div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-eye')">眼科<small>0</small></div>
|
||||
<!-- [交互] 点击子类切换右侧指标趋势卡；点击父级展开/收起 -->
|
||||
<div class="tree__group open">
|
||||
<div class="tree__item" onclick="toggleTree(this)"><span><span class="tree__caret">▾</span>一般检查</span><small>2</small></div>
|
||||
<div class="tree__sub">
|
||||
<div class="tree__item on" onclick="pickCat(this,'cat-one-bp')">血压</div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-one-bmi')">体格测量</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree__group open">
|
||||
<div class="tree__item" onclick="toggleTree(this)"><span><span class="tree__caret">▾</span>化学检查</span><small>3</small></div>
|
||||
<div class="tree__sub">
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-lab-glu')">血糖</div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-lab-lipid')">血脂</div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-lab-cbc')">血常规</div>
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-other')">尿常规</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree__group open">
|
||||
<div class="tree__item" onclick="toggleTree(this)"><span><span class="tree__caret">▾</span>功能检查</span><small>0</small></div>
|
||||
<div class="tree__sub">
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-other')">心电图</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree__group open">
|
||||
<div class="tree__item" onclick="toggleTree(this)"><span><span class="tree__caret">▾</span>影像检查</span><small>0</small></div>
|
||||
<div class="tree__sub">
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-other')">胸部DR</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree__group open">
|
||||
<div class="tree__item" onclick="toggleTree(this)"><span><span class="tree__caret">▾</span>内科</span><small>0</small></div>
|
||||
<div class="tree__sub">
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-other')">心肺听诊</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree__group open">
|
||||
<div class="tree__item" onclick="toggleTree(this)"><span><span class="tree__caret">▾</span>外科</span><small>0</small></div>
|
||||
<div class="tree__sub">
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-other')">皮肤与淋巴结</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree__group open">
|
||||
<div class="tree__item" onclick="toggleTree(this)"><span><span class="tree__caret">▾</span>眼科</span><small>0</small></div>
|
||||
<div class="tree__sub">
|
||||
<div class="tree__item" onclick="pickCat(this,'cat-other')">视力</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-all">
|
||||
<div class="ind-grid" id="cat-all" style="display:none">
|
||||
<div class="ind-card">
|
||||
<div class="ind-card__head">空腹血糖<span class="ind-card__val up">7.8 ↑</span><span class="ind-card__ref">参考 3.9~6.1 mmol/L</span></div>
|
||||
<svg viewBox="0 0 300 74">
|
||||
@@ -238,44 +335,134 @@
|
||||
</div>
|
||||
<div class="ind-empty" style="display:none">该类别暂无纵向对比指标</div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-one" style="display:none">
|
||||
<div class="ind-grid" id="cat-one-bp">
|
||||
<div class="ind-card"><div class="ind-card__head">收缩压<span class="ind-card__val up">158 ↑</span><span class="ind-card__ref">参考 90~139 mmHg</span></div><svg viewBox="0 0 300 74"><polyline points="30,30 90,36 150,26 210,22 270,12" fill="none" stroke="#1890ff" stroke-width="2"/><circle cx="270" cy="12" r="4" fill="#fd2121"/></svg></div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-one-bmi" style="display:none">
|
||||
<div class="ind-card"><div class="ind-card__head">体质指数 BMI<span class="ind-card__val up">26.5 ↑</span><span class="ind-card__ref">参考 18.5~24.9</span></div><svg viewBox="0 0 300 74"><polyline points="30,42 90,40 150,34 210,30 270,26" fill="none" stroke="#1890ff" stroke-width="2"/><circle cx="270" cy="26" r="4" fill="#fd2121"/></svg></div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-lab" style="display:none">
|
||||
<div class="ind-grid" id="cat-lab-glu" style="display:none">
|
||||
<div class="ind-card"><div class="ind-card__head">空腹血糖<span class="ind-card__val up">7.8 ↑</span><span class="ind-card__ref">参考 3.9~6.1 mmol/L</span></div><svg viewBox="0 0 300 74"><polyline points="30,48 90,45 150,38 210,26 270,14" fill="none" stroke="#1890ff" stroke-width="2"/><circle cx="270" cy="14" r="4" fill="#fd2121"/></svg></div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-lab-lipid" style="display:none">
|
||||
<div class="ind-card"><div class="ind-card__head">血清总胆固醇<span class="ind-card__val up">6.12 ↑</span><span class="ind-card__ref">参考 0~5.2 mmol/L</span></div><svg viewBox="0 0 300 74"><polyline points="30,40 90,44 150,34 210,28 270,20" fill="none" stroke="#1890ff" stroke-width="2"/><circle cx="270" cy="20" r="4" fill="#fd2121"/></svg></div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-lab-cbc" style="display:none">
|
||||
<div class="ind-card"><div class="ind-card__head">血红蛋白<span class="ind-card__val ok">148</span><span class="ind-card__ref">参考 130~175 g/L</span></div><svg viewBox="0 0 300 74"><polyline points="30,30 90,28 150,31 210,29 270,27" fill="none" stroke="#1890ff" stroke-width="2"/><circle cx="270" cy="27" r="4" fill="#2ac18b"/></svg></div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-other" style="display:none"><div class="ind-empty">该类别暂无纵向对比指标</div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 就诊记录 -->
|
||||
<div class="panel" id="p-visit">
|
||||
<div style="display:flex;gap:10px;align-items:center;margin-bottom:12px">
|
||||
<span style="font-size:13px;color:#4a5a7f">就诊日期</span>
|
||||
<input style="width:220px;height:32px;border:1px solid #d9dee8;border-radius:6px;padding:0 10px;font-size:13px;outline:none" placeholder="开始日期 ~ 结束日期">
|
||||
<button class="btn">搜 索</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th style="width:50px">序号</th><th>就诊日期</th><th>就诊医疗点</th><th>就诊医生</th><th>就诊疾病</th><th style="width:60px">操作</th></tr>
|
||||
<tr><td>1</td><td>2026-08-21</td><td>定边第一医疗点</td><td>石维国</td><td>原发性高血压3级（很高危）；2型糖尿病</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>2</td><td>2026-07-14</td><td>定边第一医疗点</td><td>韩丽平</td><td>血压偏高，建议复查</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>3</td><td>2026-05-09</td><td>定边第一医疗点</td><td>石维国</td><td>2型糖尿病复查，血糖控制一般</td><td><a class="link">详情</a></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- 随访记录 -->
|
||||
<div class="panel" id="p-follow">
|
||||
<div style="display:flex;gap:10px;align-items:center;margin-bottom:12px">
|
||||
<span style="font-size:13px;color:#4a5a7f">随访日期</span>
|
||||
<input style="width:220px;height:32px;border:1px solid #d9dee8;border-radius:6px;padding:0 10px;font-size:13px;outline:none" placeholder="开始日期 ~ 结束日期">
|
||||
<button class="btn">搜 索</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th style="width:50px">序号</th><th>随访日期</th><th>随访医生</th><th>症状</th><th>下次随访日期</th><th style="width:60px">操作</th></tr>
|
||||
<tr><td>1</td><td>2026-08-20</td><td>石维国</td><td>偶有头晕，血压波动</td><td>2026-09-20</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>2</td><td>2026-05-18</td><td>石维国</td><td>症状平稳</td><td>2026-06-18</td><td><a class="link">详情</a></td></tr>
|
||||
<tr><td>3</td><td>2026-02-10</td><td>韩丽平</td><td>自述服药不规律</td><td>2026-03-12</td><td><a class="link">详情</a></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- 就医推荐 -->
|
||||
<div class="panel" id="p-tj">
|
||||
<!-- [状态] 就医推荐由上级医院合作通道生成，仅 A01A34 医疗点可见 -->
|
||||
<div class="adv-note">就医推荐数据来自职工医院合作通道，仅 A01A34（定边第一医疗点）展示该入口。</div>
|
||||
<div class="advc">
|
||||
<b>心血管内科门诊</b> <span class="pill pill--wait">建议 2 周内就诊</span><br>
|
||||
<div class="advc__grid">
|
||||
<div>推荐医院：<b style="color:#333;font-weight:500">CQ能源职工医院</b></div>
|
||||
<div>推荐专家：<b style="color:#333;font-weight:500">李主任（主任医师）</b></div>
|
||||
<div>生成时间：<b style="color:#333;font-weight:500">2026-08-22</b></div>
|
||||
<div class="map-wrap">
|
||||
<div class="map-side">
|
||||
<div class="map-side__title">附近医疗资源</div>
|
||||
<div class="map-side__group open">
|
||||
<div class="map-side__head" onclick="toggleResGroup(this)"><span class="map-side__caret">▾</span>医疗点<small>(3)</small></div>
|
||||
<div class="map-side__body">
|
||||
<div class="map-card" data-id="mp1" onclick="selectRes('mp1')"><div class="map-card__head"><span class="map-card__name">定边第二医疗点</span><span class="map-card__dist">2.3 km</span></div><div class="map-card__addr">详细地址：<span>定边县东环城路88号</span></div><div class="map-card__tel">联系电话：<span>0912-4211234</span></div></div>
|
||||
<div class="map-card" data-id="mp2" onclick="selectRes('mp2')"><div class="map-card__head"><span class="map-card__name">砖井医疗点</span><span class="map-card__dist">8.6 km</span></div><div class="map-card__addr">详细地址：<span>定边县砖井镇中心街19号</span></div><div class="map-card__tel">联系电话：<span>0912-4668877</span></div></div>
|
||||
<div class="map-card" data-id="mp3" onclick="selectRes('mp3')"><div class="map-card__head"><span class="map-card__name">安边医疗点</span><span class="map-card__dist">12.5 km</span></div><div class="map-card__addr">详细地址：<span>定边县安边镇北大街33号</span></div><div class="map-card__tel">联系电话：<span>0912-4589922</span></div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="map-side__group open">
|
||||
<div class="map-side__head" onclick="toggleResGroup(this)"><span class="map-side__caret">▾</span>合作医院<small>(3)</small></div>
|
||||
<div class="map-side__body">
|
||||
<div class="map-card" data-id="h1" onclick="selectRes('h1')"><div class="map-card__head"><span class="map-card__name">定边县人民医院</span><span class="map-card__dist">3.4 km</span></div><div class="map-card__addr">详细地址：<span>定边县人民路120号</span></div><div class="map-card__tel">联系电话：<span>0912-4221555</span></div></div>
|
||||
<div class="map-card" data-id="h2" onclick="selectRes('h2')"><div class="map-card__head"><span class="map-card__name">CQ能源职工医院</span><span class="map-card__dist">15.8 km</span></div><div class="map-card__addr">详细地址：<span>定边县能源大道6号</span></div><div class="map-card__tel">联系电话：<span>0912-4300666</span></div></div>
|
||||
<div class="map-card" data-id="h3" onclick="selectRes('h3')"><div class="map-card__head"><span class="map-card__name">延安市人民医院</span><span class="map-card__dist">128 km</span></div><div class="map-card__addr">详细地址：<span>延安市宝塔区北大街66号</span></div><div class="map-card__tel">联系电话：<span>0911-2850123</span></div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
推荐理由：血压多次测量超过 160/100mmHg，家庭自测波动大，需调整降压方案并评估靶器官损害。<br>
|
||||
关联异常指标：<span class="tag tag--ht">收缩压 158</span><span class="tag tag--ht">舒张压 98</span>
|
||||
<div style="margin-top:8px"><button class="btn btn--primary" style="height:28px">查看推荐单</button></div>
|
||||
</div>
|
||||
<div class="advc">
|
||||
<b>内分泌科门诊</b> <span class="pill pill--ok">常规随访</span><br>
|
||||
<div class="advc__grid">
|
||||
<div>推荐医院：<b style="color:#333;font-weight:500">定边县人民医院</b></div>
|
||||
<div>推荐专家：<b style="color:#333;font-weight:500">王医生（副主任医师）</b></div>
|
||||
<div>生成时间：<b style="color:#333;font-weight:500">2026-06-02</b></div>
|
||||
<div class="map-area">
|
||||
<svg class="map-bg" viewBox="0 0 100 100" preserveAspectRatio="none">
|
||||
<rect x="0" y="0" width="100" height="100" fill="#eef1f6"/>
|
||||
<polygon points="64,100 100,100 100,64 82,74 72,88" fill="#e2f2df"/>
|
||||
<path d="M0 12 Q 26 4 42 16 T 74 18 T 100 10 L 100 0 L 0 0 Z" fill="#d8ecfa"/>
|
||||
<g stroke="#ffffff" stroke-linecap="round">
|
||||
<line x1="0" y1="30" x2="100" y2="30" stroke-width="5"/>
|
||||
<line x1="56" y1="0" x2="56" y2="100" stroke-width="5"/>
|
||||
<line x1="0" y1="70" x2="100" y2="70" stroke-width="3.5"/>
|
||||
<line x1="20" y1="0" x2="20" y2="100" stroke-width="3"/>
|
||||
<line x1="0" y1="50" x2="56" y2="50" stroke-width="3"/>
|
||||
<line x1="56" y1="50" x2="100" y2="82" stroke-width="3"/>
|
||||
</g>
|
||||
<g stroke="#e3e7ef" stroke-width="1">
|
||||
<line x1="0" y1="40" x2="100" y2="40"/>
|
||||
<line x1="0" y1="60" x2="100" y2="60"/>
|
||||
<line x1="36" y1="0" x2="36" y2="100"/>
|
||||
<line x1="80" y1="0" x2="80" y2="100"/>
|
||||
</g>
|
||||
</svg>
|
||||
<svg class="map-route" viewBox="0 0 100 100" preserveAspectRatio="none">
|
||||
<polyline id="routeHalo" points="" fill="none" stroke="rgba(24,144,255,.22)" stroke-width="7" stroke-linecap="round" stroke-linejoin="round" vector-effect="non-scaling-stroke" style="display:none"/>
|
||||
<polyline id="routeLine" points="" fill="none" stroke="#1890ff" stroke-width="2.5" stroke-dasharray="6 4" stroke-linecap="round" stroke-linejoin="round" vector-effect="non-scaling-stroke" style="display:none"/>
|
||||
</svg>
|
||||
<div class="map-pin map-pin--cur" style="left:50%;top:50%">
|
||||
<div class="map-pin__badge"><svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="4.5" fill="#fff"/></svg></div>
|
||||
<span class="map-pin__label">当前位置 · 定边第一医疗点</span>
|
||||
</div>
|
||||
<div class="map-pin map-pin--mp" style="left:26%;top:30%" onclick="selectRes('mp1')">
|
||||
<div class="map-pin__badge"><svg viewBox="0 0 24 24" fill="none"><path d="M12 5v14M5 12h14" stroke="#fff" stroke-width="3" stroke-linecap="round"/></svg></div>
|
||||
<span class="map-pin__label">定边第二医疗点</span>
|
||||
</div>
|
||||
<div class="map-pin map-pin--mp" style="left:16%;top:72%" onclick="selectRes('mp2')">
|
||||
<div class="map-pin__badge"><svg viewBox="0 0 24 24" fill="none"><path d="M12 5v14M5 12h14" stroke="#fff" stroke-width="3" stroke-linecap="round"/></svg></div>
|
||||
<span class="map-pin__label">砖井医疗点</span>
|
||||
</div>
|
||||
<div class="map-pin map-pin--mp" style="left:76%;top:22%" onclick="selectRes('mp3')">
|
||||
<div class="map-pin__badge"><svg viewBox="0 0 24 24" fill="none"><path d="M12 5v14M5 12h14" stroke="#fff" stroke-width="3" stroke-linecap="round"/></svg></div>
|
||||
<span class="map-pin__label">安边医疗点</span>
|
||||
</div>
|
||||
<div class="map-pin map-pin--hos" style="left:80%;top:66%" onclick="selectRes('h1')">
|
||||
<div class="map-pin__badge"><svg viewBox="0 0 24 24"><path d="M9 4h6v5h5v6h-5v5H9v-5H4V9h5z" fill="#fff"/></svg></div>
|
||||
<span class="map-pin__label">定边县人民医院</span>
|
||||
</div>
|
||||
<div class="map-pin map-pin--hos" style="left:38%;top:86%" onclick="selectRes('h2')">
|
||||
<div class="map-pin__badge"><svg viewBox="0 0 24 24"><path d="M9 4h6v5h5v6h-5v5H9v-5H4V9h5z" fill="#fff"/></svg></div>
|
||||
<span class="map-pin__label">CQ能源职工医院</span>
|
||||
</div>
|
||||
<div class="map-pin map-pin--hos" style="left:88%;top:12%" onclick="selectRes('h3')">
|
||||
<div class="map-pin__badge"><svg viewBox="0 0 24 24"><path d="M9 4h6v5h5v6h-5v5H9v-5H4V9h5z" fill="#fff"/></svg></div>
|
||||
<span class="map-pin__label">延安市人民医院</span>
|
||||
</div>
|
||||
<div class="map-nav" id="mapNav">
|
||||
<div class="map-nav__head">导航路线<span class="map-nav__close" onclick="clearRes()">✕</span></div>
|
||||
<div class="map-nav__body" id="mapNavBody"></div>
|
||||
</div>
|
||||
</div>
|
||||
推荐理由：空腹血糖连续 3 年逐年升高，建议行糖化血红蛋白与糖耐量复核。<br>
|
||||
关联异常指标：<span class="tag tag--dm">空腹血糖 7.8</span>
|
||||
<div style="margin-top:8px"><button class="btn btn--primary" style="height:28px">查看推荐单</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -287,32 +474,140 @@
|
||||
<div class="overlay" id="reportModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head"><span class="modal__title">2026年度健康体检报告 · 岳春生</span><button class="modal__close" onclick="closeModal('reportModal')">✕</button></div>
|
||||
<div class="modal__body rp">
|
||||
<div class="rp__bar rp__concl"><b>体检结论：</b>血压偏高；空腹血糖及血清总胆固醇升高；轻度脂肪肝；其余项目未见明显异常。</div>
|
||||
<div class="rp__bar rp__advice"><b>体检建议：</b>控制血压血糖，低盐低脂饮食并加强运动；3个月后复查血脂与空腹血糖；每年做一次肝脏超声。</div>
|
||||
<div class="rp__cat">实验室检查</div>
|
||||
<div class="rp__sub">生化检验（6项）</div>
|
||||
<table>
|
||||
<tr><th>指标名称</th><th>结果</th><th>单位</th><th>参考范围</th></tr>
|
||||
<tr><td>空腹血糖</td><td class="abn">7.8 ↑</td><td>mmol/L</td><td>3.9 ~ 6.1</td></tr>
|
||||
<tr><td>血清总胆固醇</td><td class="abn">6.12 ↑</td><td>mmol/L</td><td>0 ~ 5.2</td></tr>
|
||||
<tr><td>甘油三酯</td><td>1.78</td><td>mmol/L</td><td>0 ~ 2.3</td></tr>
|
||||
<tr><td>谷丙转氨酶</td><td>32</td><td>U/L</td><td>0 ~ 50</td></tr>
|
||||
</table>
|
||||
<div class="rp__cat">一般检查</div>
|
||||
<div class="rp__sub">体格测量（4项）</div>
|
||||
<table>
|
||||
<tr><th>指标名称</th><th>结果</th><th>单位</th><th>参考范围</th></tr>
|
||||
<tr><td>收缩压</td><td class="abn">158 ↑</td><td>mmHg</td><td>90 ~ 139</td></tr>
|
||||
<tr><td>舒张压</td><td class="abn">98 ↑</td><td>mmHg</td><td>60 ~ 89</td></tr>
|
||||
<tr><td>体质指数 BMI</td><td class="abn">26.5 ↑</td><td>kg/m²</td><td>18.5 ~ 24.9</td></tr>
|
||||
<tr><td>身高</td><td>172</td><td>cm</td><td>—</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('reportModal')">关 闭</button>
|
||||
<!-- [交互] 下载体检报告 PDF（原型演示） -->
|
||||
<button class="btn btn--primary" onclick="alert('下载体检报告 PDF（原型演示）')">下载报告</button>
|
||||
<div class="modal__body">
|
||||
<!-- 体检结论 -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title">体检结论</div>
|
||||
<div class="report-note report-note--conclusion">1. 血压偏高：收缩压 158mmHg、舒张压 98mmHg；<br>2. 空腹血糖升高：7.8 mmol/L；<br>3. 血清总胆固醇升高：6.12 mmol/L；<br>4. 体质指数(BMI)偏高：26.5 kg/m²；<br>5. 轻度脂肪肝；其余各项体检指标未见明显异常。</div>
|
||||
</div>
|
||||
<!-- 体检建议 -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title">体检建议</div>
|
||||
<div class="report-note report-note--advice">1. 建议低盐低脂饮食，规律运动，控制体重；<br>2. 规律服药，每日早晚监测血压并记录，2周后复查；<br>3. 3个月后复查空腹血糖与血脂；<br>4. 每年进行一次肝脏超声，动态关注各项指标变化。</div>
|
||||
</div>
|
||||
<!-- 物理检查 -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title">物理检查</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">一般检查</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>身高</td><td>172</td><td>cm</td><td>-</td></tr>
|
||||
<tr><td>体重</td><td>78.4</td><td>kg</td><td>-</td></tr>
|
||||
<tr><td>体质指数(BMI)</td><td class="result-abnormal">26.5 ↑</td><td>kg/m²</td><td>18.5~24.9</td></tr>
|
||||
<tr><td>收缩压</td><td class="result-abnormal">158 ↑</td><td>mmHg</td><td>90~139</td></tr>
|
||||
<tr><td>舒张压</td><td class="result-abnormal">98 ↑</td><td>mmHg</td><td>60~89</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">视力</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>裸眼视力(右)</td><td>1.0</td><td>-</td><td>≥1.0</td></tr>
|
||||
<tr><td>裸眼视力(左)</td><td>0.9</td><td>-</td><td>≥1.0</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 内科 -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title">内科</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">心肺听诊</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>心率</td><td>78</td><td>次/分</td><td>60~100</td></tr>
|
||||
<tr><td>心律</td><td>齐</td><td>-</td><td>节律整齐</td></tr>
|
||||
<tr><td>呼吸音</td><td>清晰</td><td>-</td><td>呼吸音清晰</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">腹部触诊</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>肝脏</td><td>未触及</td><td>-</td><td>无肿大</td></tr>
|
||||
<tr><td>脾脏</td><td>未触及</td><td>-</td><td>无肿大</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 外科 -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title">外科</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">皮肤与淋巴结</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>皮肤</td><td>无异常</td><td>-</td><td>皮肤黏膜无异常</td></tr>
|
||||
<tr><td>浅表淋巴结</td><td>未触及肿大</td><td>-</td><td>无肿大</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">甲状腺与脊柱四肢</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>甲状腺</td><td>无肿大</td><td>-</td><td>无肿大</td></tr>
|
||||
<tr><td>脊柱、四肢关节</td><td>无异常</td><td>-</td><td>活动自如</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 化学检查 -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title">化学检查</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">血常规</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>白细胞计数</td><td>6.5</td><td>×10⁹/L</td><td>3.5~9.5</td></tr>
|
||||
<tr><td>红细胞计数</td><td>4.9</td><td>×10¹²/L</td><td>4.3~5.8</td></tr>
|
||||
<tr><td>血红蛋白</td><td>148</td><td>g/L</td><td>130~175</td></tr>
|
||||
<tr><td>血小板计数</td><td>210</td><td>×10⁹/L</td><td>125~350</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">肝功能</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>丙氨酸氨基转移酶(ALT)</td><td>32</td><td>U/L</td><td>9~50</td></tr>
|
||||
<tr><td>天门冬氨酸氨基转移酶(AST)</td><td>26</td><td>U/L</td><td>15~40</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">血脂四项</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>总胆固醇</td><td class="result-abnormal">6.12 ↑</td><td>mmol/L</td><td><5.2</td></tr>
|
||||
<tr><td>甘油三酯</td><td>1.45</td><td>mmol/L</td><td><1.7</td></tr>
|
||||
<tr><td>高密度脂蛋白胆固醇</td><td>1.12</td><td>mmol/L</td><td>>1.04</td></tr>
|
||||
<tr><td>低密度脂蛋白胆固醇</td><td>3.10</td><td>mmol/L</td><td><3.4</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="report-sub">
|
||||
<div class="report-sub__title">血糖</div>
|
||||
<table class="report-table">
|
||||
<thead><tr><th>项目名称</th><th>结果</th><th>单位</th><th>参考值</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>空腹血糖</td><td class="result-abnormal">7.8 ↑</td><td>mmol/L</td><td>3.9~6.1</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -327,11 +622,14 @@
|
||||
document.querySelectorAll('.panel').forEach(function (p) { p.classList.remove('on'); });
|
||||
document.getElementById('p-' + name).classList.add('on');
|
||||
}
|
||||
// 检查类别树切换指标卡组：all/one/lab 有数据，其余走空态
|
||||
// 检查类别树：父级点击展开/收起，子类点击切换右侧指标卡组
|
||||
function toggleTree(el) {
|
||||
el.parentElement.classList.toggle('open');
|
||||
}
|
||||
function pickCat(el, key) {
|
||||
document.querySelectorAll('.tree__item').forEach(function (t) { t.classList.remove('on'); });
|
||||
el.classList.add('on');
|
||||
['cat-all', 'cat-one', 'cat-lab'].forEach(function (k) {
|
||||
['cat-one-bp', 'cat-one-bmi', 'cat-lab-glu', 'cat-lab-lipid', 'cat-lab-cbc'].forEach(function (k) {
|
||||
document.getElementById(k).style.display = 'none';
|
||||
});
|
||||
document.getElementById('cat-other').style.display = 'none';
|
||||
@@ -341,6 +639,46 @@
|
||||
document.getElementById('cat-other').style.display = 'grid';
|
||||
}
|
||||
}
|
||||
// ===== 就医推荐：地图导航 =====
|
||||
var MAP_RES = {
|
||||
mp1: { name: '定边第二医疗点', dist: '2.3 km', time: '约 8 分钟', x: 26, y: 30,
|
||||
steps: ['从定边第一医疗点出发，沿东环城路向南 600m；', '右转进入兴民街，直行 1.2km；', '左转进入青松路 500m，到达定边第二医疗点。'] },
|
||||
mp2: { name: '砖井医疗点', dist: '8.6 km', time: '约 20 分钟', x: 16, y: 72,
|
||||
steps: ['从定边第一医疗点出发，经南外环向西 4.5km；', '转入 G307 国道，向西南方向行驶 3.8km；', '右转进入砖井镇主街 300m，到达砖井医疗点。'] },
|
||||
mp3: { name: '安边医疗点', dist: '12.5 km', time: '约 28 分钟', x: 76, y: 22,
|
||||
steps: ['从定边第一医疗点出发，沿北外环向东 2.2km；', '驶入定靖公路，向东北方向行驶 9.6km；', '左转进入安边镇中心街 700m，到达安边医疗点。'] },
|
||||
h1: { name: '定边县人民医院', dist: '3.4 km', time: '约 12 分钟', x: 80, y: 66,
|
||||
steps: ['从定边第一医疗点出发，沿长城南街向南 800m；', '左转进入人民路，直行 1.6km；', '右转进入健康路 1.0km，到达定边县人民医院。'] },
|
||||
h2: { name: 'CQ能源职工医院', dist: '15.8 km', time: '约 35 分钟', x: 38, y: 86,
|
||||
steps: ['从定边第一医疗点出发，经东环城路向南 5.2km；', '驶入银定高速，向南行驶 9.8km；', '出口右转进入能源大道 800m，到达 CQ 能源职工医院。'] },
|
||||
h3: { name: '延安市人民医院', dist: '128 km', time: '约 2 小时', x: 88, y: 12,
|
||||
steps: ['从定边第一医疗点出发，驶入定延高速；', '沿高速向南行驶 124km；', '延安北出口下高速，进入北大街 3.6km，到达延安市人民医院。'] }
|
||||
};
|
||||
function toggleResGroup(el) { el.parentElement.classList.toggle('open'); }
|
||||
function selectRes(id) {
|
||||
var r = MAP_RES[id]; if (!r) return;
|
||||
document.querySelectorAll('.map-card').forEach(function (c) { c.classList.remove('on'); });
|
||||
var card = document.querySelector('.map-card[data-id="' + id + '"]');
|
||||
if (card) card.classList.add('on');
|
||||
var pts = '50,50 ' + r.x + ',50 ' + r.x + ',' + r.y;
|
||||
document.getElementById('routeHalo').setAttribute('points', pts);
|
||||
document.getElementById('routeLine').setAttribute('points', pts);
|
||||
document.getElementById('routeHalo').style.display = 'block';
|
||||
document.getElementById('routeLine').style.display = 'block';
|
||||
var steps = r.steps.map(function (s, i) {
|
||||
return '<div class="map-nav__step"><span class="map-nav__idx">' + (i + 1) + '</span><span>' + s + '</span></div>';
|
||||
}).join('');
|
||||
document.getElementById('mapNavBody').innerHTML =
|
||||
'<div class="map-nav__dest">' + r.name + '</div>' +
|
||||
'<div class="map-nav__info">距离 ' + r.dist + ' · ' + r.time + '</div>' + steps;
|
||||
document.getElementById('mapNav').classList.add('open');
|
||||
}
|
||||
function clearRes() {
|
||||
document.getElementById('routeHalo').style.display = 'none';
|
||||
document.getElementById('routeLine').style.display = 'none';
|
||||
document.getElementById('mapNav').classList.remove('open');
|
||||
document.querySelectorAll('.map-card').forEach(function (c) { c.classList.remove('on'); });
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
|
||||
@@ -34,15 +34,15 @@
|
||||
.panel__btn { flex: 1; text-align: center; padding: 7px 0; border-radius: 14px; background: #e7f4ff; color: #1890ff; font-size: 12px; cursor: pointer; border: none; }
|
||||
.content { flex: 1; overflow-y: auto; padding: 16px 20px; scrollbar-width: none; }
|
||||
.content::-webkit-scrollbar { display: none; }
|
||||
.search-bar { background: #fff; border-radius: 12px; padding: 14px 16px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.search-bar__item { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; position: relative; }
|
||||
.search-bar__input { height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; min-width: 150px; outline: none; }
|
||||
.search-bar { background: #fff; border-radius: 12px; padding: 14px 16px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.search-bar__item { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; position: relative; }
|
||||
.search-bar__input { height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; min-width: 120px; outline: none; }
|
||||
.search-bar__input:focus { border-color: #1890ff; }
|
||||
.btn { height: 32px; padding: 0 16px; border-radius: 6px; border: 1px solid #d9dee8; background: #fff; color: #4a5a7f; font-size: 13px; cursor: pointer; }
|
||||
.btn--primary { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* 单位/部门双列联动面板 */
|
||||
.org-select-wrap { position: relative; }
|
||||
.org-trigger { min-width: 250px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 10px; font-size: 13px; color: #333; background: #fff; cursor: pointer; }
|
||||
.org-trigger { min-width: 200px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 10px; font-size: 13px; color: #333; background: #fff; cursor: pointer; }
|
||||
.org-trigger .ph { color: #b7bfcc; }
|
||||
.org-trigger i { font-style: normal; color: #b7bfcc; font-size: 10px; }
|
||||
.org-panel { position: absolute; top: 38px; left: 68px; width: 400px; height: 268px; background: #fff; border: 1px solid #e5e8ef; border-radius: 10px; box-shadow: 0 6px 18px rgba(74,90,127,.18); z-index: 25; display: none; flex-direction: column; }
|
||||
@@ -71,6 +71,13 @@
|
||||
.ftag--c { background: rgba(212,177,6,.14); color: #b8960a; }
|
||||
.ftag--d { background: rgba(104,98,214,.12); color: #6862D6; }
|
||||
.ftag--e { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
/* 慢病干预疾病标签 */
|
||||
.dtag { display: inline-block; padding: 1px 8px; border-radius: 4px; font-size: 11px; margin-right: 4px; }
|
||||
.dtag--ht { background: rgba(24,144,255,.15); color: #1890ff; }
|
||||
.dtag--chd { background: rgba(0,195,195,.15); color: #00c3c3; }
|
||||
.dtag--ob { background: rgba(252,163,24,.15); color: #fca318; }
|
||||
.dtag--dm { background: rgba(42,193,139,.15); color: #2ac18b; }
|
||||
.dtag--over { background: rgba(238,101,87,.15); color: #EE6557; }
|
||||
.fcard__lines { margin-top: 10px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.fcard__lines b { color: #333; font-weight: 500; }
|
||||
.page-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; font-size: 12px; color: #969eb0; padding-bottom: 4px; }
|
||||
@@ -95,7 +102,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -122,7 +129,7 @@
|
||||
<div class="content">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar__item">姓名<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">工号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">员工编号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">单位部门
|
||||
<!-- [交互] 双列面板：左列选单位、右列联动显示部门；确认后代入筛选 -->
|
||||
<div class="org-select-wrap">
|
||||
@@ -147,7 +154,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-bar__item">人群分类
|
||||
<select class="search-bar__input" style="min-width:130px"><option>全部</option><option>a-大病人群</option><option>b-慢病人群</option><option>c-异常人群</option><option>d-风险人群</option><option>e-健康人群</option></select>
|
||||
<select class="search-bar__input" style="min-width:120px"><option>全部</option><option>A-大病人群</option><option>B-慢病人群</option><option>C-异常人群</option><option>D-风险人群</option><option>E-健康人群</option></select>
|
||||
</div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
@@ -156,28 +163,28 @@
|
||||
<div class="fgrid">
|
||||
<!-- [交互] 点击卡片进入员工档案详情: employee-file-detail.html -->
|
||||
<div class="fcard" onclick="location.href='employee-file-detail.html'">
|
||||
<div class="fcard__top"><span class="avatar">岳</span><span class="fcard__name">岳春生<small>男 · 54岁</small></span><span class="ftag ftag--b">b-慢病人群</span></div>
|
||||
<div class="fcard__lines">工号：1035678<br>单位/部门：<b>陕E作业区 / 管理四中心</b><br>岗位：班长 联系电话：139****2214<br>最近体检：2026年度 · 已解读</div>
|
||||
<div class="fcard__top"><span class="avatar">岳</span><span class="fcard__name">岳春生<small>男 · 54岁</small></span><span class="ftag ftag--b">B-慢病人群</span></div>
|
||||
<div class="fcard__lines">员工编号：1035678<br>单位/部门：<b>陕E作业区 / 管理四中心</b><br>联系电话：13982342214<br>慢病干预：<span class="dtag dtag--ht">高血压</span><span class="dtag dtag--dm">糖尿病</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='employee-file-detail.html'">
|
||||
<div class="fcard__top"><span class="avatar">田</span><span class="fcard__name">田淑珍<small>女 · 61岁</small></span><span class="ftag ftag--a">a-大病人群</span></div>
|
||||
<div class="fcard__lines">工号：1042237<br>单位/部门：<b>陕E作业区 / 转运站</b><br>岗位：调度 联系电话：137****8852<br>最近体检：2026年度 · 已解读</div>
|
||||
<div class="fcard__top"><span class="avatar">田</span><span class="fcard__name">田淑珍<small>女 · 61岁</small></span><span class="ftag ftag--a">A-大病人群</span></div>
|
||||
<div class="fcard__lines">员工编号：1042237<br>单位/部门：<b>陕E作业区 / 转运站</b><br>联系电话：13755128852<br>慢病干预：<span class="dtag dtag--chd">冠心病</span><span class="dtag dtag--ht">高血压</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='employee-file-detail.html'">
|
||||
<div class="fcard__top"><span class="avatar">尹</span><span class="fcard__name">尹立春<small>男 · 47岁</small></span><span class="ftag ftag--c">c-异常人群</span></div>
|
||||
<div class="fcard__lines">工号：1028945<br>单位/部门：<b>陕E作业区 / 注水大队</b><br>岗位：操作工 联系电话：158****3307<br>最近体检：2026年度 · 待解读</div>
|
||||
<div class="fcard__top"><span class="avatar">尹</span><span class="fcard__name">尹立春<small>男 · 47岁</small></span><span class="ftag ftag--c">C-异常人群</span></div>
|
||||
<div class="fcard__lines">员工编号：1028945<br>单位/部门：<b>陕E作业区 / 注水大队</b><br>联系电话：15827463307<br>慢病干预：<span class="dtag dtag--ob">肥胖</span><span class="dtag dtag--over">超重</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='employee-file-detail.html'">
|
||||
<div class="fcard__top"><span class="avatar">戴</span><span class="fcard__name">戴文广<small>男 · 58岁</small></span><span class="ftag ftag--b">b-慢病人群</span></div>
|
||||
<div class="fcard__lines">工号：1031002<br>单位/部门：<b>采油一大队</b><br>岗位：采油工 联系电话：136****9021<br>最近体检：2026年度 · 已解读</div>
|
||||
<div class="fcard__top"><span class="avatar">戴</span><span class="fcard__name">戴文广<small>男 · 58岁</small></span><span class="ftag ftag--b">B-慢病人群</span></div>
|
||||
<div class="fcard__lines">员工编号：1031002<br>单位/部门：<b>采油一大队</b><br>联系电话：13648219021<br>慢病干预：<span class="dtag dtag--ht">高血压</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='employee-file-detail.html'">
|
||||
<div class="fcard__top"><span class="avatar">付</span><span class="fcard__name">付桂荣<small>女 · 52岁</small></span><span class="ftag ftag--d">d-风险人群</span></div>
|
||||
<div class="fcard__lines">工号：1044518<br>单位/部门：<b>采油二大队</b><br>岗位：资料员 联系电话：135****4478<br>最近体检：2026年度 · 已解读</div>
|
||||
<div class="fcard__top"><span class="avatar">付</span><span class="fcard__name">付桂荣<small>女 · 52岁</small></span><span class="ftag ftag--d">D-风险人群</span></div>
|
||||
<div class="fcard__lines">员工编号：1044518<br>单位/部门：<b>采油二大队</b><br>联系电话：13570884478<br>慢病干预：<span class="dtag dtag--dm">糖尿病</span></div>
|
||||
</div>
|
||||
<div class="fcard" onclick="location.href='employee-file-detail.html'">
|
||||
<div class="fcard__top"><span class="avatar">曲</span><span class="fcard__name">曲志明<small>男 · 45岁</small></span><span class="ftag ftag--e">e-健康人群</span></div>
|
||||
<div class="fcard__lines">工号：1037781<br>单位/部门：<b>输气作业区</b><br>岗位：巡检工 联系电话：186****6633<br>最近体检：2026年度 · 已解读</div>
|
||||
<div class="fcard__top"><span class="avatar">曲</span><span class="fcard__name">曲志明<small>男 · 45岁</small></span><span class="ftag ftag--e">E-健康人群</span></div>
|
||||
<div class="fcard__lines">员工编号：1037781<br>单位/部门：<b>输气作业区</b><br>联系电话：18629166633<br>慢病干预：<span class="dtag dtag--dm">糖尿病</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -104,7 +104,7 @@
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 点击返回来源页面（来源记录为空时回退到浏览器历史） -->
|
||||
<a class="drawer__back" href="follow-records.html" onclick="goBack(); return false;">‹ 返回</a>
|
||||
<span class="drawer__title">新增随访</span>
|
||||
<span class="drawer__title" id="drawerTitle">新增随访</span>
|
||||
</div>
|
||||
|
||||
<div class="drawer__body">
|
||||
@@ -112,14 +112,14 @@
|
||||
<div class="sec">
|
||||
<div class="sec__title">基本信息</div>
|
||||
<div class="inquiry">
|
||||
<select><option>姓名</option><option>工号</option></select>
|
||||
<select><option>姓名</option><option>员工编号</option></select>
|
||||
<input placeholder="请输入姓名后搜索" value="岳春生">
|
||||
<!-- [交互] 点击搜索显示员工结果浮层；无结果时提示「未查询到此员工信息」 -->
|
||||
<button class="btn btn--primary" onclick="document.getElementById('iqResult').style.display='block'">搜 索</button>
|
||||
<button class="btn">重 置</button>
|
||||
<div class="iq-result" id="iqResult">
|
||||
<table>
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>工号</th><th>单位</th><th>部门</th></tr>
|
||||
<tr><th>姓名</th><th>性别</th><th>年龄</th><th>员工编号</th><th>单位</th><th>部门</th></tr>
|
||||
<tr class="row" onclick="pickEmp()"><td>岳春生</td><td>男</td><td>54</td><td>1035678</td><td>陕E作业区</td><td>管理四中心</td></tr>
|
||||
<tr class="row" onclick="pickEmp()"><td>岳春明</td><td>男</td><td>49</td><td>1035921</td><td>陕E作业区</td><td>注水大队</td></tr>
|
||||
</table>
|
||||
@@ -129,7 +129,7 @@
|
||||
<div class="fld"><span class="fld__label">姓名</span><input id="empName" value="岳春生" readonly></div>
|
||||
<div class="fld"><span class="fld__label">性别</span><input id="empGender" value="男" readonly></div>
|
||||
<div class="fld"><span class="fld__label">年龄</span><input id="empAge" value="54" readonly></div>
|
||||
<div class="fld"><span class="fld__label">工号</span><input id="empNo" value="1035678" readonly></div>
|
||||
<div class="fld"><span class="fld__label">员工编号</span><input id="empNo" value="1035678" readonly></div>
|
||||
<div class="fld"><span class="fld__label">联系电话</span><input value="13956282214" readonly></div>
|
||||
<div class="fld"><span class="fld__label">单位/部门</span><input id="empUnitDept" value="陕E作业区 / 管理四中心" readonly></div>
|
||||
<!-- 慢病标签由员工慢病档案自动回显，不可手工修改 -->
|
||||
@@ -336,13 +336,16 @@
|
||||
if (document.referrer) { location.href = document.referrer; }
|
||||
else { history.back(); }
|
||||
}
|
||||
// 从 URL 参数回填员工信息（由任务中心「进行随访」带入）
|
||||
// 新增/编辑模式：?mode=edit 或带 name（任务中心「进行随访」）进入编辑态，隐藏搜索并回填固定员工信息
|
||||
(function () {
|
||||
var p = new URLSearchParams(location.search);
|
||||
if (!p.get('name')) return;
|
||||
// 带入了员工信息（来自任务中心）时隐藏姓名搜索行；无参数（来自随访管理）则保留搜索
|
||||
var isEdit = p.get('mode') === 'edit' || !!p.get('name');
|
||||
if (!isEdit) return;
|
||||
document.getElementById('drawerTitle').textContent = '编辑随访';
|
||||
document.title = '编辑随访 | 医疗点PAD端';
|
||||
// 编辑态：基本信息固定（带过来的员工信息），隐藏姓名搜索行，不允许搜索更改
|
||||
document.querySelector('.inquiry').style.display = 'none';
|
||||
document.getElementById('empName').value = p.get('name');
|
||||
document.getElementById('empName').value = p.get('name') || '';
|
||||
document.getElementById('empGender').value = p.get('gender') || '';
|
||||
document.getElementById('empAge').value = p.get('age') || '';
|
||||
document.getElementById('empNo').value = p.get('empno') || '';
|
||||
|
||||
@@ -105,7 +105,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -132,40 +132,40 @@
|
||||
<div class="content">
|
||||
<div style="display:flex;gap:14px;align-items:center">
|
||||
<div class="search-bar" style="flex:1">
|
||||
<div class="search-bar__item">随访员工<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">工号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">员工姓名<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">员工编号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">随访日期<input class="search-bar__input" style="min-width:200px" placeholder="开始日期 ~ 结束日期"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
<!-- [交互] 点击打开新增随访抽屉: follow-drawer.html -->
|
||||
<button class="btn btn--primary" style="height:36px;padding:0 20px;flex-shrink:0" onclick="location.href='follow-drawer.html'">＋ 新增随访</button>
|
||||
<button class="btn btn--primary" style="height:36px;padding:0 20px;flex-shrink:0" onclick="location.href='follow-drawer.html?mode=add'">＋ 新增随访</button>
|
||||
</div>
|
||||
|
||||
<div class="fgrid">
|
||||
<div class="fcard" onclick="openModal('detailModal')">
|
||||
<div class="fcard__top"><span class="avatar">岳</span><span class="fcard__name">岳春生<small>男 · 54岁</small></span><span class="pill pill--times">第3次</span></div>
|
||||
<div class="fcard__lines">工号：1035678<br>单位：陕E作业区管理四中心<br>症状：头晕、血压波动<br>随访医生：石维国 随访时间：2026-08-20<br>联系电话：139****2214</div>
|
||||
<div class="fcard__lines">员工编号：1035678<br>单位部门：陕E作业区-管理四中心<br>症状：头晕、血压波动<br>随访医生：石维国 随访时间：2026-08-20<br>联系电话：13956282214</div>
|
||||
</div>
|
||||
<div class="fcard" onclick="openModal('detailModal')">
|
||||
<div class="fcard__top"><span class="avatar">田</span><span class="fcard__name">田淑珍<small>女 · 61岁</small></span><span class="pill pill--times">第5次</span></div>
|
||||
<div class="fcard__lines">工号：1042237<br>单位：陕E作业区转运站<br>症状：活动后胸闷<br>随访医生：石维国 随访时间：2026-08-18<br>联系电话：137****8852</div>
|
||||
<div class="fcard__lines">员工编号：1042237<br>单位部门：陕E作业区-转运站<br>症状：活动后胸闷<br>随访医生：石维国 随访时间：2026-08-18<br>联系电话：13759028852</div>
|
||||
</div>
|
||||
<div class="fcard" onclick="openModal('detailModal')">
|
||||
<div class="fcard__top"><span class="avatar">尹</span><span class="fcard__name">尹立春<small>男 · 47岁</small></span><span class="pill pill--times">第2次</span></div>
|
||||
<div class="fcard__lines">工号：1028945<br>单位：陕E作业区注水大队<br>症状：体重控制不佳<br>随访医生：韩丽平 随访时间：2026-08-15<br>联系电话：158****3307</div>
|
||||
<div class="fcard__lines">员工编号：1028945<br>单位部门：陕E作业区-注水大队<br>症状：体重控制不佳<br>随访医生：韩丽平 随访时间：2026-08-15<br>联系电话：15829153307</div>
|
||||
</div>
|
||||
<div class="fcard" onclick="openModal('detailModal')">
|
||||
<div class="fcard__top"><span class="avatar">戴</span><span class="fcard__name">戴文广<small>男 · 58岁</small></span><span class="pill pill--times">第4次</span></div>
|
||||
<div class="fcard__lines">工号：1031002<br>单位：采油一大队<br>症状：血压控制尚可<br>随访医生：石维国 随访时间：2026-08-12<br>联系电话：136****9021</div>
|
||||
<div class="fcard__lines">员工编号：1031002<br>单位部门：采油一厂-作业一大队<br>症状：血压控制尚可<br>随访医生：石维国 随访时间：2026-08-12<br>联系电话：13659219021</div>
|
||||
</div>
|
||||
<div class="fcard" onclick="openModal('detailModal')">
|
||||
<div class="fcard__top"><span class="avatar">付</span><span class="fcard__name">付桂荣<small>女 · 52岁</small></span><span class="pill pill--times">第1次</span></div>
|
||||
<div class="fcard__lines">工号：1044518<br>单位：采油二大队<br>症状：空腹血糖偏高<br>随访医生：韩丽平 随访时间：2026-08-10<br>联系电话：135****4478</div>
|
||||
<div class="fcard__lines">员工编号：1044518<br>单位部门：采油二厂-作业二大队<br>症状：空腹血糖偏高<br>随访医生：韩丽平 随访时间：2026-08-10<br>联系电话：13572914478</div>
|
||||
</div>
|
||||
<div class="fcard" onclick="openModal('detailModal')">
|
||||
<div class="fcard__top"><span class="avatar">曲</span><span class="fcard__name">曲志明<small>男 · 45岁</small></span><span class="pill pill--times">第2次</span></div>
|
||||
<div class="fcard__lines">工号：1037781<br>单位：输气作业区<br>症状：间断心悸<br>随访医生：石维国 随访时间：2026-08-06<br>联系电话：186****6633</div>
|
||||
<div class="fcard__lines">员工编号：1037781<br>单位部门：输气厂-输气作业区<br>症状：间断心悸<br>随访医生：石维国 随访时间：2026-08-06<br>联系电话：18629506633</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -191,8 +191,8 @@
|
||||
</div>
|
||||
<div class="kv">
|
||||
<div>姓名：<b>岳春生</b><span class="pill pill--times" style="margin-left:6px">第3次</span></div><div>性别：<b>男</b></div><div>年龄：<b>54 岁</b></div>
|
||||
<div>工号：<b>1035678</b></div><div>联系电话：<b>139****2214</b></div><div>慢病：<span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span></div>
|
||||
<div class="kv__full">单位/部门：<b>CQ能源陕E作业区 / 管理四中心</b></div>
|
||||
<div>员工编号：<b>1035678</b></div><div>联系电话：<b>13956282214</b></div><div>慢病：<span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span></div>
|
||||
<div class="kv__full">单位部门：<b>陕E作业区-管理四中心</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
@@ -235,7 +235,7 @@
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">关联任务</div>
|
||||
<div class="task-link">2026年第三季度高血压随访任务 <span class="pill pill--wait" style="margin:0 6px">待随访</span><span style="color:#fca318">还剩 2 天</span></div>
|
||||
<div class="task-link">任务类型：<b>频次巡诊</b> 计划随访日期：<b>2026-09-04</b></div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">员工签字</div>
|
||||
@@ -243,10 +243,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<span class="modal__tip">仅随访时间 24 小时以内可编辑或删除；人员不在本医疗点不可编辑</span>
|
||||
<span class="modal__tip">仅随访时间 24 小时以内可编辑或删除</span>
|
||||
<div style="display:flex;gap:10px">
|
||||
<button class="btn btn--danger">删 除</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('detailModal');location.href='follow-drawer.html'">编 辑</button>
|
||||
<button class="btn btn--primary" onclick="closeModal('detailModal');location.href='follow-drawer.html?mode=edit&name=岳春生&gender=男&age=54&empno=1035678&unit=陕E作业区&dept=管理四中心&tags=高血压,糖尿病'">编 辑</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -84,7 +84,6 @@
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>参加人数</span><input value="40"><span class="fld__unit">人</span></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>覆盖区域</span><input placeholder="如：管理四中心 / 全作业区" value="管理四中心"></div>
|
||||
<div class="fld"><span class="fld__label">时长</span><input value="45"><span class="fld__unit">分钟</span></div>
|
||||
<div class="fld"><span class="fld__label">负责人</span><input value="石维国（当前登录）" readonly></div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>内容</span><textarea placeholder="请输入宣教/培训内容摘要">围绕秋冬季流感与肺炎支原体感染高发季，讲解通风消毒、疫苗接种指征与出现症状后的处置流程；现场演示正确洗手七步法，发放防护要点折页。</textarea></div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -101,7 +100,7 @@
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">宣教资料</div>
|
||||
<div class="sec__title">活动资料<span class="sec__tip">文件不超过10M</span></div>
|
||||
<div class="file-line"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6"/></svg>《秋冬季呼吸道防护要点》.pdf<span class="size">1.2 MB</span><span class="x">✕</span></div>
|
||||
<!-- [交互] 上传宣教资料附件（pdf/doc/图片等） -->
|
||||
<button class="file-add" onclick="alert('选择文件上传（原型演示）')">＋ 添加资料</button>
|
||||
@@ -111,14 +110,25 @@
|
||||
<div class="sec__title">负责人签字</div>
|
||||
<div class="fld fld--full" style="align-items:flex-start">
|
||||
<span class="fld__label" style="padding-top:8px"><span class="fld__req">*</span>签字</span>
|
||||
<!-- [交互] 点击打开页内手写签名弹窗 -->
|
||||
<div class="sign-box" onclick="openSign()">
|
||||
<svg viewBox="0 0 24 24"><path d="M17 3a2.8 2.8 0 014 4L7.5 20.5 2 22l1.5-5.5z"/></svg>
|
||||
点击签名
|
||||
<div style="flex:1">
|
||||
<div class="radio" style="margin-bottom:10px">
|
||||
<label><input type="radio" name="signType" checked onclick="switchSignType('hand')">手写签名</label>
|
||||
<label><input type="radio" name="signType" onclick="switchSignType('img')">签字图片</label>
|
||||
</div>
|
||||
<!-- [交互] 手写签名：点击打开页内手写签名弹窗 -->
|
||||
<div class="sign-box" id="signHandBox" onclick="openSign()">
|
||||
<svg viewBox="0 0 24 24"><path d="M17 3a2.8 2.8 0 014 4L7.5 20.5 2 22l1.5-5.5z"/></svg>
|
||||
点击签名
|
||||
</div>
|
||||
<!-- [交互] 签字图片：点击上传图片，与手写签名两者选其一即可 -->
|
||||
<div class="sign-box" id="signImgBox" style="display:none" onclick="document.getElementById('signImgInput').click()">
|
||||
<svg viewBox="0 0 24 24"><path d="M12 16V4M7 9l5-5 5 5"/><path d="M4 20h16"/></svg>
|
||||
上传签字图片
|
||||
</div>
|
||||
<input type="file" id="signImgInput" accept="image/*" style="display:none" onchange="onSignImg(this)">
|
||||
</div>
|
||||
</div>
|
||||
<!-- [交互] 未勾选时提交提示「请确认本单位已确认」 -->
|
||||
<label class="sign-note"><input type="checkbox" checked>本人签字确认本单位已确认该宣教/培训记录真实有效</label>
|
||||
<div class="sign-note">签字确认该宣教/培训记录真实有效</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -176,10 +186,28 @@
|
||||
}
|
||||
function confirmSign() {
|
||||
if (!hasInk) { alert('您还没有进行签字！'); return; }
|
||||
var box = document.querySelector('.sign-box');
|
||||
var box = document.getElementById('signHandBox');
|
||||
box.innerHTML = '<span style="font-size:26px;font-family:KaiTi,serif;color:#333">石维国</span><span style="font-size:11px">已签名 · 点击可重签</span>';
|
||||
closeSign();
|
||||
}
|
||||
// 签字方式切换：手写签名 / 签字图片（两者选其一）
|
||||
function switchSignType(type) {
|
||||
var isHand = type === 'hand';
|
||||
document.getElementById('signHandBox').style.display = isHand ? 'flex' : 'none';
|
||||
document.getElementById('signImgBox').style.display = isHand ? 'none' : 'flex';
|
||||
}
|
||||
// 签字图片：读取上传图片并预览
|
||||
function onSignImg(input) {
|
||||
var file = input.files && input.files[0];
|
||||
if (!file) return;
|
||||
var reader = new FileReader();
|
||||
reader.onload = function (e) {
|
||||
var box = document.getElementById('signImgBox');
|
||||
box.innerHTML = '<img src="' + e.target.result + '" style="max-width:100%;max-height:92px;object-fit:contain">' +
|
||||
'<span style="font-size:11px;color:#969eb0">已上传 · 点击可重新上传</span>';
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -105,7 +105,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -133,7 +133,6 @@
|
||||
<div style="display:flex;gap:14px;align-items:center">
|
||||
<div class="search-bar" style="flex:1">
|
||||
<div class="search-bar__item">标题<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">负责人<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">日期<input class="search-bar__input" style="min-width:200px" placeholder="开始日期 ~ 结束日期"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
@@ -153,25 +152,25 @@
|
||||
<div class="egrid">
|
||||
<div class="egcard" onclick="openModal('detailModal')">
|
||||
<div class="egcard__head"><span class="egcard__title">夏季心脑血管疾病预防</span><span class="egcard__date">2026-08-18</span></div>
|
||||
<div class="egcard__body">负责人：<b>石维国</b> 参加人数：<b>36</b> 覆盖区域：<b>管理四中心</b><div class="egcard__brief">针对高温作业人群讲解中暑识别与心脑血管急症的日常预防要点，发放低盐膳食手册。</div>
|
||||
<div class="egcard__body">参加人数：<b>36</b> 覆盖区域：<b>管理四中心</b><div class="egcard__brief">针对高温作业人群讲解中暑识别与心脑血管急症的日常预防要点，发放低盐膳食手册。</div>
|
||||
<div class="photos"><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="egcard" onclick="openModal('detailModal')">
|
||||
<div class="egcard__head"><span class="egcard__title">糖尿病饮食管理讲堂</span><span class="egcard__date">2026-07-22</span></div>
|
||||
<div class="egcard__body">负责人：<b>韩丽平</b> 参加人数：<b>24</b> 覆盖区域：<b>转运站</b><div class="egcard__brief">结合职工体检血糖异常数据，讲解主食定量与升糖指数，现场演示食物份量估算。</div>
|
||||
<div class="egcard__body">参加人数：<b>24</b> 覆盖区域：<b>转运站</b><div class="egcard__brief">结合职工体检血糖异常数据，讲解主食定量与升糖指数，现场演示食物份量估算。</div>
|
||||
<div class="photos"><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="egcard" onclick="openModal('detailModal')">
|
||||
<div class="egcard__head"><span class="egcard__title">职业病防治法宣传周</span><span class="egcard__date">2026-04-28</span></div>
|
||||
<div class="egcard__body">负责人：<b>石维国</b> 参加人数：<b>112</b> 覆盖区域：<b>全作业区</b><div class="egcard__brief">围绕接害岗位防护开展普法宣传，设置粉尘与噪声防护体验展台并发放防护用品。</div>
|
||||
<div class="egcard__body">参加人数：<b>112</b> 覆盖区域：<b>全作业区</b><div class="egcard__brief">围绕接害岗位防护开展普法宣传，设置粉尘与噪声防护体验展台并发放防护用品。</div>
|
||||
<div class="photos"><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="egcard" onclick="openModal('detailModal')">
|
||||
<div class="egcard__head"><span class="egcard__title">戒烟限月主题活动</span><span class="egcard__date">2026-05-31</span></div>
|
||||
<div class="egcard__body">负责人：<b>韩丽平</b> 参加人数：<b>45</b> 覆盖区域：<b>注水大队</b><div class="egcard__brief">世界无烟日现场签约戒烟12人，展示肺部模型与戒烟后身体恢复时间表。</div>
|
||||
<div class="egcard__body">参加人数：<b>45</b> 覆盖区域：<b>注水大队</b><div class="egcard__brief">世界无烟日现场签约戒烟12人，展示肺部模型与戒烟后身体恢复时间表。</div>
|
||||
<div class="photos"><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i></div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -183,13 +182,13 @@
|
||||
<div class="egrid">
|
||||
<div class="egcard" onclick="openModal('detailModal')">
|
||||
<div class="egcard__head"><span class="egcard__title">心肺复苏实操培训</span><span class="egcard__date">2026-08-05</span></div>
|
||||
<div class="egcard__body">负责人：<b>石维国</b> 参加人数：<b>28</b> 覆盖区域：<b>管理四中心</b><div class="egcard__brief">利用模拟人开展CPR按压节律与AED使用训练，全员通过操作考核。</div>
|
||||
<div class="egcard__body">参加人数：<b>28</b> 覆盖区域：<b>管理四中心</b><div class="egcard__brief">利用模拟人开展CPR按压节律与AED使用训练，全员通过操作考核。</div>
|
||||
<div class="photos"><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="egcard" onclick="openModal('detailModal')">
|
||||
<div class="egcard__head"><span class="egcard__title">海姆立克与外伤包扎</span><span class="egcard__date">2026-06-16</span></div>
|
||||
<div class="egcard__body">负责人：<b>韩丽平</b> 参加人数：<b>33</b> 覆盖区域：<b>采油二大队</b><div class="egcard__brief">气道异物梗阻识别、海姆立克急救法与三角巾包扎逐项演练，现场发放急救包。</div>
|
||||
<div class="egcard__body">参加人数：<b>33</b> 覆盖区域：<b>采油二大队</b><div class="egcard__brief">气道异物梗阻识别、海姆立克急救法与三角巾包扎逐项演练，现场发放急救包。</div>
|
||||
<div class="photos"><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i></div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -214,12 +213,12 @@
|
||||
<div class="sec">
|
||||
<div class="sec__title">活动信息</div>
|
||||
<div class="kv">
|
||||
<div>负责人：<b>石维国</b></div><div>宣教日期：<b>2026-08-18 15:00</b></div><div>参加人数：<b>36 人</b></div>
|
||||
<div>覆盖区域：<b>管理四中心</b></div><div>时长：<b>60 分钟</b></div><div>登记时间：<b>2026-08-18 17:20</b></div>
|
||||
<div>负责人：<b>石维国</b></div><div>活动日期：<b>2026-08-18 15:00</b></div><div>参加人数：<b>36 人</b></div>
|
||||
<div>覆盖区域：<b>管理四中心</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">宣教内容</div>
|
||||
<div class="sec__title">活动内容</div>
|
||||
<div style="font-size:12px;color:#4a5a7f;line-height:2">针对高温作业人群讲解中暑识别与心脑血管急症的日常预防要点：避免正午长时间露天作业、少量多次补水、晨起一杯温水；发放低盐膳食手册并现场答疑。对已纳入慢病干预的高血压职工重点提示规律服药与自测血压方法。</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
@@ -227,7 +226,7 @@
|
||||
<div class="photos" style="margin-top:0"><i style="width:110px;height:70px"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i style="width:110px;height:70px"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i><i style="width:110px;height:70px"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><circle cx="9" cy="10" r="1.5"/><path d="M5 17l4.5-4.5 3 3L16 12l3 5"/></svg></i></div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">宣教资料</div>
|
||||
<div class="sec__title">活动资料</div>
|
||||
<div class="file-line"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6"/></svg>《低盐膳食手册》.pdf<span class="size">1.8 MB</span><a href="javascript:void(0)">下载</a></div>
|
||||
<div class="file-line"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6"/></svg>《高温天气健康防护要点》.docx<span class="size">246 KB</span><a href="javascript:void(0)">下载</a></div>
|
||||
</div>
|
||||
@@ -239,7 +238,7 @@
|
||||
<div class="modal__foot">
|
||||
<!-- [交互] 编辑打开宣教抽屉（回填数据）: health-education-drawer.html -->
|
||||
<button class="btn btn--primary" onclick="closeModal('detailModal');location.href='health-education-drawer.html'">编 辑</button>
|
||||
<button class="btn" onclick="closeModal('detailModal')">关 闭</button>
|
||||
<button class="btn" style="border-color:#ffa39e;color:#f5222d" onclick="closeModal('detailModal')">删 除</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -60,6 +60,12 @@
|
||||
.canvas-hint { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #bbb; font-size: 14px; pointer-events: none; }
|
||||
.eraser { position: absolute; right: 12px; bottom: 12px; width: 40px; height: 40px; border-radius: 8px; border: 1px solid #d9dee8; background: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; }
|
||||
.eraser svg { width: 20px; height: 20px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
/* 查看详情模式（纯显示） */
|
||||
.view-text { flex: 1; font-size: 13px; color: #333; line-height: 1.9; padding: 7px 0; white-space: pre-line; }
|
||||
.sign-view { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
|
||||
.sign-view__name { font-family: KaiTi, serif; font-size: 26px; color: #333; }
|
||||
.sign-view__note { font-size: 11px; color: #969eb0; }
|
||||
.view-mode .fld__req { display: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -111,7 +117,7 @@
|
||||
<div class="form-card__title">员工基本信息</div>
|
||||
<div class="form-grid">
|
||||
<div>姓名：<b>石维国</b></div><div>性别：<b>男</b></div>
|
||||
<div>年龄：<b>50 岁</b></div><div>工号：<b>1029334</b></div>
|
||||
<div>年龄：<b>50 岁</b></div><div>员工编号：<b>1029334</b></div>
|
||||
<div style="grid-column:1/-1">所属单位：<b>CQ能源采油三大队</b></div>
|
||||
<div style="grid-column:1/-1">体检日期：<b>2025-10-18</b> 报告：2025年体检报告</div>
|
||||
</div>
|
||||
@@ -120,10 +126,10 @@
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">解读意见</div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>综合解读建议</span>
|
||||
<textarea placeholder="请输入综合解读建议">血压、血糖控制欠佳，建议调整降压方案并内分泌科评估降糖治疗；加强生活方式干预，2 周后门诊复查。</textarea>
|
||||
<textarea id="adviceText" placeholder="请输入综合解读建议">血压、血糖控制欠佳，建议调整降压方案并内分泌科评估降糖治疗；加强生活方式干预，2 周后门诊复查。</textarea>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label">五类人群分类</span>
|
||||
<select>
|
||||
<select id="categorySelect">
|
||||
<option>请选择五类人群分类</option>
|
||||
<option>a-大病人群A</option>
|
||||
<option selected>b-慢病人群B</option>
|
||||
@@ -138,7 +144,7 @@
|
||||
<div class="form-card__title">员工确认签字</div>
|
||||
<div style="font-size:12px;color:#969eb0;margin-bottom:8px">本人已确认健康随访</div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>签字</span>
|
||||
<div style="flex:1">
|
||||
<div id="signField" style="flex:1">
|
||||
<div class="radio" style="margin-bottom:10px">
|
||||
<label><input type="radio" name="signType" checked onclick="switchSignType('hand')">手写签名</label>
|
||||
<label><input type="radio" name="signType" onclick="switchSignType('img')">签字图片</label>
|
||||
@@ -237,6 +243,43 @@
|
||||
box.innerHTML = '<span style="font-size:26px;font-family:KaiTi,serif;color:#333">石维国</span><span style="font-size:11px">已签名 · 点击可重签</span>';
|
||||
closeSign();
|
||||
}
|
||||
|
||||
// 查看详情模式：从「报告解读」页点击已解读卡片进入（URL 带 ?view=1），纯显示、不可编辑
|
||||
(function () {
|
||||
if (!/[?&]view=1/.test(location.search)) return;
|
||||
document.body.classList.add('view-mode');
|
||||
document.querySelector('.drawer__title').textContent = '解读报告详情';
|
||||
// 头部移除「删除 / 重新解读」
|
||||
var headBtns = document.querySelectorAll('.drawer__head button');
|
||||
for (var i = 0; i < headBtns.length; i++) headBtns[i].remove();
|
||||
// 解读信息：置于「员工确认签字」卡片上方
|
||||
var signCard = document.getElementById('signField').closest('.form-card');
|
||||
var fuCard = document.createElement('div');
|
||||
fuCard.className = 'form-card';
|
||||
fuCard.innerHTML = '<div class="form-card__title">解读信息</div>' +
|
||||
'<div class="form-grid">' +
|
||||
'<div>解读医生：<b>石维国</b></div><div>解读日期：<b>2026-07-15</b></div>' +
|
||||
'</div>';
|
||||
signCard.parentNode.insertBefore(fuCard, signCard);
|
||||
// 综合解读建议 → 纯文本
|
||||
var ta = document.getElementById('adviceText');
|
||||
var adviceDiv = document.createElement('div');
|
||||
adviceDiv.className = 'view-text';
|
||||
adviceDiv.textContent = ta.value;
|
||||
ta.parentNode.replaceChild(adviceDiv, ta);
|
||||
// 五类人群分类 → 纯文本
|
||||
var sel = document.getElementById('categorySelect');
|
||||
var catDiv = document.createElement('div');
|
||||
catDiv.className = 'view-text';
|
||||
catDiv.textContent = sel.options[sel.selectedIndex].text;
|
||||
sel.parentNode.replaceChild(catDiv, sel);
|
||||
// 签字 → 静态已签
|
||||
var signField = document.getElementById('signField');
|
||||
signField.innerHTML = '<div class="sign-view"><span class="sign-view__name">石维国</span><span class="sign-view__note">已签名</span></div>';
|
||||
// 底部 → 仅「返回」
|
||||
var foot = document.querySelector('.drawer__foot');
|
||||
foot.innerHTML = '<button class="btn btn--primary" onclick="history.back()">返 回</button>';
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -34,20 +34,18 @@
|
||||
.panel__btn { flex: 1; text-align: center; padding: 7px 0; border-radius: 14px; background: #e7f4ff; color: #1890ff; font-size: 12px; cursor: pointer; border: none; }
|
||||
.content { flex: 1; overflow-y: auto; padding: 16px 20px; scrollbar-width: none; }
|
||||
.content::-webkit-scrollbar { display: none; }
|
||||
.adv-note { font-size: 12px; color: #fa8c16; background: rgba(252,163,24,.08); border-radius: 8px; padding: 8px 12px; margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
|
||||
.adv-note svg { width: 15px; height: 15px; stroke: #fa8c16; fill: none; stroke-width: 2; flex-shrink: 0; }
|
||||
.search-bar { background: #fff; border-radius: 12px; padding: 14px 16px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.search-bar__item { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.search-bar__input { height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; min-width: 140px; outline: none; }
|
||||
.search-bar { background: #fff; border-radius: 12px; padding: 14px 16px; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.search-bar__row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
|
||||
.search-bar__item { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; white-space: nowrap; }
|
||||
.search-bar__input { height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; min-width: 140px; outline: none; background: #fff; }
|
||||
.search-bar__input--range { min-width: 190px; }
|
||||
.search-bar__more { border: none; background: none; color: #1890ff; font-size: 13px; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; padding: 2px 0; }
|
||||
.search-bar__more svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
|
||||
.search-bar__extra { display: none; gap: 14px; margin-top: 14px; padding-top: 14px; border-top: 1px dashed #eef1f6; }
|
||||
.search-bar.expanded .search-bar__extra { display: flex; flex-wrap: wrap; }
|
||||
.search-bar.expanded .search-bar__more svg { transform: rotate(180deg); }
|
||||
.btn { height: 32px; padding: 0 16px; border-radius: 6px; border: 1px solid #d9dee8; background: #fff; color: #4a5a7f; font-size: 13px; cursor: pointer; }
|
||||
.btn--primary { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* 事件列表 */
|
||||
.elist { background: #fff; border-radius: 12px; margin-top: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.06); overflow: hidden; }
|
||||
.ehead { display: grid; grid-template-columns: 220px 130px 1fr 170px 160px 100px 90px; padding: 11px 18px; background: #f6f8fc; font-size: 12px; color: #4a5a7f; font-weight: 500; }
|
||||
.erow { display: grid; grid-template-columns: 220px 130px 1fr 170px 160px 100px 90px; padding: 12px 18px; font-size: 12px; color: #333; align-items: center; border-top: 1px solid #f0f2f5; cursor: pointer; }
|
||||
.erow:hover { background: #f7faff; }
|
||||
.emp { display: flex; align-items: center; gap: 8px; }
|
||||
.avatar { width: 32px; height: 32px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.sex { display: inline-block; min-width: 16px; text-align: center; padding: 0 3px; height: 16px; line-height: 16px; border-radius: 4px; color: #fff; font-size: 10px; vertical-align: 1px; }
|
||||
.sex--f { background: #ff84ad; }
|
||||
.sex--m { background: #68cdfc; }
|
||||
@@ -58,12 +56,25 @@
|
||||
.etype--fall { background: rgba(238,101,87,.12); color: #EE6557; }
|
||||
.etype--temp { background: rgba(0,195,195,.12); color: #00c3c3; }
|
||||
.etype--sos { background: rgba(24,144,255,.1); color: #1890ff; }
|
||||
.e-data b { color: #fd2121; font-weight: 600; }
|
||||
.loc-timeout { color: #fd2121; }
|
||||
.pill { display: inline-block; padding: 1px 10px; border-radius: 12px; font-size: 11px; }
|
||||
.pill--wait { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.pill--done { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.link { color: #1890ff; cursor: pointer; font-size: 12px; text-decoration: none; }
|
||||
/* 事件卡片列表 */
|
||||
.card-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
|
||||
.card { background: #fff; border-radius: 12px; box-shadow: 0 2px 8px rgba(74,90,127,.06); padding: 14px 16px 12px; cursor: pointer; position: relative; overflow: hidden; transition: box-shadow .15s; }
|
||||
.card:hover { box-shadow: 0 6px 16px rgba(74,90,127,.14); }
|
||||
.card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #1890ff; }
|
||||
.card--hr::before { background: #fd2121; }
|
||||
.card--spo2::before { background: #6862D6; }
|
||||
.card--temp::before { background: #00c3c3; }
|
||||
.card--stress::before { background: #fca318; }
|
||||
.card--sos::before { background: #1890ff; }
|
||||
.card--fall::before { background: #EE6557; }
|
||||
.card__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
|
||||
.card__time { font-size: 12px; color: #969eb0; }
|
||||
.card__abnormal { background: #f7f9fc; border-radius: 8px; padding: 8px 10px; margin-bottom: 10px; font-size: 12px; color: #4a5a7f; }
|
||||
.card__abnormal b { color: #fd2121; font-weight: 600; }
|
||||
.card__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 14px; font-size: 12px; color: #4a5a7f; }
|
||||
.card__meta b { color: #333; font-weight: 500; }
|
||||
.card__loc { color: #333; }
|
||||
.card__loc--timeout { color: #fd2121; }
|
||||
.page-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; font-size: 12px; color: #969eb0; padding-bottom: 4px; }
|
||||
.pager { display: flex; gap: 6px; }
|
||||
.pager__btn { min-width: 26px; height: 26px; border-radius: 6px; border: 1px solid #d9dee8; background: #fff; color: #4a5a7f; font-size: 12px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
|
||||
@@ -83,8 +94,10 @@
|
||||
.kv { display: grid; grid-template-columns: repeat(2, 1fr); gap: 5px 18px; font-size: 12px; color: #4a5a7f; line-height: 1.9; }
|
||||
.kv b { color: #333; font-weight: 500; }
|
||||
.kv__full { grid-column: 1 / -1; }
|
||||
/* 近24小时心率趋势 */
|
||||
.trend svg { width: 100%; height: 120px; }
|
||||
/* 定位地图 */
|
||||
.map { border-radius: 8px; overflow: hidden; }
|
||||
.map svg { width: 100%; height: 220px; display: block; }
|
||||
.kv--red { color: #fd2121; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -103,7 +116,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -128,78 +141,104 @@
|
||||
</header>
|
||||
|
||||
<div class="content">
|
||||
<!-- [状态] 健康监测依赖智能手环设备接入，仅 A01A34 医疗点开通 -->
|
||||
<div class="adv-note"><svg viewBox="0 0 24 24"><path d="M12 9v4M12 17h.01M10.3 3.9L1.8 18a2 2 0 001.7 3h17a2 2 0 001.7-3L13.7 3.9a2 2 0 00-3.4 0z" stroke-linecap="round" stroke-linejoin="round"/></svg>本页面依赖智能手环数据接入，仅 A01A34（定边第一医疗点）可见。</div>
|
||||
|
||||
<div class="search-bar">
|
||||
<div class="search-bar__item">员工<input class="search-bar__input" placeholder="姓名 / 工号"></div>
|
||||
<div class="search-bar__item">事件类型
|
||||
<select class="search-bar__input"><option>全部</option><option>心率异常</option><option>血氧异常</option><option>压力异常</option><option>摔倒</option><option>体温异常</option><option>一键告警</option></select>
|
||||
<div class="search-bar" id="searchBar">
|
||||
<div class="search-bar__row">
|
||||
<div class="search-bar__item">姓名<input class="search-bar__input" placeholder="请输入姓名"></div>
|
||||
<div class="search-bar__item">日期范围<input class="search-bar__input search-bar__input--range" placeholder="开始时间 ~ 结束时间"></div>
|
||||
<div class="search-bar__item">事件类型
|
||||
<select class="search-bar__input"><option>全部</option><option>心率异常</option><option>血氧异常</option><option>体温异常</option><option>压力异常</option><option>一键报警</option><option>摔倒</option></select>
|
||||
</div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
<button class="search-bar__more" id="searchMoreBtn" onclick="toggleSearchBar()">
|
||||
<svg viewBox="0 0 24 24"><path d="M6 9l6 6 6-6"/></svg><span>更多筛选</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="search-bar__item">发生时间<input class="search-bar__input" style="min-width:200px" placeholder="开始时间 ~ 结束时间"></div>
|
||||
<div class="search-bar__item">处理状态
|
||||
<select class="search-bar__input"><option>全部</option><option>待处理</option><option>已处理</option></select>
|
||||
<div class="search-bar__extra">
|
||||
<div class="search-bar__item">员工编号<input class="search-bar__input" placeholder="请输入员工编号"></div>
|
||||
<div class="search-bar__item">单位部门<input class="search-bar__input" placeholder="请输入单位 / 部门"></div>
|
||||
</div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
|
||||
<div class="elist">
|
||||
<div class="ehead"><span>员工</span><span>事件类型</span><span>监测数据</span><span>发生时间</span><span>位置</span><span>状态</span><span>操作</span></div>
|
||||
<!-- [交互] 点击行打开页内事件详情弹窗 -->
|
||||
<div class="erow" onclick="openModal('detailModal')">
|
||||
<div class="emp"><span class="avatar">岳</span><span>岳春生 <span class="sex sex--m">男</span></span></div>
|
||||
<div><span class="etype etype--hr">心率异常</span></div>
|
||||
<div class="e-data">心率 <b>128</b> bpm（阈值 >120），持续 6 分钟</div>
|
||||
<div>2026-09-04 09:42</div>
|
||||
<div>三号宿舍楼 5 号床</div>
|
||||
<div><span class="pill pill--wait">待处理</span></div>
|
||||
<div><span class="link">查看</span></div>
|
||||
<!-- [交互] 点击卡片打开页内事件详情弹窗 -->
|
||||
<div class="card-list">
|
||||
<div class="card card--hr" onclick="openModal('detailModal')">
|
||||
<div class="card__head">
|
||||
<span class="etype etype--hr">心率异常</span>
|
||||
<span class="card__time">2026-09-04 09:42</span>
|
||||
</div>
|
||||
<div class="card__abnormal">异常值：<b>128</b> bpm</div>
|
||||
<div class="card__meta">
|
||||
<div>员工：<b>岳春生 <span class="sex sex--m">男</span> · 54岁</b></div>
|
||||
<div>员工编号：<b>1035678</b></div>
|
||||
<div>单位部门：<b>陕E作业区 / 管理四中心</b></div>
|
||||
<div>位置：<b class="card__loc">三号宿舍楼 5 号床</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="erow" onclick="openModal('detailModal')">
|
||||
<div class="emp"><span class="avatar">田</span><span>田淑珍 <span class="sex sex--f">女</span></span></div>
|
||||
<div><span class="etype etype--spo2">血氧异常</span></div>
|
||||
<div class="e-data">血氧 <b>91%</b>（阈值 <93%）</div>
|
||||
<div>2026-09-04 09:15</div>
|
||||
<div class="loc-timeout">定位超时</div>
|
||||
<div><span class="pill pill--wait">待处理</span></div>
|
||||
<div><span class="link">查看</span></div>
|
||||
<div class="card card--spo2" onclick="openModal('detailModal')">
|
||||
<div class="card__head">
|
||||
<span class="etype etype--spo2">血氧异常</span>
|
||||
<span class="card__time">2026-09-04 09:15</span>
|
||||
</div>
|
||||
<div class="card__abnormal">异常值：<b>91%</b></div>
|
||||
<div class="card__meta">
|
||||
<div>员工：<b>田淑珍 <span class="sex sex--f">女</span> · 47岁</b></div>
|
||||
<div>员工编号：<b>1035129</b></div>
|
||||
<div>单位部门：<b>陕E作业区 / 采油四队</b></div>
|
||||
<div>位置：<b class="card__loc card__loc--timeout">定位超时</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="erow" onclick="openModal('detailModal')">
|
||||
<div class="emp"><span class="avatar">尹</span><span>尹立春 <span class="sex sex--m">男</span></span></div>
|
||||
<div><span class="etype etype--fall">摔倒</span></div>
|
||||
<div class="e-data">检测到跌倒，静止 <b>35</b> 秒未恢复</div>
|
||||
<div>2026-09-03 22:41</div>
|
||||
<div>一号宿舍楼走廊</div>
|
||||
<div><span class="pill pill--wait">待处理</span></div>
|
||||
<div><span class="link">查看</span></div>
|
||||
<div class="card card--fall" onclick="openModal('detailModal')">
|
||||
<div class="card__head">
|
||||
<span class="etype etype--fall">摔倒</span>
|
||||
<span class="card__time">2026-09-03 22:41</span>
|
||||
</div>
|
||||
<div class="card__abnormal">异常值：检测到跌倒</div>
|
||||
<div class="card__meta">
|
||||
<div>员工：<b>尹立春 <span class="sex sex--m">男</span> · 52岁</b></div>
|
||||
<div>员工编号：<b>1035487</b></div>
|
||||
<div>单位部门：<b>陕E作业区 / 维修大队</b></div>
|
||||
<div>位置：<b class="card__loc">一号宿舍楼走廊</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="erow" onclick="openModal('detailModal')">
|
||||
<div class="emp"><span class="avatar">戴</span><span>戴文广 <span class="sex sex--m">男</span></span></div>
|
||||
<div><span class="etype etype--stress">压力异常</span></div>
|
||||
<div class="e-data">压力指数 <b>87</b>（高位 >80）</div>
|
||||
<div>2026-09-03 16:20</div>
|
||||
<div>注水大队泵房</div>
|
||||
<div><span class="pill pill--done">已处理</span></div>
|
||||
<div><span class="link">查看</span></div>
|
||||
<div class="card card--stress" onclick="openModal('detailModal')">
|
||||
<div class="card__head">
|
||||
<span class="etype etype--stress">压力异常</span>
|
||||
<span class="card__time">2026-09-03 16:20</span>
|
||||
</div>
|
||||
<div class="card__abnormal">异常值：<b>87</b></div>
|
||||
<div class="card__meta">
|
||||
<div>员工：<b>戴文广 <span class="sex sex--m">男</span> · 49岁</b></div>
|
||||
<div>员工编号：<b>1035201</b></div>
|
||||
<div>单位部门：<b>陕E作业区 / 注水大队</b></div>
|
||||
<div>位置：<b class="card__loc">注水大队泵房</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="erow" onclick="openModal('detailModal')">
|
||||
<div class="emp"><span class="avatar">付</span><span>付桂荣 <span class="sex sex--f">女</span></span></div>
|
||||
<div><span class="etype etype--temp">体温异常</span></div>
|
||||
<div class="e-data">腕温 <b>37.9</b> ℃（阈值 ≥37.3）</div>
|
||||
<div>2026-09-03 11:05</div>
|
||||
<div>二号宿舍楼 3 号床</div>
|
||||
<div><span class="pill pill--done">已处理</span></div>
|
||||
<div><span class="link">查看</span></div>
|
||||
<div class="card card--temp" onclick="openModal('detailModal')">
|
||||
<div class="card__head">
|
||||
<span class="etype etype--temp">体温异常</span>
|
||||
<span class="card__time">2026-09-03 11:05</span>
|
||||
</div>
|
||||
<div class="card__abnormal">异常值：<b>37.9</b> ℃</div>
|
||||
<div class="card__meta">
|
||||
<div>员工：<b>付桂荣 <span class="sex sex--f">女</span> · 45岁</b></div>
|
||||
<div>员工编号：<b>1035364</b></div>
|
||||
<div>单位部门：<b>陕E作业区 / 后勤保障中心</b></div>
|
||||
<div>位置：<b class="card__loc">二号宿舍楼 3 号床</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="erow" onclick="openModal('detailModal')">
|
||||
<div class="emp"><span class="avatar">曲</span><span>曲志明 <span class="sex sex--m">男</span></span></div>
|
||||
<div><span class="etype etype--sos">一键告警</span></div>
|
||||
<div class="e-data">手环按键主动触发求救</div>
|
||||
<div>2026-09-02 19:48</div>
|
||||
<div>输气作业区 12# 阀室</div>
|
||||
<div><span class="pill pill--done">已处理</span></div>
|
||||
<div><span class="link">查看</span></div>
|
||||
<div class="card card--sos" onclick="openModal('detailModal')">
|
||||
<div class="card__head">
|
||||
<span class="etype etype--sos">一键报警</span>
|
||||
<span class="card__time">2026-09-02 19:48</span>
|
||||
</div>
|
||||
<div class="card__abnormal">异常值：主动触发求救</div>
|
||||
<div class="card__meta">
|
||||
<div>员工：<b>曲志明 <span class="sex sex--m">男</span> · 50岁</b></div>
|
||||
<div>员工编号：<b>1035015</b></div>
|
||||
<div>单位部门：<b>陕E作业区 / 输气作业区</b></div>
|
||||
<div>位置：<b class="card__loc">输气作业区 12# 阀室</b></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -219,36 +258,67 @@
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="sec">
|
||||
<div class="sec__title">员工与事件</div>
|
||||
<div class="sec__title">告警信息</div>
|
||||
<div class="kv">
|
||||
<div>员工：<b>岳春生 <span class="sex sex--m">男</span> · 54岁</b></div><div>工号：<b>1035678</b></div>
|
||||
<div>单位/部门：<b>陕E作业区 / 管理四中心</b></div><div>手环设备：<b>W24-0093（电量 68%）</b></div>
|
||||
<div>发生时间：<b>2026-09-04 09:42:18</b></div><div>位置：<b>三号宿舍楼 5 号床</b></div>
|
||||
<div class="kv__full">触发规则：<b>连续 5 分钟心率 > 120 bpm</b></div>
|
||||
<div>事件类型：<b><span class="etype etype--hr">心率异常</span></b></div>
|
||||
<div>报警时间：<b>2026-09-04 09:42:18</b></div>
|
||||
<div class="kv__full">异常值：<b class="kv--red">128 bpm</b></div>
|
||||
<div class="kv__full">位置：<b>三号宿舍楼 5 号床</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec trend">
|
||||
<div class="sec__title">触发前后心率（近 30 分钟）</div>
|
||||
<svg viewBox="0 0 640 120" preserveAspectRatio="none">
|
||||
<line x1="0" y1="36" x2="640" y2="36" stroke="#fd2121" stroke-width="1" stroke-dasharray="5 4"/>
|
||||
<text x="6" y="30" font-size="10" fill="#fd2121">阈值 120</text>
|
||||
<polyline points="10,86 50,84 90,80 130,82 170,74 210,70 250,60 290,52 330,40 370,30 410,24 450,22 490,28 530,34 570,46 610,58" fill="none" stroke="#1890ff" stroke-width="2"/>
|
||||
<circle cx="450" cy="22" r="4" fill="#fd2121"/>
|
||||
<text x="10" y="114" font-size="9" fill="#969eb0">09:12</text><text x="320" y="114" font-size="9" fill="#969eb0" text-anchor="middle">09:27</text><text x="630" y="114" font-size="9" fill="#969eb0" text-anchor="end">09:42</text>
|
||||
</svg>
|
||||
<div class="sec">
|
||||
<div class="sec__title">员工信息</div>
|
||||
<div class="kv">
|
||||
<div>员工姓名：<b>岳春生</b></div>
|
||||
<div>性别：<b><span class="sex sex--m">男</span></b></div>
|
||||
<div>年龄：<b>54岁</b></div>
|
||||
<div>员工编号：<b>1035678</b></div>
|
||||
<div>单位部门：<b>陕E作业区 / 管理四中心</b></div>
|
||||
<div>手表编码：<b>W24-0093</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec" style="margin-bottom:0">
|
||||
<div class="sec__title">处理记录</div>
|
||||
<div class="kv" style="grid-template-columns:1fr">
|
||||
<div class="kv__full">2026-09-04 09:43 飞书推送告警至医疗点值班人（石维国）</div>
|
||||
<div class="kv__full" style="color:#969eb0">尚未填写处理结果</div>
|
||||
<div class="sec__title">定位地图</div>
|
||||
<div class="map">
|
||||
<svg viewBox="0 0 640 240" preserveAspectRatio="xMidYMid meet">
|
||||
<rect width="640" height="240" fill="#eef3f8"/>
|
||||
<g stroke="#ffffff" stroke-linecap="round">
|
||||
<path d="M0 120 H640" stroke-width="18"/>
|
||||
<path d="M320 0 V240" stroke-width="18"/>
|
||||
<path d="M160 0 V120" stroke-width="10"/>
|
||||
<path d="M480 0 V120" stroke-width="10"/>
|
||||
</g>
|
||||
<g font-size="12" fill="#6b7a93" text-anchor="middle">
|
||||
<rect x="24" y="20" width="120" height="80" rx="6" fill="#dbe4f0"/>
|
||||
<text x="84" y="57">一号宿舍楼</text>
|
||||
<rect x="184" y="20" width="120" height="80" rx="6" fill="#dbe4f0"/>
|
||||
<text x="244" y="57">二号宿舍楼</text>
|
||||
<rect x="344" y="20" width="120" height="80" rx="6" fill="#dbe4f0"/>
|
||||
<text x="404" y="57">员工食堂</text>
|
||||
<rect x="504" y="20" width="112" height="80" rx="6" fill="#dbe4f0"/>
|
||||
<text x="560" y="57">活动中心</text>
|
||||
<rect x="24" y="150" width="120" height="70" rx="6" fill="#c3d3e6"/>
|
||||
<text x="84" y="190" fill="#33415c">三号宿舍楼</text>
|
||||
<rect x="184" y="150" width="120" height="70" rx="6" fill="#dbe4f0"/>
|
||||
<text x="244" y="190">医疗点</text>
|
||||
<rect x="344" y="150" width="120" height="70" rx="6" fill="#dbe4f0"/>
|
||||
<text x="404" y="190">注水泵房</text>
|
||||
</g>
|
||||
<g>
|
||||
<circle cx="84" cy="150" r="24" fill="rgba(253,33,33,.12)"/>
|
||||
<circle cx="84" cy="150" r="13" fill="#fd2121" stroke="#ffffff" stroke-width="2.5"/>
|
||||
<circle cx="84" cy="150" r="5" fill="#ffffff"/>
|
||||
</g>
|
||||
<g>
|
||||
<rect x="120" y="118" width="150" height="30" rx="7" fill="#33415c"/>
|
||||
<text x="195" y="137" text-anchor="middle" font-size="12" fill="#ffffff">三号宿舍楼 5 号床</text>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('detailModal')">关 闭</button>
|
||||
<!-- [交互] 处理完成需填写处置说明，事件转为已处理 -->
|
||||
<button class="btn btn--primary" onclick="alert('填写处置说明并标记已处理（原型演示）')">处理</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -257,6 +327,12 @@
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
function toggleSearchBar() {
|
||||
var bar = document.getElementById('searchBar');
|
||||
var span = document.querySelector('#searchMoreBtn span');
|
||||
var expanded = bar.classList.toggle('expanded');
|
||||
span.textContent = expanded ? '收起' : '更多筛选';
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
|
||||
@@ -78,7 +78,7 @@
|
||||
<a class="nav__item" href="bed.html"><svg viewBox="0 0 24 24"><path d="M18 8a6 6 0 10-12 0c0 7-3 9-3 9h18s-3-2-3-9M13.7 21a2 2 0 01-3.4 0"/></svg>床头呼叫</a>
|
||||
<a class="nav__item nav__item--active" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="location.href='login.html'">退出登录</button></div>
|
||||
<div class="nav__foot"><button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button></div>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
@@ -104,82 +104,52 @@
|
||||
|
||||
<div class="content">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar__item">姓名/工号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">姓名/员工编号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">体检年份
|
||||
<select class="search-bar__input">
|
||||
<option>全部</option><option selected>2026</option><option>2025</option><option>2024</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="search-bar__item">解读状态
|
||||
<select class="search-bar__input">
|
||||
<option>全部</option><option>待解读</option><option>已解读</option>
|
||||
</select>
|
||||
</div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
|
||||
<div class="rpgrid">
|
||||
<!-- [状态] 待解读：底部灰块提示进入解读；点击卡片打开报告解读抽屉（解读模式）: interpret-drawer.html -->
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html'">
|
||||
<div class="rpcard__top">
|
||||
<span class="avatar">岳</span>
|
||||
<span class="rpcard__name">岳春生<span class="sexage">男 · 54岁</span></span>
|
||||
<span class="rpcard__status st--todo">待解读</span>
|
||||
</div>
|
||||
<span class="yr">2026 年度体检</span>
|
||||
<div class="rpcard__lines">单位/部门：<b>陕E作业区 / 管理四中心</b><br>体检机构：定边县人民医院<br>体检日期：2026-07-02</div>
|
||||
<div class="rpcard__foot"><span>报告已上传，尚未解读</span><span class="go">去解读 ›</span></div>
|
||||
</div>
|
||||
<!-- [状态] 已解读：底部灰块展示解读医生与解读日期；点击卡片再次打开解读抽屉（回填已有结论）: interpret-drawer.html -->
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html'">
|
||||
<!-- [状态] 已解读：底部灰块展示解读医生与解读日期；点击卡片打开解读抽屉，纯显示查看详情（?view=1）: interpret-drawer.html -->
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html?view=1'">
|
||||
<div class="rpcard__top">
|
||||
<span class="avatar">田</span>
|
||||
<span class="rpcard__name">田淑珍<span class="sexage">女 · 61岁</span></span>
|
||||
<span class="rpcard__status st--done">已解读</span>
|
||||
</div>
|
||||
<span class="yr">2026 年度体检</span>
|
||||
<div class="rpcard__lines">单位/部门：<b>陕E作业区 / 转运站</b><br>体检机构：定边县人民医院<br>体检日期：2026-07-02</div>
|
||||
<div class="rpcard__lines">单位/部门：<b>陕E作业区 / 转运站</b><br>体检医院：定边县人民医院<br>体检日期：2026-07-02</div>
|
||||
<div class="rpcard__foot"><span>解读医生：石维国</span><span>2026-07-15</span></div>
|
||||
</div>
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html'">
|
||||
<div class="rpcard__top">
|
||||
<span class="avatar">尹</span>
|
||||
<span class="rpcard__name">尹立春<span class="sexage">男 · 47岁</span></span>
|
||||
<span class="rpcard__status st--todo">待解读</span>
|
||||
</div>
|
||||
<span class="yr">2026 年度体检</span>
|
||||
<div class="rpcard__lines">单位/部门：<b>陕E作业区 / 注水大队</b><br>体检机构：榆林市第一医院<br>体检日期：2026-06-28</div>
|
||||
<div class="rpcard__foot"><span>报告已上传，尚未解读</span><span class="go">去解读 ›</span></div>
|
||||
</div>
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html'">
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html?view=1'">
|
||||
<div class="rpcard__top">
|
||||
<span class="avatar">戴</span>
|
||||
<span class="rpcard__name">戴文广<span class="sexage">男 · 58岁</span></span>
|
||||
<span class="rpcard__status st--done">已解读</span>
|
||||
</div>
|
||||
<span class="yr">2025 年度体检</span>
|
||||
<div class="rpcard__lines">单位/部门：<b>采油一大队</b><br>体检机构：定边县人民医院<br>体检日期：2025-07-10</div>
|
||||
<div class="rpcard__lines">单位/部门：<b>采油一大队</b><br>体检医院：定边县人民医院<br>体检日期：2025-07-10</div>
|
||||
<div class="rpcard__foot"><span>解读医生：石维国</span><span>2025-08-02</span></div>
|
||||
</div>
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html'">
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html?view=1'">
|
||||
<div class="rpcard__top">
|
||||
<span class="avatar">付</span>
|
||||
<span class="rpcard__name">付桂荣<span class="sexage">女 · 52岁</span></span>
|
||||
<span class="rpcard__status st--done">已解读</span>
|
||||
</div>
|
||||
<span class="yr">2026 年度体检</span>
|
||||
<div class="rpcard__lines">单位/部门：<b>采油二大队</b><br>体检机构：榆林市第一医院<br>体检日期：2026-06-28</div>
|
||||
<div class="rpcard__lines">单位/部门：<b>采油二大队</b><br>体检医院：榆林市第一医院<br>体检日期：2026-06-28</div>
|
||||
<div class="rpcard__foot"><span>解读医生：韩丽平</span><span>2026-07-20</span></div>
|
||||
</div>
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html'">
|
||||
<div class="rpcard" onclick="location.href='interpret-drawer.html?view=1'">
|
||||
<div class="rpcard__top">
|
||||
<span class="avatar">曲</span>
|
||||
<span class="rpcard__name">曲志明<span class="sexage">男 · 45岁</span></span>
|
||||
<span class="rpcard__status st--done">已解读</span>
|
||||
</div>
|
||||
<span class="yr">2025 年度体检</span>
|
||||
<div class="rpcard__lines">单位/部门：<b>输气作业区</b><br>体检机构：西安交大一附院<br>体检日期：2025-07-05</div>
|
||||
<div class="rpcard__lines">单位/部门：<b>输气作业区</b><br>体检医院：西安交大一附院<br>体检日期：2025-07-05</div>
|
||||
<div class="rpcard__foot"><span>解读医生：石维国</span><span>2025-07-28</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -112,8 +112,8 @@
|
||||
<a class="nav__item" href="report.html"><svg viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6M8 13h8M8 17h5"/></svg>报告解读</a>
|
||||
</div>
|
||||
<div class="nav__foot">
|
||||
<!-- [交互] 退出登录（旧系统弹二次确认，此处直接回登录页）: login.html -->
|
||||
<button class="nav__logout" onclick="location.href='login.html'">退出登录</button>
|
||||
<!-- [交互] 退出登录：二次确认后返回登录页 login.html -->
|
||||
<button class="nav__logout" onclick="if(confirm('确定要退出登录吗？')) location.href='login.html'">退出登录</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -144,8 +144,7 @@
|
||||
<!-- 搜索区 -->
|
||||
<div class="search-bar">
|
||||
<div class="search-bar__item">员工姓名<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">工号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<div class="search-bar__item">所属单位<input class="search-bar__input" placeholder="请选择"></div>
|
||||
<div class="search-bar__item">员工编号<input class="search-bar__input" placeholder="请输入"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
@@ -258,7 +257,7 @@
|
||||
<div class="modal__head"><span class="modal__title">选择解读任务</span><button class="modal__close" onclick="closeModal('selectModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div class="emp-card">
|
||||
<div><b>赵春霞</b> 女 · 46岁 · 工号 1045690</div>
|
||||
<div><b>赵春霞</b> 女 · 46岁 · 员工编号 1045690</div>
|
||||
<div>所属单位：CQ能源采油一厂-作业一大队 <span class="tag tag--dm">糖尿病</span><span class="tag tag--ob">肥胖</span></div>
|
||||
</div>
|
||||
<div class="section-label">该员工有 2 条待解读任务，请选择一条进入解读：</div>
|
||||
|
||||
@@ -46,6 +46,25 @@
|
||||
.sidebar-subgroup .sidebar-subgroup>.sidebar-subgroup__header{font-size:12px;}
|
||||
/* 主内容 */
|
||||
.main{margin-left:240px;margin-top:56px;padding:24px;min-height:calc(100vh - 56px);}
|
||||
/* 单位级别TAB */
|
||||
.unit-level-tab{display:flex;align-items:center;gap:0;margin-bottom:16px;background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:0 24px;border-bottom:1px solid var(--border);}
|
||||
.unit-level-tab__item{position:relative;padding:14px 20px;font-size:var(--font-sm);color:var(--text-secondary);cursor:pointer;transition:all .2s;user-select:none;}
|
||||
.unit-level-tab__item:hover{color:var(--primary);}
|
||||
.unit-level-tab__item.active{color:var(--primary);font-weight:500;}
|
||||
.unit-level-tab__item.active::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--primary);border-radius:1px;}
|
||||
/* 表头计算规则提示（问号+悬浮气泡） */
|
||||
.th-help{position:relative;display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;background:#BFBFBF;color:#fff;font-size:10px;font-weight:600;cursor:help;vertical-align:middle;margin-left:4px;}
|
||||
.th-help:hover{background:var(--primary);}
|
||||
.th-help__tip{visibility:hidden;opacity:0;position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.8);color:#fff;font-size:var(--font-sm);font-weight:400;padding:7px 12px;border-radius:var(--radius-sm);white-space:nowrap;z-index:130;transition:opacity .15s;line-height:1.5;}
|
||||
.th-help__tip::before{content:'';position:absolute;top:-4px;left:50%;margin-left:-4px;width:8px;height:8px;background:rgba(0,0,0,0.8);transform:rotate(45deg);}
|
||||
.th-help__tip--right{left:auto;right:-7px;transform:none;}
|
||||
.th-help__tip--right::before{left:auto;right:11px;margin-left:0;}
|
||||
.th-help:hover .th-help__tip{visibility:visible;opacity:1;}
|
||||
/* 二级单位tab下隐藏部门列与部门筛选 */
|
||||
.col-dept{display:none;}
|
||||
body.level-3 .col-dept{display:table-cell;}
|
||||
.filter-item.filter-dept{display:none;}
|
||||
body.level-3 .filter-item.filter-dept{display:flex;}
|
||||
/* 筛选栏 */
|
||||
.filter-bar{background:#fff;border-radius:var(--radius-md);padding:20px 24px;margin-bottom:16px;box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
|
||||
.filter-item{display:flex;align-items:center;gap:8px;}
|
||||
@@ -183,6 +202,12 @@
|
||||
|
||||
<!-- 主内容 -->
|
||||
<main class="main">
|
||||
<!-- 单位级别切换TAB -->
|
||||
<div class="unit-level-tab">
|
||||
<div class="unit-level-tab__item active" onclick="switchUnitLevel(this)">二级单位</div>
|
||||
<div class="unit-level-tab__item" onclick="switchUnitLevel(this)">三级单位</div>
|
||||
</div>
|
||||
|
||||
<!-- 筛选栏 -->
|
||||
<div class="filter-bar">
|
||||
<div class="filter-item">
|
||||
@@ -203,7 +228,7 @@
|
||||
<option value="">请选择单位</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<div class="filter-item filter-dept">
|
||||
<label>部门：</label>
|
||||
<select class="filter-select" id="f-dept" onchange="state.dept=this.value;state.page=1;renderTable();">
|
||||
<option value="">请选择部门</option>
|
||||
@@ -241,7 +266,7 @@
|
||||
<div class="table-card__content">
|
||||
<table id="statTable">
|
||||
<thead>
|
||||
<tr><th>单位</th><th>部门</th><th>应检人数</th><th>已体检人数</th><th>已预约人数</th><th>已出报告人数</th><th>未预约人数</th><th>体检年份</th></tr>
|
||||
<tr><th>单位</th><th class="col-dept">部门</th><th>应检人数</th><th>已体检人数</th><th>已预约人数</th><th>已出报告人数</th><th>未预约人数</th><th>受检率<span class="th-help">?<span class="th-help__tip">受检率 = 实际检查人数 ÷ 应检人数</span></span></th><th>检出率<span class="th-help">?<span class="th-help__tip">检出率 = 异常人数 ÷ 实际检查人数</span></span></th><th>患病率<span class="th-help">?<span class="th-help__tip th-help__tip--right">患病率 = 单病种异常人数 ÷ 实际参加检查人数</span></span></th><th>体检年份</th></tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
@@ -254,32 +279,36 @@
|
||||
/* ============ 数据 ============ */
|
||||
/* 确定性伪随机（0-1），保证每次打开数据一致 */
|
||||
function pseudo(i){var x=Math.sin(i*127.1)*43758.5453;return x-Math.floor(x);}
|
||||
function mkRow(unit,dept,total,checked,booked){
|
||||
return {unit:unit,dept:dept,total:total,checked:checked,booked:booked,reported:0,unbooked:total-checked-booked,year:'2026'};
|
||||
/* 按总人数与种子确定性生成一行：受检率=已体检/应检；检出率=异常/已体检；患病率=单病种异常/已体检 */
|
||||
function mkRow(unit,dept,total,seed){
|
||||
var checked=Math.floor(total*(0.6+pseudo(seed+0.3)*0.35));
|
||||
var booked=Math.floor(total*(0.1+pseudo(seed+0.6)*0.2));
|
||||
var reported=Math.floor(checked*(0.88+pseudo(seed+0.8)*0.12));
|
||||
var abnormal=Math.max(0,Math.floor(checked*(0.15+pseudo(seed+1.1)*0.4)));
|
||||
var disease=Math.max(0,Math.floor(abnormal*(0.3+pseudo(seed+1.3)*0.5)));
|
||||
return {unit:unit,dept:dept,total:total,checked:checked,booked:booked,reported:reported,unbooked:Math.max(0,total-checked-booked),abnormal:abnormal,disease:disease,year:'2026'};
|
||||
}
|
||||
var rows=[];
|
||||
/* 参考图前10条（第二采油厂） */
|
||||
[['南梁采油作业区',205,0,4],['消防大队',88,0,1],['温台采油作业区',174,1,27],['樊家川采油作业区',161,0,15],['科技信息部',7,0,0],['西峰采油二区',206,0,5],['地质研究所',31,0,2],['西峰采油三区',158,0,10],['华池采油作业区',198,0,30],['马岭北采油作业区',174,0,11]].forEach(function(d){
|
||||
rows.push(mkRow('第二采油厂',d[0],d[1],d[2],d[3]));
|
||||
[['南梁采油作业区',205],['消防大队',88],['温台采油作业区',174],['樊家川采油作业区',161],['科技信息部',7],['西峰采油二区',206],['地质研究所',31],['西峰采油三区',158],['华池采油作业区',198],['马岭北采油作业区',174]].forEach(function(d,i){
|
||||
rows.push(mkRow('第二采油厂',d[0],d[1],1000+i));
|
||||
});
|
||||
var BASE_DEPTS=['采油作业一区','采油作业二区','采油作业三区','采油作业四区','采油作业五区','采油作业六区','集输作业区','地质研究所','工艺研究所','信息中心','安全环保科','生产运行科','经营管理科','人力资源科','财务资产科','物资供应站','维修抢修中心','消防大队','综合办公室','后勤服务部','质量监督站','培训站','离退休管理科','保卫科'];
|
||||
var EXTRA_UNITS=[['第三采油厂',24],['第四采油厂',24],['第五采油厂',24],['公用事业公司',24],['运输公司',24],['水电厂',24],['采气一厂',10]];
|
||||
/* 第二采油厂补充5条，其余单位按部门池生成，合计169条 */
|
||||
['采油作业一区','采油作业六区','集输作业区','生产运行科','保卫科'].forEach(function(dept,i){
|
||||
var idx=100+i,total=20+Math.floor(pseudo(idx)*260),checked=pseudo(idx+0.31)<0.12?1:0;
|
||||
var booked=Math.floor(pseudo(idx+0.67)*Math.min(35,Math.floor(total*0.18)));
|
||||
rows.push(mkRow('第二采油厂',dept,total,checked,booked));
|
||||
var idx=100+i,total=20+Math.floor(pseudo(idx)*260);
|
||||
rows.push(mkRow('第二采油厂',dept,total,idx));
|
||||
});
|
||||
var gi=0;
|
||||
EXTRA_UNITS.forEach(function(u){
|
||||
for(var i=0;i<u[1];i++){
|
||||
gi++;
|
||||
var idx=200+gi,total=20+Math.floor(pseudo(idx)*260),checked=pseudo(idx+0.31)<0.12?1:0;
|
||||
var booked=Math.floor(pseudo(idx+0.67)*Math.min(35,Math.floor(total*0.18)));
|
||||
rows.push(mkRow(u[0],BASE_DEPTS[i],total,checked,booked));
|
||||
var idx=200+gi,total=20+Math.floor(pseudo(idx)*260);
|
||||
rows.push(mkRow(u[0],BASE_DEPTS[i],total,idx));
|
||||
}
|
||||
});
|
||||
var state={unit:'',dept:'',year:'2026',page:1,pageSize:10};
|
||||
var state={unit:'',dept:'',year:'2026',page:1,pageSize:10,level:'level-2'};
|
||||
|
||||
/* ============ 筛选 ============ */
|
||||
function initUnitOptions(){
|
||||
@@ -346,16 +375,27 @@ function filteredRows(){
|
||||
return (!state.unit||r.unit===state.unit)&&(!state.dept||r.dept===state.dept)&&(!state.year||r.year===state.year);
|
||||
});
|
||||
}
|
||||
function ratePct(a,b){return b>0?(a/b*100).toFixed(1)+'%':'0.0%';}
|
||||
function aggregateRows(list){
|
||||
var map={};
|
||||
list.forEach(function(r){
|
||||
var u=map[r.unit];
|
||||
if(!u){u=map[r.unit]={unit:r.unit,dept:'',total:0,checked:0,booked:0,reported:0,unbooked:0,abnormal:0,disease:0,year:r.year};}
|
||||
u.total+=r.total;u.checked+=r.checked;u.booked+=r.booked;u.reported+=r.reported;u.unbooked+=r.unbooked;u.abnormal+=r.abnormal;u.disease+=r.disease;
|
||||
});
|
||||
return Object.keys(map).map(function(k){return map[k];});
|
||||
}
|
||||
function renderTable(){
|
||||
var list=filteredRows();
|
||||
if(state.level==='level-2')list=aggregateRows(list);
|
||||
var totalPages=Math.max(1,Math.ceil(list.length/state.pageSize));
|
||||
if(state.page>totalPages)state.page=totalPages;
|
||||
var start=(state.page-1)*state.pageSize;
|
||||
var pageRows=list.slice(start,start+state.pageSize);
|
||||
var tbody=document.querySelector('#statTable tbody');
|
||||
tbody.innerHTML=pageRows.length?pageRows.map(function(r){
|
||||
return '<tr><td>'+r.unit+'</td><td>'+r.dept+'</td><td>'+r.total+'</td><td>'+r.checked+'</td><td>'+r.booked+'</td><td>'+r.reported+'</td><td>'+r.unbooked+'</td><td>'+r.year+'</td></tr>';
|
||||
}).join(''):'<tr><td colspan="8" style="padding:0;border-bottom:none;"><div class="empty-tip">暂无数据</div></td></tr>';
|
||||
return '<tr><td>'+r.unit+'</td><td class="col-dept">'+r.dept+'</td><td>'+r.total+'</td><td>'+r.checked+'</td><td>'+r.booked+'</td><td>'+r.reported+'</td><td>'+r.unbooked+'</td><td>'+ratePct(r.checked,r.total)+'</td><td>'+ratePct(r.abnormal,r.checked)+'</td><td>'+ratePct(r.disease,r.checked)+'</td><td>'+r.year+'</td></tr>';
|
||||
}).join(''):'<tr><td colspan="11" style="padding:0;border-bottom:none;"><div class="empty-tip">暂无数据</div></td></tr>';
|
||||
renderPagination(list.length,totalPages);
|
||||
}
|
||||
|
||||
@@ -395,6 +435,17 @@ function jumpTo(totalPages){
|
||||
renderTable();
|
||||
}
|
||||
|
||||
/* 二级/三级单位切换：二级按单位聚合并隐藏部门；三级按部门展示 */
|
||||
function switchUnitLevel(el){
|
||||
var items=el.parentElement.querySelectorAll('.unit-level-tab__item');
|
||||
items.forEach(function(item){item.classList.remove('active');});
|
||||
el.classList.add('active');
|
||||
var tab=el.textContent.trim();
|
||||
state.level=(tab==='三级单位')?'level-3':'level-2';
|
||||
document.body.classList.toggle('level-3',state.level==='level-3');
|
||||
state.page=1;
|
||||
renderTable();
|
||||
}
|
||||
/* ============ 通用 ============ */
|
||||
function toggleSubgroup(header){
|
||||
header.parentElement.classList.toggle('open');
|
||||
|
||||
@@ -46,6 +46,25 @@
|
||||
.sidebar-subgroup .sidebar-subgroup>.sidebar-subgroup__header{font-size:12px;}
|
||||
/* 主内容 */
|
||||
.main{margin-left:240px;margin-top:56px;padding:24px;min-height:calc(100vh - 56px);}
|
||||
/* 单位级别TAB */
|
||||
.unit-level-tab{display:flex;align-items:center;gap:0;margin-bottom:16px;background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:0 24px;border-bottom:1px solid var(--border);}
|
||||
.unit-level-tab__item{position:relative;padding:14px 20px;font-size:var(--font-sm);color:var(--text-secondary);cursor:pointer;transition:all .2s;user-select:none;}
|
||||
.unit-level-tab__item:hover{color:var(--primary);}
|
||||
.unit-level-tab__item.active{color:var(--primary);font-weight:500;}
|
||||
.unit-level-tab__item.active::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--primary);border-radius:1px;}
|
||||
/* 表头计算规则提示（问号+悬浮气泡） */
|
||||
.th-help{position:relative;display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;background:#BFBFBF;color:#fff;font-size:10px;font-weight:600;cursor:help;vertical-align:middle;margin-left:4px;}
|
||||
.th-help:hover{background:var(--primary);}
|
||||
.th-help__tip{visibility:hidden;opacity:0;position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.8);color:#fff;font-size:var(--font-sm);font-weight:400;padding:7px 12px;border-radius:var(--radius-sm);white-space:nowrap;z-index:130;transition:opacity .15s;line-height:1.5;}
|
||||
.th-help__tip::before{content:'';position:absolute;top:-4px;left:50%;margin-left:-4px;width:8px;height:8px;background:rgba(0,0,0,0.8);transform:rotate(45deg);}
|
||||
.th-help__tip--right{left:auto;right:-7px;transform:none;}
|
||||
.th-help__tip--right::before{left:auto;right:11px;margin-left:0;}
|
||||
.th-help:hover .th-help__tip{visibility:visible;opacity:1;}
|
||||
/* 二级单位tab下隐藏部门列与部门筛选 */
|
||||
.col-dept{display:none;}
|
||||
body.level-3 .col-dept{display:table-cell;}
|
||||
.filter-item.filter-dept{display:none;}
|
||||
body.level-3 .filter-item.filter-dept{display:flex;}
|
||||
/* 筛选栏 */
|
||||
.filter-bar{background:#fff;border-radius:var(--radius-md);padding:20px 24px;margin-bottom:16px;box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
|
||||
.filter-item{display:flex;align-items:center;gap:8px;}
|
||||
@@ -183,6 +202,12 @@
|
||||
|
||||
<!-- 主内容 -->
|
||||
<main class="main">
|
||||
<!-- 单位级别切换TAB -->
|
||||
<div class="unit-level-tab">
|
||||
<div class="unit-level-tab__item active" onclick="switchUnitLevel(this)">二级单位</div>
|
||||
<div class="unit-level-tab__item" onclick="switchUnitLevel(this)">三级单位</div>
|
||||
</div>
|
||||
|
||||
<!-- 筛选栏 -->
|
||||
<div class="filter-bar">
|
||||
<div class="filter-item">
|
||||
@@ -203,7 +228,7 @@
|
||||
<option value="">请选择单位</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<div class="filter-item filter-dept">
|
||||
<label>部门：</label>
|
||||
<select class="filter-select" id="f-dept" onchange="state.dept=this.value;state.page=1;renderTable();">
|
||||
<option value="">请选择部门</option>
|
||||
@@ -241,7 +266,7 @@
|
||||
<div class="table-card__content">
|
||||
<table id="statTable">
|
||||
<thead>
|
||||
<tr><th>单位</th><th>部门</th><th>应检人数</th><th>已体检人数</th><th>已预约人数</th><th>已出报告人数</th><th>未预约人数</th><th>体检年份</th></tr>
|
||||
<tr><th>单位</th><th class="col-dept">部门</th><th>应检人数</th><th>已体检人数</th><th>已预约人数</th><th>已出报告人数</th><th>未预约人数</th><th>受检率<span class="th-help">?<span class="th-help__tip">受检率 = 实际检查人数 ÷ 应检人数</span></span></th><th>检出率<span class="th-help">?<span class="th-help__tip">检出率 = 异常人数 ÷ 实际检查人数</span></span></th><th>患病率<span class="th-help">?<span class="th-help__tip th-help__tip--right">患病率 = 单病种异常人数 ÷ 实际参加检查人数</span></span></th><th>体检年份</th></tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
@@ -254,32 +279,36 @@
|
||||
/* ============ 数据 ============ */
|
||||
/* 确定性伪随机（0-1），保证每次打开数据一致 */
|
||||
function pseudo(i){var x=Math.sin(i*127.1)*43758.5453;return x-Math.floor(x);}
|
||||
function mkRow(unit,dept,total,checked,booked){
|
||||
return {unit:unit,dept:dept,total:total,checked:checked,booked:booked,reported:0,unbooked:total-checked-booked,year:'2026'};
|
||||
/* 按总人数与种子确定性生成一行：受检率=已体检/应检；检出率=异常/已体检；患病率=单病种异常/已体检 */
|
||||
function mkRow(unit,dept,total,seed){
|
||||
var checked=Math.floor(total*(0.6+pseudo(seed+0.3)*0.35));
|
||||
var booked=Math.floor(total*(0.1+pseudo(seed+0.6)*0.2));
|
||||
var reported=Math.floor(checked*(0.88+pseudo(seed+0.8)*0.12));
|
||||
var abnormal=Math.max(0,Math.floor(checked*(0.15+pseudo(seed+1.1)*0.4)));
|
||||
var disease=Math.max(0,Math.floor(abnormal*(0.3+pseudo(seed+1.3)*0.5)));
|
||||
return {unit:unit,dept:dept,total:total,checked:checked,booked:booked,reported:reported,unbooked:Math.max(0,total-checked-booked),abnormal:abnormal,disease:disease,year:'2026'};
|
||||
}
|
||||
var rows=[];
|
||||
/* 参考图前10条（第二采油厂） */
|
||||
[['南梁采油作业区',205,0,4],['消防大队',88,0,1],['温台采油作业区',174,1,27],['樊家川采油作业区',161,0,15],['科技信息部',7,0,0],['西峰采油二区',206,0,5],['地质研究所',31,0,2],['西峰采油三区',158,0,10],['华池采油作业区',198,0,30],['马岭北采油作业区',174,0,11]].forEach(function(d){
|
||||
rows.push(mkRow('第二采油厂',d[0],d[1],d[2],d[3]));
|
||||
[['南梁采油作业区',205],['消防大队',88],['温台采油作业区',174],['樊家川采油作业区',161],['科技信息部',7],['西峰采油二区',206],['地质研究所',31],['西峰采油三区',158],['华池采油作业区',198],['马岭北采油作业区',174]].forEach(function(d,i){
|
||||
rows.push(mkRow('第二采油厂',d[0],d[1],1000+i));
|
||||
});
|
||||
var BASE_DEPTS=['采油作业一区','采油作业二区','采油作业三区','采油作业四区','采油作业五区','采油作业六区','集输作业区','地质研究所','工艺研究所','信息中心','安全环保科','生产运行科','经营管理科','人力资源科','财务资产科','物资供应站','维修抢修中心','消防大队','综合办公室','后勤服务部','质量监督站','培训站','离退休管理科','保卫科'];
|
||||
var EXTRA_UNITS=[['第三采油厂',24],['第四采油厂',24],['第五采油厂',24],['公用事业公司',24],['运输公司',24],['水电厂',24],['采气一厂',10]];
|
||||
/* 第二采油厂补充5条，其余单位按部门池生成，合计169条 */
|
||||
['采油作业一区','采油作业六区','集输作业区','生产运行科','保卫科'].forEach(function(dept,i){
|
||||
var idx=100+i,total=20+Math.floor(pseudo(idx)*260),checked=pseudo(idx+0.31)<0.12?1:0;
|
||||
var booked=Math.floor(pseudo(idx+0.67)*Math.min(35,Math.floor(total*0.18)));
|
||||
rows.push(mkRow('第二采油厂',dept,total,checked,booked));
|
||||
var idx=100+i,total=20+Math.floor(pseudo(idx)*260);
|
||||
rows.push(mkRow('第二采油厂',dept,total,idx));
|
||||
});
|
||||
var gi=0;
|
||||
EXTRA_UNITS.forEach(function(u){
|
||||
for(var i=0;i<u[1];i++){
|
||||
gi++;
|
||||
var idx=200+gi,total=20+Math.floor(pseudo(idx)*260),checked=pseudo(idx+0.31)<0.12?1:0;
|
||||
var booked=Math.floor(pseudo(idx+0.67)*Math.min(35,Math.floor(total*0.18)));
|
||||
rows.push(mkRow(u[0],BASE_DEPTS[i],total,checked,booked));
|
||||
var idx=200+gi,total=20+Math.floor(pseudo(idx)*260);
|
||||
rows.push(mkRow(u[0],BASE_DEPTS[i],total,idx));
|
||||
}
|
||||
});
|
||||
var state={unit:'',dept:'',year:'2026',page:1,pageSize:10};
|
||||
var state={unit:'',dept:'',year:'2026',page:1,pageSize:10,level:'level-2'};
|
||||
|
||||
/* ============ 筛选 ============ */
|
||||
function initUnitOptions(){
|
||||
@@ -346,16 +375,27 @@ function filteredRows(){
|
||||
return (!state.unit||r.unit===state.unit)&&(!state.dept||r.dept===state.dept)&&(!state.year||r.year===state.year);
|
||||
});
|
||||
}
|
||||
function ratePct(a,b){return b>0?(a/b*100).toFixed(1)+'%':'0.0%';}
|
||||
function aggregateRows(list){
|
||||
var map={};
|
||||
list.forEach(function(r){
|
||||
var u=map[r.unit];
|
||||
if(!u){u=map[r.unit]={unit:r.unit,dept:'',total:0,checked:0,booked:0,reported:0,unbooked:0,abnormal:0,disease:0,year:r.year};}
|
||||
u.total+=r.total;u.checked+=r.checked;u.booked+=r.booked;u.reported+=r.reported;u.unbooked+=r.unbooked;u.abnormal+=r.abnormal;u.disease+=r.disease;
|
||||
});
|
||||
return Object.keys(map).map(function(k){return map[k];});
|
||||
}
|
||||
function renderTable(){
|
||||
var list=filteredRows();
|
||||
if(state.level==='level-2')list=aggregateRows(list);
|
||||
var totalPages=Math.max(1,Math.ceil(list.length/state.pageSize));
|
||||
if(state.page>totalPages)state.page=totalPages;
|
||||
var start=(state.page-1)*state.pageSize;
|
||||
var pageRows=list.slice(start,start+state.pageSize);
|
||||
var tbody=document.querySelector('#statTable tbody');
|
||||
tbody.innerHTML=pageRows.length?pageRows.map(function(r){
|
||||
return '<tr><td>'+r.unit+'</td><td>'+r.dept+'</td><td>'+r.total+'</td><td>'+r.checked+'</td><td>'+r.booked+'</td><td>'+r.reported+'</td><td>'+r.unbooked+'</td><td>'+r.year+'</td></tr>';
|
||||
}).join(''):'<tr><td colspan="8" style="padding:0;border-bottom:none;"><div class="empty-tip">暂无数据</div></td></tr>';
|
||||
return '<tr><td>'+r.unit+'</td><td class="col-dept">'+r.dept+'</td><td>'+r.total+'</td><td>'+r.checked+'</td><td>'+r.booked+'</td><td>'+r.reported+'</td><td>'+r.unbooked+'</td><td>'+ratePct(r.checked,r.total)+'</td><td>'+ratePct(r.abnormal,r.checked)+'</td><td>'+ratePct(r.disease,r.checked)+'</td><td>'+r.year+'</td></tr>';
|
||||
}).join(''):'<tr><td colspan="11" style="padding:0;border-bottom:none;"><div class="empty-tip">暂无数据</div></td></tr>';
|
||||
renderPagination(list.length,totalPages);
|
||||
}
|
||||
|
||||
@@ -395,6 +435,17 @@ function jumpTo(totalPages){
|
||||
renderTable();
|
||||
}
|
||||
|
||||
/* 二级/三级单位切换：二级按单位聚合并隐藏部门；三级按部门展示 */
|
||||
function switchUnitLevel(el){
|
||||
var items=el.parentElement.querySelectorAll('.unit-level-tab__item');
|
||||
items.forEach(function(item){item.classList.remove('active');});
|
||||
el.classList.add('active');
|
||||
var tab=el.textContent.trim();
|
||||
state.level=(tab==='三级单位')?'level-3':'level-2';
|
||||
document.body.classList.toggle('level-3',state.level==='level-3');
|
||||
state.page=1;
|
||||
renderTable();
|
||||
}
|
||||
/* ============ 通用 ============ */
|
||||
function toggleSubgroup(header){
|
||||
header.parentElement.classList.toggle('open');
|
||||
|
||||
Reference in New Issue
Block a user