feat: 医疗点PAD端首版原型（1280×800横屏20页含登录/任务中心/日常诊疗/随访/慢病干预/健康宣教/员工档案/健康监测/床头呼叫/报告解读，抽屉交互页内实现，站点地图同步与项目背景尺寸规范更新，新增模块CHANGELOG）；全站演示数据脱敏（示例人名王建国改石维国、周明远改曲志明，机构长庆油田改CQ油田，覆盖应急/体检/体重/营养/餐厅终端/大屏等约30页）；现场体检签到码由图标切换改为条形码/二维码双选项卡切换；新增健康长寿系统升级改造详细规划V8文档
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
fengpu
co-authored by
Claude Opus 4.7
Claude Opus 4.7
parent
29a09e9402
commit
15ca37b892
Generated
+4
-52
@@ -7,7 +7,7 @@
|
||||
<value>
|
||||
<TabSessionState>
|
||||
<option name="provider" value="claude" />
|
||||
<option name="sessionId" value="c788d99a-7e82-4744-99ea-240fd47fff30" />
|
||||
<option name="sessionId" value="1a5b94ba-13db-41c5-99dc-97e92d5c7371" />
|
||||
<option name="cwd" value="$PROJECT_DIR$" />
|
||||
<option name="model" value="claude-opus-4-7[1m]" />
|
||||
<option name="permissionMode" value="bypassPermissions" />
|
||||
@@ -19,7 +19,7 @@
|
||||
<value>
|
||||
<TabSessionState>
|
||||
<option name="provider" value="claude" />
|
||||
<option name="sessionId" value="a2b724c3-b000-4b97-b78b-de01348b0343" />
|
||||
<option name="sessionId" value="2b914133-b4ca-4fe5-8982-8bd381b51120" />
|
||||
<option name="cwd" value="$PROJECT_DIR$" />
|
||||
<option name="model" value="claude-opus-4-7[1m]" />
|
||||
<option name="permissionMode" value="bypassPermissions" />
|
||||
@@ -31,55 +31,7 @@
|
||||
<value>
|
||||
<TabSessionState>
|
||||
<option name="provider" value="claude" />
|
||||
<option name="sessionId" value="b7fee47b-6fb5-47f4-9bcc-7e886a50a566" />
|
||||
<option name="cwd" value="$PROJECT_DIR$" />
|
||||
<option name="model" value="claude-opus-4-7[1m]" />
|
||||
<option name="permissionMode" value="bypassPermissions" />
|
||||
<option name="reasoningEffort" value="high" />
|
||||
</TabSessionState>
|
||||
</value>
|
||||
</entry>
|
||||
<entry key="3">
|
||||
<value>
|
||||
<TabSessionState>
|
||||
<option name="provider" value="claude" />
|
||||
<option name="sessionId" value="10a4736e-8c0e-4eb9-8ff5-0d6a7bf93d6c" />
|
||||
<option name="cwd" value="$PROJECT_DIR$" />
|
||||
<option name="model" value="claude-opus-4-7[1m]" />
|
||||
<option name="permissionMode" value="bypassPermissions" />
|
||||
<option name="reasoningEffort" value="high" />
|
||||
</TabSessionState>
|
||||
</value>
|
||||
</entry>
|
||||
<entry key="4">
|
||||
<value>
|
||||
<TabSessionState>
|
||||
<option name="provider" value="claude" />
|
||||
<option name="sessionId" value="808742be-17a1-4752-84ee-2da5b8d02dfc" />
|
||||
<option name="cwd" value="$PROJECT_DIR$" />
|
||||
<option name="model" value="claude-opus-4-7[1m]" />
|
||||
<option name="permissionMode" value="bypassPermissions" />
|
||||
<option name="reasoningEffort" value="high" />
|
||||
</TabSessionState>
|
||||
</value>
|
||||
</entry>
|
||||
<entry key="5">
|
||||
<value>
|
||||
<TabSessionState>
|
||||
<option name="provider" value="claude" />
|
||||
<option name="sessionId" value="514986c8-0e40-473a-8532-cbd3cd7b09a3" />
|
||||
<option name="cwd" value="$PROJECT_DIR$" />
|
||||
<option name="model" value="claude-opus-4-7[1m]" />
|
||||
<option name="permissionMode" value="bypassPermissions" />
|
||||
<option name="reasoningEffort" value="high" />
|
||||
</TabSessionState>
|
||||
</value>
|
||||
</entry>
|
||||
<entry key="6">
|
||||
<value>
|
||||
<TabSessionState>
|
||||
<option name="provider" value="claude" />
|
||||
<option name="sessionId" value="d4678fb6-8a87-406a-9b68-a1b67a317c0c" />
|
||||
<option name="sessionId" value="9db55ee0-b91b-4abe-9d2f-5655a168223d" />
|
||||
<option name="cwd" value="$PROJECT_DIR$" />
|
||||
<option name="model" value="claude-opus-4-7[1m]" />
|
||||
<option name="permissionMode" value="bypassPermissions" />
|
||||
@@ -89,6 +41,6 @@
|
||||
</entry>
|
||||
</map>
|
||||
</option>
|
||||
<option name="tabCount" value="7" />
|
||||
<option name="tabCount" value="3" />
|
||||
</component>
|
||||
</project>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -65,7 +65,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<div class="form-group">
|
||||
<div class="form-row">
|
||||
<span class="form-label">姓名</span>
|
||||
<input class="form-input" id="inputName" type="text" value="王建国" placeholder="请输入姓名" />
|
||||
<input class="form-input" id="inputName" type="text" value="石维国" placeholder="请输入姓名" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -38,7 +38,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<div style="display:flex;align-items:center;gap:16px;">
|
||||
<div style="width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,#e6f4ff,#91caff);display:flex;align-items:center;justify-content:center;font-size:34px;border:3px solid rgba(255,255,255,0.5);">👤</div>
|
||||
<div>
|
||||
<div style="color:#fff;font-size:20px;font-weight:700;">王建国</div>
|
||||
<div style="color:#fff;font-size:20px;font-weight:700;">石维国</div>
|
||||
<div style="color:rgba(255,255,255,0.8);font-size:13px;margin-top:3px;">健康管理员</div>
|
||||
<div style="color:rgba(255,255,255,0.78);font-size:12px;margin-top:4px;">安全环保部 · 健康管理科</div>
|
||||
</div>
|
||||
|
||||
@@ -140,24 +140,24 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<script>
|
||||
/* ===== Mock数据 ===== */
|
||||
var activeOrders = [
|
||||
{ id:'EM202606001', method:'video', methodLabel:'应急视频', time:'2026-06-22 14:35', empName:'张小红', empGender:'女', empAge:32, empNo:'CQ001256', empUnit:'公司机关', empDept:'办公室', empPhone:'13812346789', center:'第一应急中心', operator:'王建国', professional:'刘志明' },
|
||||
{ id:'EM202606001', method:'video', methodLabel:'应急视频', time:'2026-06-22 14:35', empName:'张小红', empGender:'女', empAge:32, empNo:'CQ001256', empUnit:'公司机关', empDept:'办公室', empPhone:'13812346789', center:'第一应急中心', operator:'石维国', professional:'刘志明' },
|
||||
{ id:'EM202606002', method:'phone', methodLabel:'应急电话', time:'2026-06-22 10:12', empName:'李建国', empGender:'男', empAge:45, empNo:'CQ000832', empUnit:'采油一厂', empDept:'技术部', empPhone:'13923458901', center:'第二应急中心', operator:'赵海龙', professional:'陈晓东' },
|
||||
{ id:'EM202606003', method:'120', methodLabel:'拨打120', time:'2026-06-21 08:20', empName:'赵志强', empGender:'男', empAge:61, empNo:'CQ000089', empUnit:'公司机关', empDept:'后勤部', empPhone:'13756782345', center:'第一应急中心', operator:'王建国', professional:'周伟' }
|
||||
{ id:'EM202606003', method:'120', methodLabel:'拨打120', time:'2026-06-21 08:20', empName:'赵志强', empGender:'男', empAge:61, empNo:'CQ000089', empUnit:'公司机关', empDept:'后勤部', empPhone:'13756782345', center:'第一应急中心', operator:'石维国', professional:'周伟' }
|
||||
];
|
||||
|
||||
var doneOrders = [
|
||||
{ id:'EM202606004', method:'video', methodLabel:'应急视频', time:'2026-06-20 16:05', empName:'王芳', empGender:'女', empAge:28, empNo:'CQ001103', empUnit:'信息技术中心', empDept:'数据部', empPhone:'13634564567', center:'第一应急中心', operator:'王建国', professional:'刘志明' },
|
||||
{ id:'EM202606004', method:'video', methodLabel:'应急视频', time:'2026-06-20 16:05', empName:'王芳', empGender:'女', empAge:28, empNo:'CQ001103', empUnit:'信息技术中心', empDept:'数据部', empPhone:'13634564567', center:'第一应急中心', operator:'石维国', professional:'刘志明' },
|
||||
{ id:'EM202606005', method:'phone', methodLabel:'应急电话', time:'2026-06-18 09:45', empName:'陈伟', empGender:'男', empAge:36, empNo:'CQ000567', empUnit:'安全环保部', empDept:'安环部', empPhone:'13545677890', center:'第三应急中心', operator:'孙海涛', professional:'黄志强' },
|
||||
{ id:'EM202606006', method:'120', methodLabel:'拨打120', time:'2026-06-15 22:10', empName:'孙丽', empGender:'女', empAge:41, empNo:'CQ001340', empUnit:'采油一厂', empDept:'作业区', empPhone:'15867890123', center:'第二应急中心', operator:'赵海龙', professional:'马云飞' },
|
||||
{ id:'EM202606007', method:'video', methodLabel:'应急视频', time:'2026-06-12 11:30', empName:'周明', empGender:'男', empAge:33, empNo:'CQ000921', empUnit:'信息技术中心', empDept:'技术部', empPhone:'18678903456', center:'第一应急中心', operator:'王建国', professional:'刘志明' },
|
||||
{ id:'EM202606007', method:'video', methodLabel:'应急视频', time:'2026-06-12 11:30', empName:'周明', empGender:'男', empAge:33, empNo:'CQ000921', empUnit:'信息技术中心', empDept:'技术部', empPhone:'18678903456', center:'第一应急中心', operator:'石维国', professional:'刘志明' },
|
||||
{ id:'EM202606008', method:'phone', methodLabel:'应急电话', time:'2026-06-10 15:20', empName:'刘海波', empGender:'男', empAge:55, empNo:'CQ000234', empUnit:'公司机关', empDept:'行政部', empPhone:'13389015678', center:'第三应急中心', operator:'孙海涛', professional:'周伟' },
|
||||
{ id:'EM202606009', method:'120', methodLabel:'拨打120', time:'2026-06-08 07:55', empName:'吴静', empGender:'女', empAge:26, empNo:'CQ001412', empUnit:'公司机关', empDept:'人力部', empPhone:'15289016789', center:'第二应急中心', operator:'赵海龙', professional:'陈晓东' },
|
||||
{ id:'EM202606010', method:'video', methodLabel:'应急视频', time:'2026-06-05 13:40', empName:'黄晓明', empGender:'男', empAge:42, empNo:'CQ000789', empUnit:'采油一厂', empDept:'工程部', empPhone:'18990120123', center:'第一应急中心', operator:'王建国', professional:'黄志强' },
|
||||
{ id:'EM202606010', method:'video', methodLabel:'应急视频', time:'2026-06-05 13:40', empName:'黄晓明', empGender:'男', empAge:42, empNo:'CQ000789', empUnit:'采油一厂', empDept:'工程部', empPhone:'18990120123', center:'第一应急中心', operator:'石维国', professional:'黄志强' },
|
||||
{ id:'EM202606011', method:'phone', methodLabel:'应急电话', time:'2026-06-03 18:15', empName:'杨丽华', empGender:'女', empAge:39, empNo:'CQ001098', empUnit:'安全环保部', empDept:'安环部', empPhone:'13101234567', center:'第三应急中心', operator:'孙海涛', professional:'马云飞' },
|
||||
{ id:'EM202605001', method:'video', methodLabel:'应急视频', time:'2026-05-28 10:00', empName:'郑国强', empGender:'男', empAge:50, empNo:'CQ000456', empUnit:'公司机关', empDept:'财务部', empPhone:'17712347890', center:'第二应急中心', operator:'赵海龙', professional:'刘志明' },
|
||||
{ id:'EM202605002', method:'120', methodLabel:'拨打120', time:'2026-05-25 20:30', empName:'马燕', empGender:'女', empAge:35, empNo:'CQ001521', empUnit:'信息技术中心', empDept:'运维部', empPhone:'15023452345', center:'第一应急中心', operator:'王建国', professional:'周伟' },
|
||||
{ id:'EM202605002', method:'120', methodLabel:'拨打120', time:'2026-05-25 20:30', empName:'马燕', empGender:'女', empAge:35, empNo:'CQ001521', empUnit:'信息技术中心', empDept:'运维部', empPhone:'15023452345', center:'第一应急中心', operator:'石维国', professional:'周伟' },
|
||||
{ id:'EM202605003', method:'phone', methodLabel:'应急电话', time:'2026-05-20 14:50', empName:'林伟东', empGender:'男', empAge:44, empNo:'CQ000678', empUnit:'采油一厂', empDept:'设备部', empPhone:'19934563456', center:'第三应急中心', operator:'孙海涛', professional:'陈晓东' },
|
||||
{ id:'EM202604001', method:'video', methodLabel:'应急视频', time:'2026-04-15 09:10', empName:'何秀兰', empGender:'女', empAge:47, empNo:'CQ001623', empUnit:'公司机关', empDept:'后勤部', empPhone:'15545676789', center:'第一应急中心', operator:'王建国', professional:'黄志强' }
|
||||
{ id:'EM202604001', method:'video', methodLabel:'应急视频', time:'2026-04-15 09:10', empName:'何秀兰', empGender:'女', empAge:47, empNo:'CQ001623', empUnit:'公司机关', empDept:'后勤部', empPhone:'15545676789', center:'第一应急中心', operator:'石维国', professional:'黄志强' }
|
||||
];
|
||||
|
||||
/* ===== 当前筛选状态 ===== */
|
||||
|
||||
@@ -51,7 +51,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<!-- [交互] 点击头像可跳转至个人中心 -->
|
||||
<div style="width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,0.25);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;border:2px solid rgba(255,255,255,0.4);cursor:pointer;" onclick="location.href='../profile/index.html'">👤</div>
|
||||
<div style="flex:1;min-width:0;">
|
||||
<div style="color:#fff;font-size:18px;font-weight:700;">王建国</div>
|
||||
<div style="color:#fff;font-size:18px;font-weight:700;">石维国</div>
|
||||
<div style="color:rgba(255,255,255,0.85);font-size:13px;margin-top:2px;">健康管理员</div>
|
||||
<div style="color:rgba(255,255,255,0.65);font-size:11px;margin-top:2px;">安全环保部 · 健康管理科</div>
|
||||
</div>
|
||||
|
||||
@@ -122,7 +122,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<div class="case-avatar case-avatar-emergency">🚑</div>
|
||||
<div class="case-main">
|
||||
<div class="case-title-row">
|
||||
<div class="case-name">王建国<span style="font-size:13px;font-weight:400;color:#666;margin-left:6px;">38岁</span></div>
|
||||
<div class="case-name">石维国<span style="font-size:13px;font-weight:400;color:#666;margin-left:6px;">38岁</span></div>
|
||||
<span class="tag tag-red">进行中</span>
|
||||
</div>
|
||||
<div class="case-meta">求助方式：<span class="tag tag-orange">拨打120</span></div>
|
||||
|
||||
@@ -110,7 +110,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<div class="ec-top">
|
||||
<div class="ec-avatar">🚑</div>
|
||||
<div class="ec-info">
|
||||
<div class="ec-name">王建国<span class="age">38岁</span></div>
|
||||
<div class="ec-name">石维国<span class="age">38岁</span></div>
|
||||
<div class="ec-time">求助方式：<span class="tag tag-orange">拨打120</span></div>
|
||||
<div class="ec-time">求助时间：2026-04-23 08:15</div>
|
||||
</div>
|
||||
|
||||
@@ -206,15 +206,30 @@
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.code-switch {
|
||||
width: 28px; height: 28px;
|
||||
border-radius: 8px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
padding: 2px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid #e4f7f5;
|
||||
background: #f2fbfa;
|
||||
color: var(--primary-dark);
|
||||
display: inline-flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.code-switch__opt {
|
||||
border: none;
|
||||
background: transparent;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
color: var(--text-secondary);
|
||||
padding: 5px 10px;
|
||||
border-radius: 999px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.code-switch:active { background: var(--primary-light); }
|
||||
.code-switch__opt--active {
|
||||
background: var(--primary);
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 2px 6px rgba(19, 194, 194, 0.35);
|
||||
}
|
||||
.qrcode-wrap { display: flex; flex-direction: column; align-items: center; gap: 8px; }
|
||||
.code-img {
|
||||
background: #fff;
|
||||
@@ -380,10 +395,11 @@
|
||||
<div class="person-card" id="codeRoutine">
|
||||
<div class="person-card__header">
|
||||
<div class="section-title" style="margin-bottom:0">体检签到码</div>
|
||||
<!-- [交互] 点击右上角小图标切换条形码/二维码 -->
|
||||
<button class="code-switch" type="button" title="切换条形码/二维码" onclick="toggleCodeMode('codeRoutine')">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 1l4 4-4 4"/><path d="M3 11V9a4 4 0 0 1 4-4h14"/><path d="M7 23l-4-4 4-4"/><path d="M21 13v2a4 4 0 0 1-4 4H3"/></svg>
|
||||
</button>
|
||||
<!-- [交互] 点击右上角「条形码/二维码」双选项卡切换签到码展示 -->
|
||||
<div class="code-switch">
|
||||
<button class="code-switch__opt code-switch__opt--active" type="button" id="codeRoutineTabBar" onclick="setCodeMode('codeRoutine', 'bar')">条形码</button>
|
||||
<button class="code-switch__opt" type="button" id="codeRoutineTabQr" onclick="setCodeMode('codeRoutine', 'qr')">二维码</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="qrcode-wrap code-only--bar">
|
||||
<!-- [交互] 点击条码放大展示 -->
|
||||
@@ -613,9 +629,12 @@
|
||||
});
|
||||
|
||||
// ===== 签到码：条形码 ↔ 二维码切换 =====
|
||||
// [交互] 点击右上角小图标切换条形码/二维码，默认条形码
|
||||
function toggleCodeMode(cardId) {
|
||||
document.getElementById(cardId).classList.toggle('person-card--qr');
|
||||
// [交互] 点击右上角双选项卡切换条形码/二维码，默认条形码，当前模式选项高亮
|
||||
function setCodeMode(cardId, mode) {
|
||||
var isQr = mode === 'qr';
|
||||
document.getElementById(cardId).classList.toggle('person-card--qr', isQr);
|
||||
document.getElementById(cardId + 'TabBar').classList.toggle('code-switch__opt--active', !isQr);
|
||||
document.getElementById(cardId + 'TabQr').classList.toggle('code-switch__opt--active', isQr);
|
||||
}
|
||||
// [交互] 点击签到码放大查看（遮罩跟随当前类型）
|
||||
function openCodeOverlay(cardId) {
|
||||
|
||||
@@ -154,7 +154,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<div class="expert-result" onclick="window.location.href='expert-profile.html'">
|
||||
<div class="expert-avatar">👨⚕️</div>
|
||||
<div class="expert-info">
|
||||
<div class="expert-name-row"><span class="expert-name">王建国</span><span class="expert-title-tag">主任医师</span></div>
|
||||
<div class="expert-name-row"><span class="expert-name">石维国</span><span class="expert-title-tag">主任医师</span></div>
|
||||
<div class="expert-dept">骨科 · 颈椎病、关节置换</div>
|
||||
<div class="expert-hospital">北京天坛医院</div>
|
||||
</div>
|
||||
|
||||
@@ -135,7 +135,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
</div>
|
||||
<div class="activity-info__row">
|
||||
<span class="activity-info__label">负责人</span>
|
||||
<span class="activity-info__value">王建国</span>
|
||||
<span class="activity-info__value">石维国</span>
|
||||
</div>
|
||||
<div class="activity-info__row">
|
||||
<span class="activity-info__label">联系电话</span>
|
||||
|
||||
@@ -117,7 +117,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
</div>
|
||||
|
||||
<!-- 附件 -->
|
||||
<div class="attach" onclick="alert('下载附件')">附件《长庆油田体重管理三年行动计划.docx》</div>
|
||||
<div class="attach" onclick="alert('下载附件')">附件《CQ油田体重管理三年行动计划.docx》</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
+22
-1
@@ -923,7 +923,28 @@ const SITE_MAP = [
|
||||
] },
|
||||
{ name:'标准版中心大屏', dir:'other-module/emergency-screen/standard-center', pages:[] },
|
||||
{ name:'九厂应急中心大屏', dir:'other-module/emergency-screen/jiuchang-center', pages:[] },
|
||||
{ name:'医疗点PAD端', dir:'other-module/medical-pad', pages:[] },
|
||||
{ name:'医疗点PAD端', dir:'other-module/medical-pad', entry:'login.html', pages:[
|
||||
{label:'登录页', file:'login.html'},
|
||||
{label:'任务中心', file:'task.html'},
|
||||
{label:'日常诊疗', file:'daily.html'},
|
||||
{label:'日常诊疗 · 员工接诊抽屉', file:'daily-drawer.html'},
|
||||
{label:'日常诊疗 · 非员工接诊抽屉', file:'daily-nonstaff-drawer.html'},
|
||||
{label:'随访管理', file:'follow-records.html'},
|
||||
{label:'新增随访抽屉', file:'follow-drawer.html'},
|
||||
{label:'慢病干预', file:'chronic-disease.html'},
|
||||
{label:'新增干预抽屉', file:'chronic-disease-drawer.html'},
|
||||
{label:'慢病干预详情', file:'chronic-disease-detail.html'},
|
||||
{label:'健康宣教', file:'health-education.html'},
|
||||
{label:'新增宣教抽屉', file:'health-education-drawer.html'},
|
||||
{label:'员工档案', file:'employee-file.html'},
|
||||
{label:'员工档案详情', file:'employee-file-detail.html'},
|
||||
{label:'健康监测', file:'monitor.html'},
|
||||
{label:'床头呼叫', file:'bed.html'},
|
||||
{label:'呼叫处理详情', file:'bed-detail.html'},
|
||||
{label:'报告解读', file:'report.html'},
|
||||
{label:'报告解读抽屉', file:'interpret-drawer.html'},
|
||||
{label:'五类人群标签抽屉', file:'five-class-drawer.html'}
|
||||
] },
|
||||
{ name:'餐厅终端设备', dir:'other-module/canteen-device', done:true, pages:[
|
||||
{label:'餐线营养秤 · 模块导航', file:'canteen-nutrition-scale/index.html'},
|
||||
{label:'餐线营养秤 · 开餐界面', file:'canteen-nutrition-scale/01-meal-start.html'},
|
||||
|
||||
@@ -1779,7 +1779,7 @@
|
||||
{ type: 'start', time: '06:30:00', title: '开餐', desc: '操作人 <strong>李四 · CS002</strong> 开启<strong>早餐</strong>餐次，涉及 <strong>14 道菜</strong>', tags: [{ cls: 'mh-tl-tag--green', text: '14 道菜' }], detail: { firstOrder: { time: '06:48:15', line: 'A', customer: '王*强', amount: 12.50 }, dishes: [{ name: '豆浆', line: 'A', serveTime: '06:30:10', maker: '孙师傅', operator: '李四', planned: 8.0, sold: 6.5 }, { name: '油条', line: 'A', serveTime: '06:30:20', maker: '孙师傅', operator: '李四', planned: 5.0, sold: 4.2 }, { name: '鲜肉包', line: 'B', serveTime: '06:30:05', maker: '周师傅', operator: '李四', planned: 6.0, sold: 5.0 }, { name: '鸡蛋饼', line: 'A', serveTime: '06:30:35', maker: '孙师傅', operator: '李四', planned: 4.0, sold: 3.3 }, { name: '小米粥', line: 'B', serveTime: '06:30:15', maker: '周师傅', operator: '李四', planned: 6.0, sold: 5.1 }, { name: '馒头', line: 'B', serveTime: '06:30:25', maker: '周师傅', operator: '李四', planned: 5.0, sold: 4.0 }, { name: '花卷', line: 'A', serveTime: '06:30:45', maker: '孙师傅', operator: '李四', planned: 3.5, sold: 2.8 }, { name: '茶叶蛋', line: 'A', serveTime: '06:30:08', maker: '孙师傅', operator: '李四', planned: 4.0, sold: 3.5 }] } },
|
||||
{ type: 'add', time: '07:25:30', title: '补餐 · 豆浆', desc: '<strong>豆浆</strong> 余量降至 1.2kg，后厨补做 <strong>3.0kg</strong>', tags: [{ cls: 'mh-tl-tag--gold', text: '自动预警' }, { cls: 'mh-tl-tag--green', text: '已通知后厨' }], supply: { dish: '豆浆', line: 'A', dishEmoji: '🥛', triggerLeftover: 1.2, addAmount: 3.0, reason: '自动预警', operator: '李四', status: '已补做' } },
|
||||
{ type: 'close', time: '08:50:00', title: '收餐', desc: '全部餐线收餐完成,进入员工餐时段', tags: [{ cls: 'mh-tl-tag--gray', text: '全部收餐' }], closeDetail: { operator: '李四', closeTime: '08:50:00', method: 'staff_meal', methodLabel: '进入员工餐时段', orders: 142, revenue: 1820.00, avgPer: 12.82, surplus: '12.4' } },
|
||||
{ type: 'dispose', time: '09:32:18', title: '余量处置', desc: '本餐次共处置余量 <strong>12.9kg</strong>，操作人 <strong>李四</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }, { cls: 'mh-tl-tag--green', text: '交叉核对正常' }], dispose: { total: 12.9, operator: '李四', methods: [{ key: 'welfare', label: '员工福利', amount: 5.2, count: 3 }, { key: 'donate', label: '捐赠', amount: 4.8, count: 2 }, { key: 'waste', label: '废弃', amount: 1.4, count: 2 }, { key: 'reprocess', label: '加工再利用', amount: 1.0, count: 1 }, { key: 'cabinet', label: '存入智能货柜', amount: 0.5, count: 1 }], records: [{ time: '09:33:10', dish: '油条', line: 'A', method: 'welfare', amount: 2.0, receiver: '员工 · 王建国', operator: '李四', note: '加班餐' }, { time: '09:34:05', dish: '鲜肉包', line: 'B', method: 'welfare', amount: 1.8, receiver: '员工 · 陈小红', operator: '李四', note: '值班餐' }, { time: '09:35:20', dish: '鸡蛋饼', line: 'A', method: 'welfare', amount: 1.4, receiver: '员工 · 赵大鹏', operator: '李四', note: '' }, { time: '09:36:45', dish: '小米粥', line: 'B', method: 'donate', amount: 3.0, receiver: '浐灞社区服务站', operator: '李四', note: '捐赠凭证已上传' }, { time: '09:37:30', dish: '馒头', line: 'B', method: 'donate', amount: 1.8, receiver: '浐灞社区服务站', operator: '李四', note: '' }, { time: '09:38:15', dish: '花卷', line: 'A', method: 'waste', amount: 0.9, receiver: '—', operator: '李四', reason: '临期食品', note: '' }, { time: '09:39:00', dish: '茶叶蛋', line: 'A', method: 'waste', amount: 0.5, receiver: '—', operator: '李四', reason: '破壳损耗', note: '' }, { time: '09:40:10', dish: '豆浆', line: 'A', method: 'reprocess', amount: 1.0, receiver: '后厨 · 孙师傅', operator: '李四', processing: '员工餐再利用', note: '' }, { time: '09:42:00', dish: '鸡蛋饼', line: 'A', method: 'cabinet', amount: 0.5, cabinetId: 'SCG-01-03', operator: '李四', note: '保鲜盒存储' }] } }
|
||||
{ type: 'dispose', time: '09:32:18', title: '余量处置', desc: '本餐次共处置余量 <strong>12.9kg</strong>，操作人 <strong>李四</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }, { cls: 'mh-tl-tag--green', text: '交叉核对正常' }], dispose: { total: 12.9, operator: '李四', methods: [{ key: 'welfare', label: '员工福利', amount: 5.2, count: 3 }, { key: 'donate', label: '捐赠', amount: 4.8, count: 2 }, { key: 'waste', label: '废弃', amount: 1.4, count: 2 }, { key: 'reprocess', label: '加工再利用', amount: 1.0, count: 1 }, { key: 'cabinet', label: '存入智能货柜', amount: 0.5, count: 1 }], records: [{ time: '09:33:10', dish: '油条', line: 'A', method: 'welfare', amount: 2.0, receiver: '员工 · 石维国', operator: '李四', note: '加班餐' }, { time: '09:34:05', dish: '鲜肉包', line: 'B', method: 'welfare', amount: 1.8, receiver: '员工 · 陈小红', operator: '李四', note: '值班餐' }, { time: '09:35:20', dish: '鸡蛋饼', line: 'A', method: 'welfare', amount: 1.4, receiver: '员工 · 赵大鹏', operator: '李四', note: '' }, { time: '09:36:45', dish: '小米粥', line: 'B', method: 'donate', amount: 3.0, receiver: '浐灞社区服务站', operator: '李四', note: '捐赠凭证已上传' }, { time: '09:37:30', dish: '馒头', line: 'B', method: 'donate', amount: 1.8, receiver: '浐灞社区服务站', operator: '李四', note: '' }, { time: '09:38:15', dish: '花卷', line: 'A', method: 'waste', amount: 0.9, receiver: '—', operator: '李四', reason: '临期食品', note: '' }, { time: '09:39:00', dish: '茶叶蛋', line: 'A', method: 'waste', amount: 0.5, receiver: '—', operator: '李四', reason: '破壳损耗', note: '' }, { time: '09:40:10', dish: '豆浆', line: 'A', method: 'reprocess', amount: 1.0, receiver: '后厨 · 孙师傅', operator: '李四', processing: '员工餐再利用', note: '' }, { time: '09:42:00', dish: '鸡蛋饼', line: 'A', method: 'cabinet', amount: 0.5, cabinetId: 'SCG-01-03', operator: '李四', note: '保鲜盒存储' }] } }
|
||||
],
|
||||
footer: { totalOrders: 142, totalRevenue: 1820.00, avgPer: 12.82, surplus: '12.4 kg' }
|
||||
},
|
||||
@@ -1792,7 +1792,7 @@
|
||||
{ type: 'start', time: '17:00:00', title: '开餐', desc: '操作人 <strong>张三 · CS001</strong> 开启<strong>晚餐</strong>餐次，涉及 <strong>24 道菜</strong>', tags: [{ cls: 'mh-tl-tag--green', text: '24 道菜' }], detail: { firstOrder: { time: '17:21:50', line: 'C', customer: '陈*芳', amount: 8.50 }, dishes: [{ name: '宫保鸡丁', line: 'A', serveTime: '17:00:30', maker: '王师傅', operator: '张三', planned: 7.0, sold: 6.3 }, { name: '鱼香肉丝', line: 'A', serveTime: '17:00:45', maker: '王师傅', operator: '张三', planned: 6.5, sold: 5.7 }, { name: '番茄炒蛋', line: 'B', serveTime: '17:00:20', maker: '李师傅', operator: '张三', planned: 6.0, sold: 5.0 }, { name: '白米饭', line: 'A', serveTime: '17:00:10', maker: '赵师傅', operator: '张三', planned: 12.0, sold: 10.5 }, { name: '红烧肉', line: 'A', serveTime: '17:01:00', maker: '王师傅', operator: '张三', planned: 5.5, sold: 4.8 }, { name: '牛肉面', line: 'C', serveTime: '17:00:50', maker: '陈师傅', operator: '张三', planned: 8.0, sold: 6.5 }, { name: '酸辣粉', line: 'C', serveTime: '17:01:10', maker: '陈师傅', operator: '张三', planned: 5.0, sold: 4.2 }, { name: '蛋炒饭', line: 'C', serveTime: '17:00:35', maker: '陈师傅', operator: '张三', planned: 4.5, sold: 3.8 }, { name: '清炒西兰花', line: 'B', serveTime: '17:01:20', maker: '李师傅', operator: '张三', planned: 4.0, sold: 3.2 }, { name: '麻婆豆腐', line: 'B', serveTime: '17:01:30', maker: '李师傅', operator: '张三', planned: 4.0, sold: 3.5 }] } },
|
||||
{ type: 'add', time: '18:15:22', title: '补餐 · 牛肉面', desc: '<strong>牛肉面</strong> 余量降至 0.5kg（预警阈值），后厨补做 <strong>2.5kg</strong>', tags: [{ cls: 'mh-tl-tag--gold', text: '自动预警' }, { cls: 'mh-tl-tag--green', text: '已通知后厨' }], supply: { dish: '牛肉面', line: 'C', dishEmoji: '🍜', triggerLeftover: 0.5, addAmount: 2.5, reason: '自动预警', operator: '张三', status: '已补做' } },
|
||||
{ type: 'close', time: '19:30:00', title: '收餐', desc: '全部餐线收餐完成,进入余量处置流程', tags: [{ cls: 'mh-tl-tag--gray', text: '全部收餐' }], closeDetail: { operator: '张三', closeTime: '19:30:00', method: 'surplus_dispose', methodLabel: '余量处置', orders: 168, revenue: 3850.00, avgPer: 22.92, surplus: '22.6' } },
|
||||
{ type: 'dispose', time: '20:25:10', title: '余量处置', desc: '本餐次共处置余量 <strong>24.1kg</strong>，操作人 <strong>张三</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }], dispose: { total: 24.1, operator: '张三', methods: [{ key: 'welfare', label: '员工福利', amount: 8.0, count: 4 }, { key: 'donate', label: '捐赠', amount: 6.5, count: 3 }, { key: 'waste', label: '废弃', amount: 5.1, count: 4 }, { key: 'reprocess', label: '加工再利用', amount: 3.0, count: 2 }, { key: 'cabinet', label: '存入智能货柜', amount: 1.5, count: 2 }], records: [{ time: '20:26:10', dish: '宫保鸡丁', line: 'A', method: 'welfare', amount: 2.5, receiver: '员工 · 王建国', operator: '张三', note: '加班餐' }, { time: '20:27:00', dish: '鱼香肉丝', line: 'A', method: 'welfare', amount: 2.0, receiver: '员工 · 李小红', operator: '张三', note: '' }, { time: '20:27:50', dish: '白米饭', line: 'A', method: 'welfare', amount: 2.0, receiver: '员工 · 赵大鹏', operator: '张三', note: '' }, { time: '20:28:40', dish: '清炒西兰花', line: 'B', method: 'donate', amount: 2.5, receiver: '浐灞社区服务站', operator: '李四', note: '捐赠凭证已上传' }, { time: '20:29:15', dish: '番茄炒蛋', line: 'B', method: 'donate', amount: 2.2, receiver: '浐灞社区服务站', operator: '李四', note: '' }, { time: '20:29:50', dish: '麻婆豆腐', line: 'B', method: 'donate', amount: 1.8, receiver: '爱心食堂', operator: '李四', note: '' }, { time: '20:30:05', dish: '酸辣粉', line: 'C', method: 'waste', amount: 2.1, receiver: '—', operator: '张三', reason: '临期食品', note: '' }, { time: '20:30:40', dish: '蛋炒饭', line: 'C', method: 'waste', amount: 1.5, receiver: '—', operator: '张三', reason: '剩余变质', note: '' }, { time: '20:31:10', dish: '红烧肉', line: 'A', method: 'waste', amount: 0.8, receiver: '—', operator: '张三', reason: '过夜损耗', note: '' }, { time: '20:31:45', dish: '牛肉面', line: 'C', method: 'waste', amount: 0.7, receiver: '—', operator: '张三', reason: '剩余变质', note: '' }, { time: '20:32:30', dish: '番茄炒蛋', line: 'B', method: 'reprocess', amount: 1.5, receiver: '后厨 · 李师傅', operator: '李四', processing: '次日员工餐', note: '' }, { time: '20:33:10', dish: '白米饭', line: 'A', method: 'reprocess', amount: 1.5, receiver: '后厨 · 赵师傅', operator: '张三', processing: '员工餐再利用', note: '' }, { time: '20:34:00', dish: '鱼香肉丝', line: 'A', method: 'welfare', amount: 1.5, receiver: '员工 · 张伟', operator: '张三', note: '' }, { time: '20:35:00', dish: '宫保鸡丁', line: 'A', method: 'cabinet', amount: 1.0, cabinetId: 'SCG-02-05', operator: '张三', note: '次日复热' }, { time: '20:35:40', dish: '鱼香肉丝', line: 'A', method: 'cabinet', amount: 0.5, cabinetId: 'SCG-02-06', operator: '张三', note: '' }] } }
|
||||
{ type: 'dispose', time: '20:25:10', title: '余量处置', desc: '本餐次共处置余量 <strong>24.1kg</strong>，操作人 <strong>张三</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }], dispose: { total: 24.1, operator: '张三', methods: [{ key: 'welfare', label: '员工福利', amount: 8.0, count: 4 }, { key: 'donate', label: '捐赠', amount: 6.5, count: 3 }, { key: 'waste', label: '废弃', amount: 5.1, count: 4 }, { key: 'reprocess', label: '加工再利用', amount: 3.0, count: 2 }, { key: 'cabinet', label: '存入智能货柜', amount: 1.5, count: 2 }], records: [{ time: '20:26:10', dish: '宫保鸡丁', line: 'A', method: 'welfare', amount: 2.5, receiver: '员工 · 石维国', operator: '张三', note: '加班餐' }, { time: '20:27:00', dish: '鱼香肉丝', line: 'A', method: 'welfare', amount: 2.0, receiver: '员工 · 李小红', operator: '张三', note: '' }, { time: '20:27:50', dish: '白米饭', line: 'A', method: 'welfare', amount: 2.0, receiver: '员工 · 赵大鹏', operator: '张三', note: '' }, { time: '20:28:40', dish: '清炒西兰花', line: 'B', method: 'donate', amount: 2.5, receiver: '浐灞社区服务站', operator: '李四', note: '捐赠凭证已上传' }, { time: '20:29:15', dish: '番茄炒蛋', line: 'B', method: 'donate', amount: 2.2, receiver: '浐灞社区服务站', operator: '李四', note: '' }, { time: '20:29:50', dish: '麻婆豆腐', line: 'B', method: 'donate', amount: 1.8, receiver: '爱心食堂', operator: '李四', note: '' }, { time: '20:30:05', dish: '酸辣粉', line: 'C', method: 'waste', amount: 2.1, receiver: '—', operator: '张三', reason: '临期食品', note: '' }, { time: '20:30:40', dish: '蛋炒饭', line: 'C', method: 'waste', amount: 1.5, receiver: '—', operator: '张三', reason: '剩余变质', note: '' }, { time: '20:31:10', dish: '红烧肉', line: 'A', method: 'waste', amount: 0.8, receiver: '—', operator: '张三', reason: '过夜损耗', note: '' }, { time: '20:31:45', dish: '牛肉面', line: 'C', method: 'waste', amount: 0.7, receiver: '—', operator: '张三', reason: '剩余变质', note: '' }, { time: '20:32:30', dish: '番茄炒蛋', line: 'B', method: 'reprocess', amount: 1.5, receiver: '后厨 · 李师傅', operator: '李四', processing: '次日员工餐', note: '' }, { time: '20:33:10', dish: '白米饭', line: 'A', method: 'reprocess', amount: 1.5, receiver: '后厨 · 赵师傅', operator: '张三', processing: '员工餐再利用', note: '' }, { time: '20:34:00', dish: '鱼香肉丝', line: 'A', method: 'welfare', amount: 1.5, receiver: '员工 · 张伟', operator: '张三', note: '' }, { time: '20:35:00', dish: '宫保鸡丁', line: 'A', method: 'cabinet', amount: 1.0, cabinetId: 'SCG-02-05', operator: '张三', note: '次日复热' }, { time: '20:35:40', dish: '鱼香肉丝', line: 'A', method: 'cabinet', amount: 0.5, cabinetId: 'SCG-02-06', operator: '张三', note: '' }] } }
|
||||
],
|
||||
footer: { totalOrders: 168, totalRevenue: 3850.00, avgPer: 22.92, surplus: '22.6 kg' }
|
||||
},
|
||||
@@ -1804,7 +1804,7 @@
|
||||
nodes: [
|
||||
{ type: 'start', time: '11:00:00', title: '开餐', desc: '操作人 <strong>李四 · CS002</strong> 开启<strong>午餐</strong>餐次，涉及 <strong>28 道菜</strong>', tags: [{ cls: 'mh-tl-tag--green', text: '28 道菜' }], detail: { firstOrder: { time: '11:25:10', line: 'A', customer: '刘*华', amount: 32.50 }, dishes: [{ name: '宫保鸡丁', line: 'A', serveTime: '11:00:30', maker: '王师傅', operator: '李四', planned: 8.0, sold: 7.5 }, { name: '糖醋排骨', line: 'A', serveTime: '11:00:50', maker: '王师傅', operator: '李四', planned: 6.0, sold: 5.2 }, { name: '红烧狮子头', line: 'B', serveTime: '11:01:10', maker: '李师傅', operator: '李四', planned: 5.0, sold: 4.3 }, { name: '番茄炒蛋', line: 'B', serveTime: '11:00:40', maker: '李师傅', operator: '李四', planned: 7.0, sold: 6.0 }, { name: '白米饭', line: 'A', serveTime: '11:00:15', maker: '赵师傅', operator: '李四', planned: 14.0, sold: 12.0 }, { name: '葱爆羊肉', line: 'C', serveTime: '11:01:25', maker: '陈师傅', operator: '李四', planned: 4.5, sold: 3.8 }, { name: '蚝油生菜', line: 'C', serveTime: '11:01:40', maker: '陈师傅', operator: '李四', planned: 3.5, sold: 2.9 }, { name: '辣子鸡', line: 'C', serveTime: '11:02:00', maker: '陈师傅', operator: '李四', planned: 5.0, sold: 4.1 }, { name: '麻婆豆腐', line: 'B', serveTime: '11:01:55', maker: '李师傅', operator: '李四', planned: 4.0, sold: 3.4 }, { name: '紫菜蛋花汤', line: 'A', serveTime: '11:00:20', maker: '王师傅', operator: '李四', planned: 8.0, sold: 7.0 }] } },
|
||||
{ type: 'close', time: '14:05:20', title: '收餐', desc: '全部餐线收餐完成,进入余量处置流程', tags: [{ cls: 'mh-tl-tag--gray', text: '全部收餐' }], closeDetail: { operator: '李四', closeTime: '14:05:20', method: 'surplus_dispose', methodLabel: '余量处置', orders: 132, revenue: 3050.00, avgPer: 23.10, surplus: '28.6' } },
|
||||
{ type: 'dispose', time: '14:28:42', title: '余量处置', desc: '本餐次共处置余量 <strong>30.6kg</strong>，操作人 <strong>李四</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }, { cls: 'mh-tl-tag--green', text: '交叉核对正常' }], dispose: { total: 30.6, operator: '李四', methods: [{ key: 'welfare', label: '员工福利', amount: 10.0, count: 5 }, { key: 'donate', label: '捐赠', amount: 8.5, count: 3 }, { key: 'waste', label: '废弃', amount: 6.6, count: 4 }, { key: 'reprocess', label: '加工再利用', amount: 3.5, count: 2 }, { key: 'cabinet', label: '存入智能货柜', amount: 2.0, count: 2 }], records: [{ time: '14:29:10', dish: '宫保鸡丁', line: 'A', method: 'welfare', amount: 3.0, receiver: '员工 · 王建国', operator: '李四', note: '加班餐' }, { time: '14:29:50', dish: '糖醋排骨', line: 'A', method: 'welfare', amount: 2.5, receiver: '员工 · 陈小红', operator: '李四', note: '' }, { time: '14:30:30', dish: '番茄炒蛋', line: 'B', method: 'welfare', amount: 2.0, receiver: '员工 · 赵大鹏', operator: '李四', note: '' }, { time: '14:31:10', dish: '白米饭', line: 'A', method: 'welfare', amount: 1.5, receiver: '员工 · 张伟', operator: '李四', note: '' }, { time: '14:32:00', dish: '麻婆豆腐', line: 'B', method: 'welfare', amount: 1.0, receiver: '员工 · 刘洋', operator: '李四', note: '' }, { time: '14:33:20', dish: '红烧狮子头', line: 'B', method: 'donate', amount: 3.5, receiver: '浐灞社区服务站', operator: '李四', note: '捐赠凭证已上传' }, { time: '14:34:00', dish: '辣子鸡', line: 'C', method: 'donate', amount: 3.0, receiver: '爱心食堂', operator: '李四', note: '' }, { time: '14:34:40', dish: '蚝油生菜', line: 'C', method: 'donate', amount: 2.0, receiver: '爱心食堂', operator: '李四', note: '' }, { time: '14:35:30', dish: '葱爆羊肉', line: 'C', method: 'waste', amount: 2.5, receiver: '—', operator: '李四', reason: '临期食品', note: '' }, { time: '14:36:10', dish: '紫菜蛋花汤', line: 'A', method: 'waste', amount: 2.1, receiver: '—', operator: '李四', reason: '剩余变质', note: '' }, { time: '14:36:50', dish: '白米饭', line: 'A', method: 'waste', amount: 1.2, receiver: '—', operator: '李四', reason: '剩余变质', note: '' }, { time: '14:37:30', dish: '番茄炒蛋', line: 'B', method: 'waste', amount: 0.8, receiver: '—', operator: '李四', reason: '外观不佳', note: '' }, { time: '14:38:20', dish: '白米饭', line: 'A', method: 'reprocess', amount: 2.0, receiver: '后厨 · 赵师傅', operator: '李四', processing: '员工餐', note: '' }, { time: '14:39:00', dish: '宫保鸡丁', line: 'A', method: 'reprocess', amount: 1.5, receiver: '后厨 · 王师傅', operator: '李四', processing: '员工餐再利用', note: '' }, { time: '14:40:00', dish: '紫菜蛋花汤', line: 'A', method: 'cabinet', amount: 1.2, cabinetId: 'SCG-01-08', operator: '李四', note: '冷藏保存' }, { time: '14:40:30', dish: '麻婆豆腐', line: 'B', method: 'cabinet', amount: 0.8, cabinetId: 'SCG-01-09', operator: '李四', note: '' }] } }
|
||||
{ type: 'dispose', time: '14:28:42', title: '余量处置', desc: '本餐次共处置余量 <strong>30.6kg</strong>，操作人 <strong>李四</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }, { cls: 'mh-tl-tag--green', text: '交叉核对正常' }], dispose: { total: 30.6, operator: '李四', methods: [{ key: 'welfare', label: '员工福利', amount: 10.0, count: 5 }, { key: 'donate', label: '捐赠', amount: 8.5, count: 3 }, { key: 'waste', label: '废弃', amount: 6.6, count: 4 }, { key: 'reprocess', label: '加工再利用', amount: 3.5, count: 2 }, { key: 'cabinet', label: '存入智能货柜', amount: 2.0, count: 2 }], records: [{ time: '14:29:10', dish: '宫保鸡丁', line: 'A', method: 'welfare', amount: 3.0, receiver: '员工 · 石维国', operator: '李四', note: '加班餐' }, { time: '14:29:50', dish: '糖醋排骨', line: 'A', method: 'welfare', amount: 2.5, receiver: '员工 · 陈小红', operator: '李四', note: '' }, { time: '14:30:30', dish: '番茄炒蛋', line: 'B', method: 'welfare', amount: 2.0, receiver: '员工 · 赵大鹏', operator: '李四', note: '' }, { time: '14:31:10', dish: '白米饭', line: 'A', method: 'welfare', amount: 1.5, receiver: '员工 · 张伟', operator: '李四', note: '' }, { time: '14:32:00', dish: '麻婆豆腐', line: 'B', method: 'welfare', amount: 1.0, receiver: '员工 · 刘洋', operator: '李四', note: '' }, { time: '14:33:20', dish: '红烧狮子头', line: 'B', method: 'donate', amount: 3.5, receiver: '浐灞社区服务站', operator: '李四', note: '捐赠凭证已上传' }, { time: '14:34:00', dish: '辣子鸡', line: 'C', method: 'donate', amount: 3.0, receiver: '爱心食堂', operator: '李四', note: '' }, { time: '14:34:40', dish: '蚝油生菜', line: 'C', method: 'donate', amount: 2.0, receiver: '爱心食堂', operator: '李四', note: '' }, { time: '14:35:30', dish: '葱爆羊肉', line: 'C', method: 'waste', amount: 2.5, receiver: '—', operator: '李四', reason: '临期食品', note: '' }, { time: '14:36:10', dish: '紫菜蛋花汤', line: 'A', method: 'waste', amount: 2.1, receiver: '—', operator: '李四', reason: '剩余变质', note: '' }, { time: '14:36:50', dish: '白米饭', line: 'A', method: 'waste', amount: 1.2, receiver: '—', operator: '李四', reason: '剩余变质', note: '' }, { time: '14:37:30', dish: '番茄炒蛋', line: 'B', method: 'waste', amount: 0.8, receiver: '—', operator: '李四', reason: '外观不佳', note: '' }, { time: '14:38:20', dish: '白米饭', line: 'A', method: 'reprocess', amount: 2.0, receiver: '后厨 · 赵师傅', operator: '李四', processing: '员工餐', note: '' }, { time: '14:39:00', dish: '宫保鸡丁', line: 'A', method: 'reprocess', amount: 1.5, receiver: '后厨 · 王师傅', operator: '李四', processing: '员工餐再利用', note: '' }, { time: '14:40:00', dish: '紫菜蛋花汤', line: 'A', method: 'cabinet', amount: 1.2, cabinetId: 'SCG-01-08', operator: '李四', note: '冷藏保存' }, { time: '14:40:30', dish: '麻婆豆腐', line: 'B', method: 'cabinet', amount: 0.8, cabinetId: 'SCG-01-09', operator: '李四', note: '' }] } }
|
||||
],
|
||||
footer: { totalOrders: 132, totalRevenue: 3050.00, avgPer: 23.10, surplus: '28.6 kg' }
|
||||
},
|
||||
@@ -1816,7 +1816,7 @@
|
||||
nodes: [
|
||||
{ type: 'start', time: '06:30:00', title: '开餐', desc: '操作人 <strong>王五 · CS003</strong> 开启<strong>早餐</strong>餐次，涉及 <strong>12 道菜</strong>', tags: [{ cls: 'mh-tl-tag--green', text: '12 道菜' }], detail: { dishes: [{ name: '豆浆', line: 'A', serveTime: '06:30:10', maker: '孙师傅', operator: '王五', planned: 6.0, sold: 5.2 }, { name: '油条', line: 'A', serveTime: '06:30:25', maker: '孙师傅', operator: '王五', planned: 4.0, sold: 3.5 }, { name: '鲜肉包', line: 'B', serveTime: '06:30:05', maker: '周师傅', operator: '王五', planned: 5.0, sold: 4.2 }, { name: '鸡蛋饼', line: 'A', serveTime: '06:30:40', maker: '孙师傅', operator: '王五', planned: 3.5, sold: 2.8 }, { name: '小米粥', line: 'B', serveTime: '06:30:15', maker: '周师傅', operator: '王五', planned: 5.0, sold: 4.5 }, { name: '馒头', line: 'B', serveTime: '06:30:30', maker: '周师傅', operator: '王五', planned: 4.0, sold: 3.3 }, { name: '花卷', line: 'A', serveTime: '06:30:50', maker: '孙师傅', operator: '王五', planned: 3.0, sold: 2.4 }, { name: '茶叶蛋', line: 'A', serveTime: '06:30:08', maker: '孙师傅', operator: '王五', planned: 3.5, sold: 2.9 }] } },
|
||||
{ type: 'close', time: '09:18:00', title: '收餐', desc: '全部餐线收餐完成,进入员工餐时段', tags: [{ cls: 'mh-tl-tag--gray', text: '全部收餐' }], closeDetail: { operator: '王五', closeTime: '09:18:00', method: 'staff_meal', methodLabel: '进入员工餐时段', orders: 98, revenue: 1250.00, avgPer: 12.76, surplus: '8.4' } },
|
||||
{ type: 'dispose', time: '09:35:24', title: '余量处置', desc: '本餐次共处置余量 <strong>9.0kg</strong>，操作人 <strong>王五</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }], dispose: { total: 9.0, operator: '王五', methods: [{ key: 'welfare', label: '员工福利', amount: 4.0, count: 2 }, { key: 'donate', label: '捐赠', amount: 2.4, count: 2 }, { key: 'waste', label: '废弃', amount: 1.0, count: 2 }, { key: 'reprocess', label: '加工再利用', amount: 1.0, count: 1 }, { key: 'cabinet', label: '存入智能货柜', amount: 0.6, count: 1 }], records: [{ time: '09:36:10', dish: '豆浆', line: 'A', method: 'welfare', amount: 2.5, receiver: '员工 · 王建国', operator: '王五', note: '加班餐' }, { time: '09:37:00', dish: '鲜肉包', line: 'B', method: 'welfare', amount: 1.5, receiver: '员工 · 陈小红', operator: '王五', note: '' }, { time: '09:38:20', dish: '小米粥', line: 'B', method: 'donate', amount: 1.5, receiver: '浐灞社区服务站', operator: '王五', note: '捐赠凭证已上传' }, { time: '09:39:00', dish: '馒头', line: 'B', method: 'donate', amount: 0.9, receiver: '浐灞社区服务站', operator: '王五', note: '' }, { time: '09:40:10', dish: '油条', line: 'A', method: 'waste', amount: 0.6, receiver: '—', operator: '王五', reason: '临期', note: '' }, { time: '09:40:50', dish: '花卷', line: 'A', method: 'waste', amount: 0.4, receiver: '—', operator: '王五', reason: '剩余变质', note: '' }, { time: '09:41:30', dish: '鸡蛋饼', line: 'A', method: 'reprocess', amount: 1.0, receiver: '后厨 · 孙师傅', operator: '王五', processing: '员工餐', note: '' }, { time: '09:42:00', dish: '豆浆', line: 'A', method: 'cabinet', amount: 0.6, cabinetId: 'SCG-01-02', operator: '王五', note: '保鲜存储' }] } }
|
||||
{ type: 'dispose', time: '09:35:24', title: '余量处置', desc: '本餐次共处置余量 <strong>9.0kg</strong>，操作人 <strong>王五</strong>', tags: [{ cls: 'mh-tl-tag--purple', text: '处置完成' }], dispose: { total: 9.0, operator: '王五', methods: [{ key: 'welfare', label: '员工福利', amount: 4.0, count: 2 }, { key: 'donate', label: '捐赠', amount: 2.4, count: 2 }, { key: 'waste', label: '废弃', amount: 1.0, count: 2 }, { key: 'reprocess', label: '加工再利用', amount: 1.0, count: 1 }, { key: 'cabinet', label: '存入智能货柜', amount: 0.6, count: 1 }], records: [{ time: '09:36:10', dish: '豆浆', line: 'A', method: 'welfare', amount: 2.5, receiver: '员工 · 石维国', operator: '王五', note: '加班餐' }, { time: '09:37:00', dish: '鲜肉包', line: 'B', method: 'welfare', amount: 1.5, receiver: '员工 · 陈小红', operator: '王五', note: '' }, { time: '09:38:20', dish: '小米粥', line: 'B', method: 'donate', amount: 1.5, receiver: '浐灞社区服务站', operator: '王五', note: '捐赠凭证已上传' }, { time: '09:39:00', dish: '馒头', line: 'B', method: 'donate', amount: 0.9, receiver: '浐灞社区服务站', operator: '王五', note: '' }, { time: '09:40:10', dish: '油条', line: 'A', method: 'waste', amount: 0.6, receiver: '—', operator: '王五', reason: '临期', note: '' }, { time: '09:40:50', dish: '花卷', line: 'A', method: 'waste', amount: 0.4, receiver: '—', operator: '王五', reason: '剩余变质', note: '' }, { time: '09:41:30', dish: '鸡蛋饼', line: 'A', method: 'reprocess', amount: 1.0, receiver: '后厨 · 孙师傅', operator: '王五', processing: '员工餐', note: '' }, { time: '09:42:00', dish: '豆浆', line: 'A', method: 'cabinet', amount: 0.6, cabinetId: 'SCG-01-02', operator: '王五', note: '保鲜存储' }] } }
|
||||
],
|
||||
footer: { totalOrders: 98, totalRevenue: 1250.00, avgPer: 12.76, surplus: '8.4 kg' }
|
||||
}
|
||||
|
||||
@@ -2098,10 +2098,10 @@
|
||||
<div class="vc-card__meta"><span>值班负责人：<b>王建华</b></span></div>
|
||||
<span class="vc-card__check"><svg viewBox="0 0 12 12" fill="none"><path d="M2.5 6.2l2.3 2.3L9.5 3.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg></span>
|
||||
</div>
|
||||
<!-- 长庆油田应急中心 · 忙碌 -->
|
||||
<div class="vc-card" data-name="长庆油田应急中心" data-online="1" data-busy="1" onclick="toggleVcCard(this)">
|
||||
<!-- CQ油田应急中心 · 忙碌 -->
|
||||
<div class="vc-card" data-name="CQ油田应急中心" data-online="1" data-busy="1" onclick="toggleVcCard(this)">
|
||||
<div class="vc-card__row">
|
||||
<span class="vc-card__name">长庆油田应急中心</span>
|
||||
<span class="vc-card__name">CQ油田应急中心</span>
|
||||
<span class="vc-card__status vc-card__status--busy"><span class="vc-card__dot vc-card__dot--busy"></span>忙碌</span>
|
||||
</div>
|
||||
<div class="vc-card__meta"><span>值班负责人：<b>赵明</b></span></div>
|
||||
|
||||
@@ -2007,7 +2007,7 @@
|
||||
<div class="clinic-item">
|
||||
<div class="clinic-item__header">
|
||||
<div class="clinic-item__icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 21h18M5 21V7l8-4v18M19 21V11l-6-4"/><path d="M9 9v.01M9 12v.01M9 15v.01M9 18v.01"/></svg></div>
|
||||
<span class="clinic-item__name">长庆油田第一医疗点</span> </div>
|
||||
<span class="clinic-item__name">CQ油田第一医疗点</span> </div>
|
||||
<div class="clinic-item__metrics">
|
||||
<div class="clinic-item__metric clinic-item__metric--primary"><span class="clinic-item__metric-label">慢病服务</span><span class="clinic-item__metric-val">248<i>人</i></span></div>
|
||||
<div class="clinic-item__metric clinic-item__metric--success"><span class="clinic-item__metric-label">就诊次数</span><span class="clinic-item__metric-val">432<i>次</i></span></div>
|
||||
@@ -2068,7 +2068,7 @@
|
||||
<div class="clinic-item">
|
||||
<div class="clinic-item__header">
|
||||
<div class="clinic-item__icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 21h18M5 21V7l8-4v18M19 21V11l-6-4"/><path d="M9 9v.01M9 12v.01M9 15v.01M9 18v.01"/></svg></div>
|
||||
<span class="clinic-item__name">长庆油田第一医疗点</span> </div>
|
||||
<span class="clinic-item__name">CQ油田第一医疗点</span> </div>
|
||||
<div class="clinic-item__metrics">
|
||||
<div class="clinic-item__metric clinic-item__metric--primary"><span class="clinic-item__metric-label">慢病服务</span><span class="clinic-item__metric-val">248<i>人</i></span></div>
|
||||
<div class="clinic-item__metric clinic-item__metric--success"><span class="clinic-item__metric-label">就诊次数</span><span class="clinic-item__metric-val">432<i>次</i></span></div>
|
||||
@@ -2455,10 +2455,10 @@
|
||||
<div class="vc-card__meta"><span>中心电话：<b>0912-3623 0101</b></span></div>
|
||||
<span class="vc-card__check"><svg viewBox="0 0 12 12" fill="none"><path d="M2.5 6.2l2.3 2.3L9.5 3.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg></span>
|
||||
</div>
|
||||
<!-- 长庆油田应急中心 · 忙碌 -->
|
||||
<div class="vc-card" data-name="长庆油田应急中心" data-online="1" data-busy="1" onclick="toggleVcCard(this)">
|
||||
<!-- CQ油田应急中心 · 忙碌 -->
|
||||
<div class="vc-card" data-name="CQ油田应急中心" data-online="1" data-busy="1" onclick="toggleVcCard(this)">
|
||||
<div class="vc-card__row">
|
||||
<span class="vc-card__name">长庆油田应急中心</span>
|
||||
<span class="vc-card__name">CQ油田应急中心</span>
|
||||
<span class="vc-card__status vc-card__status--busy"><span class="vc-card__dot vc-card__dot--busy"></span>忙碌</span>
|
||||
</div>
|
||||
<div class="vc-card__meta"><span>负责人：<b>赵明</b></span></div>
|
||||
@@ -3868,7 +3868,7 @@ function switchConsultPeriod(period){
|
||||
var CLINIC_ICON = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 21h18M5 21V7l8-4v18M19 21V11l-6-4"/><path d="M9 9v.01M9 12v.01M9 15v.01M9 18v.01"/></svg>';
|
||||
var CLINIC_DATA = {
|
||||
week: [
|
||||
{name:'长庆油田第一医疗点', chronic:248, visit:432, follow:156},
|
||||
{name:'CQ油田第一医疗点', chronic:248, visit:432, follow:156},
|
||||
{name:'采油二厂矿区医疗点', chronic:176, visit:298, follow:112},
|
||||
{name:'姬塬采油厂前线医疗点', chronic:132, visit:215, follow:87},
|
||||
{name:'靖边气田作业区医疗点', chronic:98, visit:164, follow:63},
|
||||
@@ -3876,7 +3876,7 @@ var CLINIC_DATA = {
|
||||
{name:'庆阳基地综合医疗点', chronic:61, visit:96, follow:38}
|
||||
],
|
||||
month: [
|
||||
{name:'长庆油田第一医疗点', chronic:986, visit:1680, follow:612},
|
||||
{name:'CQ油田第一医疗点', chronic:986, visit:1680, follow:612},
|
||||
{name:'采油二厂矿区医疗点', chronic:712, visit:1185, follow:438},
|
||||
{name:'姬塬采油厂前线医疗点', chronic:524, visit:862, follow:341},
|
||||
{name:'靖边气田作业区医疗点', chronic:386, visit:652, follow:248},
|
||||
@@ -3884,7 +3884,7 @@ var CLINIC_DATA = {
|
||||
{name:'庆阳基地综合医疗点', chronic:243, visit:386, follow:151}
|
||||
],
|
||||
year: [
|
||||
{name:'长庆油田第一医疗点', chronic:11832, visit:20160, follow:7344},
|
||||
{name:'CQ油田第一医疗点', chronic:11832, visit:20160, follow:7344},
|
||||
{name:'采油二厂矿区医疗点', chronic:8544, visit:14220, follow:5256},
|
||||
{name:'姬塬采油厂前线医疗点', chronic:6288, visit:10344, follow:4092},
|
||||
{name:'靖边气田作业区医疗点', chronic:4632, visit:7824, follow:2976},
|
||||
@@ -5623,25 +5623,25 @@ function resetWeightDetailFilter(){
|
||||
|
||||
/* ========== 咨询记录弹窗 ========== */
|
||||
var CONSULT_RECORD_DATA = [
|
||||
{name:'张建国',empId:'CY-2021-0837',unit:'采油一厂',dept:'生产区',consultType:'图文咨询',consultStatus:'已完成',expertName:'王明辉',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-30 09:15:22',consultEndTime:'2026-06-30 09:32:18'},
|
||||
{name:'张建国',empId:'CY-2021-0837',unit:'采油一厂',dept:'生产区',consultType:'图文咨询',consultStatus:'已完成',expertName:'王明辉',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-30 09:15:22',consultEndTime:'2026-06-30 09:32:18'},
|
||||
{name:'李明辉',empId:'CY-2019-0512',unit:'采油一厂',dept:'设备区',consultType:'视频咨询',consultStatus:'已完成',expertName:'赵丽华',expertHospital:'西安交大一附院',consultStartTime:'2026-06-30 08:42:10',consultEndTime:'2026-06-30 09:05:44'},
|
||||
{name:'王芳',empId:'GS-2020-0128',unit:'公司机关',dept:'办公楼',consultType:'图文咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-29 14:30:05',consultEndTime:'2026-06-29 14:48:33'},
|
||||
{name:'王芳',empId:'GS-2020-0128',unit:'公司机关',dept:'办公楼',consultType:'图文咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-29 14:30:05',consultEndTime:'2026-06-29 14:48:33'},
|
||||
{name:'刘雪梅',empId:'CY-2020-0442',unit:'采油二厂',dept:'行政楼',consultType:'电话咨询',consultStatus:'已完成',expertName:'张晓燕',expertHospital:'陕西省人民医院',consultStartTime:'2026-06-29 11:20:18',consultEndTime:'2026-06-29 11:35:42'},
|
||||
{name:'赵刚',empId:'CY-2022-0305',unit:'采油三厂',dept:'调度室',consultType:'视频咨询',consultStatus:'进行中',expertName:'王明辉',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-29 10:05:33',consultEndTime:'--'},
|
||||
{name:'赵刚',empId:'CY-2022-0305',unit:'采油三厂',dept:'调度室',consultType:'视频咨询',consultStatus:'进行中',expertName:'王明辉',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-29 10:05:33',consultEndTime:'--'},
|
||||
{name:'杨丽娟',empId:'CY-2022-0156',unit:'采油三厂',dept:'行政楼',consultType:'图文咨询',consultStatus:'已完成',expertName:'李志强',expertHospital:'西安交大二附院',consultStartTime:'2026-06-28 16:42:51',consultEndTime:'2026-06-28 16:58:12'},
|
||||
{name:'孙志强',empId:'GL-2019-0215',unit:'采油四厂',dept:'生产区',consultType:'电话咨询',consultStatus:'已完成',expertName:'王明辉',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-28 15:10:27',consultEndTime:'2026-06-28 15:22:08'},
|
||||
{name:'孙志强',empId:'GL-2019-0215',unit:'采油四厂',dept:'生产区',consultType:'电话咨询',consultStatus:'已完成',expertName:'王明辉',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-28 15:10:27',consultEndTime:'2026-06-28 15:22:08'},
|
||||
{name:'许建平',empId:'GL-2018-0589',unit:'采油四厂',dept:'生产区',consultType:'视频咨询',consultStatus:'已取消',expertName:'赵丽华',expertHospital:'西安交大一附院',consultStartTime:'2026-06-28 14:00:00',consultEndTime:'--'},
|
||||
{name:'周丽华',empId:'BH-2019-0521',unit:'采气一厂',dept:'行政楼',consultType:'图文咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-27 09:35:44',consultEndTime:'2026-06-27 09:52:15'},
|
||||
{name:'周丽华',empId:'BH-2019-0521',unit:'采气一厂',dept:'行政楼',consultType:'图文咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-27 09:35:44',consultEndTime:'2026-06-27 09:52:15'},
|
||||
{name:'吴永强',empId:'QY-2018-0193',unit:'采油五厂',dept:'调度室',consultType:'电话咨询',consultStatus:'已完成',expertName:'张晓燕',expertHospital:'陕西省人民医院',consultStartTime:'2026-06-27 08:18:30',consultEndTime:'2026-06-27 08:30:55'},
|
||||
{name:'韩雪',empId:'GS-2021-0533',unit:'公司机关',dept:'办公楼',consultType:'图文咨询',consultStatus:'已完成',expertName:'李志强',expertHospital:'西安交大二附院',consultStartTime:'2026-06-26 13:22:11',consultEndTime:'2026-06-26 13:38:40'},
|
||||
{name:'马国强',empId:'GS-2017-0388',unit:'公司机关',dept:'办公楼',consultType:'视频咨询',consultStatus:'进行中',expertName:'王明辉',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-26 10:50:33',consultEndTime:'--'},
|
||||
{name:'马国强',empId:'GS-2017-0388',unit:'公司机关',dept:'办公楼',consultType:'视频咨询',consultStatus:'进行中',expertName:'王明辉',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-26 10:50:33',consultEndTime:'--'},
|
||||
{name:'陈晓东',empId:'CY-2018-0678',unit:'采油一厂',dept:'维修队',consultType:'电话咨询',consultStatus:'已完成',expertName:'赵丽华',expertHospital:'西安交大一附院',consultStartTime:'2026-06-26 09:15:42',consultEndTime:'2026-06-26 09:28:10'},
|
||||
{name:'郑海龙',empId:'CY-2021-0923',unit:'采油一厂',dept:'生产区',consultType:'图文咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-25 15:40:18',consultEndTime:'2026-06-25 15:55:36'},
|
||||
{name:'郑海龙',empId:'CY-2021-0923',unit:'采油一厂',dept:'生产区',consultType:'图文咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-25 15:40:18',consultEndTime:'2026-06-25 15:55:36'},
|
||||
{name:'冯国强',empId:'CY-2018-0814',unit:'采油三厂',dept:'维修队',consultType:'电话咨询',consultStatus:'已完成',expertName:'张晓燕',expertHospital:'陕西省人民医院',consultStartTime:'2026-06-25 11:05:22',consultEndTime:'2026-06-25 11:18:45'},
|
||||
{name:'曹敏',empId:'CY-2023-0045',unit:'采油一厂',dept:'生产区',consultType:'视频咨询',consultStatus:'已完成',expertName:'李志强',expertHospital:'西安交大二附院',consultStartTime:'2026-06-25 08:30:00',consultEndTime:'2026-06-25 08:52:14'},
|
||||
{name:'范德彪',empId:'CY-2017-0456',unit:'采油一厂',dept:'维修队',consultType:'图文咨询',consultStatus:'已完成',expertName:'王明辉',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-24 14:20:35',consultEndTime:'2026-06-24 14:38:50'},
|
||||
{name:'范德彪',empId:'CY-2017-0456',unit:'采油一厂',dept:'维修队',consultType:'图文咨询',consultStatus:'已完成',expertName:'王明辉',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-24 14:20:35',consultEndTime:'2026-06-24 14:38:50'},
|
||||
{name:'卢芳',empId:'CY-2021-0789',unit:'采油二厂',dept:'行政楼',consultType:'电话咨询',consultStatus:'已完成',expertName:'赵丽华',expertHospital:'西安交大一附院',consultStartTime:'2026-06-24 10:12:08',consultEndTime:'2026-06-24 10:25:30'},
|
||||
{name:'石磊',empId:'CY-2020-0390',unit:'采油三厂',dept:'调度室',consultType:'视频咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'长庆油田总医院',consultStartTime:'2026-06-24 09:00:22',consultEndTime:'2026-06-24 09:20:15'},
|
||||
{name:'石磊',empId:'CY-2020-0390',unit:'采油三厂',dept:'调度室',consultType:'视频咨询',consultStatus:'已完成',expertName:'陈建国',expertHospital:'CQ油田总医院',consultStartTime:'2026-06-24 09:00:22',consultEndTime:'2026-06-24 09:20:15'},
|
||||
{name:'董志远',empId:'QY-2020-0182',unit:'采油五厂',dept:'设备区',consultType:'图文咨询',consultStatus:'进行中',expertName:'张晓燕',expertHospital:'陕西省人民医院',consultStartTime:'2026-06-30 10:30:00',consultEndTime:'--'}
|
||||
];
|
||||
|
||||
|
||||
@@ -2418,10 +2418,10 @@
|
||||
<div class="vc-card__meta"><span>中心电话：<b>0912-3623 0101</b></span></div>
|
||||
<span class="vc-card__check"><svg viewBox="0 0 12 12" fill="none"><path d="M2.5 6.2l2.3 2.3L9.5 3.5" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/></svg></span>
|
||||
</div>
|
||||
<!-- 长庆油田应急中心 · 忙碌 -->
|
||||
<div class="vc-card" data-name="长庆油田应急中心" data-online="1" data-busy="1" onclick="toggleVcCard(this)">
|
||||
<!-- CQ油田应急中心 · 忙碌 -->
|
||||
<div class="vc-card" data-name="CQ油田应急中心" data-online="1" data-busy="1" onclick="toggleVcCard(this)">
|
||||
<div class="vc-card__row">
|
||||
<span class="vc-card__name">长庆油田应急中心</span>
|
||||
<span class="vc-card__name">CQ油田应急中心</span>
|
||||
<span class="vc-card__status vc-card__status--busy"><span class="vc-card__dot vc-card__dot--busy"></span>忙碌</span>
|
||||
</div>
|
||||
<div class="vc-card__meta"><span>负责人：<b>赵明</b></span></div>
|
||||
|
||||
@@ -0,0 +1,231 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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; }
|
||||
.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; }
|
||||
.call-head__sub { font-size: 12px; color: #969eb0; margin-top: 4px; }
|
||||
.caps { display: inline-block; padding: 3px 14px; border-radius: 14px; font-size: 12px; }
|
||||
.caps--no { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.pill--wait { background: rgba(253,33,33,.08); color: #fd2121; 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; }
|
||||
.sec__title .ops { margin-left: auto; display: flex; gap: 10px; }
|
||||
.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; }
|
||||
.fld--full { grid-column: 1 / -1; }
|
||||
.fld__label { width: 84px; 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; }
|
||||
.radio input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
.counter { text-align: right; font-size: 11px; color: #b7bfcc; margin-top: 4px; }
|
||||
/* 页内弹窗：选择员工（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; }
|
||||
.modal { background: #fff; border-radius: 12px; width: 700px; max-height: 560px; 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; }
|
||||
.search-line { display: flex; gap: 10px; margin-bottom: 14px; }
|
||||
.search-line input { flex: 1; height: 34px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; }
|
||||
.table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.table th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 8px 10px; text-align: center; }
|
||||
.table td { padding: 8px 10px; border-bottom: 1px solid #f0f2f5; text-align: center; color: #333; }
|
||||
.table tr.row { cursor: pointer; }
|
||||
.table tr.row:hover { background: #f2f6ff; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="content">
|
||||
<!-- [交互] 返回床头呼叫列表: bed.html -->
|
||||
<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>
|
||||
<span class="pill--wait">待处理</span>
|
||||
<span class="caps caps--no">未接听</span>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">员工信息
|
||||
<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>
|
||||
</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>
|
||||
</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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：选择员工（700） -->
|
||||
<div class="overlay" id="empModal">
|
||||
<div class="modal">
|
||||
<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="请输入姓名或工号查询">
|
||||
<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 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>
|
||||
<tr class="row" onclick="pickEmp(this)"><td>尚卫国</td><td>男</td><td>50</td><td>1049872</td><td>采油一大队</td><td>一号中心站</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('empModal')">取 消</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
// 选中员工：回填员工信息区并收起弹窗
|
||||
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>';
|
||||
closeModal('empModal');
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,197 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
/* 呼叫卡片 */
|
||||
.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: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; }
|
||||
/* 接听状态胶囊 */
|
||||
.caps { display: inline-block; padding: 2px 12px; border-radius: 12px; font-size: 11px; }
|
||||
.caps--no { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.caps--yes { background: #7adb7f; color: #098a2d; }
|
||||
.panel { display: none; }
|
||||
.panel.on { display: block; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</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="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>
|
||||
<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>
|
||||
<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>
|
||||
<div class="bcard__right"><div class="btime">今天 09:47</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__mid">
|
||||
<div class="bcard__bed">一号宿舍楼 · 2号床<small>呼叫器 BJ-01-02</small></div>
|
||||
<!-- [状态] 员工信息未知：床位未登记人员时呼叫无法关联员工 -->
|
||||
<div class="bcard__emp"><span class="unknown">员工信息未知（该床位未登记人员）</span></div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">今天 08:31</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__mid">
|
||||
<div class="bcard__bed">二号宿舍楼 · 3号床<small>呼叫器 BJ-02-03</small></div>
|
||||
<div class="bcard__emp">付桂荣 · 女 · 52岁 <b>采油二大队</b></div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">今天 06:12</div><span class="caps caps--no">未接听</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 已处理 -->
|
||||
<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__mid">
|
||||
<div class="bcard__bed">三号宿舍楼 · 5号床<small>呼叫器 BJ-03-05</small></div>
|
||||
<div class="bcard__emp">岳春生 · 男 · 54岁 <b>陕E作业区 / 管理四中心</b></div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">昨天 21:03</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__mid">
|
||||
<div class="bcard__bed">一号宿舍楼 · 8号床<small>呼叫器 BJ-01-08</small></div>
|
||||
<div class="bcard__emp">戴文广 · 男 · 58岁 <b>采油一大队</b></div>
|
||||
</div>
|
||||
<div class="bcard__right"><div class="btime">昨天 15:40</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__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>
|
||||
<div class="bcard__right"><div class="btime">09-01 23:18</div><span class="caps caps--yes">已接听</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function switchState(name) {
|
||||
document.querySelectorAll('.panel').forEach(function (p) { p.classList.remove('on'); });
|
||||
document.getElementById('p-' + name).classList.add('on');
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,266 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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; }
|
||||
.back { font-size: 13px; color: #1890ff; cursor: pointer; text-decoration: none; margin-bottom: 12px; display: inline-block; }
|
||||
/* 顶部员工信息卡 */
|
||||
.top-card { background: #fff; border-radius: 14px; padding: 16px 20px; display: flex; gap: 16px; align-items: center; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.avatar { width: 46px; height: 46px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 18px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.top-card__info { flex: 1; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.top-card__info b { color: #333; font-weight: 600; font-size: 15px; margin-right: 8px; }
|
||||
.top-card__info small { color: #969eb0; font-weight: 400; font-size: 12px; margin-right: 8px; }
|
||||
.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; }
|
||||
/* 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; }
|
||||
.tabs__item { padding: 14px 2px; font-size: 14px; color: #4a5a7f; cursor: pointer; border-bottom: 2.5px solid transparent; margin-bottom: -1px; }
|
||||
.tabs__item.on { color: #1890ff; border-color: #1890ff; font-weight: 600; }
|
||||
.tabs__item small { color: #969eb0; font-weight: 400; margin-left: 4px; }
|
||||
.tabs__body { padding: 16px 20px; }
|
||||
.panel { display: none; }
|
||||
.panel.on { display: block; }
|
||||
.table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.table th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 9px 12px; text-align: left; }
|
||||
.table td { padding: 9px 12px; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.link { color: #1890ff; cursor: pointer; font-size: 12px; text-decoration: none; margin-right: 10px; }
|
||||
.pill { display: inline-block; padding: 1px 10px; border-radius: 12px; font-size: 11px; }
|
||||
.pill--on { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.pill--off { background: #f0f0f0; color: #969eb0; }
|
||||
.pill--wait { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
/* 页内弹窗 */
|
||||
.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: 700px; max-height: 620px; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
|
||||
.modal--760 { width: 760px; }
|
||||
.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; }
|
||||
.sec { background: #f8fafc; border-radius: 10px; padding: 12px 16px; margin-bottom: 12px; }
|
||||
.sec__title { font-size: 13px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 10px; }
|
||||
.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; }
|
||||
.med-card { background: #f2f6ff; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; margin-bottom: 8px; }
|
||||
.med-card b { color: #333; font-size: 13px; }
|
||||
.fld { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; margin-bottom: 12px; }
|
||||
.fld__label { width: 84px; text-align: right; flex-shrink: 0; }
|
||||
.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; }
|
||||
.fld textarea { height: 56px; padding: 7px 10px; resize: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item nav__item--active" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="content">
|
||||
<!-- [交互] 返回慢病干预列表: chronic-disease.html -->
|
||||
<a class="back" href="chronic-disease.html">‹ 返回慢病干预列表</a>
|
||||
|
||||
<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（糖尿病）
|
||||
</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>
|
||||
</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" onclick="switchTab('visit',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">
|
||||
<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>
|
||||
</table>
|
||||
</div>
|
||||
<!-- 就诊记录 -->
|
||||
<div class="panel" id="p-visit">
|
||||
<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>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：用药方案详情（700） -->
|
||||
<div class="overlay" id="medModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head"><span class="modal__title">用药方案 · 苯磺酸氨氯地平片</span><button class="modal__close" onclick="closeModal('medModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div class="med-card"><b>苯磺酸氨氯地平片</b>（5mg×7片 · 23.80元）<br>数量：2盒 用法用量：口服，一日1次，一次1片</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">方案信息</div>
|
||||
<div class="kv">
|
||||
<div>生效日期：<b>2026-06-01</b></div><div>状态：<b>使用中</b></div>
|
||||
<div>开具医生：<b>石维国</b></div><div>开具来源：<b>就诊记录 2026-08-21</b></div>
|
||||
<div class="kv__full">备注：<b>两周一评估，血压稳定后考虑减量</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">变更记录</div>
|
||||
<table class="table">
|
||||
<tr><th>日期</th><th>变更内容</th><th>操作人</th></tr>
|
||||
<tr><td>2026-06-01</td><td>新增用药方案</td><td>石维国</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('medModal')">关 闭</button>
|
||||
<!-- [交互] 停用当前方案（停用后可在用药方案 Tab 新增替代方案） -->
|
||||
<button class="btn btn--primary" onclick="closeModal('medModal')">停 用</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：就诊详情 -->
|
||||
<div class="overlay" id="visitModal">
|
||||
<div class="modal modal--760">
|
||||
<div class="modal__head"><span class="modal__title">就诊详情 · 2026-08-21</span><button class="modal__close" onclick="closeModal('visitModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div class="sec">
|
||||
<div class="sec__title">就诊信息</div>
|
||||
<div class="kv">
|
||||
<div>就诊医生：<b>石维国</b></div><div>就诊日期：<b>2026-08-21 10:32</b></div>
|
||||
<div>是否复诊：<b>复诊</b></div><div>诊断：<b>原发性高血压3级（很高危）；2型糖尿病</b></div>
|
||||
<div class="kv__full">主诉：<b>晨起后头晕、后颈部发紧，测血压 165/102mmHg</b></div>
|
||||
<div class="kv__full">查体：<b>BP 162/100mmHg，心率 78 次/分，律齐，双肺呼吸音清。</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">医药信息</div>
|
||||
<div class="med-card"><b>苯磺酸氨氯地平片</b>（5mg×7片）<br>数量：2盒 用法用量：口服，一日1次，一次1片</div>
|
||||
<div class="med-card" style="margin-bottom:0"><b>二甲双胍缓释片</b>（0.5g×30片）<br>数量：1盒 用法用量：口服，一日2次，一次1片</div>
|
||||
</div>
|
||||
<div class="sec" style="margin-bottom:0">
|
||||
<div class="sec__title">生活建议</div>
|
||||
<div class="kv" style="grid-template-columns:1fr">
|
||||
<div>医嘱：<b>规律服药，每日早晚监测血压并记录，2周后复查。</b></div>
|
||||
<div>运动处方：<b>每日快走30分钟，避免剧烈运动。</b></div>
|
||||
<div>膳食处方：<b>低盐（<5g/日）低脂饮食，控制主食量。</b></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot"><button class="btn" onclick="closeModal('visitModal')">关 闭</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
// Tab 切换
|
||||
function switchTab(name, el) {
|
||||
document.querySelectorAll('.tabs__item').forEach(function (t) { t.classList.remove('on'); });
|
||||
el.classList.add('on');
|
||||
document.querySelectorAll('.panel').forEach(function (p) { p.classList.remove('on'); });
|
||||
document.getElementById('p-' + name).classList.add('on');
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,155 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #eef1f6; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-direction: column; flex-shrink: 0; }
|
||||
.drawer__head { height: 56px; background: #fff; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(74,90,127,.06); z-index: 5; }
|
||||
.drawer__back { color: #1890ff; font-size: 14px; cursor: pointer; text-decoration: none; }
|
||||
.drawer__title { font-size: 16px; font-weight: 600; color: #333; flex: 1; }
|
||||
.drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; scrollbar-width: none; }
|
||||
.drawer__body::-webkit-scrollbar { display: none; }
|
||||
.drawer__foot { height: 60px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; box-shadow: 0 -2px 6px rgba(74,90,127,.06); }
|
||||
.btn { height: 32px; padding: 0 18px; 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; }
|
||||
.sec { background: #fff; border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 12px; }
|
||||
.sec__tip { font-size: 12px; font-weight: 400; color: #969eb0; margin-left: 10px; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 22px; }
|
||||
.fld { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.fld__label { width: 84px; text-align: right; flex-shrink: 0; }
|
||||
.fld input, .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; }
|
||||
.fld input[readonly] { background: #f5f6f8; color: #666; }
|
||||
/* 员工查询 */
|
||||
.inquiry { display: flex; gap: 10px; position: relative; }
|
||||
.inquiry select { width: 90px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; font-size: 13px; padding: 0 8px; outline: none; }
|
||||
.inquiry input { width: 260px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; }
|
||||
.iq-result { position: absolute; top: 40px; left: 100px; width: 620px; background: #fff; border: 1px solid #d9d9d9; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12); z-index: 10; max-height: 220px; overflow-y: auto; }
|
||||
.iq-result table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.iq-result th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 8px 10px; text-align: center; }
|
||||
.iq-result td { padding: 8px 10px; text-align: center; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.iq-result tr.row:hover { background: #f2f6ff; cursor: pointer; }
|
||||
/* 慢病类型六色可选块 */
|
||||
.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; }
|
||||
/* 其他慢病名称输入（选中「其他」时显示） */
|
||||
.oth-row { display: none; margin-top: 12px; }
|
||||
.oth-row.show { display: flex; }
|
||||
/* 就诊记录表 */
|
||||
.table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.table th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 8px 10px; text-align: left; }
|
||||
.table td { padding: 8px 10px; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.table .none { color: #969eb0; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="device-frame">
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回慢病干预列表: chronic-disease.html -->
|
||||
<a class="drawer__back" href="chronic-disease.html">‹ 返回</a>
|
||||
<span class="drawer__title">新增慢病干预</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>
|
||||
</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>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<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>
|
||||
<div class="type-opt t-chd" onclick="toggleType(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="toggleType(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="toggleType(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="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>
|
||||
<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>
|
||||
</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">
|
||||
<button class="btn" onclick="location.href='chronic-disease.html'">取 消</button>
|
||||
<!-- [交互] 确认建立慢病干预档案，返回慢病干预列表 -->
|
||||
<button class="btn btn--primary" onclick="location.href='chronic-disease.html'">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function pickEmp() { document.getElementById('iqResult').style.display = 'none'; }
|
||||
// 色块选中切换；「其他」选中时显示病名输入行
|
||||
function toggleType(el) {
|
||||
el.classList.toggle('on');
|
||||
var show = document.getElementById('othOpt').classList.contains('on');
|
||||
document.getElementById('othRow').classList.toggle('show', show);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,261 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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__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; }
|
||||
.btn--danger { background: #fff; border-color: #ffa39e; color: #f5222d; }
|
||||
/* 慢病类型多选下拉 */
|
||||
.msel { position: relative; }
|
||||
.msel__btn { height: 32px; padding: 0 12px; border: 1px solid #d9dee8; border-radius: 6px; background: #fff; color: #333; font-size: 13px; cursor: pointer; display: flex; align-items: center; gap: 6px; }
|
||||
.msel__btn .cnt { background: #e7f4ff; color: #1890ff; border-radius: 9px; padding: 0 7px; font-size: 11px; line-height: 18px; }
|
||||
.msel__panel { position: absolute; top: 38px; left: 0; width: 200px; background: #fff; border: 1px solid #e5e8ef; border-radius: 10px; box-shadow: 0 6px 18px rgba(74,90,127,.18); z-index: 20; padding: 10px 12px; display: none; }
|
||||
.msel__panel.open { display: block; }
|
||||
.msel__opt { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #333; padding: 6px 2px; cursor: pointer; }
|
||||
.msel__opt input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
.msel__foot { display: flex; justify-content: space-between; border-top: 1px solid #f0f2f5; margin-top: 8px; padding-top: 8px; }
|
||||
.msel__foot a { font-size: 12px; color: #1890ff; cursor: pointer; text-decoration: none; }
|
||||
/* 慢病卡片 */
|
||||
.fgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 14px; }
|
||||
.fcard { background: #fff; border-radius: 18px; padding: 16px; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; position: relative; }
|
||||
.fcard:hover { box-shadow: 0 8px 20px rgba(74,90,127,.16); }
|
||||
.fcard__top { display: flex; align-items: center; gap: 10px; padding-right: 26px; }
|
||||
.avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.fcard__name { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.fcard__name small { font-weight: 400; color: #969eb0; font-size: 12px; margin-left: 5px; }
|
||||
.fcard__lines { margin-top: 10px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.fcard__lines b { color: #333; font-weight: 500; }
|
||||
.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--chd { background: rgba(0,195,195,.2); color: #00c3c3; }
|
||||
.tag--ob { background: rgba(252,163,24,.2); color: #fca318; }
|
||||
.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; }
|
||||
/* 卡片右上更多操作 */
|
||||
.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; }
|
||||
.more__menu { position: absolute; top: 26px; right: 0; width: 88px; background: #fff; border-radius: 8px; box-shadow: 0 6px 18px rgba(74,90,127,.22); padding: 5px 0; display: none; z-index: 15; }
|
||||
.more__menu.open { display: block; }
|
||||
.more__menu a { display: block; padding: 7px 14px; font-size: 12px; color: #333; cursor: pointer; text-decoration: none; }
|
||||
.more__menu a:hover { background: #f5f7fa; }
|
||||
.more__menu a.del { color: #f5222d; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* 页内弹窗：删除确认 */
|
||||
.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: 400px; box-shadow: 0 12px 40px rgba(0,0,0,.25); padding: 22px 24px; }
|
||||
.modal__title { font-size: 15px; font-weight: 600; color: #333; display: flex; align-items: center; gap: 8px; }
|
||||
.modal__title svg { width: 20px; height: 20px; stroke: #faad14; fill: none; stroke-width: 2; }
|
||||
.modal__text { font-size: 13px; color: #4a5a7f; line-height: 1.8; margin: 12px 0 20px; }
|
||||
.modal__foot { display: flex; justify-content: flex-end; gap: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item nav__item--active" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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">慢病类型
|
||||
<!-- [交互] 慢病类型多选下拉，勾选后点「确定」按类型过滤列表 -->
|
||||
<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>
|
||||
<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>
|
||||
<label class="msel__opt"><input type="checkbox" value="糖尿病">糖尿病</label>
|
||||
<label class="msel__opt"><input type="checkbox" value="肥胖">肥胖</label>
|
||||
<label class="msel__opt"><input type="checkbox" value="超重">超重</label>
|
||||
<label class="msel__opt"><input type="checkbox" value="其他">其他</label>
|
||||
<div class="msel__foot"><a onclick="clearType()">清空</a><a onclick="applyType()">确 定</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</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>
|
||||
|
||||
<div class="fgrid">
|
||||
<!-- [交互] 点击卡片进入慢病干预详情: chronic-disease-detail.html -->
|
||||
<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 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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span>共 9 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">2</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：删除确认 -->
|
||||
<div class="overlay" id="delModal">
|
||||
<div class="modal">
|
||||
<div class="modal__title"><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>确认删除该慢病干预档案？</div>
|
||||
<div class="modal__text">删除后该员工的慢病干预信息、用药方案将一并移除，历史随访记录保留在随访管理中。此操作不可恢复。</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('delModal')">取 消</button>
|
||||
<!-- [交互] 确认删除，列表移除该卡片（原型演示） -->
|
||||
<button class="btn btn--danger" onclick="closeModal('delModal')">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
// 更多操作菜单：同时只展开一个
|
||||
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;
|
||||
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.addEventListener('click', function () {
|
||||
document.querySelectorAll('.more__menu.open').forEach(function (m) { m.classList.remove('open'); });
|
||||
document.getElementById('typePanel').classList.remove('open');
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,230 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #eef1f6; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-direction: column; flex-shrink: 0; }
|
||||
.drawer__head { height: 56px; background: #fff; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(74,90,127,.06); z-index: 5; }
|
||||
.drawer__back { color: #1890ff; font-size: 14px; cursor: pointer; text-decoration: none; }
|
||||
.drawer__title { font-size: 16px; font-weight: 600; color: #333; flex: 1; }
|
||||
.drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; scrollbar-width: none; }
|
||||
.drawer__body::-webkit-scrollbar { display: none; }
|
||||
.drawer__foot { height: 60px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; box-shadow: 0 -2px 6px rgba(74,90,127,.06); }
|
||||
.btn { height: 32px; padding: 0 18px; 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; }
|
||||
/* 表单分区卡 */
|
||||
.sec { background: #fff; border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 12px; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 22px; }
|
||||
.fld { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.fld--full { grid-column: 1 / -1; }
|
||||
.fld__label { width: 80px; text-align: right; flex-shrink: 0; }
|
||||
.fld__req { color: #fd2121; }
|
||||
.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; }
|
||||
.fld input:focus, .fld textarea:focus { border-color: #1890ff; }
|
||||
.fld input[readonly] { background: #f5f6f8; color: #666; }
|
||||
.fld textarea { height: 58px; padding: 7px 10px; resize: none; }
|
||||
.radio { display: flex; gap: 18px; align-items: center; font-size: 13px; color: #333; }
|
||||
.radio input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
/* 员工查询 */
|
||||
.inquiry { display: flex; gap: 10px; position: relative; }
|
||||
.inquiry select { width: 90px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; font-size: 13px; padding: 0 8px; outline: none; }
|
||||
.inquiry input { width: 260px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; }
|
||||
.iq-result { position: absolute; top: 40px; left: 100px; width: 620px; background: #fff; border: 1px solid #d9d9d9; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12); z-index: 10; max-height: 220px; overflow-y: auto; }
|
||||
.iq-result table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.iq-result th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 8px 10px; text-align: center; }
|
||||
.iq-result td { padding: 8px 10px; text-align: center; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.iq-result tr.row:hover { background: #f2f6ff; cursor: pointer; }
|
||||
/* 医药信息 */
|
||||
.med-card { background: #f2f6ff; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; position: relative; }
|
||||
.med-card b { color: #333; font-size: 13px; }
|
||||
.med-card__ops { position: absolute; top: 10px; right: 12px; display: flex; gap: 10px; font-size: 12px; }
|
||||
.med-card__ops a { cursor: pointer; text-decoration: none; }
|
||||
.op-del { color: #f5222d; }
|
||||
.op-back { color: #969eb0; }
|
||||
.med-mine { background: #f5f5f5; color: #bbb; }
|
||||
.med-mine b { color: #bbb; }
|
||||
.add-med-btn { width: 100%; height: 56px; border: 1px dashed #1890ff; border-radius: 10px; background: #f2f6ff; color: #1890ff; font-size: 14px; cursor: pointer; margin-top: 10px; }
|
||||
.med-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
|
||||
/* 页内弹窗：新增用药 */
|
||||
.overlay { position: absolute; inset: 0; background: rgba(15,23,42,.45); z-index: 60; display: none; align-items: center; justify-content: center; }
|
||||
.overlay.open { display: flex; }
|
||||
.modal { background: #fff; border-radius: 12px; width: 660px; max-height: 600px; 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: 18px 22px; position: relative; 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; }
|
||||
.search-line { display: flex; gap: 10px; margin-bottom: 16px; position: relative; }
|
||||
.search-line input { flex: 1; height: 34px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; }
|
||||
.drug-list { position: absolute; top: 44px; left: 0; right: 96px; background: #fff; border: 1px solid #d9d9d9; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12); z-index: 10; max-height: 190px; overflow-y: auto; }
|
||||
.drug-list table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.drug-list th { background: #f6f8fc; padding: 7px 10px; color: #4a5a7f; font-weight: 500; }
|
||||
.drug-list td { padding: 7px 10px; border-bottom: 1px solid #f0f2f5; text-align: center; color: #333; }
|
||||
.drug-list tr:hover { background: #f2f6ff; cursor: pointer; }
|
||||
.stepper { display: flex; align-items: center; gap: 0; }
|
||||
.stepper button { width: 30px; height: 32px; border: 1px solid #d9dee8; background: #fff; font-size: 15px; cursor: pointer; color: #4a5a7f; }
|
||||
.stepper input { width: 60px; height: 32px; border: 1px solid #d9dee8; border-left: none; border-right: none; text-align: center; font-size: 13px; outline: none; }
|
||||
.ro-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 16px; }
|
||||
.ro-box { background: #f5f6f8; border-radius: 6px; padding: 7px 10px; font-size: 12px; color: #666; line-height: 1.7; }
|
||||
.ro-box b { display: block; color: #333; font-weight: 500; font-size: 13px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="device-frame">
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回日常诊疗列表（未保存退出时旧系统弹确认）: daily.html -->
|
||||
<a class="drawer__back" href="daily.html">‹ 返回</a>
|
||||
<span class="drawer__title">新增就诊 · 职工</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>
|
||||
</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>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">就诊信息</div>
|
||||
<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="2026-09-04 10:32" readonly></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>是否复诊</span>
|
||||
<span class="radio"><label><input type="radio" name="re">初诊</label><label><input type="radio" name="re" checked>复诊</label></span>
|
||||
</div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>主诉</span><input placeholder="请输入主要症状与持续时间" value="晨起后头晕、后颈部发紧，测血压 165/102mmHg"></div>
|
||||
<div class="fld fld--full"><span class="fld__label">查体</span><textarea>BP 162/100mmHg，心率 78 次/分，律齐，双肺呼吸音清，未闻及干湿啰音。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">现病史</span><textarea>近1周劳累后症状加重，自述降压药服用不规律。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">既往史</span><textarea>高血压8年，2型糖尿病4年，规律服药。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">过敏史</span><input value="青霉素过敏"></div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>诊断</span><input placeholder="请输入诊断结论" value="原发性高血压3级（很高危）；2型糖尿病"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
<!-- [交互] 点击打开页内「新增用药」弹窗 -->
|
||||
<button class="add-med-btn" onclick="openModal('medModal')">＋ 新增用药</button>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活建议</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld fld--full"><span class="fld__label">医嘱</span><textarea placeholder="请输入医嘱建议">规律服药，每日早晚监测血压并记录，2周后复查。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">运动处方</span><textarea placeholder="请输入运动处方">每日快走30分钟，避免剧烈运动。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">膳食处方</span><textarea placeholder="请输入膳食处方">低盐（<5g/日）低脂饮食，控制主食量。</textarea></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="drawer__foot">
|
||||
<button class="btn" onclick="location.href='daily.html'">取 消</button>
|
||||
<!-- [交互] 确认提交就诊记录，返回日常诊疗列表 -->
|
||||
<button class="btn btn--primary" onclick="location.href='daily.html'">确 认</button>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：新增用药 -->
|
||||
<div class="overlay" id="medModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head"><span class="modal__title">新增用药</span><button class="modal__close" onclick="closeModal('medModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div class="search-line">
|
||||
<input placeholder="请输入药品名称查询" value="氨氯地平">
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<!-- 药品查询结果（点击行选中回填） -->
|
||||
<div class="drug-list">
|
||||
<table>
|
||||
<tr><th>名称</th><th>规格</th><th>单位</th><th>售价(元)</th><th>库存</th></tr>
|
||||
<tr onclick="pickDrug(this)"><td>苯磺酸氨氯地平片</td><td>5mg×7片</td><td>盒</td><td>23.80</td><td>86</td></tr>
|
||||
<tr onclick="pickDrug(this)"><td>苯磺酸左氨氯地平片</td><td>2.5mg×14片</td><td>盒</td><td>28.50</td><td>40</td></tr>
|
||||
<tr onclick="pickDrug(this)"><td>氨氯地平贝那普利片</td><td>5mg×7片</td><td>盒</td><td>45.00</td><td>12</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ro-row" style="margin-top:210px">
|
||||
<div class="ro-box">规格<b>5mg×7片</b></div>
|
||||
<div class="ro-box">单位<b>盒</b></div>
|
||||
<div class="ro-box">售价<b>23.80 元</b></div>
|
||||
<div class="ro-box">库存<b>86</b></div>
|
||||
</div>
|
||||
<div class="fld" style="margin-bottom:14px"><span class="fld__label" style="width:88px"><span class="fld__req">*</span>数量</span>
|
||||
<span class="stepper">
|
||||
<button onclick="step(-1)">−</button><input id="qty" value="2"><button onclick="step(1)">＋</button>
|
||||
</span>
|
||||
<span style="font-size:12px;color:#969eb0;margin-left:8px">不可超过库存 86</span>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label" style="width:88px"><span class="fld__req">*</span>用法用量</span><input value="口服，一日1次，一次1片"></div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('medModal')">取 消</button>
|
||||
<!-- [交互] 确认后生成一张用药卡片加入医药信息 -->
|
||||
<button class="btn btn--primary" onclick="closeModal('medModal')">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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'; }
|
||||
// 药品选中：隐藏结果浮层
|
||||
function pickDrug(tr) {
|
||||
document.querySelector('.drug-list').style.display = 'none';
|
||||
var tds = tr.querySelectorAll('td');
|
||||
var boxes = document.querySelectorAll('.ro-box b');
|
||||
boxes[0].textContent = tds[1].textContent;
|
||||
boxes[1].textContent = tds[2].textContent;
|
||||
boxes[2].textContent = tds[3].textContent + ' 元';
|
||||
boxes[3].textContent = tds[4].textContent;
|
||||
}
|
||||
// 数量步进（上限为库存）
|
||||
function step(d) {
|
||||
var el = document.getElementById('qty');
|
||||
var v = parseInt(el.value || '1', 10) + d;
|
||||
if (v < 1) v = 1;
|
||||
if (v > 86) v = 86;
|
||||
el.value = v;
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,108 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #eef1f6; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-direction: column; flex-shrink: 0; }
|
||||
.drawer__head { height: 56px; background: #fff; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(74,90,127,.06); z-index: 5; }
|
||||
.drawer__back { color: #1890ff; font-size: 14px; cursor: pointer; text-decoration: none; }
|
||||
.drawer__title { font-size: 16px; font-weight: 600; color: #333; flex: 1; }
|
||||
.drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; scrollbar-width: none; }
|
||||
.drawer__body::-webkit-scrollbar { display: none; }
|
||||
.drawer__foot { height: 60px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; box-shadow: 0 -2px 6px rgba(74,90,127,.06); }
|
||||
.btn { height: 32px; padding: 0 18px; 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; }
|
||||
.sec { background: #fff; border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 12px; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 22px; }
|
||||
.fld { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.fld--full { grid-column: 1 / -1; }
|
||||
.fld__label { width: 80px; 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 input[readonly] { background: #f5f6f8; color: #666; }
|
||||
.fld textarea { height: 58px; padding: 7px 10px; resize: none; }
|
||||
.fld__hint { font-size: 12px; color: #fa8c16; margin-left: 8px; flex-shrink: 0; }
|
||||
.radio { display: flex; gap: 18px; align-items: center; font-size: 13px; color: #333; }
|
||||
.radio input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
.med-card { background: #f2f6ff; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; position: relative; }
|
||||
.med-card b { color: #333; font-size: 13px; }
|
||||
.med-card__ops { position: absolute; top: 10px; right: 12px; display: flex; gap: 10px; font-size: 12px; }
|
||||
.op-del { color: #f5222d; cursor: pointer; }
|
||||
.add-med-btn { width: 100%; height: 56px; border: 1px dashed #1890ff; border-radius: 10px; background: #f2f6ff; color: #1890ff; font-size: 14px; cursor: pointer; margin-top: 10px; }
|
||||
.med-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="device-frame">
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回日常诊疗列表: daily.html -->
|
||||
<a class="drawer__back" href="daily.html">‹ 返回</a>
|
||||
<span class="drawer__title">新增就诊 · 非职工（家属/协作单位人员）</span>
|
||||
</div>
|
||||
|
||||
<div class="drawer__body">
|
||||
<!-- 非职工：手工登记，无档案查询、无「查看员工档案」入口 -->
|
||||
<div class="sec">
|
||||
<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="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>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">就诊信息</div>
|
||||
<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="2026-09-04 10:40" readonly></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>是否复诊</span>
|
||||
<span class="radio"><label><input type="radio" name="re" checked>初诊</label><label><input type="radio" name="re">复诊</label></span>
|
||||
</div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>主诉</span><input value="腹痛、腹泻半天，呕吐2次"></div>
|
||||
<div class="fld fld--full"><span class="fld__label">查体</span><textarea>T 37.6℃，脐周压痛，肠鸣音活跃。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">现病史</span><textarea>进食隔夜饭菜后出现症状。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">既往史</span><textarea></textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">过敏史</span><input value="无"></div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>诊断</span><input value="急性胃肠炎"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">医药信息</div>
|
||||
<div class="med-grid">
|
||||
<div class="med-card"><b>蒙脱石散</b>（3g×10袋 · 18.60元）<br>数量：1盒 用法用量：口服，一日3次，一次1袋<div class="med-card__ops"><a class="op-del">删除</a></div></div>
|
||||
<div class="med-card"><b>左氧氟沙星片</b>（0.5g×6片 · 26.80元）<br>数量：1盒 用法用量：口服，一日1次，一次1片<div class="med-card__ops"><a class="op-del">删除</a></div></div>
|
||||
</div>
|
||||
<!-- [交互] 打开「新增用药」弹窗（与职工就诊抽屉同一交互，见 daily-drawer.html 内联演示） -->
|
||||
<button class="add-med-btn" onclick="alert('打开新增用药弹窗（交互同职工就诊，演示见 daily-drawer.html）')">＋ 新增用药</button>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活建议</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld fld--full"><span class="fld__label">医嘱</span><textarea>清淡饮食，多饮水补充电解质，症状加重及时转诊。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">运动处方</span><textarea>休息为主，暂缓体力活动。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">膳食处方</span><textarea>小米粥、面条等易消化食物，忌生冷油腻。</textarea></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="drawer__foot">
|
||||
<button class="btn" onclick="location.href='daily.html'">取 消</button>
|
||||
<!-- [交互] 确认提交非职工就诊记录，返回日常诊疗列表 -->
|
||||
<button class="btn btn--primary" onclick="location.href='daily.html'">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,277 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
/* ===== 左侧导航 ===== */
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
/* ===== 右区 ===== */
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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__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; }
|
||||
/* ===== Tab + 新增 ===== */
|
||||
.tabs-row { display: flex; align-items: center; margin-top: 14px; }
|
||||
.tabs { display: flex; gap: 26px; background: #fff; border-radius: 12px; padding: 0 16px; flex: 1; }
|
||||
.tabs__item { padding: 13px 2px; font-size: 14px; color: #666; cursor: pointer; border-bottom: 2px solid transparent; }
|
||||
.tabs__item--active { color: #1890ff; border-bottom-color: #1890ff; font-weight: 600; }
|
||||
/* ===== 就诊卡片 ===== */
|
||||
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
|
||||
.dcard { background: #fff; border-radius: 18px; padding: 16px; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; }
|
||||
.dcard:hover { box-shadow: 0 8px 20px rgba(74,90,127,.16); }
|
||||
.dcard__top { display: flex; align-items: center; gap: 10px; }
|
||||
.avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.dcard__name { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.dcard__name small { font-weight: 400; color: #969eb0; font-size: 12px; margin-left: 5px; }
|
||||
.pill { margin-left: auto; padding: 3px 12px; border-radius: 14px; font-size: 12px; }
|
||||
.pill--first { background: #e9f9f3; color: #2ac18b; }
|
||||
.pill--re { background: #fff6e7; color: #fca318; }
|
||||
.dcard__lines { margin-top: 12px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.dcard__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; }
|
||||
.pager { display: flex; gap: 6px; align-items: center; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* ===== 页内弹窗：就诊详情 ===== */
|
||||
.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: 760px; max-height: 680px; 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; background: #f8fafc; }
|
||||
.modal__body::-webkit-scrollbar { display: none; }
|
||||
.modal__foot { padding: 13px 20px; border-top: 1px solid #f0f2f5; display: flex; justify-content: space-between; align-items: center; }
|
||||
.modal__tip { font-size: 12px; color: #969eb0; }
|
||||
.btn--danger { background: #fff; border-color: #ffa39e; color: #f5222d; }
|
||||
.sec { background: #fff; border-radius: 10px; padding: 12px 16px; margin-bottom: 12px; }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 10px; display: flex; align-items: center; }
|
||||
.sec__title .file-link { margin-left: auto; font-size: 12px; font-weight: 400; color: #1890ff; background: #e7f4ff; border-radius: 12px; padding: 3px 12px; cursor: pointer; text-decoration: none; }
|
||||
.kv { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px 22px; font-size: 12px; color: #4a5a7f; line-height: 1.9; }
|
||||
.kv b { color: #333; font-weight: 500; }
|
||||
.kv--full { grid-column: 1 / -1; }
|
||||
.tag { display: inline-block; padding: 1px 8px; border-radius: 4px; font-size: 11px; margin-right: 4px; }
|
||||
.tag--ht { background: rgba(24,144,255,.12); color: #1890ff; }
|
||||
.tag--dm { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.med-card { background: #f2f6ff; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; margin-bottom: 8px; }
|
||||
.med-card b { color: #333; font-size: 13px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item nav__item--active" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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" style="min-width:200px" placeholder="开始日期 ~ 结束日期"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
|
||||
<div class="tabs-row">
|
||||
<div class="tabs">
|
||||
<div class="tabs__item tabs__item--active" id="tabStaff" onclick="switchTab('staff')">职工就诊（6）</div>
|
||||
<div class="tabs__item" id="tabOuter" onclick="switchTab('outer')">非职工就诊（2）</div>
|
||||
</div>
|
||||
<!-- [交互] 职工Tab打开职工就诊抽屉，非职工Tab打开非职工就诊抽屉 -->
|
||||
<button class="btn btn--primary" style="margin-left:14px" id="addBtn" onclick="gotoAdd()">＋ 新增就诊</button>
|
||||
</div>
|
||||
|
||||
<!-- 职工就诊卡片 -->
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<!-- 非职工就诊卡片（默认隐藏） -->
|
||||
<div class="grid" id="panelOuter" style="display:none">
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<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>
|
||||
<div class="dcard" onclick="openModal('detailModal')">
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span id="totalCount">共 6 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：就诊详情 -->
|
||||
<div class="overlay" id="detailModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head">
|
||||
<span class="modal__title">就诊详情</span>
|
||||
<button class="modal__close" onclick="closeModal('detailModal')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="sec">
|
||||
<div class="sec__title">基本信息
|
||||
<!-- [交互] 跳转员工档案详情: employee-file-detail.html -->
|
||||
<a class="file-link" href="employee-file-detail.html">查看员工档案</a>
|
||||
</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>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">就诊信息</div>
|
||||
<div class="kv">
|
||||
<div>就诊医生：<b>石维国</b></div><div>就诊日期：<b>2026-09-03 09:26</b></div>
|
||||
<div class="kv--full">主诉：<b>晨起后头晕、后颈部发紧，测血压 165/102mmHg</b></div>
|
||||
<div class="kv--full">查体：<b>BP 162/100mmHg，心率 78 次/分，律齐，双肺呼吸音清</b></div>
|
||||
<div class="kv--full">现病史：<b>近 1 周劳累后症状加重，服药不规律</b></div>
|
||||
<div class="kv--full">既往史：<b>高血压 8 年，2 型糖尿病 4 年</b></div>
|
||||
<div class="kv--full">过敏史：<b>青霉素过敏（皮试阳性）</b></div>
|
||||
<div class="kv--full">诊断：<b>原发性高血压3级（很高危）；2型糖尿病</b></div>
|
||||
</div>
|
||||
</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>
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活建议</div>
|
||||
<div class="kv">
|
||||
<div class="kv--full">医嘱：<b>规律服药，每日早晚监测血压并记录，2 周后复查</b></div>
|
||||
<div class="kv--full">运动处方：<b>每日快走 30 分钟，避免剧烈运动</b></div>
|
||||
<div class="kv--full">膳食处方：<b>低盐（<5g/日）低脂饮食，控制主食量，多蔬菜</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('detailModal');location.href='daily-drawer.html'">编 辑</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var curTab = 'staff';
|
||||
// 职工/非职工 Tab 切换（切换时重置表单）
|
||||
function switchTab(name) {
|
||||
curTab = name;
|
||||
var isStaff = name === 'staff';
|
||||
document.getElementById('tabStaff').className = 'tabs__item' + (isStaff ? ' tabs__item--active' : '');
|
||||
document.getElementById('tabOuter').className = 'tabs__item' + (isStaff ? '' : ' tabs__item--active');
|
||||
document.getElementById('panelStaff').style.display = isStaff ? 'grid' : 'none';
|
||||
document.getElementById('panelOuter').style.display = isStaff ? 'none' : 'grid';
|
||||
document.getElementById('totalCount').textContent = isStaff ? '共 6 条' : '共 2 条';
|
||||
document.querySelectorAll('.search-bar__input').forEach(function (i) { i.value = ''; });
|
||||
}
|
||||
// 新增就诊：按当前 Tab 打开对应抽屉
|
||||
function gotoAdd() {
|
||||
location.href = curTab === 'staff' ? 'daily-drawer.html' : 'daily-nonstaff-drawer.html';
|
||||
}
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,30 @@
|
||||
# 医疗点PAD端 变更记录
|
||||
|
||||
## [2026-09-04] feat: 医疗点PAD端首版原型（20个页面）
|
||||
|
||||
新增医疗点PAD端模块原型，采用平板横屏布局（设计尺寸 1280×800，16:10，安卓医疗平板），覆盖登录、任务中心、日常诊疗、随访管理、慢病干预、健康宣教、员工档案、健康监测、床头呼叫、报告解读十大业务线。抽屉类交互均在页内实现，无模块级导航页，页面间以登录页为入口跳转。
|
||||
|
||||
**涉及文件：**
|
||||
|
||||
- `login.html` — 登录页（模块入口）
|
||||
- `task.html` — 任务中心
|
||||
- `daily.html` — 日常诊疗列表
|
||||
- `daily-drawer.html` — 日常诊疗 · 员工接诊抽屉
|
||||
- `daily-nonstaff-drawer.html` — 日常诊疗 · 非员工接诊抽屉
|
||||
- `follow-records.html` — 随访管理
|
||||
- `follow-drawer.html` — 新增随访抽屉
|
||||
- `chronic-disease.html` — 慢病干预
|
||||
- `chronic-disease-drawer.html` — 新增干预抽屉
|
||||
- `chronic-disease-detail.html` — 慢病干预详情
|
||||
- `health-education.html` — 健康宣教
|
||||
- `health-education-drawer.html` — 新增宣教抽屉
|
||||
- `employee-file.html` — 员工档案
|
||||
- `employee-file-detail.html` — 员工档案详情
|
||||
- `monitor.html` — 健康监测
|
||||
- `bed.html` — 床头呼叫
|
||||
- `bed-detail.html` — 呼叫处理详情
|
||||
- `report.html` — 报告解读
|
||||
- `interpret-drawer.html` — 报告解读抽屉
|
||||
- `five-class-drawer.html` — 五类人群标签抽屉
|
||||
- `项目背景.md` — PAD 端设计尺寸由 1024×768 调整为 1280×800
|
||||
- `index.html` — 站点地图新增医疗点PAD端 20 个页面条目（入口 login.html）
|
||||
@@ -0,0 +1,350 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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; }
|
||||
.back { font-size: 13px; color: #1890ff; cursor: pointer; text-decoration: none; margin-bottom: 12px; display: inline-block; }
|
||||
/* 顶部信息卡 */
|
||||
.top-card { background: #fff; border-radius: 14px; padding: 16px 20px; display: flex; gap: 16px; align-items: center; box-shadow: 0 2px 8px rgba(74,90,127,.06); }
|
||||
.avatar { width: 46px; height: 46px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 18px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.top-card__info { flex: 1; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.top-card__info b { color: #333; font-weight: 600; font-size: 15px; margin-right: 8px; }
|
||||
.top-card__info small { color: #969eb0; font-weight: 400; font-size: 12px; margin-right: 8px; }
|
||||
.ftag { padding: 2px 10px; border-radius: 12px; font-size: 11px; background: rgba(250,140,22,.12); color: #fa8c16; }
|
||||
.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; }
|
||||
/* 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; }
|
||||
.tabs__item { padding: 14px 2px; font-size: 14px; color: #4a5a7f; cursor: pointer; border-bottom: 2.5px solid transparent; margin-bottom: -1px; }
|
||||
.tabs__item.on { color: #1890ff; border-color: #1890ff; font-weight: 600; }
|
||||
.tabs__body { padding: 16px 20px; }
|
||||
.panel { display: none; }
|
||||
.panel.on { display: block; }
|
||||
.table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.table th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 9px 12px; text-align: left; }
|
||||
.table td { padding: 9px 12px; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.link { color: #1890ff; cursor: pointer; font-size: 12px; text-decoration: none; margin-right: 10px; }
|
||||
.pill { display: inline-block; padding: 1px 10px; border-radius: 12px; font-size: 11px; }
|
||||
.pill--ok { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.pill--wait { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
/* 分析报告：左树右卡 */
|
||||
.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 small { color: #b7bfcc; }
|
||||
.tree__item:hover { background: #f5f7fa; }
|
||||
.tree__item.on { background: #e7f4ff; color: #1890ff; font-weight: 600; }
|
||||
.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; }
|
||||
.ind-card__val { font-size: 20px; font-weight: 700; }
|
||||
.ind-card__val.up { color: #fd2121; }
|
||||
.ind-card__val.ok { color: #2ac18b; }
|
||||
.ind-card__ref { font-size: 11px; color: #969eb0; margin-left: auto; font-weight: 400; }
|
||||
.ind-card svg { width: 100%; height: 74px; margin-top: 6px; }
|
||||
.ind-empty { grid-column: 1 / -1; text-align: center; color: #969eb0; font-size: 13px; padding: 60px 0; }
|
||||
/* 就医推荐 */
|
||||
.adv-note { font-size: 12px; color: #fa8c16; background: rgba(252,163,24,.08); border-radius: 8px; padding: 8px 12px; margin-bottom: 12px; }
|
||||
.advc { border: 1px solid #eef1f6; border-radius: 12px; padding: 14px 16px; margin-bottom: 12px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.advc b { color: #333; font-size: 14px; }
|
||||
.advc__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 18px; }
|
||||
/* 页内弹窗：查看体检报告 */
|
||||
.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__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; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item nav__item--active" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="content">
|
||||
<!-- [交互] 返回员工档案列表: employee-file.html -->
|
||||
<a class="back" href="employee-file.html">‹ 返回员工档案</a>
|
||||
|
||||
<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次）
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tabs__head">
|
||||
<!-- [交互] 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('tj',this)">就医推荐</span>
|
||||
</div>
|
||||
<div class="tabs__body">
|
||||
<!-- 体检历史 -->
|
||||
<div class="panel on" id="p-hx">
|
||||
<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>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- 分析报告：左检查类别树 + 右指标纵向趋势卡 -->
|
||||
<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>
|
||||
<div class="ind-grid" id="cat-all">
|
||||
<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">
|
||||
<line x1="8" y1="52" x2="292" y2="52" stroke="#eee"/>
|
||||
<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"/>
|
||||
<text x="30" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2022</text><text x="90" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2023</text><text x="150" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2024</text><text x="210" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2025</text><text x="270" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2026</text>
|
||||
</svg>
|
||||
</div>
|
||||
<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">
|
||||
<line x1="8" y1="52" x2="292" y2="52" stroke="#eee"/>
|
||||
<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"/>
|
||||
<text x="30" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2022</text><text x="90" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2023</text><text x="150" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2024</text><text x="210" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2025</text><text x="270" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2026</text>
|
||||
</svg>
|
||||
</div>
|
||||
<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">
|
||||
<line x1="8" y1="52" x2="292" y2="52" stroke="#eee"/>
|
||||
<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"/>
|
||||
<text x="30" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2022</text><text x="90" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2023</text><text x="150" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2024</text><text x="210" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2025</text><text x="270" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2026</text>
|
||||
</svg>
|
||||
</div>
|
||||
<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">
|
||||
<line x1="8" y1="52" x2="292" y2="52" stroke="#eee"/>
|
||||
<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"/>
|
||||
<text x="30" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2022</text><text x="90" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2023</text><text x="150" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2024</text><text x="210" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2025</text><text x="270" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2026</text>
|
||||
</svg>
|
||||
</div>
|
||||
<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">
|
||||
<line x1="8" y1="52" x2="292" y2="52" stroke="#eee"/>
|
||||
<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"/>
|
||||
<text x="30" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2022</text><text x="90" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2023</text><text x="150" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2024</text><text x="210" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2025</text><text x="270" y="66" font-size="9" fill="#969eb0" text-anchor="middle">2026</text>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="ind-empty" style="display:none">该类别暂无纵向对比指标</div>
|
||||
</div>
|
||||
<div class="ind-grid" id="cat-one" style="display:none">
|
||||
<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 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-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 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 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-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>
|
||||
推荐理由：血压多次测量超过 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>
|
||||
推荐理由：空腹血糖连续 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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：查看体检报告（结构同报告解读抽屉左侧） -->
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
function switchTab(name, el) {
|
||||
document.querySelectorAll('.tabs__item').forEach(function (t) { t.classList.remove('on'); });
|
||||
el.classList.add('on');
|
||||
document.querySelectorAll('.panel').forEach(function (p) { p.classList.remove('on'); });
|
||||
document.getElementById('p-' + name).classList.add('on');
|
||||
}
|
||||
// 检查类别树切换指标卡组：all/one/lab 有数据，其余走空态
|
||||
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) {
|
||||
document.getElementById(k).style.display = 'none';
|
||||
});
|
||||
document.getElementById('cat-other').style.display = 'none';
|
||||
if (document.getElementById(key)) {
|
||||
document.getElementById(key).style.display = 'grid';
|
||||
} else {
|
||||
document.getElementById('cat-other').style.display = 'grid';
|
||||
}
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,235 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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__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 .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; }
|
||||
.org-panel.open { display: flex; }
|
||||
.org-body { flex: 1; display: flex; min-height: 0; }
|
||||
.org-col { flex: 1; overflow-y: auto; padding: 8px; scrollbar-width: none; }
|
||||
.org-col::-webkit-scrollbar { display: none; }
|
||||
.org-col:first-child { border-right: 1px solid #f0f2f5; }
|
||||
.org-node { padding: 7px 10px; font-size: 12px; border-radius: 6px; cursor: pointer; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.org-node:hover { background: #f2f6ff; }
|
||||
.org-node.on { background: #e7f4ff; color: #1890ff; }
|
||||
.org-foot { border-top: 1px solid #f0f2f5; padding: 8px 12px; display: flex; justify-content: space-between; }
|
||||
.org-foot a { font-size: 12px; color: #1890ff; cursor: pointer; text-decoration: none; }
|
||||
.org-foot a.ok { background: #1890ff; color: #fff; border-radius: 5px; padding: 4px 14px; }
|
||||
/* 档案卡片 */
|
||||
.fgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 14px; }
|
||||
.fcard { background: #fff; border-radius: 18px; padding: 16px; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; }
|
||||
.fcard:hover { box-shadow: 0 8px 20px rgba(74,90,127,.16); }
|
||||
.fcard__top { display: flex; align-items: center; gap: 10px; }
|
||||
.avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.fcard__name { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.fcard__name small { font-weight: 400; color: #969eb0; font-size: 12px; margin-left: 5px; }
|
||||
.ftag { margin-left: auto; padding: 2px 10px; border-radius: 12px; font-size: 11px; }
|
||||
.ftag--a { background: rgba(245,34,45,.1); color: #f5222d; }
|
||||
.ftag--b { background: rgba(250,140,22,.12); color: #fa8c16; }
|
||||
.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; }
|
||||
.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; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item nav__item--active" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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">单位部门
|
||||
<!-- [交互] 双列面板：左列选单位、右列联动显示部门；确认后代入筛选 -->
|
||||
<div class="org-select-wrap">
|
||||
<div class="org-trigger" onclick="event.stopPropagation();document.getElementById('orgPanel').classList.toggle('open')">
|
||||
<span class="ph" id="orgText">全部单位</span><i>▾</i>
|
||||
</div>
|
||||
<div class="org-panel" id="orgPanel" onclick="event.stopPropagation()">
|
||||
<div class="org-body">
|
||||
<div class="org-col" id="orgColUnit">
|
||||
<div class="org-node on" onclick="pickUnit(this,'陕E作业区')">陕E作业区</div>
|
||||
<div class="org-node" onclick="pickUnit(this,'采油一大队')">采油一大队</div>
|
||||
<div class="org-node" onclick="pickUnit(this,'采油二大队')">采油二大队</div>
|
||||
<div class="org-node" onclick="pickUnit(this,'输气作业区')">输气作业区</div>
|
||||
</div>
|
||||
<div class="org-col" id="orgColDept"></div>
|
||||
</div>
|
||||
<div class="org-foot">
|
||||
<a onclick="clearOrg()">清空</a>
|
||||
<a class="ok" onclick="applyOrg()">确 定</a>
|
||||
</div>
|
||||
</div>
|
||||
</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>
|
||||
</div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span>共 216 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">2</button><button class="pager__btn">3</button><button class="pager__btn">…</button><button class="pager__btn">36</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// 单位 → 部门联动数据
|
||||
var ORG_DEPTS = {
|
||||
'陕E作业区': ['管理四中心', '注水大队', '转运站', '供电大队'],
|
||||
'采油一大队': ['一号中心站', '二号中心站', '队部机关'],
|
||||
'采油二大队': ['三号中心站', '四号中心站', '队部机关'],
|
||||
'输气作业区': ['压气站', '管线巡护队']
|
||||
};
|
||||
var selUnit = '', selDept = '';
|
||||
function pickUnit(el, name) {
|
||||
selUnit = name; selDept = '';
|
||||
document.querySelectorAll('#orgColUnit .org-node').forEach(function (n) { n.classList.remove('on'); });
|
||||
el.classList.add('on');
|
||||
var col = document.getElementById('orgColDept');
|
||||
col.innerHTML = '';
|
||||
(ORG_DEPTS[name] || []).forEach(function (d) {
|
||||
var node = document.createElement('div');
|
||||
node.className = 'org-node';
|
||||
node.textContent = d;
|
||||
node.onclick = function () {
|
||||
col.querySelectorAll('.org-node').forEach(function (n) { n.classList.remove('on'); });
|
||||
node.classList.add('on');
|
||||
selDept = d;
|
||||
};
|
||||
col.appendChild(node);
|
||||
});
|
||||
}
|
||||
function applyOrg() {
|
||||
var t = document.getElementById('orgText');
|
||||
t.textContent = selUnit ? (selDept ? selUnit + ' / ' + selDept : selUnit) : '全部单位';
|
||||
t.className = selUnit ? '' : 'ph';
|
||||
document.getElementById('orgPanel').classList.remove('open');
|
||||
}
|
||||
function clearOrg() { selUnit = ''; selDept = ''; applyOrg(); }
|
||||
// 默认展示陕E作业区的部门列
|
||||
pickUnit(document.querySelector('#orgColUnit .org-node'), '陕E作业区');
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('orgPanel').classList.remove('open');
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,138 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #eef1f6; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-direction: column; flex-shrink: 0; }
|
||||
.drawer__head { height: 56px; background: #fff; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(74,90,127,.06); }
|
||||
.drawer__back { color: #1890ff; font-size: 14px; cursor: pointer; text-decoration: none; }
|
||||
.drawer__title { font-size: 16px; font-weight: 600; color: #333; }
|
||||
.drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; scrollbar-width: none; }
|
||||
.drawer__body::-webkit-scrollbar { display: none; }
|
||||
.drawer__foot { height: 60px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; box-shadow: 0 -2px 6px rgba(74,90,127,.06); }
|
||||
.btn { height: 32px; padding: 0 18px; 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; }
|
||||
/* 顶部只读员工信息 */
|
||||
.emp-bar { background: #fff; border-radius: 12px; padding: 12px 18px; display: flex; gap: 34px; font-size: 13px; color: #4a5a7f; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.emp-bar b { color: #333; font-weight: 500; }
|
||||
/* 分类单选 */
|
||||
.cls-row { background: #fff; border-radius: 12px; padding: 14px 18px; margin-top: 12px; box-shadow: 0 2px 8px rgba(74,90,127,.05); display: flex; align-items: center; gap: 22px; font-size: 13px; color: #333; }
|
||||
.cls-row label { display: flex; align-items: center; gap: 6px; cursor: pointer; }
|
||||
.cls-row input { accent-color: #1890ff; width: 15px; height: 15px; }
|
||||
.sec { background: #fff; border-radius: 12px; padding: 14px 18px; margin-top: 12px; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.sec__head { display: flex; align-items: center; margin-bottom: 10px; }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; flex: 1; }
|
||||
.table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.table th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 8px 10px; text-align: left; }
|
||||
.table td { padding: 7px 10px; border-bottom: 1px solid #f0f2f5; }
|
||||
.table input, .table select { width: 100%; height: 30px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 8px; font-size: 12px; outline: none; box-sizing: border-box; }
|
||||
.op-del { color: #f5222d; cursor: pointer; font-size: 12px; }
|
||||
.link-add { color: #1890ff; font-size: 12px; cursor: pointer; text-decoration: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="device-frame">
|
||||
<div class="drawer__head">
|
||||
<a class="drawer__back" href="javascript:history.back()">‹ 返回</a>
|
||||
<span class="drawer__title">五类人群信息登记</span>
|
||||
</div>
|
||||
|
||||
<div class="drawer__body">
|
||||
<div class="emp-bar">
|
||||
<span>单位：<b>CQ能源采油三大队</b></span>
|
||||
<span>部门：<b>采油三队</b></span>
|
||||
<span>姓名：<b>石维国</b></span>
|
||||
<span>身份证号：<b>612427********3417</b></span>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__head"><span class="sec__title">人群分类</span></div>
|
||||
<div class="cls-row" style="padding:0;box-shadow:none;border-radius:0">
|
||||
<label><input type="radio" name="cls">a-大病人群A</label>
|
||||
<label><input type="radio" name="cls" checked onclick="showCls('b')">b-慢病人群B</label>
|
||||
<label><input type="radio" name="cls" onclick="showCls('c')">c-异常人群C</label>
|
||||
<label><input type="radio" name="cls" onclick="showCls('d')">d-风险人群D</label>
|
||||
<label><input type="radio" name="cls" onclick="showCls('e')">e-健康人群E</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- B 慢病人群 -->
|
||||
<div class="sec" id="secB">
|
||||
<div class="sec__head">
|
||||
<span class="sec__title">慢病信息</span>
|
||||
<!-- [交互] 添加一行慢病记录 -->
|
||||
<button class="btn btn--primary" style="height:28px;padding:0 12px">添 加</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th style="width:26%">慢病名称</th><th style="width:16%">确诊年份</th><th style="width:26%">确诊医院</th><th>治疗情况</th><th style="width:50px">操作</th></tr>
|
||||
<tr><td><input value="原发性高血压3级"></td><td><input value="2019"></td><td><input value="定边县人民医院"></td><td><input value="口服降压药，血压控制一般"></td><td><span class="op-del">删除</span></td></tr>
|
||||
<tr><td><input value="2型糖尿病"></td><td><input value="2022"></td><td><input value="CQ能源职工医院"></td><td><input value="二甲双胍治疗，定期监测"></td><td><span class="op-del">删除</span></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- C 异常人群 -->
|
||||
<div class="sec" id="secC" style="display:none">
|
||||
<div class="sec__head">
|
||||
<span class="sec__title">异常指标信息</span>
|
||||
<!-- [交互] 添加时打开「体检报告」指标多选弹窗（旧系统 chooseModal），勾选指标回填本表 -->
|
||||
<a class="link-add" href="javascript:void(0)">＋ 从体检报告添加</a>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>指标名称</th><th>指标值</th><th>参考范围</th><th style="width:12%">确诊年份</th><th style="width:22%">确诊医院</th><th style="width:50px">操作</th></tr>
|
||||
<tr><td>空腹血糖</td><td><input value="7.8"></td><td>3.9~6.1</td><td><input value="2025"></td><td><input value="定边县人民医院"></td><td><span class="op-del">删除</span></td></tr>
|
||||
<tr><td>血清总胆固醇</td><td><input value="6.12"></td><td>0~5.2</td><td><input value="2025"></td><td><input value="定边县人民医院"></td><td><span class="op-del">删除</span></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- D 风险人群 -->
|
||||
<div class="sec" id="secD" style="display:none">
|
||||
<div class="sec__head">
|
||||
<span class="sec__title">风险疾病信息</span>
|
||||
<!-- [交互] 添加时打开「评估结果」多选弹窗 -->
|
||||
<a class="link-add" href="javascript:void(0)">＋ 从评估结果添加</a>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>疾病名称</th><th style="width:24%">风险等级</th><th style="width:20%">评估年份</th><th style="width:50px">操作</th></tr>
|
||||
<tr><td>心脑血管疾病风险</td><td><select><option>中风险</option><option selected>高风险</option></select></td><td><input value="2025"></td><td><span class="op-del">删除</span></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- A 大病人群 -->
|
||||
<div class="sec" id="secA" style="display:none">
|
||||
<div class="sec__head">
|
||||
<span class="sec__title">大病信息</span>
|
||||
<button class="btn btn--primary" style="height:28px;padding:0 12px">添 加</button>
|
||||
</div>
|
||||
<table class="table">
|
||||
<tr><th>大病名称</th><th style="width:12%">确诊年份</th><th style="width:20%">确诊医院</th><th style="width:16%">大病状态</th><th>治疗情况</th><th style="width:50px">操作</th></tr>
|
||||
<tr><td><input value="—"></td><td><input></td><td><input></td><td><select><option>治疗期</option><option>康复期</option></select></td><td><input></td><td><span class="op-del">删除</span></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- E 健康人群 -->
|
||||
<div class="sec" id="secE" style="display:none">
|
||||
<div style="font-size:13px;color:#969eb0;text-align:center;padding:16px 0">健康人群无需登记附加信息</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="drawer__foot">
|
||||
<button class="btn" onclick="history.back()">取 消</button>
|
||||
<!-- [交互] 确认保存五类人群登记信息，返回解读抽屉 -->
|
||||
<button class="btn btn--primary" onclick="history.back()">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// 按人群分类切换信息表显隐
|
||||
function showCls(k) {
|
||||
['A', 'B', 'C', 'D', 'E'].forEach(function (c) {
|
||||
document.getElementById('sec' + c).style.display = c === k.toUpperCase() ? 'block' : 'none';
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,375 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #eef1f6; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-direction: column; flex-shrink: 0; }
|
||||
.drawer__head { height: 56px; background: #fff; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(74,90,127,.06); z-index: 5; }
|
||||
.drawer__back { color: #1890ff; font-size: 14px; cursor: pointer; text-decoration: none; }
|
||||
.drawer__title { font-size: 16px; font-weight: 600; color: #333; flex: 1; }
|
||||
.drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; scrollbar-width: none; }
|
||||
.drawer__body::-webkit-scrollbar { display: none; }
|
||||
.drawer__foot { height: 60px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; box-shadow: 0 -2px 6px rgba(74,90,127,.06); }
|
||||
.btn { height: 32px; padding: 0 18px; 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; }
|
||||
/* 表单分区卡 */
|
||||
.sec { background: #fff; border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 12px; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 22px; }
|
||||
.fld { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.fld--full { grid-column: 1 / -1; }
|
||||
.fld__label { width: 84px; text-align: right; flex-shrink: 0; }
|
||||
.fld__req { color: #fd2121; }
|
||||
.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; }
|
||||
.fld input:focus, .fld textarea:focus, .fld select:focus { border-color: #1890ff; }
|
||||
.fld input[readonly] { background: #f5f6f8; color: #666; }
|
||||
.fld textarea { height: 58px; padding: 7px 10px; resize: none; }
|
||||
.fld__unit { font-size: 12px; color: #969eb0; flex-shrink: 0; }
|
||||
.radio { display: flex; gap: 16px; align-items: center; font-size: 13px; color: #333; flex: 1; }
|
||||
.radio input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
/* 员工查询 */
|
||||
.inquiry { display: flex; gap: 10px; position: relative; }
|
||||
.inquiry select { width: 90px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; font-size: 13px; padding: 0 8px; outline: none; }
|
||||
.inquiry input { width: 260px; height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; }
|
||||
.iq-result { position: absolute; top: 40px; left: 100px; width: 620px; background: #fff; border: 1px solid #d9d9d9; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12); z-index: 10; max-height: 220px; overflow-y: auto; }
|
||||
.iq-result table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.iq-result th { background: #f6f8fc; color: #4a5a7f; font-weight: 500; padding: 8px 10px; text-align: center; }
|
||||
.iq-result td { padding: 8px 10px; text-align: center; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.iq-result tr.row:hover { background: #f2f6ff; cursor: pointer; }
|
||||
/* 慢病标签回显 */
|
||||
.tag { display: inline-block; padding: 2px 10px; border-radius: 4px; font-size: 12px; margin-right: 6px; }
|
||||
.tag--ht { background: rgba(24,144,255,.12); color: #1890ff; }
|
||||
.tag--dm { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.tag--chd { background: rgba(0,195,195,.12); color: #00c3c3; }
|
||||
/* 医药信息 */
|
||||
.med-card { background: #f2f6ff; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; position: relative; }
|
||||
.med-card b { color: #333; font-size: 13px; }
|
||||
.med-card__ops { position: absolute; top: 10px; right: 12px; font-size: 12px; }
|
||||
.op-del { color: #f5222d; cursor: pointer; }
|
||||
.add-med-btn { width: 100%; height: 56px; border: 1px dashed #1890ff; border-radius: 10px; background: #f2f6ff; color: #1890ff; font-size: 14px; cursor: pointer; margin-top: 10px; }
|
||||
.med-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
|
||||
/* 关联随访任务 */
|
||||
.task-opt { border: 1px dashed #1890ff; border-radius: 10px; background: #f7fbff; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; display: flex; align-items: center; gap: 10px; cursor: pointer; }
|
||||
.task-opt input { accent-color: #1890ff; width: 15px; height: 15px; }
|
||||
.task-opt--on { background: #dae3f3; }
|
||||
.pill { display: inline-block; padding: 1px 10px; border-radius: 12px; font-size: 11px; background: rgba(252,163,24,.12); color: #fca318; }
|
||||
/* 签名块 */
|
||||
.sign-box { flex: 1; height: 110px; border: 1px dashed #b7c3d6; border-radius: 8px; background: #f7f9fc; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #969eb0; font-size: 13px; cursor: pointer; }
|
||||
.sign-box svg { width: 22px; height: 22px; stroke: #969eb0; fill: none; stroke-width: 2; }
|
||||
/* 页内弹窗通用 */
|
||||
.overlay { position: absolute; inset: 0; background: rgba(15,23,42,.45); z-index: 60; display: none; align-items: center; justify-content: center; }
|
||||
.overlay.open { display: flex; }
|
||||
.modal { background: #fff; border-radius: 12px; width: 660px; max-height: 600px; 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: 18px 22px; position: relative; 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; }
|
||||
.search-line { display: flex; gap: 10px; margin-bottom: 16px; position: relative; }
|
||||
.search-line input { flex: 1; height: 34px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; outline: none; }
|
||||
.drug-list { position: absolute; top: 44px; left: 0; right: 96px; background: #fff; border: 1px solid #d9d9d9; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12); z-index: 10; max-height: 190px; overflow-y: auto; }
|
||||
.drug-list table { width: 100%; border-collapse: collapse; font-size: 12px; }
|
||||
.drug-list th { background: #f6f8fc; padding: 7px 10px; color: #4a5a7f; font-weight: 500; }
|
||||
.drug-list td { padding: 7px 10px; border-bottom: 1px solid #f0f2f5; text-align: center; color: #333; }
|
||||
.drug-list tr:hover { background: #f2f6ff; cursor: pointer; }
|
||||
.stepper { display: flex; align-items: center; gap: 0; }
|
||||
.stepper button { width: 30px; height: 32px; border: 1px solid #d9dee8; background: #fff; font-size: 15px; cursor: pointer; color: #4a5a7f; }
|
||||
.stepper input { width: 60px; height: 32px; border: 1px solid #d9dee8; border-left: none; border-right: none; text-align: center; font-size: 13px; outline: none; }
|
||||
.ro-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 16px; }
|
||||
.ro-box { background: #f5f6f8; border-radius: 6px; padding: 7px 10px; font-size: 12px; color: #666; line-height: 1.7; }
|
||||
.ro-box b { display: block; color: #333; font-weight: 500; font-size: 13px; }
|
||||
/* 页内弹窗：手写签名 */
|
||||
.sign-modal { background: #fff; border-radius: 12px; width: 820px; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
|
||||
.sign-modal__head { padding: 15px 20px; border-bottom: 1px solid #f0f2f5; display: flex; align-items: center; }
|
||||
.sign-modal__title { font-size: 15px; font-weight: 600; color: #333; flex: 1; }
|
||||
.sign-modal__close { cursor: pointer; color: #999; font-size: 18px; border: none; background: none; }
|
||||
.sign-modal__foot { padding: 13px 20px; border-top: 1px solid #f0f2f5; display: flex; justify-content: flex-end; gap: 10px; }
|
||||
.canvas-wrap { position: relative; margin: 20px; border: 1px solid #ddd; background: #eee; border-radius: 6px; overflow: hidden; }
|
||||
.canvas-wrap canvas { display: block; width: 100%; height: 260px; cursor: crosshair; }
|
||||
.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; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="device-frame">
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回随访管理列表: follow-records.html -->
|
||||
<a class="drawer__back" href="follow-records.html">‹ 返回</a>
|
||||
<span class="drawer__title">新增随访</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>
|
||||
</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="陕E作业区 / 管理四中心" readonly></div>
|
||||
<!-- 慢病标签由员工慢病档案自动回显，不可手工修改 -->
|
||||
<div class="fld fld--full"><span class="fld__label">慢病</span><span style="line-height:26px"><span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span></span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">随访信息</div>
|
||||
<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="2026-09-04" readonly></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>下次随访</span><input value="2026-10-04"></div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>随访形式</span>
|
||||
<span class="radio">
|
||||
<label><input type="radio" name="form" checked>门诊随访</label>
|
||||
<label><input type="radio" name="form">巡诊随访</label>
|
||||
<label><input type="radio" name="form">家庭随访</label>
|
||||
<label><input type="radio" name="form">电话随访</label>
|
||||
</span>
|
||||
</div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>症状</span><textarea placeholder="请输入目前症状与主诉">偶有头晕，血压波动，无胸闷心悸。</textarea></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>效果评价</span>
|
||||
<select><option>良好</option><option selected>一般</option><option>不良</option></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">体征</div>
|
||||
<div class="form-grid">
|
||||
<!-- [交互] 血压按「收缩压/舒张压」格式录入 -->
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>血压</span><input value="158/98" placeholder="收缩压/舒张压"><span class="fld__unit">mmHg</span></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>心率</span><input value="76"><span class="fld__unit">次/分</span></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>血糖</span><input value="8.2"><span class="fld__unit">mmol/L</span></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>身高</span><input value="172"><span class="fld__unit">cm</span></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>体重</span><input value="78.5"><span class="fld__unit">kg</span></div>
|
||||
<!-- [交互] BMI 由身高体重自动计算，只读 -->
|
||||
<div class="fld"><span class="fld__label">BMI</span><input value="26.5" readonly></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>腰围</span><input value="94"><span class="fld__unit">cm</span></div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>臀围</span><input value="98"><span class="fld__unit">cm</span></div>
|
||||
<!-- [交互] 腰身比由腰围臀围自动计算，只读 -->
|
||||
<div class="fld"><span class="fld__label">腰身比</span><input value="0.96" readonly></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活方式</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld"><span class="fld__label">吸烟量</span><input value="10"><span class="fld__unit">支/日</span></div>
|
||||
<div class="fld"><span class="fld__label">饮酒量</span><input value="0"><span class="fld__unit">两/日</span></div>
|
||||
<div class="fld"><span class="fld__label">运动频率</span><input value="3"><span class="fld__unit">次/周</span></div>
|
||||
<div class="fld"><span class="fld__label">运动时长</span><input value="30"><span class="fld__unit">分钟/次</span></div>
|
||||
<div class="fld"><span class="fld__label">摄盐情况</span>
|
||||
<span class="radio"><label><input type="radio" name="salt">轻</label><label><input type="radio" name="salt">中</label><label><input type="radio" name="salt" checked>重</label></span>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label">心理调整</span>
|
||||
<select><option selected>良好</option><option>一般</option><option>差</option></select>
|
||||
</div>
|
||||
<div class="fld fld--full"><span class="fld__label">遵医行为</span>
|
||||
<span class="radio"><label><input type="radio" name="comp" >良好</label><label><input type="radio" name="comp" checked>一般</label><label><input type="radio" name="comp">差</label></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<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"><span class="op-del">删除</span></div></div>
|
||||
<div class="med-card"><b>二甲双胍缓释片</b>（0.5g×30片 · 32.40元）<br>数量：1盒 用法用量：口服，一日2次，一次1片<div class="med-card__ops"><span class="op-del">删除</span></div></div>
|
||||
</div>
|
||||
<!-- [交互] 点击打开页内「新增用药」弹窗 -->
|
||||
<button class="add-med-btn" onclick="openModal('medModal')">＋ 新增用药</button>
|
||||
<div class="form-grid" style="margin-top:14px">
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>用药依从性</span>
|
||||
<span class="radio"><label><input type="radio" name="adh">规律用药</label><label><input type="radio" name="adh" checked>间断用药</label><label><input type="radio" name="adh">自行停药</label></span>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label"><span class="fld__req">*</span>药物不良反应</span>
|
||||
<!-- [交互] 选择「存在」时追加不良反应描述必填 -->
|
||||
<span class="radio"><label><input type="radio" name="adr" checked>无</label><label><input type="radio" name="adr">存在</label></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">风险评估</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>原因</span><input placeholder="请输入导致指标异常或病情波动的原因" value="服药不规律、高盐饮食、吸烟"></div>
|
||||
<div class="fld fld--full"><span class="fld__label"><span class="fld__req">*</span>措施</span><input placeholder="请输入干预措施" value="调整降压方案，加强戒烟与限盐宣教"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活建议</div>
|
||||
<div class="form-grid">
|
||||
<div class="fld fld--full"><span class="fld__label">膳食处方</span><textarea placeholder="请输入膳食处方">低盐低脂，每日主食控制在6两以内，增加蔬菜与粗粮。</textarea></div>
|
||||
<div class="fld fld--full"><span class="fld__label">运动处方</span><textarea placeholder="请输入运动处方">每日快走30分钟，每周不少于5次，避免清晨剧烈运动。</textarea></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">关联任务</div>
|
||||
<!-- [交互] 员工存在待随访的巡诊任务时在此显示，勾选后随本次随访一并处理；选中态底色加深 -->
|
||||
<label class="task-opt task-opt--on" onclick="this.classList.toggle('task-opt--on')">
|
||||
<input type="checkbox" checked>
|
||||
<span style="flex:1">2026年第三季度高血压随访任务<br><span style="color:#969eb0">任务来源：慢病干预计划 随访时限：2026-09-06 前</span></span>
|
||||
<span class="pill">待随访 · 还剩2天</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="drawer__foot">
|
||||
<button class="btn" onclick="location.href='follow-records.html'">取 消</button>
|
||||
<!-- [交互] 确认提交随访记录（必填项缺失时旧系统逐项提示），返回随访管理列表 -->
|
||||
<button class="btn btn--primary" onclick="location.href='follow-records.html'">确 认</button>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：新增用药 -->
|
||||
<div class="overlay" id="medModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head"><span class="modal__title">新增用药</span><button class="modal__close" onclick="closeModal('medModal')">✕</button></div>
|
||||
<div class="modal__body">
|
||||
<div class="search-line">
|
||||
<input placeholder="请输入药品名称查询" value="氨氯地平">
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<div class="drug-list">
|
||||
<table>
|
||||
<tr><th>名称</th><th>规格</th><th>单位</th><th>售价(元)</th><th>库存</th></tr>
|
||||
<tr onclick="pickDrug(this)"><td>苯磺酸氨氯地平片</td><td>5mg×7片</td><td>盒</td><td>23.80</td><td>86</td></tr>
|
||||
<tr onclick="pickDrug(this)"><td>苯磺酸左氨氯地平片</td><td>2.5mg×14片</td><td>盒</td><td>28.50</td><td>40</td></tr>
|
||||
<tr onclick="pickDrug(this)"><td>氨氯地平贝那普利片</td><td>5mg×7片</td><td>盒</td><td>45.00</td><td>12</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ro-row" style="margin-top:210px">
|
||||
<div class="ro-box">规格<b>5mg×7片</b></div>
|
||||
<div class="ro-box">单位<b>盒</b></div>
|
||||
<div class="ro-box">售价<b>23.80 元</b></div>
|
||||
<div class="ro-box">库存<b>86</b></div>
|
||||
</div>
|
||||
<div class="fld" style="margin-bottom:14px"><span class="fld__label" style="width:88px"><span class="fld__req">*</span>数量</span>
|
||||
<span class="stepper">
|
||||
<button onclick="step(-1)">−</button><input id="qty" value="2"><button onclick="step(1)">＋</button>
|
||||
</span>
|
||||
<span style="font-size:12px;color:#969eb0;margin-left:8px">不可超过库存 86</span>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label" style="width:88px"><span class="fld__req">*</span>用法用量</span><input value="口服，一日1次，一次1片"></div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('medModal')">取 消</button>
|
||||
<!-- [交互] 确认后生成一张用药卡片加入用药情况 -->
|
||||
<button class="btn btn--primary" onclick="closeModal('medModal')">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：手写签名 -->
|
||||
<div class="overlay" id="signModal">
|
||||
<div class="sign-modal">
|
||||
<div class="sign-modal__head">
|
||||
<span class="sign-modal__title">员工签名</span>
|
||||
<button class="sign-modal__close" onclick="closeSign()">✕</button>
|
||||
</div>
|
||||
<div class="canvas-wrap">
|
||||
<canvas id="signCanvas" width="780" height="260"></canvas>
|
||||
<div class="canvas-hint" id="signHint">请在区域内签名<div style="font-size:12px">保证字迹清晰可辨</div></div>
|
||||
<button class="eraser" onclick="clearCanvas()" title="清空">
|
||||
<svg viewBox="0 0 24 24"><path d="M20 20H8.5l-4-4a2 2 0 010-2.8l8.2-8.2a2 2 0 012.8 0l5 5a2 2 0 010 2.8L13 20M8 11l6 6"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="sign-modal__foot">
|
||||
<button class="btn" onclick="closeSign()">取 消</button>
|
||||
<!-- [交互] 确认生成签名图片回填签字位（未签字时提示「您还没有进行签字！」） -->
|
||||
<button class="btn btn--primary" onclick="confirmSign()">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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'; }
|
||||
// 药品选中：隐藏结果浮层并回填只读区
|
||||
function pickDrug(tr) {
|
||||
document.querySelector('.drug-list').style.display = 'none';
|
||||
var tds = tr.querySelectorAll('td');
|
||||
var boxes = document.querySelectorAll('.ro-box b');
|
||||
boxes[0].textContent = tds[1].textContent;
|
||||
boxes[1].textContent = tds[2].textContent;
|
||||
boxes[2].textContent = tds[3].textContent + ' 元';
|
||||
boxes[3].textContent = tds[4].textContent;
|
||||
}
|
||||
// 数量步进（上限为库存）
|
||||
function step(d) {
|
||||
var el = document.getElementById('qty');
|
||||
var v = parseInt(el.value || '1', 10) + d;
|
||||
if (v < 1) v = 1;
|
||||
if (v > 86) v = 86;
|
||||
el.value = v;
|
||||
}
|
||||
// 手写签名（页内弹窗）
|
||||
function openSign() { document.getElementById('signModal').classList.add('open'); }
|
||||
function closeSign() { document.getElementById('signModal').classList.remove('open'); }
|
||||
var canvas = document.getElementById('signCanvas');
|
||||
var ctx = canvas.getContext('2d');
|
||||
var drawing = false, hasInk = false;
|
||||
ctx.lineWidth = 3; ctx.lineCap = 'round'; ctx.strokeStyle = '#333';
|
||||
function pos(e) {
|
||||
var r = canvas.getBoundingClientRect();
|
||||
return { x: (e.clientX - r.left) * (canvas.width / r.width), y: (e.clientY - r.top) * (canvas.height / r.height) };
|
||||
}
|
||||
canvas.addEventListener('mousedown', function (e) { drawing = true; var p = pos(e); ctx.beginPath(); ctx.moveTo(p.x, p.y); });
|
||||
canvas.addEventListener('mousemove', function (e) {
|
||||
if (!drawing) return;
|
||||
var p = pos(e); ctx.lineTo(p.x, p.y); ctx.stroke(); hasInk = true;
|
||||
document.getElementById('signHint').style.display = 'none';
|
||||
});
|
||||
window.addEventListener('mouseup', function () { drawing = false; });
|
||||
function clearCanvas() {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
hasInk = false;
|
||||
document.getElementById('signHint').style.display = 'flex';
|
||||
}
|
||||
function confirmSign() {
|
||||
if (!hasInk) { alert('您还没有进行签字！'); return; }
|
||||
var box = document.querySelector('.sign-box');
|
||||
box.innerHTML = '<span style="font-size:26px;font-family:KaiTi,serif;color:#333">岳春生</span><span style="font-size:11px">已签名 · 点击可重签</span>';
|
||||
closeSign();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,262 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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__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; }
|
||||
.btn--danger { background: #fff; border-color: #ffa39e; color: #f5222d; }
|
||||
/* 随访卡片 */
|
||||
.fgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 14px; }
|
||||
.fcard { background: #fff; border-radius: 18px; padding: 16px; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; }
|
||||
.fcard:hover { box-shadow: 0 8px 20px rgba(74,90,127,.16); }
|
||||
.fcard__top { display: flex; align-items: center; gap: 10px; }
|
||||
.avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.fcard__name { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.fcard__name small { font-weight: 400; color: #969eb0; font-size: 12px; margin-left: 5px; }
|
||||
.pill { padding: 3px 12px; border-radius: 14px; font-size: 12px; }
|
||||
.pill--times { background: rgba(49,156,255,.1); color: #319cff; margin-left: auto; }
|
||||
.pill--wait { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
.pill--over { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.fcard__lines { margin-top: 12px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.fcard__lines b { color: #333; font-weight: 500; }
|
||||
.tag { display: inline-block; padding: 1px 8px; border-radius: 4px; font-size: 11px; margin-right: 4px; }
|
||||
.tag--ht { background: rgba(24,144,255,.12); color: #1890ff; }
|
||||
.tag--dm { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.tag--chd { background: rgba(0,195,195,.12); color: #00c3c3; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* 页内弹窗：随访详情 */
|
||||
.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: 760px; max-height: 700px; 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; background: #f8fafc; }
|
||||
.modal__body::-webkit-scrollbar { display: none; }
|
||||
.modal__foot { padding: 13px 20px; border-top: 1px solid #f0f2f5; display: flex; justify-content: space-between; align-items: center; }
|
||||
.modal__tip { font-size: 12px; color: #969eb0; }
|
||||
.sec { background: #fff; border-radius: 10px; padding: 12px 16px; margin-bottom: 12px; }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 10px; display: flex; align-items: center; }
|
||||
.sec__title .file-link { margin-left: auto; font-size: 12px; font-weight: 400; color: #1890ff; background: #e7f4ff; border-radius: 12px; padding: 3px 12px; cursor: pointer; text-decoration: none; }
|
||||
.kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px 18px; font-size: 12px; color: #4a5a7f; line-height: 1.9; }
|
||||
.kv--2 { grid-template-columns: repeat(2, 1fr); }
|
||||
.kv b { color: #333; font-weight: 500; }
|
||||
.kv__full { grid-column: 1 / -1; }
|
||||
.link-cell { color: #1890ff; font-size: 11px; }
|
||||
.med-card { background: #f2f6ff; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; }
|
||||
.med-card b { color: #333; font-size: 13px; }
|
||||
.task-link { border: 1px dashed #1890ff; border-radius: 10px; background: #f7fbff; padding: 10px 14px; font-size: 12px; color: #4a5a7f; line-height: 1.9; }
|
||||
.sign-img { height: 90px; border: 1px solid #e5e8ef; border-radius: 8px; display: flex; align-items: center; justify-content: center; background: #fbfcfe; }
|
||||
.sign-img span { font-family: KaiTi, serif; font-size: 30px; color: #333; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item nav__item--active" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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" 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>
|
||||
</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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span>共 8 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">2</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：随访详情 -->
|
||||
<div class="overlay" id="detailModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head">
|
||||
<span class="modal__title">随访详情</span>
|
||||
<button class="modal__close" onclick="closeModal('detailModal')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="sec">
|
||||
<div class="sec__title">基本信息
|
||||
<!-- [交互] 跳转员工档案详情: employee-file-detail.html -->
|
||||
<a class="file-link" href="employee-file-detail.html">查看员工档案</a>
|
||||
</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>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">随访信息</div>
|
||||
<div class="kv kv--2">
|
||||
<div>随访医生：<b>石维国</b></div><div>随访时间：<b>2026-08-20 10:15</b></div>
|
||||
<div>随访形式：<b>门诊随访</b></div><div>效果评价：<b>良好</b></div>
|
||||
<div>下次随访：<b>2026-09-20</b></div><div>症状：<b>偶有头晕，血压波动</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">体征</div>
|
||||
<div class="kv">
|
||||
<div>血压：<b>158/98 mmHg</b></div><div>心率：<b>76 次/分</b></div><div>血糖：<b>8.2 mmol/L</b></div>
|
||||
<div>身高：<b>172 cm</b></div><div>体重：<b>78.5 kg</b></div><div>BMI：<b>26.5（自动）</b></div>
|
||||
<div>腰围：<b>94 cm</b></div><div>臀围：<b>98 cm</b></div><div>腰身比：<b>0.96（自动）</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">生活方式</div>
|
||||
<div class="kv kv--2">
|
||||
<div>吸烟量：<b>10 支/日</b></div><div>饮酒量：<b>偶尔</b></div>
|
||||
<div>运动：<b>3 次/周 · 30 分钟/次</b></div><div>摄盐情况：<b>偏重</b></div>
|
||||
<div>心理调整：<b>良好</b></div><div>遵医行为：<b>一般（服药不规律）</b></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">用药情况</div>
|
||||
<div class="med-card" style="margin-bottom:8px"><b>苯磺酸氨氯地平片</b> 5mg×7片 数量2盒<br>口服，一日1次，一次1片</div>
|
||||
<div class="kv kv--2"><div>用药依从性：<b>一般</b></div><div>药物不良反应：<b>无</b></div></div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">风险评估与生活建议</div>
|
||||
<div class="kv" style="grid-template-columns:1fr">
|
||||
<div>原因：<b>服药不规律、高盐饮食、吸烟</b></div>
|
||||
<div>措施：<b>调整降压方案，加强戒烟与限盐宣教</b></div>
|
||||
<div>膳食处方：<b>低盐低脂，每日主食控制在 6 两以内</b></div>
|
||||
<div>运动处方：<b>每日快走 30 分钟，每周不少于 5 次</b></div>
|
||||
</div>
|
||||
</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>
|
||||
<div class="sec">
|
||||
<div class="sec__title">员工签字</div>
|
||||
<div class="sign-img"><span>岳春生</span></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('detailModal');location.href='follow-drawer.html'">编 辑</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,185 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #eef1f6; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-direction: column; flex-shrink: 0; }
|
||||
.drawer__head { height: 56px; background: #fff; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(74,90,127,.06); z-index: 5; }
|
||||
.drawer__back { color: #1890ff; font-size: 14px; cursor: pointer; text-decoration: none; }
|
||||
.drawer__title { font-size: 16px; font-weight: 600; color: #333; flex: 1; }
|
||||
.drawer__body { flex: 1; overflow-y: auto; padding: 16px 24px; scrollbar-width: none; }
|
||||
.drawer__body::-webkit-scrollbar { display: none; }
|
||||
.drawer__foot { height: 60px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; box-shadow: 0 -2px 6px rgba(74,90,127,.06); }
|
||||
.btn { height: 32px; padding: 0 18px; 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; }
|
||||
.sec { background: #fff; border-radius: 12px; padding: 14px 18px; margin-bottom: 14px; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 12px; }
|
||||
.sec__tip { font-size: 12px; font-weight: 400; color: #969eb0; margin-left: 10px; }
|
||||
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 22px; }
|
||||
.fld { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #4a5a7f; }
|
||||
.fld--full { grid-column: 1 / -1; }
|
||||
.fld__label { width: 84px; 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 input[readonly] { background: #f5f6f8; color: #666; }
|
||||
.fld textarea { height: 96px; padding: 7px 10px; resize: none; }
|
||||
.fld__unit { font-size: 12px; color: #969eb0; flex-shrink: 0; }
|
||||
.radio { display: flex; gap: 18px; align-items: center; font-size: 13px; color: #333; }
|
||||
.radio input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
/* 现场照片上传 */
|
||||
.up-grid { display: flex; gap: 12px; flex-wrap: wrap; }
|
||||
.up-cell { width: 116px; height: 78px; border-radius: 8px; background: #e8edf5; position: relative; display: flex; align-items: center; justify-content: center; }
|
||||
.up-cell svg { width: 22px; height: 22px; stroke: #b3bfce; fill: none; stroke-width: 2; }
|
||||
.up-cell__del { position: absolute; top: -8px; right: -8px; width: 20px; height: 20px; border-radius: 50%; background: #f5222d; color: #fff; font-size: 12px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
|
||||
.up-add { width: 116px; height: 78px; border-radius: 8px; border: 1px dashed #1890ff; background: #f2f6ff; color: #1890ff; font-size: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; cursor: pointer; }
|
||||
.up-add svg { width: 20px; height: 20px; stroke: #1890ff; fill: none; stroke-width: 2; }
|
||||
/* 宣教资料 */
|
||||
.file-line { display: flex; align-items: center; gap: 8px; background: #f5f6f8; border-radius: 8px; padding: 8px 12px; font-size: 12px; color: #333; margin-bottom: 8px; }
|
||||
.file-line svg { width: 16px; height: 16px; stroke: #1890ff; fill: none; stroke-width: 2; flex-shrink: 0; }
|
||||
.file-line .size { color: #969eb0; margin-left: auto; }
|
||||
.file-line .x { color: #f5222d; cursor: pointer; }
|
||||
.file-add { width: 100%; height: 40px; border: 1px dashed #1890ff; border-radius: 8px; background: #f2f6ff; color: #1890ff; font-size: 13px; cursor: pointer; }
|
||||
/* 签名块 */
|
||||
.sign-box { flex: 1; height: 110px; border: 1px dashed #b7c3d6; border-radius: 8px; background: #f7f9fc; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #969eb0; font-size: 13px; cursor: pointer; }
|
||||
.sign-box svg { width: 22px; height: 22px; stroke: #969eb0; fill: none; stroke-width: 2; }
|
||||
.sign-note { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #4a5a7f; margin-top: 10px; }
|
||||
.sign-note input { accent-color: #1890ff; width: 14px; height: 14px; }
|
||||
/* 页内弹窗：手写签名 */
|
||||
.overlay { position: absolute; inset: 0; background: rgba(15,23,42,.45); z-index: 60; display: none; align-items: center; justify-content: center; }
|
||||
.overlay.open { display: flex; }
|
||||
.sign-modal { background: #fff; border-radius: 12px; width: 820px; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
|
||||
.sign-modal__head { padding: 15px 20px; border-bottom: 1px solid #f0f2f5; display: flex; align-items: center; }
|
||||
.sign-modal__title { font-size: 15px; font-weight: 600; color: #333; flex: 1; }
|
||||
.sign-modal__close { cursor: pointer; color: #999; font-size: 18px; border: none; background: none; }
|
||||
.sign-modal__foot { padding: 13px 20px; border-top: 1px solid #f0f2f5; display: flex; justify-content: flex-end; gap: 10px; }
|
||||
.canvas-wrap { position: relative; margin: 20px; border: 1px solid #ddd; background: #eee; border-radius: 6px; overflow: hidden; }
|
||||
.canvas-wrap canvas { display: block; width: 100%; height: 260px; cursor: crosshair; }
|
||||
.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; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="device-frame">
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回健康宣教列表: health-education.html -->
|
||||
<a class="drawer__back" href="health-education.html">‹ 返回</a>
|
||||
<span class="drawer__title">新增健康宣教 / 急救培训</span>
|
||||
</div>
|
||||
|
||||
<div class="drawer__body">
|
||||
<div class="sec">
|
||||
<div class="sec__title">活动信息</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="type" checked>健康宣教</label><label><input type="radio" name="type">急救培训</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><input value="2026-09-04" readonly></div>
|
||||
<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>
|
||||
|
||||
<div class="sec">
|
||||
<div class="sec__title">现场照片<span class="sec__tip">最多 9 张，支持拍照或从相册选择</span></div>
|
||||
<div class="up-grid">
|
||||
<!-- [交互] 上传后展示缩略图，右上角红叉删除 -->
|
||||
<div class="up-cell"><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><span class="up-cell__del">✕</span></div>
|
||||
<div class="up-cell"><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><span class="up-cell__del">✕</span></div>
|
||||
<!-- [交互] 点击调起相册/拍照 -->
|
||||
<div class="up-add" onclick="alert('调起相册/拍照（原型演示）')"><svg viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>上传照片</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<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.2 MB</span><span class="x">✕</span></div>
|
||||
<!-- [交互] 上传宣教资料附件（pdf/doc/图片等） -->
|
||||
<button class="file-add" onclick="alert('选择文件上传（原型演示）')">＋ 添加资料</button>
|
||||
</div>
|
||||
|
||||
<div class="sec">
|
||||
<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>
|
||||
</div>
|
||||
<!-- [交互] 未勾选时提交提示「请确认本单位已确认」 -->
|
||||
<label class="sign-note"><input type="checkbox" checked>本人签字确认本单位已确认该宣教/培训记录真实有效</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="drawer__foot">
|
||||
<button class="btn" onclick="location.href='health-education.html'">取 消</button>
|
||||
<!-- [交互] 确认提交宣教记录，返回健康宣教列表 -->
|
||||
<button class="btn btn--primary" onclick="location.href='health-education.html'">确 认</button>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：手写签名 -->
|
||||
<div class="overlay" id="signModal">
|
||||
<div class="sign-modal">
|
||||
<div class="sign-modal__head">
|
||||
<span class="sign-modal__title">负责人签名</span>
|
||||
<button class="sign-modal__close" onclick="closeSign()">✕</button>
|
||||
</div>
|
||||
<div class="canvas-wrap">
|
||||
<canvas id="signCanvas" width="780" height="260"></canvas>
|
||||
<div class="canvas-hint" id="signHint">请在区域内签名<div style="font-size:12px">保证字迹清晰可辨</div></div>
|
||||
<button class="eraser" onclick="clearCanvas()" title="清空">
|
||||
<svg viewBox="0 0 24 24"><path d="M20 20H8.5l-4-4a2 2 0 010-2.8l8.2-8.2a2 2 0 012.8 0l5 5a2 2 0 010 2.8L13 20M8 11l6 6"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="sign-modal__foot">
|
||||
<button class="btn" onclick="closeSign()">取 消</button>
|
||||
<!-- [交互] 确认生成签名图片回填签字位（未签字时提示「您还没有进行签字！」） -->
|
||||
<button class="btn btn--primary" onclick="confirmSign()">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openSign() { document.getElementById('signModal').classList.add('open'); }
|
||||
function closeSign() { document.getElementById('signModal').classList.remove('open'); }
|
||||
var canvas = document.getElementById('signCanvas');
|
||||
var ctx = canvas.getContext('2d');
|
||||
var drawing = false, hasInk = false;
|
||||
ctx.lineWidth = 3; ctx.lineCap = 'round'; ctx.strokeStyle = '#333';
|
||||
function pos(e) {
|
||||
var r = canvas.getBoundingClientRect();
|
||||
return { x: (e.clientX - r.left) * (canvas.width / r.width), y: (e.clientY - r.top) * (canvas.height / r.height) };
|
||||
}
|
||||
canvas.addEventListener('mousedown', function (e) { drawing = true; var p = pos(e); ctx.beginPath(); ctx.moveTo(p.x, p.y); });
|
||||
canvas.addEventListener('mousemove', function (e) {
|
||||
if (!drawing) return;
|
||||
var p = pos(e); ctx.lineTo(p.x, p.y); ctx.stroke(); hasInk = true;
|
||||
document.getElementById('signHint').style.display = 'none';
|
||||
});
|
||||
window.addEventListener('mouseup', function () { drawing = false; });
|
||||
function clearCanvas() {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
hasInk = false;
|
||||
document.getElementById('signHint').style.display = 'flex';
|
||||
}
|
||||
function confirmSign() {
|
||||
if (!hasInk) { alert('您还没有进行签字！'); return; }
|
||||
var box = document.querySelector('.sign-box');
|
||||
box.innerHTML = '<span style="font-size:26px;font-family:KaiTi,serif;color:#333">石维国</span><span style="font-size:11px">已签名 · 点击可重签</span>';
|
||||
closeSign();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,263 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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__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; }
|
||||
/* 宣教/培训 Tab（下划线式） */
|
||||
.tabs-row { display: flex; gap: 26px; margin-top: 14px; border-bottom: 1px solid #e3e8f0; }
|
||||
.tabs-row__item { padding: 10px 2px; font-size: 14px; color: #4a5a7f; cursor: pointer; border-bottom: 2.5px solid transparent; margin-bottom: -1px; }
|
||||
.tabs-row__item.on { color: #1890ff; border-color: #1890ff; font-weight: 600; }
|
||||
.tabs-row__item small { color: #969eb0; font-weight: 400; margin-left: 4px; }
|
||||
/* 宣教卡片：蓝头大圆角 */
|
||||
.egrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 14px; }
|
||||
.egcard { background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; }
|
||||
.egcard:hover { box-shadow: 0 8px 20px rgba(74,90,127,.16); }
|
||||
.egcard__head { height: 62px; background: linear-gradient(135deg, #1890ff, #63b3ff); border-radius: 60px 60px 25px 25px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: #fff; }
|
||||
.egcard__title { font-size: 15px; font-weight: 600; }
|
||||
.egcard__date { font-size: 11px; opacity: .85; }
|
||||
.egcard__body { padding: 12px 16px 14px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.egcard__body b { color: #333; font-weight: 500; }
|
||||
.egcard__brief { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #969eb0; }
|
||||
.photos { display: flex; gap: 8px; overflow-x: auto; margin-top: 8px; scrollbar-width: none; }
|
||||
.photos::-webkit-scrollbar { display: none; }
|
||||
.photos i { flex-shrink: 0; width: 72px; height: 46px; border-radius: 6px; background: #e8edf5; display: flex; align-items: center; justify-content: center; }
|
||||
.photos i svg { width: 18px; height: 18px; stroke: #b3bfce; fill: none; stroke-width: 2; }
|
||||
.panel { display: none; }
|
||||
.panel.on { display: block; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* 页内弹窗：宣教详情 */
|
||||
.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: 760px; max-height: 680px; 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; }
|
||||
.pill { display: inline-block; padding: 2px 10px; border-radius: 12px; font-size: 11px; background: rgba(49,156,255,.1); color: #319cff; margin-left: 8px; vertical-align: 2px; }
|
||||
.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; background: #f8fafc; }
|
||||
.modal__body::-webkit-scrollbar { display: none; }
|
||||
.modal__foot { padding: 13px 20px; border-top: 1px solid #f0f2f5; display: flex; justify-content: flex-end; gap: 10px; }
|
||||
.sec { background: #fff; border-radius: 10px; padding: 12px 16px; margin-bottom: 12px; }
|
||||
.sec__title { font-size: 14px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 10px; }
|
||||
.kv { display: grid; grid-template-columns: repeat(3, 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; }
|
||||
.file-line { display: flex; align-items: center; gap: 8px; background: #f5f6f8; border-radius: 8px; padding: 8px 12px; font-size: 12px; color: #333; margin-top: 8px; }
|
||||
.file-line svg { width: 16px; height: 16px; stroke: #1890ff; fill: none; stroke-width: 2; flex-shrink: 0; }
|
||||
.file-line .size { color: #969eb0; margin-left: auto; }
|
||||
.file-line a { color: #1890ff; text-decoration: none; }
|
||||
.sign-img { height: 84px; border: 1px solid #e5e8ef; border-radius: 8px; display: flex; align-items: center; justify-content: center; background: #fbfcfe; }
|
||||
.sign-img span { font-family: KaiTi, serif; font-size: 28px; color: #333; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item nav__item--active" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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" style="min-width:200px" placeholder="开始日期 ~ 结束日期"></div>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
<!-- [交互] 点击打开新增宣教/培训抽屉: health-education-drawer.html -->
|
||||
<button class="btn btn--primary" style="height:36px;padding:0 20px;flex-shrink:0" onclick="location.href='health-education-drawer.html'">＋ 新增记录</button>
|
||||
</div>
|
||||
|
||||
<div class="tabs-row">
|
||||
<!-- [交互] Tab 切换健康宣教与急救培训两个列表 -->
|
||||
<span class="tabs-row__item on" onclick="switchTab('xj',this)">健康宣教<small>(4)</small></span>
|
||||
<span class="tabs-row__item" onclick="switchTab('jj',this)">急救培训<small>(2)</small></span>
|
||||
</div>
|
||||
|
||||
<!-- 健康宣教 -->
|
||||
<div class="panel on" id="p-xj">
|
||||
<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="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="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="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="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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 急救培训 -->
|
||||
<div class="panel" id="p-jj">
|
||||
<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="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="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>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span>共 6 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：宣教/培训详情 -->
|
||||
<div class="overlay" id="detailModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head">
|
||||
<span class="modal__title">夏季心脑血管疾病预防<span class="pill">健康宣教</span></span>
|
||||
<button class="modal__close" onclick="closeModal('detailModal')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<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>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">宣教内容</div>
|
||||
<div style="font-size:12px;color:#4a5a7f;line-height:2">针对高温作业人群讲解中暑识别与心脑血管急症的日常预防要点：避免正午长时间露天作业、少量多次补水、晨起一杯温水；发放低盐膳食手册并现场答疑。对已纳入慢病干预的高血压职工重点提示规律服药与自测血压方法。</div>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<div class="sec__title">现场照片</div>
|
||||
<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="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>
|
||||
<div class="sec" style="margin-bottom:0">
|
||||
<div class="sec__title">负责人签字</div>
|
||||
<div class="sign-img"><span>石维国</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
function switchTab(name, el) {
|
||||
document.querySelectorAll('.tabs-row__item').forEach(function (t) { t.classList.remove('on'); });
|
||||
el.classList.add('on');
|
||||
document.querySelectorAll('.panel').forEach(function (p) { p.classList.remove('on'); });
|
||||
document.getElementById('p-' + name).classList.add('on');
|
||||
}
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,216 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-direction: column; flex-shrink: 0; }
|
||||
/* 抽屉头 */
|
||||
.drawer__head { height: 56px; background: #fff; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; box-shadow: 0 2px 6px rgba(74,90,127,.06); z-index: 5; }
|
||||
.drawer__back { color: #1890ff; font-size: 14px; cursor: pointer; text-decoration: none; display: flex; align-items: center; gap: 4px; }
|
||||
.drawer__title { font-size: 16px; font-weight: 600; color: #333; flex: 1; }
|
||||
.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; }
|
||||
.btn--danger { background: #fff; border-color: #ffa39e; color: #f5222d; }
|
||||
/* 双栏主体 */
|
||||
.drawer__body { flex: 1; display: flex; min-height: 0; }
|
||||
.col-report { flex: 1.15; border-right: 1px dashed #d9dee8; overflow-y: auto; padding: 16px 18px; scrollbar-width: none; }
|
||||
.col-report::-webkit-scrollbar { display: none; }
|
||||
.col-form { flex: 1; overflow-y: auto; padding: 16px 18px; scrollbar-width: none; background: #fafbfd; }
|
||||
.col-form::-webkit-scrollbar { display: none; }
|
||||
/* 报告解读样式（与员工档案「查看体检报告」弹窗同构） */
|
||||
.rpt-title { font-size: 15px; font-weight: 600; color: #333; margin: 14px 0 8px; padding-left: 8px; border-left: 4px solid #e3cb2c; }
|
||||
.rpt-title--sub { border-left-color: #02c2a6; }
|
||||
.rpt-text { font-size: 12px; color: #4a5a7f; line-height: 1.9; }
|
||||
.rpt-major { background: #f6f6f6; border-radius: 8px; padding: 8px 12px; font-size: 13px; font-weight: 600; color: #333; margin: 12px 0 8px; }
|
||||
.rpt-table { width: 100%; border-collapse: collapse; font-size: 12px; margin-bottom: 6px; }
|
||||
.rpt-table th { background: #f0f2ff; color: #4a5a7f; font-weight: 500; padding: 7px 10px; text-align: left; }
|
||||
.rpt-table td { padding: 7px 10px; border-bottom: 1px solid #f0f2f5; color: #333; }
|
||||
.rpt-table td.abnormal { color: #f5222d; font-weight: 600; }
|
||||
/* 表单 */
|
||||
.form-card { background: #fff; border-radius: 10px; padding: 14px 16px; margin-bottom: 12px; box-shadow: 0 2px 8px rgba(74,90,127,.05); }
|
||||
.form-card__title { font-size: 14px; font-weight: 600; color: #333; margin-bottom: 10px; padding-left: 8px; border-left: 3px solid #1890ff; }
|
||||
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; font-size: 12px; color: #4a5a7f; line-height: 2.1; }
|
||||
.form-grid b { color: #333; font-weight: 500; }
|
||||
.fld { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: #4a5a7f; margin-bottom: 12px; }
|
||||
.fld__label { width: 100px; text-align: right; flex-shrink: 0; padding-top: 6px; }
|
||||
.fld__req { color: #fd2121; }
|
||||
.fld textarea, .fld select { flex: 1; border: 1px solid #d9dee8; border-radius: 6px; padding: 7px 10px; font-size: 13px; color: #333; outline: none; font-family: inherit; min-width: 0; }
|
||||
.fld textarea { resize: none; height: 76px; }
|
||||
.fld textarea:focus, .fld select:focus { border-color: #1890ff; }
|
||||
/* 签名块 */
|
||||
.sign-box { flex: 1; height: 130px; border: 1px dashed #b7c3d6; border-radius: 8px; background: #f7f9fc; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #969eb0; font-size: 13px; cursor: pointer; }
|
||||
.sign-box svg { width: 22px; height: 22px; stroke: #969eb0; fill: none; stroke-width: 2; }
|
||||
.drawer__foot { height: 60px; background: #fff; display: flex; align-items: center; justify-content: center; gap: 14px; flex-shrink: 0; box-shadow: 0 -2px 6px rgba(74,90,127,.06); }
|
||||
/* 页内弹窗：手写签名 */
|
||||
.overlay { position: absolute; inset: 0; background: rgba(15,23,42,.45); z-index: 60; display: none; align-items: center; justify-content: center; }
|
||||
.overlay.open { display: flex; }
|
||||
.sign-modal { background: #fff; border-radius: 12px; width: 820px; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
|
||||
.sign-modal__head { padding: 15px 20px; border-bottom: 1px solid #f0f2f5; display: flex; align-items: center; }
|
||||
.sign-modal__title { font-size: 15px; font-weight: 600; color: #333; flex: 1; }
|
||||
.sign-modal__close { cursor: pointer; color: #999; font-size: 18px; border: none; background: none; }
|
||||
.sign-modal__foot { padding: 13px 20px; border-top: 1px solid #f0f2f5; display: flex; justify-content: flex-end; gap: 10px; }
|
||||
.canvas-wrap { position: relative; margin: 20px; border: 1px solid #ddd; background: #eee; border-radius: 6px; overflow: hidden; }
|
||||
.canvas-wrap canvas { display: block; width: 100%; height: 300px; cursor: crosshair; }
|
||||
.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; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="device-frame">
|
||||
<div class="drawer__head">
|
||||
<!-- [交互] 返回上一页（未保存时旧系统弹确认，此处直接返回）: history.back() -->
|
||||
<a class="drawer__back" href="javascript:history.back()">‹ 返回</a>
|
||||
<span class="drawer__title">解读报告</span>
|
||||
<!-- [状态] 已解读记录从「报告解读」页进入时，此处显示「重新解读」+ 删除/编辑按钮 -->
|
||||
<button class="btn btn--danger">删 除</button>
|
||||
<button class="btn btn--primary">重新解读</button>
|
||||
</div>
|
||||
|
||||
<div class="drawer__body">
|
||||
<!-- 左半：体检报告内容 -->
|
||||
<div class="col-report">
|
||||
<div class="rpt-title">体检结论</div>
|
||||
<div class="rpt-text">1. 血压偏高（收缩压 148mmHg / 舒张压 95mmHg），建议心血管内科复查；<br>2. 空腹血糖 7.8mmHg 偏高，建议内分泌科进一步检查；<br>3. 超重（BMI 27.4），建议控制饮食、加强运动。</div>
|
||||
<div class="rpt-title">体检建议</div>
|
||||
<div class="rpt-text">低盐低脂饮食，规律监测血压并记录；3 个月内复查血脂、血糖、糖化血红蛋白；每周中等强度运动不少于 150 分钟；如出现头晕、心悸等症状及时就诊。</div>
|
||||
<div class="rpt-major">实验室检查</div>
|
||||
<div class="rpt-title rpt-title--sub">生化全套</div>
|
||||
<table class="rpt-table">
|
||||
<tr><th>名称</th><th>结果</th><th>单位</th><th>参考值</th></tr>
|
||||
<tr><td>血清总胆固醇</td><td>6.12</td><td>mmol/L</td><td>0~5.2</td></tr>
|
||||
<tr><td>血清甘油三酯</td><td>2.35</td><td>mmol/L</td><td>0~1.7</td></tr>
|
||||
<tr><td>空腹血糖</td><td class="abnormal">7.8 ↑</td><td>mmol/L</td><td>3.9~6.1</td></tr>
|
||||
<tr><td>糖化血红蛋白</td><td>6.9</td><td>%</td><td>4~6.5</td></tr>
|
||||
</table>
|
||||
<div class="rpt-title rpt-title--sub">血常规</div>
|
||||
<table class="rpt-table">
|
||||
<tr><th>名称</th><th>结果</th><th>单位</th><th>参考值</th></tr>
|
||||
<tr><td>白细胞计数</td><td>6.8</td><td>10^9/L</td><td>3.5~9.5</td></tr>
|
||||
<tr><td>血红蛋白</td><td>145</td><td>g/L</td><td>130~175</td></tr>
|
||||
<tr><td>血小板计数</td><td>210</td><td>10^9/L</td><td>125~350</td></tr>
|
||||
</table>
|
||||
<div class="rpt-major">辅助检查</div>
|
||||
<div class="rpt-title rpt-title--sub">心电图</div>
|
||||
<table class="rpt-table">
|
||||
<tr><th>名称</th><th>结果</th><th>单位</th><th>参考值</th></tr>
|
||||
<tr><td>窦性心律</td><td>未见异常</td><td>—</td><td>—</td></tr>
|
||||
<tr><td>ST-T 改变</td><td class="abnormal">轻度异常</td><td>—</td><td>—</td></tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- 右半：解读表单 -->
|
||||
<div class="col-form">
|
||||
<div class="form-card">
|
||||
<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 style="grid-column:1/-1">所属单位：<b>CQ能源采油三大队</b></div>
|
||||
<div style="grid-column:1/-1">体检日期：<b>2025-10-18</b> 报告：2025年体检报告</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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>
|
||||
</div>
|
||||
<div class="fld"><span class="fld__label">重新分类</span>
|
||||
<select>
|
||||
<!-- [交互] 选择 A/B/C/D 类时需完成五类人群信息登记，打开五类人群抽屉: five-class-drawer.html -->
|
||||
<option>请选择五类人群分类</option>
|
||||
<option>a-大病人群A</option>
|
||||
<option selected>b-慢病人群B</option>
|
||||
<option>c-异常人群C</option>
|
||||
<option>d-风险人群D</option>
|
||||
<option>e-健康人群E</option>
|
||||
</select>
|
||||
</div>
|
||||
<button class="btn" style="width:100%" onclick="location.href='five-class-drawer.html'">登记五类人群信息</button>
|
||||
</div>
|
||||
|
||||
<div class="form-card">
|
||||
<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>
|
||||
<!-- [交互] 点击打开页内手写签名弹窗 -->
|
||||
<div class="sign-box" onclick="openSign()" style="flex:1">
|
||||
<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>
|
||||
<div class="fld"><span class="fld__label">签字图片</span>
|
||||
<!-- [交互] 上传签字图片（仅 png/jpg），旧系统调起相册/拍照 -->
|
||||
<select style="height:32px;padding:6px 10px"><option>上传文件（png/jpg）…</option></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="drawer__foot">
|
||||
<button class="btn" onclick="history.back()">取 消</button>
|
||||
<!-- [交互] 确认提交解读结果，返回来源页 -->
|
||||
<button class="btn btn--primary" onclick="history.back()">确 认</button>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：手写签名 -->
|
||||
<div class="overlay" id="signModal">
|
||||
<div class="sign-modal">
|
||||
<div class="sign-modal__head">
|
||||
<span class="sign-modal__title">签名</span>
|
||||
<button class="sign-modal__close" onclick="closeSign()">✕</button>
|
||||
</div>
|
||||
<div class="canvas-wrap">
|
||||
<canvas id="signCanvas" width="780" height="300"></canvas>
|
||||
<div class="canvas-hint" id="signHint">请在区域内签名<div style="font-size:12px">保证字迹清晰可辨</div></div>
|
||||
<button class="eraser" onclick="clearCanvas()" title="清空">
|
||||
<svg viewBox="0 0 24 24"><path d="M20 20H8.5l-4-4a2 2 0 010-2.8l8.2-8.2a2 2 0 012.8 0l5 5a2 2 0 010 2.8L13 20M8 11l6 6"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="sign-modal__foot">
|
||||
<button class="btn" onclick="closeSign()">取 消</button>
|
||||
<!-- [交互] 确认生成签名图片回填签名位（未签字时提示「您还没有进行签字！」） -->
|
||||
<button class="btn btn--primary" onclick="confirmSign()">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// 手写签名（页内弹窗）
|
||||
function openSign() { document.getElementById('signModal').classList.add('open'); }
|
||||
function closeSign() { document.getElementById('signModal').classList.remove('open'); }
|
||||
var canvas = document.getElementById('signCanvas');
|
||||
var ctx = canvas.getContext('2d');
|
||||
var drawing = false, hasInk = false;
|
||||
ctx.lineWidth = 3; ctx.lineCap = 'round'; ctx.strokeStyle = '#333';
|
||||
function pos(e) {
|
||||
var r = canvas.getBoundingClientRect();
|
||||
return { x: (e.clientX - r.left) * (canvas.width / r.width), y: (e.clientY - r.top) * (canvas.height / r.height) };
|
||||
}
|
||||
canvas.addEventListener('mousedown', function (e) { drawing = true; var p = pos(e); ctx.beginPath(); ctx.moveTo(p.x, p.y); });
|
||||
canvas.addEventListener('mousemove', function (e) {
|
||||
if (!drawing) return;
|
||||
var p = pos(e); ctx.lineTo(p.x, p.y); ctx.stroke(); hasInk = true;
|
||||
document.getElementById('signHint').style.display = 'none';
|
||||
});
|
||||
window.addEventListener('mouseup', function () { drawing = false; });
|
||||
function clearCanvas() {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
hasInk = false;
|
||||
document.getElementById('signHint').style.display = 'flex';
|
||||
}
|
||||
function confirmSign() {
|
||||
if (!hasInk) { alert('您还没有进行签字！'); return; }
|
||||
var box = document.querySelector('.sign-box');
|
||||
box.innerHTML = '<span style="font-size:26px;font-family:KaiTi,serif;color:#333">石维国</span><span style="font-size:11px">已签名 · 点击可重签</span>';
|
||||
closeSign();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,239 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1024, initial-scale=1.0">
|
||||
<title>医护登录 | 医疗点PAD端</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
/* 外层视口：全屏深色背景，承载居中 PAD 外壳（grid 居中，勿用 flex） */
|
||||
body {
|
||||
font-family: -apple-system, "Microsoft YaHei", "PingFang SC", sans-serif;
|
||||
background: #05080f;
|
||||
min-height: 840px; /* 800 + 40 padding */
|
||||
min-width: 1320px; /* 1280 + 40 padding */
|
||||
display: grid;
|
||||
place-items: center;
|
||||
padding: 20px;
|
||||
}
|
||||
/* PAD 设备外壳：1280x800 安卓医疗平板横屏（16:10） */
|
||||
.device-frame {
|
||||
width: 1280px;
|
||||
height: 800px;
|
||||
background: linear-gradient(135deg, #0a4d9e 0%, #1b87fc 55%, #59b3ff 100%);
|
||||
border-radius: 24px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.04);
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
/* 欢迎语（左上角白字） */
|
||||
.login__welcome {
|
||||
position: absolute;
|
||||
top: 36px;
|
||||
left: 40px;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
/* 中央登录卡片 */
|
||||
.login-card {
|
||||
width: 900px;
|
||||
padding: 84px 52px 64px;
|
||||
background: #fff;
|
||||
border: 1px solid #1b87fc;
|
||||
border-radius: 25px;
|
||||
box-shadow: 0 12px 19px 12px rgba(74, 90, 127, 0.18);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.login-card__title {
|
||||
position: absolute;
|
||||
top: 22px;
|
||||
left: 28px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #1890ff;
|
||||
}
|
||||
.login-card__title svg { width: 26px; height: 26px; }
|
||||
/* 左侧插画占位区 */
|
||||
.login-card__art {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.login-card__art svg { width: 100%; max-width: 320px; height: auto; }
|
||||
/* 右侧表单区 */
|
||||
.login-form {
|
||||
width: 400px;
|
||||
padding: 0 16px;
|
||||
}
|
||||
.login-form__heading {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #1890ff;
|
||||
text-align: center;
|
||||
margin-bottom: 26px;
|
||||
}
|
||||
.login-form__item { margin-bottom: 18px; }
|
||||
.login-form__input-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 1px solid #d9d9d9;
|
||||
border-radius: 6px;
|
||||
padding: 0 11px;
|
||||
height: 42px;
|
||||
transition: border-color 0.2s;
|
||||
background: #fff;
|
||||
}
|
||||
.login-form__input-wrap:focus-within { border-color: #1890ff; box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.12); }
|
||||
.login-form__input-wrap svg { width: 16px; height: 16px; fill: #bfbfbf; flex-shrink: 0; }
|
||||
.login-form__input {
|
||||
flex: 1;
|
||||
border: none;
|
||||
outline: none;
|
||||
font-size: 14px;
|
||||
padding: 0 8px;
|
||||
color: #333;
|
||||
background: transparent;
|
||||
min-width: 0;
|
||||
}
|
||||
.login-form__code-row { display: flex; gap: 10px; }
|
||||
.login-form__code-row .login-form__input-wrap { flex: 1; }
|
||||
/* 验证码图片（点击刷新） */
|
||||
.login-form__captcha {
|
||||
width: 110px;
|
||||
height: 42px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
/* 登录按钮 */
|
||||
.login-form__submit {
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
background: #1890ff;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
cursor: pointer;
|
||||
margin-top: 4px;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.login-form__submit:hover { background: #40a9ff; }
|
||||
.login-form__submit:active { background: #096dd9; }
|
||||
/* 轻提示 */
|
||||
.toast {
|
||||
position: absolute;
|
||||
top: 24px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: #fff;
|
||||
color: #fa8c16;
|
||||
border: 1px solid #ffd591;
|
||||
border-radius: 6px;
|
||||
padding: 8px 18px;
|
||||
font-size: 13px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
|
||||
display: none;
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<div class="login__welcome">你好，欢迎使用CQ油田一线医疗点平台</div>
|
||||
<div class="toast" id="toast">请输入账号！</div>
|
||||
|
||||
<div class="login-card">
|
||||
<div class="login-card__title">
|
||||
<!-- 医疗点标识图标（内联SVG，墨刀兼容） -->
|
||||
<svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>
|
||||
医疗点
|
||||
</div>
|
||||
|
||||
<div class="login-card__art">
|
||||
<!-- 左侧插画占位：医疗主题内联SVG（替代旧系统 left-bg.png） -->
|
||||
<svg viewBox="0 0 320 240" xmlns="http://www.w3.org/2000/svg">
|
||||
<ellipse cx="160" cy="216" rx="130" ry="14" fill="#e8effd"/>
|
||||
<rect x="60" y="86" width="200" height="120" rx="12" fill="#f2f6ff" stroke="#cfe0fb"/>
|
||||
<rect x="86" y="52" width="148" height="24" rx="12" fill="#1b87fc"/>
|
||||
<circle cx="160" cy="140" r="34" fill="#fff" stroke="#1b87fc" stroke-width="3"/>
|
||||
<path d="M160 126v28M146 140h28" stroke="#1b87fc" stroke-width="6" stroke-linecap="round"/>
|
||||
<path d="M96 180c14-10 22-2 32-10 10-8 16-16 26-8" stroke="#5cd1fe" stroke-width="4" fill="none" stroke-linecap="round"/>
|
||||
<circle cx="242" cy="70" r="10" fill="#fca318" opacity=".85"/>
|
||||
<circle cx="266" cy="104" r="6" fill="#2ac18b" opacity=".85"/>
|
||||
<circle cx="52" cy="64" r="7" fill="#59b3ff"/>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div class="login-form">
|
||||
<div class="login-form__heading">欢迎使用医疗点系统</div>
|
||||
<div class="login-form__item">
|
||||
<div class="login-form__input-wrap">
|
||||
<svg viewBox="0 0 24 24"><path d="M12 12c2.7 0 5-2.3 5-5s-2.3-5-5-5-5 2.3-5 5 2.3 5 5 5zm0 2c-3.3 0-10 1.7-10 5v3h20v-3c0-3.3-6.7-5-10-5z"/></svg>
|
||||
<input class="login-form__input" id="username" type="text" placeholder="请输入账号">
|
||||
</div>
|
||||
</div>
|
||||
<div class="login-form__item">
|
||||
<div class="login-form__input-wrap">
|
||||
<svg viewBox="0 0 24 24"><path d="M18 8h-1V6c0-2.8-2.2-5-5-5S7 3.2 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM9 6c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9V6zm3 11c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z"/></svg>
|
||||
<input class="login-form__input" id="password" type="password" placeholder="请输入密码" autocomplete="new-password">
|
||||
</div>
|
||||
</div>
|
||||
<div class="login-form__item">
|
||||
<div class="login-form__code-row">
|
||||
<div class="login-form__input-wrap">
|
||||
<input class="login-form__input" id="inputCode" type="text" placeholder="请输入验证码">
|
||||
</div>
|
||||
<!-- [交互] 点击验证码图片刷新（循环切换预置图形） -->
|
||||
<svg class="login-form__captcha" id="captchaImg" viewBox="0 0 110 42" xmlns="http://www.w3.org/2000/svg" onclick="refreshCaptcha()">
|
||||
<rect width="110" height="42" rx="6" fill="#f0f5ff"/>
|
||||
<path d="M0 12l110 8M0 30l110-14M30 0l14 42M80 0l-8 42" stroke="#adc6ff" stroke-width="1"/>
|
||||
<text id="captchaText" x="55" y="29" font-size="22" font-weight="bold" fill="#1890ff" text-anchor="middle" font-family="Georgia, serif" letter-spacing="4">8X4D</text>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="login-form__item">
|
||||
<!-- [交互] 点击登录，校验通过后跳转至任务中心（主页）: ./task.html -->
|
||||
<button class="login-form__submit" onclick="doLogin()">登 录</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// 验证码预置图形集合（原型演示用，点击循环刷新）
|
||||
var captchaList = ['8X4D', 'K7M2', 'P5Q9', 'R3T6'];
|
||||
var captchaIdx = 0;
|
||||
function refreshCaptcha() {
|
||||
captchaIdx = (captchaIdx + 1) % captchaList.length;
|
||||
document.getElementById('captchaText').textContent = captchaList[captchaIdx];
|
||||
}
|
||||
// 登录校验与跳转（原型不做真实鉴权）
|
||||
function doLogin() {
|
||||
var toast = document.getElementById('toast');
|
||||
function showToast(msg) {
|
||||
toast.textContent = msg;
|
||||
toast.style.display = 'block';
|
||||
setTimeout(function () { toast.style.display = 'none'; }, 1600);
|
||||
}
|
||||
if (!document.getElementById('username').value) { showToast('请输入账号！'); return; }
|
||||
if (!document.getElementById('password').value) { showToast('请输入密码！'); return; }
|
||||
showToast('登录成功，正在进入系统…');
|
||||
setTimeout(function () { location.href = './task.html'; }, 800);
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,266 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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; }
|
||||
.etype { padding: 2px 10px; border-radius: 12px; font-size: 11px; display: inline-block; }
|
||||
.etype--hr { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.etype--spo2 { background: rgba(104,98,214,.12); color: #6862D6; }
|
||||
.etype--stress { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
.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; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* 页内弹窗：事件详情 */
|
||||
.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: 700px; max-height: 620px; 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; }
|
||||
.sec { background: #f8fafc; border-radius: 10px; padding: 12px 16px; margin-bottom: 12px; }
|
||||
.sec__title { font-size: 13px; font-weight: 600; color: #333; border-left: 3px solid #1890ff; padding-left: 8px; margin-bottom: 10px; }
|
||||
.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; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item nav__item--active" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span>共 34 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">2</button><button class="pager__btn">3</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：事件详情 -->
|
||||
<div class="overlay" id="detailModal">
|
||||
<div class="modal">
|
||||
<div class="modal__head">
|
||||
<span class="modal__title">事件详情<span class="etype etype--hr" style="margin-left:8px">心率异常</span></span>
|
||||
<button class="modal__close" onclick="closeModal('detailModal')">✕</button>
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="sec">
|
||||
<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>
|
||||
</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>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('detailModal')">关 闭</button>
|
||||
<!-- [交互] 处理完成需填写处置说明，事件转为已处理 -->
|
||||
<button class="btn btn--primary" onclick="alert('填写处置说明并标记已处理（原型演示）')">处理</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,203 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.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; }
|
||||
.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; }
|
||||
/* 报告卡片 */
|
||||
.rpgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 14px; }
|
||||
.rpcard { background: #fff; border-radius: 18px; padding: 16px; box-shadow: 0 4px 12px rgba(74,90,127,.08); cursor: pointer; }
|
||||
.rpcard:hover { box-shadow: 0 8px 20px rgba(74,90,127,.16); }
|
||||
.rpcard__top { display: flex; align-items: center; gap: 10px; }
|
||||
.avatar { width: 36px; height: 36px; border-radius: 50%; border: 2px solid #1890ff; color: #3485ff; background: #fff; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
|
||||
.rpcard__name { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.sexage { background: #5cd1fe; color: #fff; border-radius: 4px; padding: 1px 6px; font-size: 11px; margin-left: 6px; font-weight: 400; }
|
||||
.rpcard__status { margin-left: auto; padding: 2px 9px; border-radius: 10px; font-size: 11px; flex-shrink: 0; }
|
||||
.st--todo { background: rgba(252,163,24,.15); color: #fca318; }
|
||||
.st--done { background: rgba(42,193,139,.15); color: #2ac18b; }
|
||||
.yr { display: inline-flex; align-items: center; margin-top: 10px; border: 1px dashed #5087ec; background: #e8effd; color: #5087ec; border-radius: 12px; padding: 2px 10px; font-size: 11px; }
|
||||
.rpcard__lines { margin-top: 8px; font-size: 12px; color: #4a5a7f; line-height: 2; }
|
||||
.rpcard__lines b { color: #333; font-weight: 500; }
|
||||
.rpcard__foot { background: #ebedf0; border-radius: 8px; margin-top: 10px; padding: 8px 10px; font-size: 12px; color: #4a5a7f; display: flex; justify-content: space-between; align-items: center; }
|
||||
.rpcard__foot .go { color: #1890ff; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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>
|
||||
</nav>
|
||||
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="event.stopPropagation();document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="content">
|
||||
<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 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'">
|
||||
<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__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__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__foot"><span>解读医生：石维国</span><span>2025-08-02</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">女 · 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__foot"><span>解读医生：韩丽平</span><span>2026-07-20</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">男 · 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__foot"><span>解读医生：石维国</span><span>2025-07-28</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span>共 24 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">2</button><button class="pager__btn">3</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// 点击空白处收起用户面板
|
||||
document.addEventListener('click', function () {
|
||||
document.getElementById('userPanel').classList.remove('open');
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,301 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1280, initial-scale=1.0">
|
||||
<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; }
|
||||
.device-frame { width: 1280px; height: 800px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.04); position: relative; display: flex; flex-shrink: 0; }
|
||||
/* ===== 左侧导航 ===== */
|
||||
.nav { width: 120px; background: #fff; border-right: 1px solid #e5e8ef; display: flex; flex-direction: column; padding: 16px 0 14px; flex-shrink: 0; }
|
||||
.nav__logo { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 19px; font-weight: bold; color: #1890ff; padding-bottom: 16px; }
|
||||
.nav__logo svg { width: 24px; height: 24px; }
|
||||
.nav__menu { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 0 9px; }
|
||||
.nav__item { display: flex; align-items: center; gap: 7px; padding: 10px 10px; border-radius: 20px; text-decoration: none; color: #4a5a7f; font-size: 13px; }
|
||||
.nav__item svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
|
||||
.nav__item:hover { background: #f2f6ff; }
|
||||
.nav__item--active { background: #319cff; color: #fff; }
|
||||
.nav__foot { padding: 0 9px; }
|
||||
.nav__logout { width: 100%; padding: 10px 0; border: none; border-radius: 20px; background: #f5f6f8; color: #666; font-size: 13px; cursor: pointer; }
|
||||
/* ===== 右区 ===== */
|
||||
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: #eef1f6; }
|
||||
.header { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px; flex-shrink: 0; gap: 14px; }
|
||||
.header__point { font-size: 15px; font-weight: 600; color: #333; }
|
||||
.header__spacer { flex: 1; }
|
||||
.header__todo { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #4a5a7f; cursor: pointer; position: relative; text-decoration: none; }
|
||||
.header__todo svg { width: 18px; height: 18px; stroke: #4a5a7f; fill: none; stroke-width: 2; }
|
||||
.header__badge { position: absolute; top: -7px; right: -9px; min-width: 16px; height: 16px; border-radius: 8px; background: #fd2121; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.header__avatar { width: 35px; height: 35px; border-radius: 50%; background: #1890ff; color: #fff; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
|
||||
.header__panel { position: absolute; top: 45px; right: 0; width: 250px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(74,90,127,.25); padding: 18px 16px; display: none; z-index: 30; text-align: left; }
|
||||
.header__panel.open { display: block; }
|
||||
.panel__row { font-size: 12px; color: #666; margin-top: 8px; }
|
||||
.panel__row b { color: #333; font-weight: 500; }
|
||||
.panel__btns { display: flex; gap: 10px; margin-top: 14px; }
|
||||
.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; }
|
||||
.search-bar__input { height: 32px; border: 1px solid #d9dee8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; min-width: 160px; 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; }
|
||||
/* ===== Tab ===== */
|
||||
.tabs { display: flex; gap: 26px; background: #fff; border-radius: 12px; margin-top: 14px; padding: 0 16px; }
|
||||
.tabs__item { padding: 13px 2px; font-size: 14px; color: #666; cursor: pointer; border-bottom: 2px solid transparent; }
|
||||
.tabs__item--active { color: #1890ff; border-bottom-color: #1890ff; font-weight: 600; }
|
||||
/* ===== 任务卡片 ===== */
|
||||
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
|
||||
.tcard { background: #fff; border-radius: 18px; padding: 16px; box-shadow: 0 4px 12px rgba(74,90,127,.08); display: flex; flex-direction: column; }
|
||||
.tcard__head { display: flex; align-items: center; justify-content: space-between; }
|
||||
.tcard__times { font-size: 14px; font-weight: 600; color: #333; }
|
||||
.tcard__dates { font-size: 12px; color: #969eb0; margin-top: 6px; line-height: 1.8; }
|
||||
.tcard__edit { color: #fd2121; font-size: 12px; cursor: pointer; margin-left: 8px; }
|
||||
.info-block { background: #f0f0f0; border-radius: 10px; padding: 10px 12px; font-size: 12px; color: #4a5a7f; line-height: 1.9; margin-top: 10px; }
|
||||
.info-block b { font-size: 13px; color: #333; font-weight: 600; margin-right: 4px; }
|
||||
.pill { display: inline-block; padding: 2px 10px; border-radius: 12px; font-size: 12px; }
|
||||
.pill--wait { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
.pill--over { background: rgba(253,33,33,.08); color: #fd2121; }
|
||||
.tag { display: inline-block; padding: 1px 8px; border-radius: 4px; font-size: 11px; margin-right: 4px; }
|
||||
.tag--ht { background: rgba(24,144,255,.12); color: #1890ff; }
|
||||
.tag--chd { background: rgba(0,195,195,.12); color: #00c3c3; }
|
||||
.tag--ob { background: rgba(252,163,24,.12); color: #fca318; }
|
||||
.tag--dm { background: rgba(42,193,139,.12); color: #2ac18b; }
|
||||
.tag--oth { background: rgba(104,98,214,.12); color: #6862d6; }
|
||||
.tcard__btn { margin-top: 12px; height: 38px; border: none; border-radius: 8px; background: #1890ff; color: #fff; font-size: 13px; cursor: pointer; }
|
||||
.tcard__btn:hover { background: #40a9ff; }
|
||||
.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; align-items: center; }
|
||||
.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; }
|
||||
.pager__btn--active { background: #1890ff; border-color: #1890ff; color: #fff; }
|
||||
/* ===== 页内弹窗（编辑截止日期 / 选择解读任务） ===== */
|
||||
.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: 640px; max-height: 620px; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
|
||||
.modal--sm { width: 460px; max-height: none; }
|
||||
.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: 18px 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; }
|
||||
.emp-card { background: #f2f6ff; border-radius: 10px; padding: 12px 16px; font-size: 13px; color: #4a5a7f; line-height: 2; }
|
||||
.emp-card b { color: #333; font-size: 14px; margin-right: 6px; }
|
||||
.section-label { font-size: 13px; color: #969eb0; margin: 14px 0 8px; }
|
||||
.task-row { border: 1px solid #eef1f6; border-radius: 10px; padding: 12px 16px; display: flex; align-items: center; gap: 14px; font-size: 13px; color: #333; cursor: pointer; margin-bottom: 10px; }
|
||||
.task-row:hover { border-color: #1890ff; background: #f7fbff; }
|
||||
.task-row__name { font-weight: 600; width: 160px; }
|
||||
.task-row__date { color: #969eb0; flex: 1; }
|
||||
.deadline-row { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 22px 0; font-size: 14px; color: #4a5a7f; }
|
||||
.modal__date { display: flex; align-items: center; gap: 8px; border: 1px solid #d9dee8; border-radius: 6px; padding: 6px 12px; font-size: 14px; color: #333; width: 300px; }
|
||||
.modal__date svg { width: 15px; height: 15px; stroke: #969eb0; fill: none; stroke-width: 2; margin-left: auto; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="device-frame">
|
||||
<!-- 左侧导航（全局常驻壳） -->
|
||||
<nav class="nav">
|
||||
<div class="nav__logo"><svg viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" fill="#1890ff"/><path d="M12 7v10M7 12h10" stroke="#fff" stroke-width="2.6" stroke-linecap="round"/></svg>医疗点</div>
|
||||
<div class="nav__menu">
|
||||
<a class="nav__item nav__item--active" href="task.html"><svg viewBox="0 0 24 24"><rect x="5" y="4" width="14" height="17" rx="2"/><path d="M9.5 4.5A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5V5h-5v-.5zM9 13l2 2 4-4M9 18l1 1 3-3"/></svg>任务中心</a>
|
||||
<a class="nav__item" href="daily.html"><svg viewBox="0 0 24 24"><path d="M6 3v5a4 4 0 008 0V3M10 12v3a5 5 0 0010 0v-2"/><circle cx="20" cy="9" r="2"/></svg>日常诊疗</a>
|
||||
<a class="nav__item" href="follow-records.html"><svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4M9 15l2 2 4-4"/></svg>随访管理</a>
|
||||
<a class="nav__item" href="chronic-disease.html"><svg viewBox="0 0 24 24"><path d="M12 20s-7-4.35-9.5-8.5C.8 8.6 2.6 5 6 5c2.2 0 3.6 1.2 4.5 2.7L12 9l1.5-1.3C14.4 6.2 15.8 5 18 5c3.4 0 5.2 3.6 3.5 6.5C19 15.65 12 20 12 20z"/><path d="M5 12h3l1.5-2.5L12 14l1.5-2h4"/></svg>慢病干预</a>
|
||||
<a class="nav__item" href="health-education.html"><svg viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M12 16v4M8 20h8M7 8h7M7 11h5"/></svg>健康宣教</a>
|
||||
<a class="nav__item" href="employee-file.html"><svg viewBox="0 0 24 24"><path d="M3 7V5a2 2 0 012-2h4l2 2h8a2 2 0 012 2v11a2 2 0 01-2 2H5a2 2 0 01-2-2V7z"/><circle cx="12" cy="12" r="2.2"/><path d="M8.5 17c.8-1.8 2-2.6 3.5-2.6s2.7.8 3.5 2.6"/></svg>员工档案</a>
|
||||
<a class="nav__item" href="monitor.html"><svg viewBox="0 0 24 24"><path d="M3 12h4l3-8 4 16 3-8h4"/></svg>健康监测</a>
|
||||
<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">
|
||||
<!-- [交互] 退出登录（旧系统弹二次确认，此处直接回登录页）: login.html -->
|
||||
<button class="nav__logout" onclick="location.href='login.html'">退出登录</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- 右区 -->
|
||||
<div class="main">
|
||||
<header class="header">
|
||||
<span class="header__point">陕E·定边第一医疗点</span>
|
||||
<div class="header__spacer"></div>
|
||||
<a class="header__todo" href="task.html">
|
||||
<svg viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><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>
|
||||
您有 5 条待办任务<span class="header__badge">5</span>
|
||||
</a>
|
||||
<div class="header__avatar" onclick="document.getElementById('userPanel').classList.toggle('open')">石
|
||||
<div class="header__panel" id="userPanel">
|
||||
<div class="panel__row"><b>石维国 · shiweiguo</b></div>
|
||||
<div class="panel__row">所属单位：CQ能源陕E作业区</div>
|
||||
<div class="panel__row">所属医疗点：定边第一医疗点</div>
|
||||
<div class="panel__btns">
|
||||
<button class="panel__btn" onclick="alert('修改密码（原型演示）')">修改密码</button>
|
||||
<!-- [交互] 切换账号回登录页: login.html -->
|
||||
<button class="panel__btn" onclick="location.href='login.html'">切换账号</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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>
|
||||
<button class="btn btn--primary">查 询</button>
|
||||
<button class="btn">重 置</button>
|
||||
</div>
|
||||
|
||||
<!-- Tab：随访任务 / 解读任务（切换时重置表单） -->
|
||||
<div class="tabs">
|
||||
<div class="tabs__item tabs__item--active" id="tabFollow" onclick="switchTab('follow')">随访任务（6）</div>
|
||||
<div class="tabs__item" id="tabInterpret" onclick="switchTab('interpret')">解读任务（4）</div>
|
||||
</div>
|
||||
|
||||
<!-- 随访任务卡片 -->
|
||||
<div class="grid" id="panelFollow">
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待随访 2 次</span><span class="pill pill--wait">待随访</span></div>
|
||||
<div class="tcard__dates">计划随访：2026-09-08 截止日期：2026-09-15</div>
|
||||
<div class="info-block"><b>岳春生</b> 男 · 54岁 · 1035678<br><span class="tag tag--ht">高血压</span><span class="tag tag--dm">糖尿病</span><br>陕E作业区管理四中心</div>
|
||||
<!-- [交互] 点击打开新增随访抽屉: follow-drawer.html -->
|
||||
<button class="tcard__btn" onclick="location.href='follow-drawer.html'">进行随访</button>
|
||||
</div>
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待随访 1 次</span><span class="pill pill--over">已逾期</span></div>
|
||||
<div class="tcard__dates">计划随访：2026-08-25 截止日期：2026-09-01</div>
|
||||
<div class="info-block"><b>田淑珍</b> 女 · 61岁 · 1042237<br><span class="tag tag--chd">冠心病</span><br>陕E作业区转运站</div>
|
||||
<button class="tcard__btn" onclick="location.href='follow-drawer.html'">进行随访</button>
|
||||
</div>
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待随访 3 次</span><span class="pill pill--wait">待随访</span></div>
|
||||
<div class="tcard__dates">计划随访：2026-09-12 截止日期：2026-09-19</div>
|
||||
<div class="info-block"><b>尹立春</b> 男 · 47岁 · 1028945<br><span class="tag tag--ob">肥胖</span><span class="tag tag--oth">其他</span><br>陕E作业区注水大队</div>
|
||||
<button class="tcard__btn" onclick="location.href='follow-drawer.html'">进行随访</button>
|
||||
</div>
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待随访 1 次</span><span class="pill pill--wait">待随访</span></div>
|
||||
<div class="tcard__dates">计划随访：2026-09-10 截止日期：2026-09-17</div>
|
||||
<div class="info-block"><b>戴文广</b> 男 · 58岁 · 1031002<br><span class="tag tag--ht">高血压</span><br>采油一大队</div>
|
||||
<button class="tcard__btn" onclick="location.href='follow-drawer.html'">进行随访</button>
|
||||
</div>
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待随访 2 次</span><span class="pill pill--wait">待随访</span></div>
|
||||
<div class="tcard__dates">计划随访：2026-09-14 截止日期：2026-09-21</div>
|
||||
<div class="info-block"><b>付桂荣</b> 女 · 52岁 · 1044518<br><span class="tag tag--dm">糖尿病</span><br>采油二大队</div>
|
||||
<button class="tcard__btn" onclick="location.href='follow-drawer.html'">进行随访</button>
|
||||
</div>
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待随访 1 次</span><span class="pill pill--wait">待随访</span></div>
|
||||
<div class="tcard__dates">计划随访：2026-09-16 截止日期：2026-09-23</div>
|
||||
<div class="info-block"><b>曲志明</b> 男 · 45岁 · 1037781<br><span class="tag tag--chd">冠心病</span><span class="tag tag--ht">高血压</span><br>输气作业区</div>
|
||||
<button class="tcard__btn" onclick="location.href='follow-drawer.html'">进行随访</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 解读任务卡片（默认隐藏） -->
|
||||
<div class="grid" id="panelInterpret" style="display:none">
|
||||
<!-- 单条待解读：直接进入解读抽屉 -->
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待解读 1 次<span class="tcard__edit" onclick="openModal('deadlineModal')">编辑</span></span><span class="pill pill--wait">待解读</span></div>
|
||||
<div class="tcard__dates">截止日期：2026-09-12</div>
|
||||
<div class="info-block"><b>石维国</b> 男 · 50岁 · 1029334<br><span class="tag tag--ht">高血压</span><br>采油三大队</div>
|
||||
<!-- [交互] 点击打开解读报告抽屉: interpret-drawer.html -->
|
||||
<button class="tcard__btn" onclick="location.href='interpret-drawer.html'">进行解读</button>
|
||||
</div>
|
||||
<!-- 多条待解读：先弹选择解读任务 -->
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待解读 2 次<span class="tcard__edit" onclick="openModal('deadlineModal')">编辑</span></span><span class="pill pill--wait">待解读</span></div>
|
||||
<div class="tcard__dates">截止日期：2026-09-18<br>截止日期：2026-09-20</div>
|
||||
<div class="info-block"><b>赵春霞</b> 女 · 46岁 · 1045690<br><span class="tag tag--dm">糖尿病</span><span class="tag tag--ob">肥胖</span><br>采油一大队</div>
|
||||
<!-- [交互] 多条待解读，点击先打开「选择解读任务」页内弹窗 -->
|
||||
<button class="tcard__btn" onclick="openModal('selectModal')">进行解读</button>
|
||||
</div>
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待解读 1 次<span class="tcard__edit" onclick="openModal('deadlineModal')">编辑</span></span><span class="pill pill--over">已逾期</span></div>
|
||||
<div class="tcard__dates">截止日期：2026-08-30</div>
|
||||
<div class="info-block"><b>马福成</b> 男 · 63岁 · 1026011<br><span class="tag tag--chd">冠心病</span><br>运输大队</div>
|
||||
<button class="tcard__btn" onclick="location.href='interpret-drawer.html'">进行解读</button>
|
||||
</div>
|
||||
<div class="tcard">
|
||||
<div class="tcard__head"><span class="tcard__times">待解读 1 次<span class="tcard__edit" onclick="openModal('deadlineModal')">编辑</span></span><span class="pill pill--wait">待解读</span></div>
|
||||
<div class="tcard__dates">截止日期：2026-09-25</div>
|
||||
<div class="info-block"><b>杨海燕</b> 女 · 49岁 · 1043358<br><span class="tag tag--oth">其他</span><br>供电服务班</div>
|
||||
<button class="tcard__btn" onclick="location.href='interpret-drawer.html'">进行解读</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-foot">
|
||||
<span>共 6 条</span>
|
||||
<div class="pager"><button class="pager__btn">‹</button><button class="pager__btn pager__btn--active">1</button><button class="pager__btn">›</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：编辑截止日期 -->
|
||||
<div class="overlay" id="deadlineModal">
|
||||
<div class="modal modal--sm">
|
||||
<div class="modal__head"><span class="modal__title">编辑截止日期</span><button class="modal__close" onclick="closeModal('deadlineModal')">✕</button></div>
|
||||
<div class="deadline-row">
|
||||
<span><span style="color:#fd2121">*</span> 截止日期：</span>
|
||||
<div class="modal__date">2026-09-12<svg viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4"/></svg></div>
|
||||
</div>
|
||||
<div class="modal__foot">
|
||||
<button class="btn" onclick="closeModal('deadlineModal')">取 消</button>
|
||||
<!-- [交互] 确认后保存新截止日期 -->
|
||||
<button class="btn btn--primary" onclick="closeModal('deadlineModal')">确 认</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 页内弹窗：选择解读任务 -->
|
||||
<div class="overlay" id="selectModal">
|
||||
<div class="modal">
|
||||
<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>所属单位：CQ能源采油一大队 <span class="tag tag--dm">糖尿病</span><span class="tag tag--ob">肥胖</span></div>
|
||||
</div>
|
||||
<div class="section-label">该员工有 2 条待解读任务，请选择一条进入解读：</div>
|
||||
<!-- [交互] 点击任务行进入解读报告抽屉: interpret-drawer.html -->
|
||||
<div class="task-row" onclick="location.href='interpret-drawer.html'">
|
||||
<span class="task-row__name">2025年体检报告</span>
|
||||
<span class="pill pill--wait">待解读</span>
|
||||
<span class="task-row__date">截止日期：2026-09-18</span>
|
||||
<span style="color:#969eb0">高血压、糖尿病</span>
|
||||
</div>
|
||||
<div class="task-row" onclick="location.href='interpret-drawer.html'">
|
||||
<span class="task-row__name">2024年体检报告</span>
|
||||
<span class="pill pill--wait">待解读</span>
|
||||
<span class="task-row__date">截止日期：2026-09-20</span>
|
||||
<span style="color:#969eb0">糖尿病</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal__foot"><button class="btn" onclick="closeModal('selectModal')">取 消</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// 随访/解读 Tab 切换（切换时重置表单）
|
||||
function switchTab(name) {
|
||||
var isFollow = name === 'follow';
|
||||
document.getElementById('tabFollow').className = 'tabs__item' + (isFollow ? ' tabs__item--active' : '');
|
||||
document.getElementById('tabInterpret').className = 'tabs__item' + (isFollow ? '' : ' tabs__item--active');
|
||||
document.getElementById('panelFollow').style.display = isFollow ? 'grid' : 'none';
|
||||
document.getElementById('panelInterpret').style.display = isFollow ? 'none' : 'grid';
|
||||
document.querySelector('.page-foot span').textContent = isFollow ? '共 6 条' : '共 4 条';
|
||||
document.querySelectorAll('.search-bar__input').forEach(function (i) { i.value = ''; });
|
||||
}
|
||||
// 页内弹窗显隐
|
||||
function openModal(id) { document.getElementById(id).classList.add('open'); }
|
||||
function closeModal(id) { document.getElementById(id).classList.remove('open'); }
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -233,7 +233,7 @@ function switchEmpType(type){
|
||||
|
||||
/* 能源员工搜索 */
|
||||
var _emps=[
|
||||
{name:'王建国',code:'EMP20230156',org:'采油一厂',dept:'作业一区',tel:'138-9201-1001',idCard:'610102197201******'},
|
||||
{name:'石维国',code:'EMP20230156',org:'采油一厂',dept:'作业一区',tel:'138-9201-1001',idCard:'610102197201******'},
|
||||
{name:'张丽华',code:'EMP20220089',org:'公司机关',dept:'综合管理部',tel:'138-9201-2002',idCard:'610103198105******'},
|
||||
{name:'刘志强',code:'EMP20210234',org:'采油二厂',dept:'注水站',tel:'138-9201-3003',idCard:'610104198308******'},
|
||||
{name:'陈秀英',code:'EMP20230312',org:'采气一厂',dept:'集输站',tel:'138-9201-4004',idCard:'620102196802******'},
|
||||
|
||||
@@ -344,7 +344,7 @@
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="col-fixed col-fixed-1">4</td>
|
||||
<td class="col-fixed col-fixed-2">王建国-男-52</td>
|
||||
<td class="col-fixed col-fixed-2">石维国-男-52</td>
|
||||
<td class="col-fixed col-fixed-3">EMP20230156</td>
|
||||
<td>采油一厂</td>
|
||||
<td>作业一区</td>
|
||||
|
||||
@@ -215,7 +215,7 @@
|
||||
<td><span class="tag tag-orange">工单超时</span></td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">WO20260420035</td>
|
||||
<td>西安应急中心</td>
|
||||
<td>王建国</td>
|
||||
<td>石维国</td>
|
||||
<td>2026-04-20 09:15</td>
|
||||
<td><div class="action-btns"><span class="link" onclick="openWoDetail(this)">详情</span></div></td>
|
||||
</tr>
|
||||
@@ -224,7 +224,7 @@
|
||||
<td><span class="tag tag-orange">工单超时</span></td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">WO20260420035</td>
|
||||
<td>西安应急中心</td>
|
||||
<td>王建国</td>
|
||||
<td>石维国</td>
|
||||
<td>2026-04-20 09:15</td>
|
||||
<td><div class="action-btns"><span class="link" onclick="openWoDetail(this)">详情</span></div></td>
|
||||
</tr>
|
||||
@@ -242,7 +242,7 @@
|
||||
<td><span class="tag tag-orange">工单超时</span></td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">WO20260419012</td>
|
||||
<td>延安应急中心</td>
|
||||
<td>王建国</td>
|
||||
<td>石维国</td>
|
||||
<td>2026-04-19 14:20</td>
|
||||
<td><div class="action-btns"><span class="link" onclick="openWoDetail(this)">详情</span></div></td>
|
||||
</tr>
|
||||
@@ -269,7 +269,7 @@
|
||||
<td><span class="tag tag-orange">工单超时</span></td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">WO20260417056</td>
|
||||
<td>延安应急中心</td>
|
||||
<td>王建国</td>
|
||||
<td>石维国</td>
|
||||
<td>2026-04-17 15:48</td>
|
||||
<td><div class="action-btns"><span class="link" onclick="openWoDetail(this)">详情</span></div></td>
|
||||
</tr>
|
||||
@@ -401,8 +401,8 @@ document.getElementById('callDetailModal').addEventListener('click',function(e){
|
||||
// 工单超时模拟数据（按工单编号索引）
|
||||
var woMockData={
|
||||
'WO20260420035':{name:'王旭',gender:'男',age:'53',empNo:'56985',company:'公司机关',dept:'健康科',phone:'18566985523',idCard:'430626196500236',orderNo:'YJ5633256',type:'正常派单',status:'未完成',helpType:'应急视频',helpTime:'2026-03-21 15:12:21',location:'陕西省西安市雁塔区电子一路56号',center:'西安应急中心',operator:'刘旭',professional:'刘旭'},
|
||||
'WO20260419012':{name:'李明辉',gender:'男',age:'47',empNo:'32156',company:'采油二厂',dept:'生产运行科',phone:'13709125587',idCard:'610402197902156',orderNo:'YJ5633102',type:'正常派单',status:'未完成',helpType:'电话求助',helpTime:'2026-03-18 10:35:40',location:'甘肃省庆阳市西峰区CQ大道128号',center:'延安应急中心',operator:'王建国',professional:'张婧'},
|
||||
'WO20260417056':{name:'赵志刚',gender:'男',age:'51',empNo:'41023',company:'采油三厂',dept:'工程技术科',phone:'15891034421',idCard:'610502197503087',orderNo:'YJ5632890',type:'正常派单',status:'未完成',helpType:'一键求助',helpTime:'2026-03-15 08:22:15',location:'陕西省延安市宝塔区长青路89号',center:'延安应急中心',operator:'王建国',professional:'张明'}
|
||||
'WO20260419012':{name:'李明辉',gender:'男',age:'47',empNo:'32156',company:'采油二厂',dept:'生产运行科',phone:'13709125587',idCard:'610402197902156',orderNo:'YJ5633102',type:'正常派单',status:'未完成',helpType:'电话求助',helpTime:'2026-03-18 10:35:40',location:'甘肃省庆阳市西峰区CQ大道128号',center:'延安应急中心',operator:'石维国',professional:'张婧'},
|
||||
'WO20260417056':{name:'赵志刚',gender:'男',age:'51',empNo:'41023',company:'采油三厂',dept:'工程技术科',phone:'15891034421',idCard:'610502197503087',orderNo:'YJ5632890',type:'正常派单',status:'未完成',helpType:'一键求助',helpTime:'2026-03-15 08:22:15',location:'陕西省延安市宝塔区长青路89号',center:'延安应急中心',operator:'石维国',professional:'张明'}
|
||||
};
|
||||
|
||||
function openWoDetail(linkEl){
|
||||
|
||||
@@ -232,7 +232,7 @@
|
||||
var secondaryBtn=document.querySelector('.bottom-bar .btn-default');
|
||||
|
||||
// 预填示例数据
|
||||
setField('姓名','王建国');
|
||||
setField('姓名','石维国');
|
||||
setField('身份证号','610102198503****');
|
||||
setField('联系电话','138****2001');
|
||||
setField('所在医院','西安交通大学第一附属医院');
|
||||
|
||||
@@ -219,7 +219,7 @@
|
||||
<select class="filter-select" style="min-width:160px;">
|
||||
<option>请选择</option>
|
||||
<option>宁夏宝石花医院</option>
|
||||
<option>长庆油田医院</option>
|
||||
<option>CQ油田医院</option>
|
||||
<option>长安胃肠镜医院</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -258,9 +258,9 @@
|
||||
<tbody>
|
||||
<tr><td>陈伟</td><td>30078912</td><td>610103197809220015</td><td>采油四厂</td><td>工程技术科</td><td>2026年度胃肠镜预选</td><td>宁夏宝石花医院</td><td>2026-03-05 10:23</td></tr>
|
||||
<tr><td>刘芳</td><td>30082345</td><td>610103197905120034</td><td>采油四厂</td><td>综合办</td><td>2026年度胃肠镜预选</td><td>宁夏宝石花医院</td><td>2026-03-06 14:41</td></tr>
|
||||
<tr><td>王强</td><td>30085678</td><td>610103197403080024</td><td>采油五厂</td><td>采油队</td><td>2026年度胃肠镜预选</td><td>长庆油田医院</td><td>2026-04-02 09:15</td></tr>
|
||||
<tr><td>王强</td><td>30085678</td><td>610103197403080024</td><td>采油五厂</td><td>采油队</td><td>2026年度胃肠镜预选</td><td>CQ油田医院</td><td>2026-04-02 09:15</td></tr>
|
||||
<tr><td>李娜</td><td>30088901</td><td>610103198511090026</td><td>采油五厂</td><td>财务科</td><td>2026年度胃肠镜预选</td><td>长安胃肠镜医院</td><td>2026-04-08 16:52</td></tr>
|
||||
<tr><td>赵敏</td><td>30094567</td><td>610103196807260046</td><td>采油六厂</td><td>地质所</td><td>2026年度胃肠镜预选</td><td>长庆油田医院</td><td>2026-04-11 11:30</td></tr>
|
||||
<tr><td>赵敏</td><td>30094567</td><td>610103196807260046</td><td>采油六厂</td><td>地质所</td><td>2026年度胃肠镜预选</td><td>CQ油田医院</td><td>2026-04-11 11:30</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
@@ -225,7 +225,7 @@
|
||||
<select class="filter-select" style="min-width:160px;">
|
||||
<option>请选择</option>
|
||||
<option>宁夏宝石花医院</option>
|
||||
<option>长庆油田医院</option>
|
||||
<option>CQ油田医院</option>
|
||||
<option>长安胃肠镜医院</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -252,7 +252,7 @@
|
||||
<tbody>
|
||||
<tr><td>采油四厂</td><td>工程技术科</td><td>2026</td><td>2026年度胃肠镜预选</td><td>宁夏宝石花医院</td><td><span class="num-link" onclick="openDetail('采油四厂 工程技术科 / 宁夏宝石花医院')">12</span></td></tr>
|
||||
<tr><td>采油四厂</td><td>综合办</td><td>2026</td><td>2026年度胃肠镜预选</td><td>宁夏宝石花医院</td><td><span class="num-link" onclick="openDetail('采油四厂 综合办 / 宁夏宝石花医院')">8</span></td></tr>
|
||||
<tr><td>采油五厂</td><td>采油队</td><td>2026</td><td>2026年度胃肠镜预选</td><td>长庆油田医院</td><td><span class="num-link" onclick="openDetail('采油五厂 采油队 / 长庆油田医院')">23</span></td></tr>
|
||||
<tr><td>采油五厂</td><td>采油队</td><td>2026</td><td>2026年度胃肠镜预选</td><td>CQ油田医院</td><td><span class="num-link" onclick="openDetail('采油五厂 采油队 / CQ油田医院')">23</span></td></tr>
|
||||
<tr><td>采油六厂</td><td>地质所</td><td>2026</td><td>2026年度胃肠镜预选</td><td>长安胃肠镜医院</td><td><span class="num-link" onclick="openDetail('采油六厂 地质所 / 长安胃肠镜医院')">6</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -291,7 +291,7 @@
|
||||
<select class="filter-select" style="min-width:160px;">
|
||||
<option>请选择</option>
|
||||
<option>宁夏宝石花医院</option>
|
||||
<option>长庆油田医院</option>
|
||||
<option>CQ油田医院</option>
|
||||
<option>长安胃肠镜医院</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -318,7 +318,7 @@
|
||||
<tbody>
|
||||
<tr><td>宁夏宝石花医院</td><td>2026</td><td>采油四厂</td><td><span class="num-link" onclick="openDetail('宁夏宝石花医院 / 采油四厂')">20</span></td></tr>
|
||||
<tr><td>宁夏宝石花医院</td><td>2026</td><td>采油五厂</td><td><span class="num-link" onclick="openDetail('宁夏宝石花医院 / 采油五厂')">15</span></td></tr>
|
||||
<tr><td>长庆油田医院</td><td>2026</td><td>采油五厂</td><td><span class="num-link" onclick="openDetail('长庆油田医院 / 采油五厂')">31</span></td></tr>
|
||||
<tr><td>CQ油田医院</td><td>2026</td><td>采油五厂</td><td><span class="num-link" onclick="openDetail('CQ油田医院 / 采油五厂')">31</span></td></tr>
|
||||
<tr><td>长安胃肠镜医院</td><td>2026</td><td>采油六厂</td><td><span class="num-link" onclick="openDetail('长安胃肠镜医院 / 采油六厂')">9</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -351,7 +351,7 @@
|
||||
<tbody>
|
||||
<tr><td>陈伟</td><td>30078912</td><td>610103197809220015</td><td>采油四厂</td><td>工程技术科</td><td>宁夏宝石花医院</td><td>2026-03-05 10:23</td></tr>
|
||||
<tr><td>刘芳</td><td>30082345</td><td>610103197905120034</td><td>采油四厂</td><td>综合办</td><td>宁夏宝石花医院</td><td>2026-03-06 14:41</td></tr>
|
||||
<tr><td>王强</td><td>30085678</td><td>610103197403080024</td><td>采油五厂</td><td>采油队</td><td>长庆油田医院</td><td>2026-04-02 09:15</td></tr>
|
||||
<tr><td>王强</td><td>30085678</td><td>610103197403080024</td><td>采油五厂</td><td>采油队</td><td>CQ油田医院</td><td>2026-04-02 09:15</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
@@ -306,7 +306,7 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>1</td><td>王建国</td><td>20045678</td><td>男</td><td>59</td><td>610105196712080031</td><td>13845678901</td><td>公司机关</td><td>安全环保部</td><td>2026</td><td>—</td><td>冠脉CTA</td><td>未体检</td><td>宁夏宝石花医院</td><td><span class="link">编辑</span> <span class="link" style="margin-left:8px;">删除</span></td></tr>
|
||||
<tr><td>1</td><td>石维国</td><td>20045678</td><td>男</td><td>59</td><td>610105196712080031</td><td>13845678901</td><td>公司机关</td><td>安全环保部</td><td>2026</td><td>—</td><td>冠脉CTA</td><td>未体检</td><td>宁夏宝石花医院</td><td><span class="link">编辑</span> <span class="link" style="margin-left:8px;">删除</span></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -424,14 +424,14 @@ function deleteRow(el){
|
||||
|
||||
/* ===== 添加本次冠脉CTA检查人员弹窗 ===== */
|
||||
var candidateData = [
|
||||
{code:'20045678', name:'王建国', idcard:'610105196712080031', phone:'13845678901', gender:'男', age:'59', ageRange:'50-60', unit:'公司机关', dept:'安全环保部', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'20045678', name:'石维国', idcard:'610105196712080031', phone:'13845678901', gender:'男', age:'59', ageRange:'50-60', unit:'公司机关', dept:'安全环保部', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'20051234', name:'刘淑芬', idcard:'610105197105120034', phone:'13945789012', gender:'女', age:'55', ageRange:'50-60', unit:'公司机关', dept:'财务部', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'20052345', name:'张德贵', idcard:'610105196403080024', phone:'13745890123', gender:'男', age:'62', ageRange:'60以上', unit:'采油一厂', dept:'作业区', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'长庆油田医院'},
|
||||
{code:'20053456', name:'李红梅', idcard:'610105197409220011', phone:'13645901234', gender:'女', age:'52', ageRange:'50-60', unit:'采油一厂', dept:'综合办', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'长庆油田医院'},
|
||||
{code:'20052345', name:'张德贵', idcard:'610105196403080024', phone:'13745890123', gender:'男', age:'62', ageRange:'60以上', unit:'采油一厂', dept:'作业区', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'CQ油田医院'},
|
||||
{code:'20053456', name:'李红梅', idcard:'610105197409220011', phone:'13645901234', gender:'女', age:'52', ageRange:'50-60', unit:'采油一厂', dept:'综合办', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'CQ油田医院'},
|
||||
{code:'20054567', name:'王军', idcard:'610105196807260046', phone:'13546012345', gender:'男', age:'58', ageRange:'50-60', unit:'采油二厂', dept:'采油队', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'20055678', name:'赵丽', idcard:'610105197711090026', phone:'13446123456', gender:'女', age:'49', ageRange:'40-50', unit:'采油二厂', dept:'财务科', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'长庆油田医院'},
|
||||
{code:'20055678', name:'赵丽', idcard:'610105197711090026', phone:'13446123456', gender:'女', age:'49', ageRange:'40-50', unit:'采油二厂', dept:'财务科', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'CQ油田医院'},
|
||||
{code:'20056789', name:'孙志强', idcard:'610105197003150019', phone:'13346234567', gender:'男', age:'56', ageRange:'50-60', unit:'公司机关', dept:'人事部', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'20057890', name:'陈桂芳', idcard:'610105196504210025', phone:'13246345678', gender:'女', age:'61', ageRange:'60以上', unit:'采油一厂', dept:'地质所', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'长庆油田医院'}
|
||||
{code:'20057890', name:'陈桂芳', idcard:'610105196504210025', phone:'13246345678', gender:'女', age:'61', ageRange:'60以上', unit:'采油一厂', dept:'地质所', ctaItem:'冠脉CTA', sysStatus:'未体检', hospital:'CQ油田医院'}
|
||||
];
|
||||
var selectedMap = {};
|
||||
|
||||
|
||||
@@ -419,7 +419,7 @@
|
||||
</div>
|
||||
<div class="multi-select__dropdown" id="pick-hospital-dropdown">
|
||||
<label class="multi-select__option"><input type="checkbox" value="宁夏宝石花医院" onchange="onHospitalChange()">宁夏宝石花医院</label>
|
||||
<label class="multi-select__option"><input type="checkbox" value="长庆油田医院" onchange="onHospitalChange()">长庆油田医院</label>
|
||||
<label class="multi-select__option"><input type="checkbox" value="CQ油田医院" onchange="onHospitalChange()">CQ油田医院</label>
|
||||
<label class="multi-select__option"><input type="checkbox" value="长安胃肠镜医院" onchange="onHospitalChange()">长安胃肠镜医院</label>
|
||||
<label class="multi-select__option"><input type="checkbox" value="庆阳医院" onchange="onHospitalChange()">庆阳医院</label>
|
||||
</div>
|
||||
@@ -469,12 +469,12 @@ function deleteRow(el){
|
||||
var candidateData = [
|
||||
{code:'30078912', name:'陈伟', idcard:'610103197809220015', phone:'13809123456', gender:'男', age:'48', ageRange:'40-50', unit:'采油四厂', dept:'工程技术科', gastroItem:'胃镜,肠镜', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'30082345', name:'刘芳', idcard:'610103197905120034', phone:'13909134567', gender:'女', age:'45', ageRange:'40-50', unit:'采油四厂', dept:'综合办', gastroItem:'胃镜', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'30085678', name:'王强', idcard:'610103197403080024', phone:'13709145678', gender:'男', age:'52', ageRange:'50-60', unit:'采油五厂', dept:'采油队', gastroItem:'肠镜', sysStatus:'未体检', hospital:'长庆油田医院'},
|
||||
{code:'30088901', name:'李娜', idcard:'610103198511090026', phone:'13609156789', gender:'女', age:'41', ageRange:'40-50', unit:'采油五厂', dept:'财务科', gastroItem:'胃镜,肠镜', sysStatus:'未体检', hospital:'长庆油田医院'},
|
||||
{code:'30085678', name:'王强', idcard:'610103197403080024', phone:'13709145678', gender:'男', age:'52', ageRange:'50-60', unit:'采油五厂', dept:'采油队', gastroItem:'肠镜', sysStatus:'未体检', hospital:'CQ油田医院'},
|
||||
{code:'30088901', name:'李娜', idcard:'610103198511090026', phone:'13609156789', gender:'女', age:'41', ageRange:'40-50', unit:'采油五厂', dept:'财务科', gastroItem:'胃镜,肠镜', sysStatus:'未体检', hospital:'CQ油田医院'},
|
||||
{code:'30091234', name:'张伟', idcard:'610103197109220011', phone:'13509167890', gender:'男', age:'55', ageRange:'50-60', unit:'采油六厂', dept:'作业区', gastroItem:'胃镜', sysStatus:'已体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'30094567', name:'赵敏', idcard:'610103196807260046', phone:'13409178901', gender:'女', age:'58', ageRange:'50-60', unit:'采油六厂', dept:'地质所', gastroItem:'肠镜', sysStatus:'未体检', hospital:'长庆油田医院'},
|
||||
{code:'30094567', name:'赵敏', idcard:'610103196807260046', phone:'13409178901', gender:'女', age:'58', ageRange:'50-60', unit:'采油六厂', dept:'地质所', gastroItem:'肠镜', sysStatus:'未体检', hospital:'CQ油田医院'},
|
||||
{code:'30097890', name:'孙军', idcard:'610103198303150019', phone:'13309189012', gender:'男', age:'47', ageRange:'40-50', unit:'采油四厂', dept:'维修队', gastroItem:'胃镜,肠镜', sysStatus:'未体检', hospital:'宁夏宝石花医院'},
|
||||
{code:'30099901', name:'周丽', idcard:'610103196404210025', phone:'13209190123', gender:'女', age:'62', ageRange:'60以上', unit:'采油五厂', dept:'综合办', gastroItem:'肠镜', sysStatus:'未体检', hospital:'长庆油田医院'}
|
||||
{code:'30099901', name:'周丽', idcard:'610103196404210025', phone:'13209190123', gender:'女', age:'62', ageRange:'60以上', unit:'采油五厂', dept:'综合办', gastroItem:'肠镜', sysStatus:'未体检', hospital:'CQ油田医院'}
|
||||
];
|
||||
var selectedMap = {};
|
||||
|
||||
|
||||
@@ -420,7 +420,7 @@ function deleteRow(el){
|
||||
|
||||
/* ===== 添加指定体检医院员工弹窗 ===== */
|
||||
var candidateData = [
|
||||
{code:'00008512', name:'王建国', idcard:'511222197512120031', phone:'13717501234', gender:'男', age:'51', ageRange:'50-60', unit:'第一采油厂', dept:'采油队'},
|
||||
{code:'00008512', name:'石维国', idcard:'511222197512120031', phone:'13717501234', gender:'男', age:'51', ageRange:'50-60', unit:'第一采油厂', dept:'采油队'},
|
||||
{code:'00008623', name:'刘淑芬', idcard:'511222198003080034', phone:'13817512345', gender:'女', age:'46', ageRange:'40-50', unit:'第一采油厂', dept:'综合办'},
|
||||
{code:'00008734', name:'张德贵', idcard:'511222197109220011', phone:'13917523456', gender:'男', age:'55', ageRange:'50-60', unit:'第二采油厂', dept:'作业区'},
|
||||
{code:'00008845', name:'李红梅', idcard:'511222198511090026', phone:'13617534567', gender:'女', age:'41', ageRange:'40-50', unit:'第二采油厂', dept:'财务科'},
|
||||
|
||||
@@ -566,11 +566,11 @@ var candidateData = [
|
||||
{code:'50501234', name:'陈晨', idcard:'411330198802150025', phone:'13891234567', gender:'女', age:'41', ageRange:'40-50', unit:'CQ工程设计有限公司', dept:'建筑设计部', jobType:'热力司炉工', empForm:'合同制B', entryDate:'1994-09-01', hazardDate:'2000-05-01', examForm:'在岗期间', sysStatus:'未体检', hospital:'宁夏宝石花医院', hazardFactor:'噪声,一氧化碳'},
|
||||
{code:'50502345', name:'刘洋', idcard:'411330197805120034', phone:'13991345678', gender:'男', age:'48', ageRange:'40-50', unit:'第二采气厂', dept:'采气作业区', jobType:'采气工', empForm:'合同制A', entryDate:'1998-07-15', hazardDate:'2002-03-20', examForm:'在岗期间', sysStatus:'未体检', hospital:'宁夏宝石花医院', hazardFactor:'噪声,硫化氢'},
|
||||
{code:'50503456', name:'王敏', idcard:'411330198703080024', phone:'13791456789', gender:'女', age:'44', ageRange:'40-50', unit:'第二采气厂', dept:'集气站', jobType:'化验工', empForm:'合同制B', entryDate:'2003-04-10', hazardDate:'2005-08-12', examForm:'在岗期间', sysStatus:'未体检', hospital:'宁夏宝石花医院', hazardFactor:'苯,噪声'},
|
||||
{code:'50504567', name:'张勇', idcard:'411330197109220011', phone:'13691567890', gender:'男', age:'52', ageRange:'50-60', unit:'第三采气厂', dept:'采气作业区', jobType:'采气工', empForm:'合同制A', entryDate:'1992-11-01', hazardDate:'1996-06-18', examForm:'在岗期间', sysStatus:'未体检', hospital:'长庆油田医院', hazardFactor:'噪声,硫化氢'},
|
||||
{code:'50505678', name:'李静', idcard:'411330198511090026', phone:'13591678901', gender:'女', age:'46', ageRange:'40-50', unit:'第三采气厂', dept:'综合办', jobType:'行政专员', empForm:'合同制B', entryDate:'2006-09-01', hazardDate:'2008-01-15', examForm:'在岗期间', sysStatus:'未体检', hospital:'长庆油田医院', hazardFactor:'噪声'},
|
||||
{code:'50504567', name:'张勇', idcard:'411330197109220011', phone:'13691567890', gender:'男', age:'52', ageRange:'50-60', unit:'第三采气厂', dept:'采气作业区', jobType:'采气工', empForm:'合同制A', entryDate:'1992-11-01', hazardDate:'1996-06-18', examForm:'在岗期间', sysStatus:'未体检', hospital:'CQ油田医院', hazardFactor:'噪声,硫化氢'},
|
||||
{code:'50505678', name:'李静', idcard:'411330198511090026', phone:'13591678901', gender:'女', age:'46', ageRange:'40-50', unit:'第三采气厂', dept:'综合办', jobType:'行政专员', empForm:'合同制B', entryDate:'2006-09-01', hazardDate:'2008-01-15', examForm:'在岗期间', sysStatus:'未体检', hospital:'CQ油田医院', hazardFactor:'噪声'},
|
||||
{code:'50506789', name:'赵刚', idcard:'411330196403150019', phone:'13491789012', gender:'男', age:'55', ageRange:'50-60', unit:'第二采气厂', dept:'维修队', jobType:'机修工', empForm:'劳务派遣', entryDate:'1990-03-05', hazardDate:'1994-10-22', examForm:'在岗期间', sysStatus:'未体检', hospital:'宁夏宝石花医院', hazardFactor:'噪声,电焊烟尘'},
|
||||
{code:'50507890', name:'孙丽', idcard:'411330197904210025', phone:'13391890123', gender:'女', age:'58', ageRange:'50-60', unit:'CQ工程设计有限公司', dept:'结构设计部', jobType:'结构工程师', empForm:'合同制A', entryDate:'1999-05-20', hazardDate:'2001-09-30', examForm:'在岗期间', sysStatus:'未体检', hospital:'宁夏宝石花医院', hazardFactor:'噪声'},
|
||||
{code:'50508901', name:'周强', idcard:'411330196807260046', phone:'13291901234', gender:'男', age:'62', ageRange:'60以上', unit:'第三采气厂', dept:'采气作业区', jobType:'采气工', empForm:'劳务派遣', entryDate:'1988-08-15', hazardDate:'1992-04-11', examForm:'在岗期间', sysStatus:'未体检', hospital:'长庆油田医院', hazardFactor:'噪声,一氧化碳'}
|
||||
{code:'50508901', name:'周强', idcard:'411330196807260046', phone:'13291901234', gender:'男', age:'62', ageRange:'60以上', unit:'第三采气厂', dept:'采气作业区', jobType:'采气工', empForm:'劳务派遣', entryDate:'1988-08-15', hazardDate:'1992-04-11', examForm:'在岗期间', sysStatus:'未体检', hospital:'CQ油田医院', hazardFactor:'噪声,一氧化碳'}
|
||||
];
|
||||
var selectedMap = {};
|
||||
|
||||
|
||||
@@ -294,7 +294,7 @@
|
||||
<span>员工：李明</span><span>·</span><span>男</span><span>·</span><span>35岁</span><span>·</span><span>采油二厂</span><span>·</span><span>生产运行科</span>
|
||||
</div>
|
||||
<div class="chat-expert-info" id="chatExpertInfo">
|
||||
<span>专家：王建国</span><span>·</span><span>主任医师</span><span>·</span><span>内分泌科</span><span>·</span><span>北京协和医院</span>
|
||||
<span>专家：石维国</span><span>·</span><span>主任医师</span><span>·</span><span>内分泌科</span><span>·</span><span>北京协和医院</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -501,7 +501,7 @@ convContents[5] = ''
|
||||
|
||||
/* 各对话的状态配置：tag文字 + 是否已结束 */
|
||||
var convStatus = {
|
||||
0: { text: '咨询中', ended: false, type: 'expert', typeText: '咨询专家', expert: '王建国 · 主任医师 · 内分泌科 · 北京协和医院', emp: '李明 · 男 · 35岁 · 采油二厂 · 生产运行科' },
|
||||
0: { text: '咨询中', ended: false, type: 'expert', typeText: '咨询专家', expert: '石维国 · 主任医师 · 内分泌科 · 北京协和医院', emp: '李明 · 男 · 35岁 · 采油二厂 · 生产运行科' },
|
||||
1: { text: '已结束', ended: true, type: 'expert', typeText: '咨询专家', expert: '李慧敏 · 副主任医师 · 神经内科 · 西京医院', emp: '张伟 · 男 · 42岁 · 钻井工程公司 · 技术管理部' },
|
||||
2: { text: '咨询中', ended: false, type: 'asst', typeText: '咨询小助手', expert: '', emp: '王芳 · 女 · 29岁 · CQ能源总医院 · 护理部' },
|
||||
3: { text: '咨询中', ended: false, type: 'asst', typeText: '咨询小助手', expert: '', emp: '赵静 · 女 · 38岁 · 第五采气厂 · 综合管理科' },
|
||||
|
||||
@@ -328,7 +328,7 @@ table thead .sub-header th{font-size:12px;font-weight:500;}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>BREED-A1</td><td>A1-猪舍</td><td>1,200</td><td>王建国</td><td><span class="tag tag-green">养殖中</span></td><td>猪（杜洛克）</td><td>圈养</td>
|
||||
<tr><td>BREED-A1</td><td>A1-猪舍</td><td>1,200</td><td>石维国</td><td><span class="tag tag-green">养殖中</span></td><td>猪（杜洛克）</td><td>圈养</td>
|
||||
<td>22.4</td><td>68</td><td>8.2</td><td>1,240</td><td>180</td>
|
||||
<td><span class="tag tag-green">正常</span></td><td><span class="tag tag-green">优</span></td><td><span class="tag tag-green">正常</span></td>
|
||||
<td>2026-04-22 10:05</td><td><span class="tag tag-green">正常</span></td><td class="td-actions"><a class="link" onclick="showBreedDetail(this)">详情</a><a class="link" onclick="openBreedModal('edit','BREED-A1','A1-猪舍','1200','猪','圈养','养殖中')">编辑</a><a class="link" onclick="openAlarmLog('BREED-A1','A1-猪舍','breed')">采集记录</a><a class="link" style="color:var(--danger)" onclick="if(confirm('确认删除养殖区 BREED-A1？')){}">删除</a></td></tr>
|
||||
|
||||
@@ -673,7 +673,7 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
<script>
|
||||
/* ===== 联系人模拟数据 ===== */
|
||||
var canteenContacts = {
|
||||
'一号场所': {contact:'王建国', phone:'029-8812-3001'},
|
||||
'一号场所': {contact:'石维国', phone:'029-8812-3001'},
|
||||
'二号场所': {contact:'赵芳', phone:'029-8812-3002'},
|
||||
'三号场所': {contact:'刘洋', phone:'029-8812-3003'}
|
||||
};
|
||||
@@ -768,7 +768,7 @@ var orders = [
|
||||
{trace:'ST-EX-LY01-VG-XLHU-080K-20260416-001',name:'西兰花',cat:'蔬菜类',qty:80,spec:'500g/袋',price:4.5,subtotal:'¥360',acceptedQty:'—',remark:'—'},
|
||||
{trace:'ST-EX-LY01-VG-QCAI-120K-20260416-002',name:'芹菜',cat:'蔬菜类',qty:120,spec:'500g/袋',price:2.5,subtotal:'¥300',acceptedQty:'—',remark:'—'}
|
||||
]},
|
||||
{ no:'PO-20260415-001', canteen:'一号场所', canteenContact:'王建国', canteenPhone:'029-8812-3001',
|
||||
{ no:'PO-20260415-001', canteen:'一号场所', canteenContact:'石维国', canteenPhone:'029-8812-3001',
|
||||
supplier:'绿源蔬菜配送', supplierContact:'李明', supplierPhone:'138-9912-3456',
|
||||
date:'2026-04-15', arrival:'2026-04-16', source:'食谱搭配', status:'待发货', total:'¥485',
|
||||
items:[
|
||||
@@ -776,7 +776,7 @@ var orders = [
|
||||
{trace:'ST-EX-LY01-VG-BCAI-080K-20260415-003',name:'白菜',cat:'蔬菜类',qty:80,spec:'500g/袋',price:1.8,subtotal:'¥144',acceptedQty:'—',remark:'—'},
|
||||
{trace:'ST-EX-LY01-VG-HLUB-120K-20260415-004',name:'胡萝卜',cat:'蔬菜类',qty:120,spec:'500g/袋',price:1.8,subtotal:'¥216',acceptedQty:'—',remark:'—'}
|
||||
]},
|
||||
{ no:'PO-20260415-002', canteen:'一号场所', canteenContact:'王建国', canteenPhone:'029-8812-3001',
|
||||
{ no:'PO-20260415-002', canteen:'一号场所', canteenContact:'石维国', canteenPhone:'029-8812-3001',
|
||||
supplier:'鲜肉直供公司', supplierContact:'张伟', supplierPhone:'139-0088-7654',
|
||||
date:'2026-04-15', arrival:'2026-04-16', source:'食谱搭配', status:'待收货', total:'¥8,480',
|
||||
deliveryMethod:'供应商自送', deliveryPerson:'张伟', deliveryPhone:'139-0088-7654', deliveryETA:'2026-04-16 14:00',
|
||||
@@ -802,7 +802,7 @@ var orders = [
|
||||
{trace:'ST-EX-LY02-DG-HSYO-168K-20260413-002',name:'花生油',cat:'粮油类',qty:168,spec:'5kg/桶',price:16,subtotal:'¥2,688',acceptedQty:'—',remark:'—'}
|
||||
]},
|
||||
/* 待确认订单：系统自动生成，缺供应商与单价，需用户通过"立即确认"补全后流转为"待接单" */
|
||||
{ no:'PO-20260416-006', canteen:'一号场所', canteenContact:'王建国', canteenPhone:'029-8812-3001',
|
||||
{ no:'PO-20260416-006', canteen:'一号场所', canteenContact:'石维国', canteenPhone:'029-8812-3001',
|
||||
supplier:'', supplierContact:'', supplierPhone:'',
|
||||
date:'2026-04-16', arrival:'2026-04-17', source:'系统生成', status:'待确认', total:'待核算',
|
||||
items:[
|
||||
|
||||
@@ -299,11 +299,11 @@ function getParam(name) {
|
||||
/* ===== Mock 活动数据 ===== */
|
||||
var unitActivityData = {
|
||||
'第四采油厂': [
|
||||
{id:1,planName:'第四采油厂2024年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2024-03-01',dateTo:'2024-08-31',staffScope:'全厂员工',shouldCount:220,actualCount:205,notCount:15,weightGoalDone:168,fatGoalDone:152,waistGoalDone:145,avgWeightLoss:3.8,avgLossRate:4.5,avgWaistLoss:4.2,avgDailyIntake:1850,avgDailyConsume:520,avgDailyGap:330,avgScore:82.5,avgActionScore:76.3,responsible:'王建国'},
|
||||
{id:2,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'全厂员工',shouldCount:267,actualCount:251,notCount:16,weightGoalDone:198,fatGoalDone:185,waistGoalDone:172,avgWeightLoss:4.2,avgLossRate:5.1,avgWaistLoss:4.8,avgDailyIntake:1780,avgDailyConsume:560,avgDailyGap:380,avgScore:85.3,avgActionScore:79.1,responsible:'王建国'},
|
||||
{id:3,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'全厂员工',shouldCount:234,actualCount:218,notCount:16,weightGoalDone:92,fatGoalDone:78,waistGoalDone:71,avgWeightLoss:2.1,avgLossRate:2.5,avgWaistLoss:2.3,avgDailyIntake:1920,avgDailyConsume:490,avgDailyGap:280,avgScore:74.8,avgActionScore:68.2,responsible:'王建国'},
|
||||
{id:1,planName:'第四采油厂2024年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2024-03-01',dateTo:'2024-08-31',staffScope:'全厂员工',shouldCount:220,actualCount:205,notCount:15,weightGoalDone:168,fatGoalDone:152,waistGoalDone:145,avgWeightLoss:3.8,avgLossRate:4.5,avgWaistLoss:4.2,avgDailyIntake:1850,avgDailyConsume:520,avgDailyGap:330,avgScore:82.5,avgActionScore:76.3,responsible:'石维国'},
|
||||
{id:2,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'全厂员工',shouldCount:267,actualCount:251,notCount:16,weightGoalDone:198,fatGoalDone:185,waistGoalDone:172,avgWeightLoss:4.2,avgLossRate:5.1,avgWaistLoss:4.8,avgDailyIntake:1780,avgDailyConsume:560,avgDailyGap:380,avgScore:85.3,avgActionScore:79.1,responsible:'石维国'},
|
||||
{id:3,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'全厂员工',shouldCount:234,actualCount:218,notCount:16,weightGoalDone:92,fatGoalDone:78,waistGoalDone:71,avgWeightLoss:2.1,avgLossRate:2.5,avgWaistLoss:2.3,avgDailyIntake:1920,avgDailyConsume:490,avgDailyGap:280,avgScore:74.8,avgActionScore:68.2,responsible:'石维国'},
|
||||
{id:4,planName:'第四采油厂2025年秋季健步走活动',unit:'第四采油厂',dept:'工会办公室',dateFrom:'2025-09-01',dateTo:'2025-10-31',staffScope:'一线员工',shouldCount:150,actualCount:138,notCount:12,weightGoalDone:89,fatGoalDone:76,waistGoalDone:70,avgWeightLoss:2.8,avgLossRate:3.2,avgWaistLoss:3.0,avgDailyIntake:1950,avgDailyConsume:510,avgDailyGap:290,avgScore:78.2,avgActionScore:72.5,responsible:'张翠花'},
|
||||
{id:5,planName:'第四采油厂2026年春季健康训练营',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-04-01',dateTo:'2026-06-30',staffScope:'管理部门',shouldCount:96,actualCount:82,notCount:14,weightGoalDone:35,fatGoalDone:28,waistGoalDone:25,avgWeightLoss:1.5,avgLossRate:1.8,avgWaistLoss:1.6,avgDailyIntake:2010,avgDailyConsume:460,avgDailyGap:220,avgScore:69.5,avgActionScore:63.8,responsible:'王建国'}
|
||||
{id:5,planName:'第四采油厂2026年春季健康训练营',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-04-01',dateTo:'2026-06-30',staffScope:'管理部门',shouldCount:96,actualCount:82,notCount:14,weightGoalDone:35,fatGoalDone:28,waistGoalDone:25,avgWeightLoss:1.5,avgLossRate:1.8,avgWaistLoss:1.6,avgDailyIntake:2010,avgDailyConsume:460,avgDailyGap:220,avgScore:69.5,avgActionScore:63.8,responsible:'石维国'}
|
||||
],
|
||||
'采油一厂': [
|
||||
{id:6,planName:'采油一厂2024年健康体重专项活动',unit:'采油一厂',dept:'安全环保科',dateFrom:'2024-04-01',dateTo:'2024-09-30',staffScope:'管理部门',shouldCount:156,actualCount:142,notCount:14,weightGoalDone:110,fatGoalDone:98,waistGoalDone:89,avgWeightLoss:3.5,avgLossRate:4.2,avgWaistLoss:3.9,avgDailyIntake:1900,avgDailyConsume:480,avgDailyGap:300,avgScore:80.1,avgActionScore:73.5,responsible:'李明辉'},
|
||||
@@ -321,12 +321,12 @@ var unitActivityData = {
|
||||
/* 部门活动数据（三级单位） */
|
||||
var deptActivityData = {
|
||||
'第四采油厂|作业一区': [
|
||||
{id:1,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'作业一区',shouldCount:85,actualCount:80,notCount:5,weightGoalDone:62,fatGoalDone:55,waistGoalDone:50,avgWeightLoss:4.8,avgLossRate:5.5,avgWaistLoss:5.2,avgDailyIntake:1750,avgDailyConsume:580,avgDailyGap:400,avgScore:87.2,avgActionScore:81.5,responsible:'王建国'},
|
||||
{id:2,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'作业一区',shouldCount:78,actualCount:72,notCount:6,weightGoalDone:32,fatGoalDone:28,waistGoalDone:25,avgWeightLoss:2.5,avgLossRate:3.0,avgWaistLoss:2.8,avgDailyIntake:1900,avgDailyConsume:500,avgDailyGap:300,avgScore:76.5,avgActionScore:70.2,responsible:'王建国'}
|
||||
{id:1,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'作业一区',shouldCount:85,actualCount:80,notCount:5,weightGoalDone:62,fatGoalDone:55,waistGoalDone:50,avgWeightLoss:4.8,avgLossRate:5.5,avgWaistLoss:5.2,avgDailyIntake:1750,avgDailyConsume:580,avgDailyGap:400,avgScore:87.2,avgActionScore:81.5,responsible:'石维国'},
|
||||
{id:2,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'作业一区',shouldCount:78,actualCount:72,notCount:6,weightGoalDone:32,fatGoalDone:28,waistGoalDone:25,avgWeightLoss:2.5,avgLossRate:3.0,avgWaistLoss:2.8,avgDailyIntake:1900,avgDailyConsume:500,avgDailyGap:300,avgScore:76.5,avgActionScore:70.2,responsible:'石维国'}
|
||||
],
|
||||
'第四采油厂|作业二区': [
|
||||
{id:3,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'作业二区',shouldCount:92,actualCount:88,notCount:4,weightGoalDone:70,fatGoalDone:65,waistGoalDone:60,avgWeightLoss:4.0,avgLossRate:4.8,avgWaistLoss:4.5,avgDailyIntake:1800,avgDailyConsume:550,avgDailyGap:370,avgScore:84.0,avgActionScore:78.3,responsible:'王建国'},
|
||||
{id:4,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'作业二区',shouldCount:82,actualCount:76,notCount:6,weightGoalDone:30,fatGoalDone:25,waistGoalDone:22,avgWeightLoss:1.8,avgLossRate:2.2,avgWaistLoss:2.0,avgDailyIntake:1950,avgDailyConsume:480,avgDailyGap:260,avgScore:73.2,avgActionScore:66.8,responsible:'王建国'}
|
||||
{id:3,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'作业二区',shouldCount:92,actualCount:88,notCount:4,weightGoalDone:70,fatGoalDone:65,waistGoalDone:60,avgWeightLoss:4.0,avgLossRate:4.8,avgWaistLoss:4.5,avgDailyIntake:1800,avgDailyConsume:550,avgDailyGap:370,avgScore:84.0,avgActionScore:78.3,responsible:'石维国'},
|
||||
{id:4,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'作业二区',shouldCount:82,actualCount:76,notCount:6,weightGoalDone:30,fatGoalDone:25,waistGoalDone:22,avgWeightLoss:1.8,avgLossRate:2.2,avgWaistLoss:2.0,avgDailyIntake:1950,avgDailyConsume:480,avgDailyGap:260,avgScore:73.2,avgActionScore:66.8,responsible:'石维国'}
|
||||
],
|
||||
'采油一厂|采油一队': [
|
||||
{id:5,planName:'采油一厂2025年员工健康体重活动',unit:'采油一厂',dept:'安全环保科',dateFrom:'2025-04-15',dateTo:'2025-10-15',staffScope:'采油一队',shouldCount:130,actualCount:125,notCount:5,weightGoalDone:98,fatGoalDone:90,waistGoalDone:85,avgWeightLoss:3.5,avgLossRate:4.2,avgWaistLoss:3.8,avgDailyIntake:1850,avgDailyConsume:520,avgDailyGap:340,avgScore:82.0,avgActionScore:76.5,responsible:'李明辉'},
|
||||
|
||||
@@ -373,9 +373,9 @@ tbody tr:hover{background:#F8FBFF;}
|
||||
|
||||
/* ===== Mock 数据：历史活动活动列表 ===== */
|
||||
var historyPlans = [
|
||||
{id:1,planName:'第四采油厂2024年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2024-03-01',dateTo:'2024-08-31',staffScope:'全厂员工',shouldCount:220,actualCount:205,notCount:15,weightGoalDone:168,fatGoalDone:152,waistGoalDone:145,avgWeightLoss:3.8,avgLossRate:4.5,avgWaistLoss:4.2,avgDailyIntake:1850,avgDailyConsume:520,avgDailyGap:330,avgScore:82.5,avgActionScore:76.3,responsible:'王建国'},
|
||||
{id:2,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'全厂员工',shouldCount:267,actualCount:251,notCount:16,weightGoalDone:198,fatGoalDone:185,waistGoalDone:172,avgWeightLoss:4.2,avgLossRate:5.1,avgWaistLoss:4.8,avgDailyIntake:1780,avgDailyConsume:560,avgDailyGap:380,avgScore:85.3,avgActionScore:79.1,responsible:'王建国'},
|
||||
{id:3,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'全厂员工',shouldCount:234,actualCount:218,notCount:16,weightGoalDone:92,fatGoalDone:78,waistGoalDone:71,avgWeightLoss:2.1,avgLossRate:2.5,avgWaistLoss:2.3,avgDailyIntake:1920,avgDailyConsume:490,avgDailyGap:280,avgScore:74.8,avgActionScore:68.2,responsible:'王建国'},
|
||||
{id:1,planName:'第四采油厂2024年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2024-03-01',dateTo:'2024-08-31',staffScope:'全厂员工',shouldCount:220,actualCount:205,notCount:15,weightGoalDone:168,fatGoalDone:152,waistGoalDone:145,avgWeightLoss:3.8,avgLossRate:4.5,avgWaistLoss:4.2,avgDailyIntake:1850,avgDailyConsume:520,avgDailyGap:330,avgScore:82.5,avgActionScore:76.3,responsible:'石维国'},
|
||||
{id:2,planName:'第四采油厂2025年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',staffScope:'全厂员工',shouldCount:267,actualCount:251,notCount:16,weightGoalDone:198,fatGoalDone:185,waistGoalDone:172,avgWeightLoss:4.2,avgLossRate:5.1,avgWaistLoss:4.8,avgDailyIntake:1780,avgDailyConsume:560,avgDailyGap:380,avgScore:85.3,avgActionScore:79.1,responsible:'石维国'},
|
||||
{id:3,planName:'第四采油厂2026年超重健康干预活动',unit:'第四采油厂',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',staffScope:'全厂员工',shouldCount:234,actualCount:218,notCount:16,weightGoalDone:92,fatGoalDone:78,waistGoalDone:71,avgWeightLoss:2.1,avgLossRate:2.5,avgWaistLoss:2.3,avgDailyIntake:1920,avgDailyConsume:490,avgDailyGap:280,avgScore:74.8,avgActionScore:68.2,responsible:'石维国'},
|
||||
{id:4,planName:'采油一厂2024年健康体重专项活动',unit:'采油一厂',dept:'安全环保科',dateFrom:'2024-04-01',dateTo:'2024-09-30',staffScope:'管理部门',shouldCount:156,actualCount:142,notCount:14,weightGoalDone:110,fatGoalDone:98,waistGoalDone:89,avgWeightLoss:3.5,avgLossRate:4.2,avgWaistLoss:3.9,avgDailyIntake:1900,avgDailyConsume:480,avgDailyGap:300,avgScore:80.1,avgActionScore:73.5,responsible:'李明辉'},
|
||||
{id:5,planName:'采油一厂2025年员工健康体重活动',unit:'采油一厂',dept:'安全环保科',dateFrom:'2025-04-15',dateTo:'2025-10-15',staffScope:'全厂员工',shouldCount:420,actualCount:398,notCount:22,weightGoalDone:310,fatGoalDone:285,waistGoalDone:268,avgWeightLoss:3.9,avgLossRate:4.8,avgWaistLoss:4.3,avgDailyIntake:1820,avgDailyConsume:540,avgDailyGap:360,avgScore:83.7,avgActionScore:77.8,responsible:'李明辉'},
|
||||
{id:6,planName:'采油一厂2026年体重管理专项行动',unit:'采油一厂',dept:'安全环保科',dateFrom:'2026-04-01',dateTo:'2026-09-30',staffScope:'全厂员工',shouldCount:186,actualCount:180,notCount:6,weightGoalDone:65,fatGoalDone:52,waistGoalDone:48,avgWeightLoss:1.8,avgLossRate:2.1,avgWaistLoss:2.0,avgDailyIntake:1950,avgDailyConsume:470,avgDailyGap:250,avgScore:72.3,avgActionScore:65.8,responsible:'李明辉'},
|
||||
|
||||
@@ -396,7 +396,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei
|
||||
<div class="search-select__panel" id="leaderPanel">
|
||||
<div class="search-select__option" onclick="selectLeader(this,'宋喜宁','CQ001001')"><span class="search-select__avatar">宋</span>宋喜宁（CQ001001）</div>
|
||||
<div class="search-select__option" onclick="selectLeader(this,'刘建华','CQ001002')"><span class="search-select__avatar">刘</span>刘建华（CQ001002）</div>
|
||||
<div class="search-select__option" onclick="selectLeader(this,'周明远','CQ001003')"><span class="search-select__avatar">周</span>周明远（CQ001003）</div>
|
||||
<div class="search-select__option" onclick="selectLeader(this,'曲志明','CQ001003')"><span class="search-select__avatar">曲</span>曲志明（CQ001003）</div>
|
||||
<div class="search-select__option" onclick="selectLeader(this,'王志强','CQ001004')"><span class="search-select__avatar">王</span>王志强（CQ001004）</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1230,12 +1230,12 @@ document.getElementById('empModal').addEventListener('click',function(e){
|
||||
var editData = {
|
||||
1:{org:'第四采油厂',name:'第四采油厂2026年超重健康干预活动',personType:'specific',dept:'健康管理部',dateFrom:'2026-03-01',dateTo:'2026-08-31',leader:'宋喜宁',reviewer:'李健康'},
|
||||
2:{org:'采油一厂',name:'采油一厂2026年体重管理专项行动',personType:'specific',dept:'安全环保科',dateFrom:'2026-04-01',dateTo:'2026-09-30',leader:'刘建华',reviewer:'张体检'},
|
||||
3:{org:'采油二厂',name:'采油二厂2026年健康减重活动',personType:'all',dept:'工会办公室',dateFrom:'2026-05-15',dateTo:'2026-11-15',leader:'周明远',reviewer:'陈管理'},
|
||||
3:{org:'采油二厂',name:'采油二厂2026年健康减重活动',personType:'all',dept:'工会办公室',dateFrom:'2026-05-15',dateTo:'2026-11-15',leader:'曲志明',reviewer:'陈管理'},
|
||||
4:{org:'采气一厂',name:'采气一厂2025年度体重管理活动',personType:'specific',dept:'健康管理部',dateFrom:'2025-06-01',dateTo:'2025-12-01',leader:'王志强',reviewer:'冯审核'},
|
||||
5:{org:'第四采油厂',name:'第四采油厂2025年超重健康干预活动',personType:'all',dept:'健康管理部',dateFrom:'2025-03-01',dateTo:'2025-08-31',leader:'宋喜宁',reviewer:'李健康'},
|
||||
6:{org:'采油一厂',name:'采油一厂2025年员工健康体重活动',personType:'all',dept:'安全环保科',dateFrom:'2025-04-15',dateTo:'2025-10-15',leader:'刘建华',reviewer:'赵预防'},
|
||||
7:{org:'采气一厂',name:'采气一厂2026下半年体重干预活动',personType:'specific',dept:'健康管理部',dateFrom:'2026-09-01',dateTo:'2026-12-31',leader:'王志强',reviewer:'杨体检'},
|
||||
8:{org:'采油二厂',name:'采油二厂2024年体重控制专项活动',personType:'specific',dept:'工会办公室',dateFrom:'2024-07-01',dateTo:'2024-12-31',leader:'周明远',reviewer:'陈管理'}
|
||||
8:{org:'采油二厂',name:'采油二厂2024年体重控制专项活动',personType:'specific',dept:'工会办公室',dateFrom:'2024-07-01',dateTo:'2024-12-31',leader:'曲志明',reviewer:'陈管理'}
|
||||
};
|
||||
var data = editData[id];
|
||||
if(!data) return;
|
||||
|
||||
@@ -320,7 +320,7 @@ tbody tr:hover td.td-actions{background:#F8FBFF;}
|
||||
<td><a class="link" onclick="openReviewerDialog(3)">2人</a></td>
|
||||
<td><span class="tag tag-blue">进行中</span></td>
|
||||
<td>工会办公室</td>
|
||||
<td>周明远</td>
|
||||
<td>曲志明</td>
|
||||
<td>137-6523-7890</td>
|
||||
<td class="td-actions">
|
||||
<span style="color:var(--text-placeholder);cursor:not-allowed;">编辑</span>
|
||||
|
||||
Reference in New Issue
Block a user