fix: 更新健康检查、健康监测及体重管理页面，新增胃肠镜报告页面
This commit is contained in:
liuyunqin
@@ -162,6 +162,8 @@
|
||||
.consult-table thead th:nth-child(2) { width: 22%; }
|
||||
.consult-table thead th:nth-child(3) { width: 20%; }
|
||||
.consult-table thead th:nth-child(4) { width: 24%; }
|
||||
.consult-table--gastro thead th:first-child { width: 30%; }
|
||||
.consult-table--gastro thead th:nth-child(2) { width: 70%; }
|
||||
.is-abnormal { color: var(--danger); font-weight: 600; }
|
||||
.consult-table tbody td:nth-child(2) { color: var(--danger); font-weight: 600; }
|
||||
</style>
|
||||
@@ -310,6 +312,44 @@
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 肠胃镜检查 -->
|
||||
<div class="category">
|
||||
<div class="category__title">肠胃镜检查</div>
|
||||
|
||||
<!-- 胃镜 -->
|
||||
<div class="sub-section">
|
||||
<div class="sub-section__header">
|
||||
<div class="sub-section__name"><span class="sub-section__bar"></span>胃镜</div>
|
||||
<a class="sub-section__link">专家库一键咨询></a>
|
||||
</div>
|
||||
<table class="consult-table consult-table--gastro">
|
||||
<thead><tr><th>名称</th><th>结果</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>食管</td><td class="is-abnormal">黏膜光滑，未见异常</td></tr>
|
||||
<tr><td>胃</td><td class="is-abnormal">胃窦黏膜轻度充血水肿</td></tr>
|
||||
<tr><td>十二指肠</td><td class="is-abnormal">黏膜光滑，未见异常</td></tr>
|
||||
<tr><td>诊断结果</td><td class="is-abnormal">慢性非萎缩性胃炎（胃窦）</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- 肠镜 -->
|
||||
<div class="sub-section">
|
||||
<div class="sub-section__header">
|
||||
<div class="sub-section__name"><span class="sub-section__bar"></span>肠镜</div>
|
||||
<a class="sub-section__link">专家库一键咨询></a>
|
||||
</div>
|
||||
<table class="consult-table consult-table--gastro">
|
||||
<thead><tr><th>名称</th><th>结果</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>结肠</td><td class="is-abnormal">全结肠黏膜光滑，未见异常</td></tr>
|
||||
<tr><td>诊断结果</td><td class="is-abnormal">全结肠黏膜未见明显异常</td></tr>
|
||||
<tr><td>病理诊断</td><td class="is-abnormal">黏膜慢性炎</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,477 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>胃肠镜体检报告</title>
|
||||
<style>
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
:root {
|
||||
--primary: #20c7c7;
|
||||
--primary-dark: #119b9b;
|
||||
--primary-light: #e8fbfb;
|
||||
--border: #cfeeee;
|
||||
--line: #dff3f3;
|
||||
--bg-page: #f0f2f5;
|
||||
--bg-content: #f6fbfb;
|
||||
--text-primary: #1a1a1a;
|
||||
--text-secondary: #666;
|
||||
--text-muted: #8c8c8c;
|
||||
--success: #52c41a;
|
||||
--paper-shadow: 0 8px 24px rgba(17, 155, 155, 0.08);
|
||||
}
|
||||
body {
|
||||
background: var(--bg-page);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
min-height: 100vh;
|
||||
padding: 20px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
.phone-shell {
|
||||
width: 390px;
|
||||
min-height: 844px;
|
||||
background: var(--bg-content);
|
||||
border-radius: 44px;
|
||||
box-shadow: 0 20px 60px rgba(0,0,0,0.25), inset 0 0 0 2px #e0e0e0;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.phone-status-bar {
|
||||
height: 44px;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.phone-status-bar .time { font-size: 15px; font-weight: 700; }
|
||||
.phone-status-bar .icons { display: flex; gap: 6px; align-items: center; }
|
||||
.nav-bar {
|
||||
height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 16px;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
flex-shrink: 0;
|
||||
position: relative;
|
||||
}
|
||||
.nav-back {
|
||||
font-size: 18px;
|
||||
color: var(--text-primary);
|
||||
cursor: pointer;
|
||||
line-height: 1;
|
||||
text-decoration: none;
|
||||
}
|
||||
.nav-title {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 17px;
|
||||
font-weight: 600;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
.scroll-content {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
background: linear-gradient(180deg, #ecfbfb 0%, #f7fbfb 160px, #f7fbfb 100%);
|
||||
}
|
||||
.scroll-content::-webkit-scrollbar { display: none; }
|
||||
.page-body { padding: 14px; }
|
||||
|
||||
/* 报告卡片 */
|
||||
.report-paper {
|
||||
background: #fff;
|
||||
border-radius: 20px;
|
||||
box-shadow: var(--paper-shadow);
|
||||
border: 1px solid rgba(32, 199, 199, 0.08);
|
||||
overflow: hidden;
|
||||
}
|
||||
.report-header {
|
||||
padding: 18px 16px 14px;
|
||||
background: linear-gradient(180deg, #fbffff 0%, #f4ffff 100%);
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
.report-header__top {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.report-header__title {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 1px;
|
||||
color: #0f7d7d;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
.report-header__sub {
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
line-height: 1.6;
|
||||
}
|
||||
.report-status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 62px;
|
||||
height: 28px;
|
||||
padding: 0 10px;
|
||||
border-radius: 14px;
|
||||
background: #f6ffed;
|
||||
color: var(--success);
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.report-tag--gastro {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 62px;
|
||||
height: 28px;
|
||||
padding: 0 10px;
|
||||
border-radius: 14px;
|
||||
background: #e6fffb;
|
||||
color: #08979c;
|
||||
border: 1px solid #87e8de;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* 章节 */
|
||||
.report-section {
|
||||
padding: 14px 16px 0;
|
||||
}
|
||||
.report-section__title {
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 12px;
|
||||
margin: 0 -16px 12px;
|
||||
background: linear-gradient(90deg, #78e3e3 0%, #a4eded 100%);
|
||||
color: #0c7070;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
.report-section__title--gastric {
|
||||
background: linear-gradient(90deg, #ffd591 0%, #ffe7ba 100%);
|
||||
color: #ad6800;
|
||||
}
|
||||
.report-section__title--colon {
|
||||
background: linear-gradient(90deg, #b5f5ec 0%, #d9f9f4 100%);
|
||||
color: #006d75;
|
||||
}
|
||||
|
||||
/* 检查字段 */
|
||||
.field-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
padding-bottom: 14px;
|
||||
}
|
||||
.field-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
.field-item__label {
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
font-weight: 600;
|
||||
}
|
||||
.field-item__value-wrap {
|
||||
position: relative;
|
||||
}
|
||||
.field-item__value {
|
||||
font-size: 13px;
|
||||
line-height: 1.7;
|
||||
color: var(--text-primary);
|
||||
background: #f9fffe;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 10px;
|
||||
padding: 10px 12px;
|
||||
min-height: 40px;
|
||||
max-height: 76px;
|
||||
overflow: hidden;
|
||||
transition: max-height 0.3s ease;
|
||||
}
|
||||
.field-item.is-expanded .field-item__value {
|
||||
max-height: 600px;
|
||||
}
|
||||
.field-item__fade {
|
||||
position: absolute;
|
||||
left: 1px;
|
||||
right: 1px;
|
||||
bottom: 1px;
|
||||
height: 32px;
|
||||
background: linear-gradient(180deg, rgba(249,255,254,0) 0%, rgba(249,255,254,0.96) 60%);
|
||||
pointer-events: none;
|
||||
border-radius: 0 0 10px 10px;
|
||||
}
|
||||
.field-item.is-expanded .field-item__fade {
|
||||
display: none;
|
||||
}
|
||||
.field-item__toggle {
|
||||
display: none;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
bottom: 8px;
|
||||
border: none;
|
||||
background: #f9fffe;
|
||||
color: var(--primary-dark);
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
z-index: 1;
|
||||
}
|
||||
.field-item__toggle.is-visible {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
/* 报告图片 */
|
||||
.image-section {
|
||||
padding: 14px 16px 4px;
|
||||
}
|
||||
.image-section__label {
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
font-weight: 600;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.image-view-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 8px 14px;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 10px;
|
||||
background: #f9fffe;
|
||||
color: var(--primary-dark);
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
margin-bottom: 14px;
|
||||
transition: border-color 0.2s, background 0.2s;
|
||||
}
|
||||
.image-view-link:hover { border-color: var(--primary); background: var(--primary-light); }
|
||||
|
||||
/* 分割线 */
|
||||
.divider {
|
||||
height: 1px;
|
||||
background: var(--line);
|
||||
margin: 0 16px;
|
||||
}
|
||||
|
||||
/* 返回按钮 */
|
||||
.back-btn-wrap {
|
||||
padding: 10px 16px 18px;
|
||||
}
|
||||
.back-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
width: 100%;
|
||||
height: 46px;
|
||||
border: none;
|
||||
border-radius: 23px;
|
||||
background: linear-gradient(135deg, #13c2c2, #36cfc9);
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 8px 20px rgba(19, 194, 194, 0.22);
|
||||
}
|
||||
.bottom-spacer { height: 20px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="phone-shell">
|
||||
<div class="phone-status-bar">
|
||||
<span class="time">12:00</span>
|
||||
<div class="icons">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 6l5 5 5-5"/><path d="M4 9l3 3 3-3" opacity="0.5"/></svg>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="1" y="6" width="18" height="12" rx="2"/><path d="M21 10v4"/></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="nav-bar">
|
||||
<!-- [交互] 返回按钮：返回体检报告列表 -->
|
||||
<span class="nav-back" onclick="location.href='reports.html'">‹</span>
|
||||
<span class="nav-title">胃肠镜报告</span>
|
||||
</div>
|
||||
<div class="scroll-content">
|
||||
<div class="page-body">
|
||||
<div class="report-paper">
|
||||
<!-- 报告头部 -->
|
||||
<div class="report-header">
|
||||
<div class="report-header__top">
|
||||
<div>
|
||||
<div class="report-header__title">2025年体检报告</div>
|
||||
<div class="report-header__sub">姓名：张旭
|
||||
<br>性别：男
|
||||
<br>年龄：32
|
||||
<br>身份证号：430626198503250024
|
||||
<br>体检日期：2025-03-21
|
||||
<br>体检医院：CQ星龙园医院
|
||||
</div>
|
||||
</div>
|
||||
<span class="report-tag--gastro">胃肠镜体检</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ========== 胃镜检查 ========== -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title report-section__title--gastric">胃镜检查</div>
|
||||
<div class="field-list">
|
||||
<div class="field-item" id="field-esophagus">
|
||||
<div class="field-item__label">食管</div>
|
||||
<div class="field-item__value-wrap">
|
||||
<div class="field-item__value">食管黏膜光滑，色泽正常，血管纹理清晰，未见静脉曲张及占位性病变。贲门开闭良好。</div>
|
||||
<div class="field-item__fade"></div>
|
||||
<button class="field-item__toggle" type="button" onclick="toggleField(this)">展开</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field-item" id="field-stomach">
|
||||
<div class="field-item__label">胃</div>
|
||||
<div class="field-item__value-wrap">
|
||||
<div class="field-item__value">胃底、胃体黏膜光滑，色泽橘红，黏液湖清亮。胃角切迹光滑，胃窦黏膜轻度充血水肿，未见糜烂及溃疡。幽门口圆，开闭良好。</div>
|
||||
<div class="field-item__fade"></div>
|
||||
<button class="field-item__toggle" type="button" onclick="toggleField(this)">展开</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field-item" id="field-duodenum">
|
||||
<div class="field-item__label">十二指肠</div>
|
||||
<div class="field-item__value-wrap">
|
||||
<div class="field-item__value">十二指肠球部及降部黏膜光滑，未见溃疡、糜烂及占位性病变。乳头形态正常。</div>
|
||||
<div class="field-item__fade"></div>
|
||||
<button class="field-item__toggle" type="button" onclick="toggleField(this)">展开</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field-item" id="field-gastro-diagnosis">
|
||||
<div class="field-item__label">诊断结果</div>
|
||||
<div class="field-item__value-wrap">
|
||||
<div class="field-item__value">慢性非萎缩性胃炎（胃窦）</div>
|
||||
<div class="field-item__fade"></div>
|
||||
<button class="field-item__toggle" type="button" onclick="toggleField(this)">展开</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 胃镜报告图片 -->
|
||||
<div class="image-section">
|
||||
<div class="image-section__label">胃镜报告图片</div>
|
||||
<div class="image-view-link">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
|
||||
查看
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="divider"></div>
|
||||
|
||||
<!-- ========== 肠镜检查 ========== -->
|
||||
<div class="report-section">
|
||||
<div class="report-section__title report-section__title--colon">肠镜检查</div>
|
||||
<div class="field-list">
|
||||
<div class="field-item" id="field-colon">
|
||||
<div class="field-item__label">结肠</div>
|
||||
<div class="field-item__value-wrap">
|
||||
<div class="field-item__value">全结肠黏膜光滑，血管纹理清晰，未见充血、水肿、糜烂、溃疡及占位性病变。回盲瓣呈唇形，阑尾开口形态正常。结肠袋形态规整，蠕动良好。</div>
|
||||
<div class="field-item__fade"></div>
|
||||
<button class="field-item__toggle" type="button" onclick="toggleField(this)">展开</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field-item" id="field-colon-diagnosis">
|
||||
<div class="field-item__label">诊断结果</div>
|
||||
<div class="field-item__value-wrap">
|
||||
<div class="field-item__value">全结肠黏膜未见明显异常</div>
|
||||
<div class="field-item__fade"></div>
|
||||
<button class="field-item__toggle" type="button" onclick="toggleField(this)">展开</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field-item" id="field-pathology">
|
||||
<div class="field-item__label">病理诊断</div>
|
||||
<div class="field-item__value-wrap">
|
||||
<div class="field-item__value">（降结肠活检）送检肠黏膜组织，腺体排列整齐，间质少量淋巴细胞浸润，未见异型增生及癌细胞。病理诊断：黏膜慢性炎。</div>
|
||||
<div class="field-item__fade"></div>
|
||||
<button class="field-item__toggle" type="button" onclick="toggleField(this)">展开</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 肠镜报告图片 -->
|
||||
<div class="image-section">
|
||||
<div class="image-section__label">肠镜报告图片</div>
|
||||
<div class="image-view-link">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
|
||||
查看
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 货件报告图片 -->
|
||||
<div class="image-section">
|
||||
<div class="image-section__label">货件报告图片</div>
|
||||
<div class="image-view-link">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
|
||||
查看
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 返回按钮 -->
|
||||
<div class="back-btn-wrap">
|
||||
<!-- [交互] 返回报告列表按钮 -->
|
||||
<button class="back-btn" onclick="location.href='reports.html'">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><line x1="19" y1="12" x2="5" y2="12"/><polyline points="12 19 5 12 12 5"/></svg>
|
||||
返回报告列表
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom-spacer"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
// [交互] 展开/收起字段内容
|
||||
function toggleField(btn) {
|
||||
var item = btn.closest('.field-item');
|
||||
var fade = item.querySelector('.field-item__fade');
|
||||
var isExpanded = item.classList.toggle('is-expanded');
|
||||
btn.innerHTML = isExpanded
|
||||
? '收起 <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"/></svg>'
|
||||
: '展开 <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>';
|
||||
if (fade) fade.style.display = isExpanded ? 'none' : '';
|
||||
}
|
||||
|
||||
// 页面加载后，检测哪些字段内容超过3行，仅对超出的显示展开按钮
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
var items = document.querySelectorAll('.field-item');
|
||||
items.forEach(function(item) {
|
||||
var value = item.querySelector('.field-item__value');
|
||||
var btn = item.querySelector('.field-item__toggle');
|
||||
if (!value || !btn) return;
|
||||
// scrollHeight 为完整内容高度，clientHeight 为可见高度
|
||||
if (value.scrollHeight > value.clientHeight + 2) {
|
||||
btn.classList.add('is-visible');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -144,6 +144,21 @@
|
||||
font-weight: 700;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.report-tag--regular {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 62px;
|
||||
height: 28px;
|
||||
padding: 0 10px;
|
||||
border-radius: 14px;
|
||||
background: #e6f7ff;
|
||||
color: #096dd9;
|
||||
border: 1px solid #91d5ff;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.summary-strip {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
@@ -404,7 +419,7 @@
|
||||
<div class="nav-bar">
|
||||
<!-- [交互] 返回按钮：返回体检报告列表 -->
|
||||
<span class="nav-back" onclick="location.href='reports.html'">‹</span>
|
||||
<span class="nav-title">报告查询</span>
|
||||
<span class="nav-title">常规体检报告</span>
|
||||
<a class="nav-action" href="javascript:void(0)">
|
||||
<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="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>
|
||||
下载
|
||||
@@ -425,7 +440,7 @@
|
||||
<br>体检医院：宁夏宝石花医院健康管理中心
|
||||
</div>
|
||||
</div>
|
||||
<div class="report-status">已出报告</div>
|
||||
<span class="report-tag--regular">常规体检</span>
|
||||
</div>
|
||||
<!-- <div class="summary-strip">-->
|
||||
<!-- <div class="summary-strip__item">-->
|
||||
|
||||
@@ -69,6 +69,14 @@
|
||||
.report-item__content { flex: 1; min-width: 0; }
|
||||
.report-item__title { font-size: 15px; font-weight: 600; color: #1a1a1a; margin-bottom: 4px; }
|
||||
.report-item__meta { font-size: 12px; color: #8c8c8c; }
|
||||
.report-item__header { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
|
||||
/* 标签 */
|
||||
.report-tag {
|
||||
display: inline-flex; align-items: center; height: 22px; padding: 0 8px;
|
||||
border-radius: 11px; font-size: 11px; font-weight: 600; white-space: nowrap; flex-shrink: 0;
|
||||
}
|
||||
.report-tag--gastro { background: #e6fffb; color: #08979c; border: 1px solid #87e8de; }
|
||||
.report-tag--regular { background: #e6f7ff; color: #096dd9; border: 1px solid #91d5ff; }
|
||||
.report-item__arrow { font-size: 18px; color: #c6c6c6; flex-shrink: 0; }
|
||||
.bottom-spacer { height: 28px; }
|
||||
</style>
|
||||
@@ -104,46 +112,58 @@
|
||||
<!-- 报告列表 -->
|
||||
<div class="section-title">我的历年报告</div>
|
||||
<div class="report-list">
|
||||
<!-- [交互] 点击跳转至: report-query.html -->
|
||||
<div class="report-item" onclick="location.href='report-query.html'">
|
||||
<div class="report-item__icon">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/><line x1="8" y1="13" x2="16" y2="13"/><line x1="8" y1="17" x2="14" y2="17"/></svg>
|
||||
<!-- [交互] 点击跳转至: report-gastro.html（胃肠镜报告） -->
|
||||
<div class="report-item" onclick="location.href='report-gastro.html'">
|
||||
<div class="report-item__icon" style="background:#e6fffb;color:#08979c;">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
|
||||
</div>
|
||||
<div class="report-item__content">
|
||||
<div class="report-item__title">2025年度胃肠镜体检报告</div>
|
||||
<div class="report-item__header">
|
||||
<span class="report-item__title">2025年度体检报告</span>
|
||||
<span class="report-tag report-tag--gastro">胃肠镜体检</span>
|
||||
</div>
|
||||
<div class="report-item__meta">CQ星龙园医院</div>
|
||||
</div>
|
||||
<span class="report-item__arrow">›</span>
|
||||
</div>
|
||||
<!-- [交互] 点击跳转至: report-query.html -->
|
||||
<!-- [交互] 点击跳转至: report-query.html（常规体检） -->
|
||||
<div class="report-item" onclick="location.href='report-query.html'">
|
||||
<div class="report-item__icon">
|
||||
<div class="report-item__icon" style="background:#e6f7ff;color:#096dd9;">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/><line x1="8" y1="13" x2="16" y2="13"/><line x1="8" y1="17" x2="14" y2="17"/></svg>
|
||||
</div>
|
||||
<div class="report-item__content">
|
||||
<div class="report-item__title">2025年度常规体检报告</div>
|
||||
<div class="report-item__header">
|
||||
<span class="report-item__title">2025年度体检报告</span>
|
||||
<span class="report-tag report-tag--regular">常规体检</span>
|
||||
</div>
|
||||
<div class="report-item__meta">CQ星龙园医院</div>
|
||||
</div>
|
||||
<span class="report-item__arrow">›</span>
|
||||
</div>
|
||||
<!-- [交互] 点击跳转至: report-query.html -->
|
||||
<!-- [交互] 点击跳转至: report-query.html（常规体检） -->
|
||||
<div class="report-item" onclick="location.href='report-query.html'">
|
||||
<div class="report-item__icon">
|
||||
<div class="report-item__icon" style="background:#e6f7ff;color:#096dd9;">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/><line x1="8" y1="13" x2="16" y2="13"/><line x1="8" y1="17" x2="14" y2="17"/></svg>
|
||||
</div>
|
||||
<div class="report-item__content">
|
||||
<div class="report-item__title">2024年度常规体检报告</div>
|
||||
<div class="report-item__header">
|
||||
<span class="report-item__title">2024年度体检报告</span>
|
||||
<span class="report-tag report-tag--regular">常规体检</span>
|
||||
</div>
|
||||
<div class="report-item__meta">CQ星龙园医院</div>
|
||||
</div>
|
||||
<span class="report-item__arrow">›</span>
|
||||
</div>
|
||||
<!-- [交互] 点击跳转至: report-query.html -->
|
||||
<!-- [交互] 点击跳转至: report-query.html（常规体检） -->
|
||||
<div class="report-item" onclick="location.href='report-query.html'">
|
||||
<div class="report-item__icon">
|
||||
<div class="report-item__icon" style="background:#e6f7ff;color:#096dd9;">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/><line x1="8" y1="13" x2="16" y2="13"/><line x1="8" y1="17" x2="14" y2="17"/></svg>
|
||||
</div>
|
||||
<div class="report-item__content">
|
||||
<div class="report-item__title">2023年度常规体检报告</div>
|
||||
<div class="report-item__header">
|
||||
<span class="report-item__title">2023年度体检报告</span>
|
||||
<span class="report-tag report-tag--regular">常规体检</span>
|
||||
</div>
|
||||
<div class="report-item__meta">CQ星龙园医院</div>
|
||||
</div>
|
||||
<span class="report-item__arrow">›</span>
|
||||
|
||||
@@ -240,9 +240,10 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
font-size: 11px; font-weight: 700;
|
||||
padding: 3px 10px; border-radius: 12px; color: #fff; white-space: nowrap;
|
||||
}
|
||||
.device-card__metrics { display: flex; flex-wrap: wrap; gap: 8px; }
|
||||
.metric-chip { font-size: 11px; color: #666; background: #f5f7fa; border-radius: 8px; padding: 3px 8px; }
|
||||
.metric-chip strong { color: #333; }
|
||||
.device-card__metrics { display: flex; flex-wrap: wrap; gap: 8px; }
|
||||
.metric-chip { font-size: 11px; color: #666; background: #f5f7fa; border-radius: 8px; padding: 3px 8px; }
|
||||
.metric-chip strong { color: #333; }
|
||||
.device-card__distance { text-align: right; font-size: 11px; color: #999; margin-top: 8px; }
|
||||
|
||||
/* ===== 底部弹窗 ===== */
|
||||
.bottom-sheet-mask {
|
||||
@@ -420,12 +421,12 @@ const DATA = {
|
||||
'lvl-severe': '健康人群运动耐受力降低，有明显强烈症状，提前出现某些疾病',
|
||||
},
|
||||
devices: [
|
||||
{ id:'OA001', name:'空气质量监测站-A01', code:'OA-2024-001', unit:'采油一厂', loc:'厂区大门东侧', time:'14:30', level:'lvl-excellent', levelLabel:'优', x:200, y:100, metrics:[{k:'温度',v:'32.5',u:'℃'},{k:'湿度',v:'45',u:'%'},{k:'太阳辐射',v:'680',u:'W/m²'},{k:'PM2.5',v:'28',u:'μg/m³'},{k:'PM10',v:'52',u:'μg/m³'},{k:'照度',v:'65000',u:'lm/m²'},{k:'风速',v:'3.2',u:'m/s'}] },
|
||||
{ id:'OA002', name:'PM10检测仪-B02', code:'OA-2024-002', unit:'采油一厂', loc:'生产区北围栏', time:'14:28', level:'lvl-good', levelLabel:'良', x:120, y:180, metrics:[{k:'温度',v:'33.1',u:'℃'},{k:'湿度',v:'42',u:'%'},{k:'太阳辐射',v:'720',u:'W/m²'},{k:'PM2.5',v:'38',u:'μg/m³'},{k:'PM10',v:'68',u:'μg/m³'},{k:'照度',v:'72000',u:'lm/m²'},{k:'风速',v:'4.1',u:'m/s'}] },
|
||||
{ id:'OA003', name:'臭氧检测仪-C01', code:'OA-2024-003', unit:'采油二厂', loc:'办公楼楼顶', time:'14:25', level:'lvl-light', levelLabel:'轻度污染', x:260, y:210, metrics:[{k:'温度',v:'31.8',u:'℃'},{k:'湿度',v:'50',u:'%'},{k:'太阳辐射',v:'580',u:'W/m²'},{k:'PM2.5',v:'55',u:'μg/m³'},{k:'PM10',v:'92',u:'μg/m³'},{k:'照度',v:'58000',u:'lm/m²'},{k:'风速',v:'2.8',u:'m/s'}] },
|
||||
{ id:'OA004', name:'气象参数监测仪-D01', code:'OA-2024-004', unit:'采油三厂', loc:'气象观测场', time:'14:20', level:'lvl-moderate', levelLabel:'中度污染', x:80, y:300, metrics:[{k:'温度',v:'34.2',u:'℃'},{k:'湿度',v:'38',u:'%'},{k:'太阳辐射',v:'850',u:'W/m²'},{k:'PM2.5',v:'82',u:'μg/m³'},{k:'PM10',v:'135',u:'μg/m³'},{k:'照度',v:'85000',u:'lm/m²'},{k:'风速',v:'5.6',u:'m/s'}] },
|
||||
{ id:'OA005', name:'空气质量监测站-A03', code:'OA-2024-005', unit:'采油三厂', loc:'储油罐区南侧', time:'14:15', level:'lvl-heavy', levelLabel:'重度污染', x:210, y:340, metrics:[{k:'温度',v:'35.0',u:'℃'},{k:'湿度',v:'35',u:'%'},{k:'太阳辐射',v:'920',u:'W/m²'},{k:'PM2.5',v:'125',u:'μg/m³'},{k:'PM10',v:'190',u:'μg/m³'},{k:'照度',v:'92000',u:'lm/m²'},{k:'风速',v:'6.3',u:'m/s'}] },
|
||||
{ id:'OA006', name:'VOC检测仪-E01', code:'OA-2024-006', unit:'采油三厂', loc:'化工装置区', time:'14:10', level:'lvl-severe', levelLabel:'严重污染', x:310, y:280, metrics:[{k:'温度',v:'36.2',u:'℃'},{k:'湿度',v:'30',u:'%'},{k:'太阳辐射',v:'950',u:'W/m²'},{k:'PM2.5',v:'180',u:'μg/m³'},{k:'PM10',v:'260',u:'μg/m³'},{k:'照度',v:'95000',u:'lm/m²'},{k:'风速',v:'7.1',u:'m/s'}] },
|
||||
{ id:'OA001', name:'空气质量监测站-A01', code:'OA-2024-001', unit:'采油一厂', loc:'厂区大门东侧', time:'14:30', level:'lvl-excellent', levelLabel:'优', dist:0.8, x:200, y:100, metrics:[{k:'温度',v:'32.5',u:'℃'},{k:'湿度',v:'45',u:'%'},{k:'太阳辐射',v:'680',u:'W/m²'},{k:'PM2.5',v:'28',u:'μg/m³'},{k:'PM10',v:'52',u:'μg/m³'},{k:'照度',v:'65000',u:'lm/m²'},{k:'风速',v:'3.2',u:'m/s'}] },
|
||||
{ id:'OA002', name:'PM10检测仪-B02', code:'OA-2024-002', unit:'采油一厂', loc:'生产区北围栏', time:'14:28', level:'lvl-good', levelLabel:'良', dist:1.2, x:120, y:180, metrics:[{k:'温度',v:'33.1',u:'℃'},{k:'湿度',v:'42',u:'%'},{k:'太阳辐射',v:'720',u:'W/m²'},{k:'PM2.5',v:'38',u:'μg/m³'},{k:'PM10',v:'68',u:'μg/m³'},{k:'照度',v:'72000',u:'lm/m²'},{k:'风速',v:'4.1',u:'m/s'}] },
|
||||
{ id:'OA003', name:'臭氧检测仪-C01', code:'OA-2024-003', unit:'采油二厂', loc:'办公楼楼顶', time:'14:25', level:'lvl-light', levelLabel:'轻度污染', dist:2.5, x:260, y:210, metrics:[{k:'温度',v:'31.8',u:'℃'},{k:'湿度',v:'50',u:'%'},{k:'太阳辐射',v:'580',u:'W/m²'},{k:'PM2.5',v:'55',u:'μg/m³'},{k:'PM10',v:'92',u:'μg/m³'},{k:'照度',v:'58000',u:'lm/m²'},{k:'风速',v:'2.8',u:'m/s'}] },
|
||||
{ id:'OA004', name:'气象参数监测仪-D01', code:'OA-2024-004', unit:'采油三厂', loc:'气象观测场', time:'14:20', level:'lvl-moderate', levelLabel:'中度污染', dist:3.1, x:80, y:300, metrics:[{k:'温度',v:'34.2',u:'℃'},{k:'湿度',v:'38',u:'%'},{k:'太阳辐射',v:'850',u:'W/m²'},{k:'PM2.5',v:'82',u:'μg/m³'},{k:'PM10',v:'135',u:'μg/m³'},{k:'照度',v:'85000',u:'lm/m²'},{k:'风速',v:'5.6',u:'m/s'}] },
|
||||
{ id:'OA005', name:'空气质量监测站-A03', code:'OA-2024-005', unit:'采油三厂', loc:'储油罐区南侧', time:'14:15', level:'lvl-heavy', levelLabel:'重度污染', dist:4.0, x:210, y:340, metrics:[{k:'温度',v:'35.0',u:'℃'},{k:'湿度',v:'35',u:'%'},{k:'太阳辐射',v:'920',u:'W/m²'},{k:'PM2.5',v:'125',u:'μg/m³'},{k:'PM10',v:'190',u:'μg/m³'},{k:'照度',v:'92000',u:'lm/m²'},{k:'风速',v:'6.3',u:'m/s'}] },
|
||||
{ id:'OA006', name:'VOC检测仪-E01', code:'OA-2024-006', unit:'采油三厂', loc:'化工装置区', time:'14:10', level:'lvl-severe', levelLabel:'严重污染', dist:5.2, x:310, y:280, metrics:[{k:'温度',v:'36.2',u:'℃'},{k:'湿度',v:'30',u:'%'},{k:'太阳辐射',v:'950',u:'W/m²'},{k:'PM2.5',v:'180',u:'μg/m³'},{k:'PM10',v:'260',u:'μg/m³'},{k:'照度',v:'95000',u:'lm/m²'},{k:'风速',v:'7.1',u:'m/s'}] },
|
||||
]
|
||||
},
|
||||
indoor: {
|
||||
@@ -445,11 +446,11 @@ const DATA = {
|
||||
'lvl-heavy': '空气质量较差，敏感人群应离开该区域',
|
||||
},
|
||||
devices: [
|
||||
{ id:'IA001', name:'综合空气监测仪-A01', code:'IA-2024-001', unit:'采油一厂', loc:'办公楼1层大厅', time:'14:30', level:'lvl-clean', levelLabel:'清洁', x:200, y:100, metrics:[{k:'温度',v:'24.5',u:'℃'},{k:'湿度',v:'52',u:'%'},{k:'CO₂',v:'456',u:'ppm'},{k:'甲醛',v:'0.03',u:'mg/m³'},{k:'PM2.5',v:'35',u:'μg/m³'},{k:'PM10',v:'68',u:'μg/m³'}] },
|
||||
{ id:'IA002', name:'PM2.5检测仪-B03', code:'IA-2024-002', unit:'采油一厂', loc:'办公楼2层会议室', time:'14:28', level:'lvl-good', levelLabel:'未污染', x:130, y:185, metrics:[{k:'温度',v:'25.1',u:'℃'},{k:'湿度',v:'58',u:'%'},{k:'CO₂',v:'512',u:'ppm'},{k:'甲醛',v:'0.05',u:'mg/m³'},{k:'PM2.5',v:'42',u:'μg/m³'},{k:'PM10',v:'76',u:'μg/m³'}] },
|
||||
{ id:'IA003', name:'甲醛检测仪-C02', code:'IA-2024-003', unit:'采油二厂', loc:'新装修办公室3层', time:'14:25', level:'lvl-light', levelLabel:'轻污染', x:270, y:220, metrics:[{k:'温度',v:'26.3',u:'℃'},{k:'湿度',v:'61',u:'%'},{k:'CO₂',v:'680',u:'ppm'},{k:'甲醛',v:'0.09',u:'mg/m³'},{k:'PM2.5',v:'58',u:'μg/m³'},{k:'PM10',v:'95',u:'μg/m³'}] },
|
||||
{ id:'IA004', name:'CO₂检测仪-D01', code:'IA-2024-004', unit:'采油二厂', loc:'地下车库B1层', time:'14:20', level:'lvl-moderate', levelLabel:'中污染', x:90, y:305, metrics:[{k:'温度',v:'22.8',u:'℃'},{k:'湿度',v:'72',u:'%'},{k:'CO₂',v:'920',u:'ppm'},{k:'甲醛',v:'0.07',u:'mg/m³'},{k:'PM2.5',v:'82',u:'μg/m³'},{k:'PM10',v:'128',u:'μg/m³'}] },
|
||||
{ id:'IA005', name:'综合空气监测仪-A05', code:'IA-2024-005', unit:'采油三厂', loc:'生产车间1号', time:'14:15', level:'lvl-heavy', levelLabel:'重污染', x:210, y:340, metrics:[{k:'温度',v:'28.6',u:'℃'},{k:'湿度',v:'78',u:'%'},{k:'CO₂',v:'1050',u:'ppm'},{k:'甲醛',v:'0.12',u:'mg/m³'},{k:'PM2.5',v:'120',u:'μg/m³'},{k:'PM10',v:'185',u:'μg/m³'}] },
|
||||
{ id:'IA001', name:'综合空气监测仪-A01', code:'IA-2024-001', unit:'采油一厂', loc:'办公楼1层大厅', time:'14:30', level:'lvl-clean', levelLabel:'清洁', dist:0.5, x:200, y:100, metrics:[{k:'温度',v:'24.5',u:'℃'},{k:'湿度',v:'52',u:'%'},{k:'CO₂',v:'456',u:'ppm'},{k:'甲醛',v:'0.03',u:'mg/m³'},{k:'PM2.5',v:'35',u:'μg/m³'},{k:'PM10',v:'68',u:'μg/m³'}] },
|
||||
{ id:'IA002', name:'PM2.5检测仪-B03', code:'IA-2024-002', unit:'采油一厂', loc:'办公楼2层会议室', time:'14:28', level:'lvl-good', levelLabel:'未污染', dist:0.7, x:130, y:185, metrics:[{k:'温度',v:'25.1',u:'℃'},{k:'湿度',v:'58',u:'%'},{k:'CO₂',v:'512',u:'ppm'},{k:'甲醛',v:'0.05',u:'mg/m³'},{k:'PM2.5',v:'42',u:'μg/m³'},{k:'PM10',v:'76',u:'μg/m³'}] },
|
||||
{ id:'IA003', name:'甲醛检测仪-C02', code:'IA-2024-003', unit:'采油二厂', loc:'新装修办公室3层', time:'14:25', level:'lvl-light', levelLabel:'轻污染', dist:1.8, x:270, y:220, metrics:[{k:'温度',v:'26.3',u:'℃'},{k:'湿度',v:'61',u:'%'},{k:'CO₂',v:'680',u:'ppm'},{k:'甲醛',v:'0.09',u:'mg/m³'},{k:'PM2.5',v:'58',u:'μg/m³'},{k:'PM10',v:'95',u:'μg/m³'}] },
|
||||
{ id:'IA004', name:'CO₂检测仪-D01', code:'IA-2024-004', unit:'采油二厂', loc:'地下车库B1层', time:'14:20', level:'lvl-moderate', levelLabel:'中污染', dist:2.2, x:90, y:305, metrics:[{k:'温度',v:'22.8',u:'℃'},{k:'湿度',v:'72',u:'%'},{k:'CO₂',v:'920',u:'ppm'},{k:'甲醛',v:'0.07',u:'mg/m³'},{k:'PM2.5',v:'82',u:'μg/m³'},{k:'PM10',v:'128',u:'μg/m³'}] },
|
||||
{ id:'IA005', name:'综合空气监测仪-A05', code:'IA-2024-005', unit:'采油三厂', loc:'生产车间1号', time:'14:15', level:'lvl-heavy', levelLabel:'重污染', dist:3.5, x:210, y:340, metrics:[{k:'温度',v:'28.6',u:'℃'},{k:'湿度',v:'78',u:'%'},{k:'CO₂',v:'1050',u:'ppm'},{k:'甲醛',v:'0.12',u:'mg/m³'},{k:'PM2.5',v:'120',u:'μg/m³'},{k:'PM10',v:'185',u:'μg/m³'}] },
|
||||
]
|
||||
},
|
||||
water: {
|
||||
@@ -463,11 +464,11 @@ const DATA = {
|
||||
'lvl-fail': '水质存在超标项目，需检查处理',
|
||||
},
|
||||
devices: [
|
||||
{ id:'WQ001', name:'多参数水质分析仪-A01', code:'WQ-2024-001', unit:'采油一厂', loc:'生活区供水站', time:'14:30', level:'lvl-pass', levelLabel:'达标', x:180, y:110, metrics:[{k:'温度',v:'18.5',u:'℃'},{k:'电导率',v:'320',u:'μS/cm'},{k:'PH',v:'7.2',u:''},{k:'盐度',v:'180',u:'mg/L'},{k:'电阻率',v:'3125',u:'Ω·m'},{k:'TDS',v:'160',u:'mg/L'}] },
|
||||
{ id:'WQ002', name:'在线PH计-B02', code:'WQ-2024-002', unit:'采油一厂', loc:'污水处理站出口', time:'14:28', level:'lvl-pass', levelLabel:'达标', x:110, y:200, metrics:[{k:'温度',v:'20.3',u:'℃'},{k:'电导率',v:'580',u:'μS/cm'},{k:'PH',v:'6.8',u:''},{k:'盐度',v:'320',u:'mg/L'},{k:'电阻率',v:'1724',u:'Ω·m'},{k:'TDS',v:'290',u:'mg/L'}] },
|
||||
{ id:'WQ003', name:'电导率监测仪-C01', code:'WQ-2024-003', unit:'采油二厂', loc:'注水站入口', time:'14:25', level:'lvl-fail', levelLabel:'未达标', x:260, y:215, metrics:[{k:'温度',v:'22.1',u:'℃'},{k:'电导率',v:'1250',u:'μS/cm'},{k:'PH',v:'8.5',u:''},{k:'盐度',v:'680',u:'mg/L'},{k:'电阻率',v:'800',u:'Ω·m'},{k:'TDS',v:'625',u:'mg/L'}] },
|
||||
{ id:'WQ004', name:'TDS检测仪-D01', code:'WQ-2024-004', unit:'采油二厂', loc:'生产区储水池', time:'14:20', level:'lvl-pass', levelLabel:'达标', x:80, y:310, metrics:[{k:'温度',v:'19.8',u:'℃'},{k:'电导率',v:'450',u:'μS/cm'},{k:'PH',v:'7.0',u:''},{k:'盐度',v:'240',u:'mg/L'},{k:'电阻率',v:'2222',u:'Ω·m'},{k:'TDS',v:'225',u:'mg/L'}] },
|
||||
{ id:'WQ005', name:'多参数水质分析仪-A03', code:'WQ-2024-005', unit:'采油三厂', loc:'排污口监测点', time:'14:15', level:'lvl-fail', levelLabel:'未达标', x:220, y:345, metrics:[{k:'温度',v:'23.5',u:'℃'},{k:'电导率',v:'1680',u:'μS/cm'},{k:'PH',v:'9.2',u:''},{k:'盐度',v:'920',u:'mg/L'},{k:'电阻率',v:'595',u:'Ω·m'},{k:'TDS',v:'840',u:'mg/L'}] },
|
||||
{ id:'WQ001', name:'多参数水质分析仪-A01', code:'WQ-2024-001', unit:'采油一厂', loc:'生活区供水站', time:'14:30', level:'lvl-pass', levelLabel:'达标', dist:0.6, x:180, y:110, metrics:[{k:'温度',v:'18.5',u:'℃'},{k:'电导率',v:'320',u:'μS/cm'},{k:'PH',v:'7.2',u:''},{k:'盐度',v:'180',u:'mg/L'},{k:'电阻率',v:'3125',u:'Ω·m'},{k:'TDS',v:'160',u:'mg/L'}] },
|
||||
{ id:'WQ002', name:'在线PH计-B02', code:'WQ-2024-002', unit:'采油一厂', loc:'污水处理站出口', time:'14:28', level:'lvl-pass', levelLabel:'达标', dist:1.1, x:110, y:200, metrics:[{k:'温度',v:'20.3',u:'℃'},{k:'电导率',v:'580',u:'μS/cm'},{k:'PH',v:'6.8',u:''},{k:'盐度',v:'320',u:'mg/L'},{k:'电阻率',v:'1724',u:'Ω·m'},{k:'TDS',v:'290',u:'mg/L'}] },
|
||||
{ id:'WQ003', name:'电导率监测仪-C01', code:'WQ-2024-003', unit:'采油二厂', loc:'注水站入口', time:'14:25', level:'lvl-fail', levelLabel:'未达标', dist:2.0, x:260, y:215, metrics:[{k:'温度',v:'22.1',u:'℃'},{k:'电导率',v:'1250',u:'μS/cm'},{k:'PH',v:'8.5',u:''},{k:'盐度',v:'680',u:'mg/L'},{k:'电阻率',v:'800',u:'Ω·m'},{k:'TDS',v:'625',u:'mg/L'}] },
|
||||
{ id:'WQ004', name:'TDS检测仪-D01', code:'WQ-2024-004', unit:'采油二厂', loc:'生产区储水池', time:'14:20', level:'lvl-pass', levelLabel:'达标', dist:2.8, x:80, y:310, metrics:[{k:'温度',v:'19.8',u:'℃'},{k:'电导率',v:'450',u:'μS/cm'},{k:'PH',v:'7.0',u:''},{k:'盐度',v:'240',u:'mg/L'},{k:'电阻率',v:'2222',u:'Ω·m'},{k:'TDS',v:'225',u:'mg/L'}] },
|
||||
{ id:'WQ005', name:'多参数水质分析仪-A03', code:'WQ-2024-005', unit:'采油三厂', loc:'排污口监测点', time:'14:15', level:'lvl-fail', levelLabel:'未达标', dist:3.6, x:220, y:345, metrics:[{k:'温度',v:'23.5',u:'℃'},{k:'电导率',v:'1680',u:'μS/cm'},{k:'PH',v:'9.2',u:''},{k:'盐度',v:'920',u:'mg/L'},{k:'电阻率',v:'595',u:'Ω·m'},{k:'TDS',v:'840',u:'mg/L'}] },
|
||||
]
|
||||
},
|
||||
pollen: {
|
||||
@@ -487,11 +488,11 @@ const DATA = {
|
||||
'lvl-vhigh': '花粉浓度极高，过敏人群应尽量避免外出',
|
||||
},
|
||||
devices: [
|
||||
{ id:'PL001', name:'花粉采样器-A01', code:'PL-2024-001', unit:'采油一厂', loc:'办公区绿化带', time:'14:30', level:'lvl-vlow', levelLabel:'很低', x:190, y:105, metrics:[{k:'榆属',v:'12',u:'粒/千mm²'},{k:'松属',v:'8',u:'粒/千mm²'},{k:'杨属',v:'15',u:'粒/千mm²'},{k:'柏科',v:'6',u:'粒/千mm²'},{k:'柳属',v:'10',u:'粒/千mm²'},{k:'蒿属',v:'5',u:'粒/千mm²'},{k:'藜科',v:'3',u:'粒/千mm²'},{k:'苋科',v:'2',u:'粒/千mm²'},{k:'花粉总数',v:'61',u:'粒/千mm²'}] },
|
||||
{ id:'PL002', name:'花粉浓度监测仪-B01', code:'PL-2024-002', unit:'采油一厂', loc:'厂区东侧林带', time:'14:28', level:'lvl-low', levelLabel:'低', x:120, y:195, metrics:[{k:'榆属',v:'35',u:'粒/千mm²'},{k:'松属',v:'22',u:'粒/千mm²'},{k:'杨属',v:'48',u:'粒/千mm²'},{k:'柏科',v:'18',u:'粒/千mm²'},{k:'柳属',v:'28',u:'粒/千mm²'},{k:'蒿属',v:'15',u:'粒/千mm²'},{k:'藜科',v:'8',u:'粒/千mm²'},{k:'苋科',v:'6',u:'粒/千mm²'},{k:'花粉总数',v:'180',u:'粒/千mm²'}] },
|
||||
{ id:'PL003', name:'花粉自动计数仪-C01', code:'PL-2024-003', unit:'采油二厂', loc:'生活区花园', time:'14:25', level:'lvl-medium', levelLabel:'中等', x:265, y:220, metrics:[{k:'榆属',v:'68',u:'粒/千mm²'},{k:'松属',v:'45',u:'粒/千mm²'},{k:'杨属',v:'82',u:'粒/千mm²'},{k:'柏科',v:'35',u:'粒/千mm²'},{k:'柳属',v:'52',u:'粒/千mm²'},{k:'蒿属',v:'30',u:'粒/千mm²'},{k:'藜科',v:'18',u:'粒/千mm²'},{k:'苋科',v:'12',u:'粒/千mm²'},{k:'花粉总数',v:'342',u:'粒/千mm²'}] },
|
||||
{ id:'PL004', name:'综合气象花粉站-D01', code:'PL-2024-004', unit:'采油二厂', loc:'气象观测场', time:'14:20', level:'lvl-high', levelLabel:'高', x:80, y:305, metrics:[{k:'榆属',v:'120',u:'粒/千mm²'},{k:'松属',v:'85',u:'粒/千mm²'},{k:'杨属',v:'150',u:'粒/千mm²'},{k:'柏科',v:'65',u:'粒/千mm²'},{k:'柳属',v:'95',u:'粒/千mm²'},{k:'蒿属',v:'55',u:'粒/千mm²'},{k:'藜科',v:'32',u:'粒/千mm²'},{k:'苋科',v:'22',u:'粒/千mm²'},{k:'花粉总数',v:'624',u:'粒/千mm²'}] },
|
||||
{ id:'PL005', name:'花粉采样器-A03', code:'PL-2024-005', unit:'采油三厂', loc:'杨树林防护带', time:'14:15', level:'lvl-vhigh', levelLabel:'很高', x:215, y:345, metrics:[{k:'榆属',v:'210',u:'粒/千mm²'},{k:'松属',v:'145',u:'粒/千mm²'},{k:'杨属',v:'280',u:'粒/千mm²'},{k:'柏科',v:'110',u:'粒/千mm²'},{k:'柳属',v:'168',u:'粒/千mm²'},{k:'蒿属',v:'92',u:'粒/千mm²'},{k:'藜科',v:'55',u:'粒/千mm²'},{k:'苋科',v:'38',u:'粒/千mm²'},{k:'花粉总数',v:'1098',u:'粒/千mm²'}] },
|
||||
{ id:'PL001', name:'花粉采样器-A01', code:'PL-2024-001', unit:'采油一厂', loc:'办公区绿化带', time:'14:30', level:'lvl-vlow', levelLabel:'很低', dist:0.4, x:190, y:105, metrics:[{k:'榆属',v:'12',u:'粒/千mm²'},{k:'松属',v:'8',u:'粒/千mm²'},{k:'杨属',v:'15',u:'粒/千mm²'},{k:'柏科',v:'6',u:'粒/千mm²'},{k:'柳属',v:'10',u:'粒/千mm²'},{k:'蒿属',v:'5',u:'粒/千mm²'},{k:'藜科',v:'3',u:'粒/千mm²'},{k:'苋科',v:'2',u:'粒/千mm²'},{k:'花粉总数',v:'61',u:'粒/千mm²'}] },
|
||||
{ id:'PL002', name:'花粉浓度监测仪-B01', code:'PL-2024-002', unit:'采油一厂', loc:'厂区东侧林带', time:'14:28', level:'lvl-low', levelLabel:'低', dist:0.9, x:120, y:195, metrics:[{k:'榆属',v:'35',u:'粒/千mm²'},{k:'松属',v:'22',u:'粒/千mm²'},{k:'杨属',v:'48',u:'粒/千mm²'},{k:'柏科',v:'18',u:'粒/千mm²'},{k:'柳属',v:'28',u:'粒/千mm²'},{k:'蒿属',v:'15',u:'粒/千mm²'},{k:'藜科',v:'8',u:'粒/千mm²'},{k:'苋科',v:'6',u:'粒/千mm²'},{k:'花粉总数',v:'180',u:'粒/千mm²'}] },
|
||||
{ id:'PL003', name:'花粉自动计数仪-C01', code:'PL-2024-003', unit:'采油二厂', loc:'生活区花园', time:'14:25', level:'lvl-medium', levelLabel:'中等', dist:1.6, x:265, y:220, metrics:[{k:'榆属',v:'68',u:'粒/千mm²'},{k:'松属',v:'45',u:'粒/千mm²'},{k:'杨属',v:'82',u:'粒/千mm²'},{k:'柏科',v:'35',u:'粒/千mm²'},{k:'柳属',v:'52',u:'粒/千mm²'},{k:'蒿属',v:'30',u:'粒/千mm²'},{k:'藜科',v:'18',u:'粒/千mm²'},{k:'苋科',v:'12',u:'粒/千mm²'},{k:'花粉总数',v:'342',u:'粒/千mm²'}] },
|
||||
{ id:'PL004', name:'综合气象花粉站-D01', code:'PL-2024-004', unit:'采油二厂', loc:'气象观测场', time:'14:20', level:'lvl-high', levelLabel:'高', dist:2.4, x:80, y:305, metrics:[{k:'榆属',v:'120',u:'粒/千mm²'},{k:'松属',v:'85',u:'粒/千mm²'},{k:'杨属',v:'150',u:'粒/千mm²'},{k:'柏科',v:'65',u:'粒/千mm²'},{k:'柳属',v:'95',u:'粒/千mm²'},{k:'蒿属',v:'55',u:'粒/千mm²'},{k:'藜科',v:'32',u:'粒/千mm²'},{k:'苋科',v:'22',u:'粒/千mm²'},{k:'花粉总数',v:'624',u:'粒/千mm²'}] },
|
||||
{ id:'PL005', name:'花粉采样器-A03', code:'PL-2024-005', unit:'采油三厂', loc:'杨树林防护带', time:'14:15', level:'lvl-vhigh', levelLabel:'很高', dist:3.3, x:215, y:345, metrics:[{k:'榆属',v:'210',u:'粒/千mm²'},{k:'松属',v:'145',u:'粒/千mm²'},{k:'杨属',v:'280',u:'粒/千mm²'},{k:'柏科',v:'110',u:'粒/千mm²'},{k:'柳属',v:'168',u:'粒/千mm²'},{k:'蒿属',v:'92',u:'粒/千mm²'},{k:'藜科',v:'55',u:'粒/千mm²'},{k:'苋科',v:'38',u:'粒/千mm²'},{k:'花粉总数',v:'1098',u:'粒/千mm²'}] },
|
||||
]
|
||||
}
|
||||
};
|
||||
@@ -584,6 +585,7 @@ function renderListCards() {
|
||||
</div>
|
||||
<span class="device-card__badge" style="background:${color}">${dev.levelLabel}</span>
|
||||
</div>
|
||||
<div class="device-card__distance">距离${dev.dist}km</div>
|
||||
</div>`;
|
||||
}).join('');
|
||||
}
|
||||
|
||||
@@ -27,14 +27,33 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
.gauge-badge { position: absolute; top: 10px; right: -10px; width: 40px; height: 40px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 800; color: #fff; }
|
||||
.gauge-badge--A { background: #ff4d4f; }
|
||||
|
||||
/* 人群标签 */
|
||||
.crowd-tag { display: inline-flex; align-items: center; padding: 6px 16px; border-radius: 20px; font-size: 15px; font-weight: 700; margin-bottom: 8px; }
|
||||
.crowd-tag--A { color: #ff4d4f; background: #fff1f0; border: 1px solid #ffccc7; }
|
||||
.crowd-tag--B { color: #fa8c16; background: #fff7e6; border: 1px solid #ffd591; }
|
||||
.crowd-tag--C { color: #faad14; background: #fffbe6; border: 1px solid #ffe58f; }
|
||||
.crowd-tag--D { color: #1890ff; background: #e6f7ff; border: 1px solid #91d5ff; }
|
||||
.crowd-tag--E { color: #52c41a; background: #f6ffed; border: 1px solid #b7eb8f; }
|
||||
.update-time { font-size: 12px; color: #999; }
|
||||
/* 人群标签 */
|
||||
.crowd-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
|
||||
.crowd-tag { display: inline-flex; align-items: center; padding: 6px 16px; border-radius: 20px; font-size: 15px; font-weight: 700; }
|
||||
.crowd-tag--A { color: #ff4d4f; background: #fff1f0; border: 1px solid #ffccc7; }
|
||||
.crowd-tag--B { color: #fa8c16; background: #fff7e6; border: 1px solid #ffd591; }
|
||||
.crowd-tag--C { color: #faad14; background: #fffbe6; border: 1px solid #ffe58f; }
|
||||
.crowd-tag--D { color: #1890ff; background: #e6f7ff; border: 1px solid #91d5ff; }
|
||||
.crowd-tag--E { color: #52c41a; background: #f6ffed; border: 1px solid #b7eb8f; }
|
||||
.crowd-help-btn { width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid #d9d9d9; background: #fff; color: #999; font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; }
|
||||
.update-time { font-size: 12px; color: #999; }
|
||||
|
||||
/* 弹窗遮罩 */
|
||||
.popup-mask { position: absolute; inset: 0; background: rgba(0,0,0,0.4); z-index: 30; display: none; align-items: center; justify-content: center; }
|
||||
.popup-mask.active { display: flex; }
|
||||
.popup-dialog { width: 300px; background: #fff; border-radius: 16px; padding: 20px; box-shadow: 0 12px 40px rgba(0,0,0,0.2); animation: popIn 0.2s ease; }
|
||||
@keyframes popIn { from { transform: scale(0.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
|
||||
.popup-dialog__title { font-size: 16px; font-weight: 700; color: #1a1a1a; margin-bottom: 14px; text-align: center; }
|
||||
.popup-dialog__list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
|
||||
.popup-dialog__item { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #333; }
|
||||
.popup-dialog__letter { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #fff; flex-shrink: 0; }
|
||||
.popup-dialog__letter--A { background: #ff4d4f; }
|
||||
.popup-dialog__letter--B { background: #fa8c16; }
|
||||
.popup-dialog__letter--C { background: #faad14; }
|
||||
.popup-dialog__letter--D { background: #1890ff; }
|
||||
.popup-dialog__letter--E { background: #52c41a; }
|
||||
.popup-dialog__desc { flex: 1; line-height: 1.5; }
|
||||
.popup-dialog__close { width: 100%; height: 40px; border: none; border-radius: 20px; background: #f5f5f5; color: #666; font-size: 14px; font-weight: 600; cursor: pointer; }
|
||||
|
||||
/* 说明区 */
|
||||
.note-section { padding: 16px; }
|
||||
@@ -102,15 +121,34 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
</div>
|
||||
<div class="gauge-badge gauge-badge--A">A</div>
|
||||
</div>
|
||||
<div class="crowd-tag crowd-tag--A">A类人群</div>
|
||||
<div class="crowd-row">
|
||||
<div class="crowd-tag crowd-tag--A">A类人群</div>
|
||||
<button class="crowd-help-btn" onclick="showCrowdPopup()">?</button>
|
||||
</div>
|
||||
<div class="update-time">更新时间：2026-03-26 14:36</div>
|
||||
</div>
|
||||
|
||||
<!-- 说明 -->
|
||||
<div class="note-section">
|
||||
<div class="note-card">
|
||||
<div class="note-card__title">💬 说明</div>
|
||||
<div class="note-card__text">现状评估的人群分类按A、B、C、D、E五个分类进行分类。<br>E类：健康人群 | D类：风险人群 | C类：异常人群 | B类：慢病人群 | A类：大病人群</div>
|
||||
<!-- 分类信息 -->
|
||||
<div class="info-section">
|
||||
<div class="info-section__title">分类信息（大病信息）</div>
|
||||
<div class="info-card">
|
||||
<div class="category-header"><span class="category-header__bar"></span>肺癌</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">确诊年份</span>
|
||||
<span class="info-row__value">2022年</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">确诊医院</span>
|
||||
<span class="info-row__value">宁夏宝石花医院</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">大病状态</span>
|
||||
<span class="info-row__value">可控</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">治疗情况</span>
|
||||
<span class="info-row__value">目前属于血糖偏高，可控阶段，按时服药，定期复诊。</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -141,32 +179,49 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 分类信息 -->
|
||||
<div class="info-section">
|
||||
<div class="info-section__title">分类信息（大病信息）</div>
|
||||
<div class="info-card">
|
||||
<div class="category-header"><span class="category-header__bar"></span>肺癌</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">确诊年份</span>
|
||||
<span class="info-row__value">2022年</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">确诊医院</span>
|
||||
<span class="info-row__value">宁夏宝石花医院</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">大病状态</span>
|
||||
<span class="info-row__value">可控</span>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<span class="info-row__label">治疗情况</span>
|
||||
<span class="info-row__value">目前属于血糖偏高，可控阶段，按时服药，定期复诊。</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="bottom-safe"></div>
|
||||
|
||||
<!-- 人群说明弹窗 -->
|
||||
<div class="popup-mask" id="crowdPopup" onclick="closeCrowdPopup(event)">
|
||||
<div class="popup-dialog">
|
||||
<div class="popup-dialog__title">人群分类说明</div>
|
||||
<div class="popup-dialog__list">
|
||||
<div class="popup-dialog__item">
|
||||
<span class="popup-dialog__letter popup-dialog__letter--A">A</span>
|
||||
<span class="popup-dialog__desc">大病人群</span>
|
||||
</div>
|
||||
<div class="popup-dialog__item">
|
||||
<span class="popup-dialog__letter popup-dialog__letter--B">B</span>
|
||||
<span class="popup-dialog__desc">慢病人群</span>
|
||||
</div>
|
||||
<div class="popup-dialog__item">
|
||||
<span class="popup-dialog__letter popup-dialog__letter--C">C</span>
|
||||
<span class="popup-dialog__desc">异常人群</span>
|
||||
</div>
|
||||
<div class="popup-dialog__item">
|
||||
<span class="popup-dialog__letter popup-dialog__letter--D">D</span>
|
||||
<span class="popup-dialog__desc">风险人群</span>
|
||||
</div>
|
||||
<div class="popup-dialog__item">
|
||||
<span class="popup-dialog__letter popup-dialog__letter--E">E</span>
|
||||
<span class="popup-dialog__desc">健康人群</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="popup-dialog__close" onclick="document.getElementById('crowdPopup').classList.remove('active')">关闭</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
function showCrowdPopup() {
|
||||
document.getElementById('crowdPopup').classList.add('active');
|
||||
}
|
||||
function closeCrowdPopup(e) {
|
||||
if (e.target === e.currentTarget) {
|
||||
document.getElementById('crowdPopup').classList.remove('active');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -71,8 +71,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
.type-card__kcal { font-size: 11px; color: #666; }
|
||||
.type-card__kcal em { font-style: normal; font-weight: 700; color: #1a1a1a; }
|
||||
.type-card__empty { font-size: 11px; color: #bbb; }
|
||||
.type-card__arrow { color: #ccc; flex-shrink: 0; margin-left: 4px; }
|
||||
.type-card__arrow svg { width: 16px; height: 16px; }
|
||||
.type-card__arrow { display: none; }
|
||||
|
||||
/* ===== 自记餐品选择区 ===== */
|
||||
.self-record { margin: 0 12px 12px; }
|
||||
|
||||
@@ -289,7 +289,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
<div class="day-card" data-day="tue" onclick="selectDay('tue')">
|
||||
<div class="day-card__name">周二</div>
|
||||
<div class="day-card__date">08-11</div>
|
||||
<div class="day-card__steps">10200<span class="day-card__steps-unit">步</span></div>
|
||||
<div class="day-card__steps">523<span class="day-card__steps-unit">千卡</span></div>
|
||||
<div class="day-card__recommend">推荐<em>12000</em>步</div>
|
||||
<span class="day-card__badge day-card__badge--wearable">穿戴</span>
|
||||
</div>
|
||||
@@ -359,7 +359,7 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
</div>
|
||||
<div class="type-card__info">
|
||||
<div class="type-card__label">穿戴设备</div>
|
||||
<div class="type-card__empty">尚未自动记录</div>
|
||||
<div class="type-card__empty">尚未记录</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -115,6 +115,10 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
.source-badge--manual { background: #fff7e6; color: #fa8c16; }
|
||||
.source-badge--mixed { background: #f9f0ff; color: #722ed1; }
|
||||
|
||||
.record-section-title { font-size: 13px; font-weight: 700; color: #1a1a1a; padding: 4px 4px 0; display: flex; align-items: center; gap: 6px; }
|
||||
.record-section-title::before { content: ''; width: 3px; height: 14px; background: #ff8a3d; border-radius: 2px; flex-shrink: 0; }
|
||||
.record-section-title--steps::before { background: #1890ff; }
|
||||
|
||||
.record-empty { text-align: center; padding: 40px 20px; color: #ccc; font-size: 14px; }
|
||||
|
||||
.bottom-safe { height: 20px; flex-shrink: 0; }
|
||||
@@ -468,6 +472,10 @@ function getTabDateRange() {
|
||||
}
|
||||
|
||||
/* ===== 渲染记录列表 ===== */
|
||||
function isStepRecord(r) {
|
||||
return r.name === '快走' || r.name === '散步' || r.name === '徒步';
|
||||
}
|
||||
|
||||
function renderRecordList() {
|
||||
var filtered;
|
||||
if (selectedDate) {
|
||||
@@ -486,6 +494,56 @@ function renderRecordList() {
|
||||
return;
|
||||
}
|
||||
|
||||
// 选中具体日期时，分组展示：当日步数 + 运动记录
|
||||
if (selectedDate) {
|
||||
var stepRecords = filtered.filter(function(r) { return isStepRecord(r); });
|
||||
var exerciseRecords = filtered.filter(function(r) { return !isStepRecord(r); });
|
||||
|
||||
var html = '';
|
||||
|
||||
// 当日步数（最多一条）
|
||||
if (stepRecords.length > 0) {
|
||||
html += '<div class="record-section-title record-section-title--steps">当日步数</div>';
|
||||
var sr = stepRecords[0];
|
||||
var src = SOURCE_TYPES[sr.source];
|
||||
html += '<div class="record-item">';
|
||||
html += '<div class="record-item__header">';
|
||||
html += '<span class="record-item__title">' + sr.name + '</span>';
|
||||
html += '<span class="record-item__time">' + sr.date + ' ' + sr.time + '</span>';
|
||||
html += '</div>';
|
||||
html += '<div class="record-item__body">';
|
||||
html += '<div class="record-item__metric"><div class="record-item__metric-label">消耗热量</div><div class="record-item__metric-val">' + sr.kcal + '<span class="record-item__metric-unit">千卡</span></div></div>';
|
||||
html += '<div class="record-item__metric"><div class="record-item__metric-label">运动时长</div><div class="record-item__metric-val">' + sr.duration + '<span class="record-item__metric-unit">分钟</span></div></div>';
|
||||
html += '<div class="record-item__source"><span class="source-badge ' + src.badge + '">' + src.label + '</span></div>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
// 运动记录
|
||||
if (exerciseRecords.length > 0) {
|
||||
html += '<div class="record-section-title" style="margin-top:' + (stepRecords.length > 0 ? '12px' : '0') + ';">运动记录</div>';
|
||||
for (var i = 0; i < exerciseRecords.length; i++) {
|
||||
var r = exerciseRecords[i];
|
||||
var src2 = SOURCE_TYPES[r.source];
|
||||
html += '<div class="record-item">';
|
||||
html += '<div class="record-item__header">';
|
||||
html += '<span class="record-item__title">' + r.name + '</span>';
|
||||
html += '<span class="record-item__time">' + r.date + ' ' + r.time + '</span>';
|
||||
html += '</div>';
|
||||
html += '<div class="record-item__body">';
|
||||
html += '<div class="record-item__metric"><div class="record-item__metric-label">消耗热量</div><div class="record-item__metric-val">' + r.kcal + '<span class="record-item__metric-unit">千卡</span></div></div>';
|
||||
html += '<div class="record-item__metric"><div class="record-item__metric-label">运动时长</div><div class="record-item__metric-val">' + r.duration + '<span class="record-item__metric-unit">分钟</span></div></div>';
|
||||
html += '<div class="record-item__source"><span class="source-badge ' + src2.badge + '">' + src2.label + '</span></div>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
}
|
||||
}
|
||||
|
||||
container.innerHTML = html;
|
||||
return;
|
||||
}
|
||||
|
||||
// Tab 模式：扁平列表
|
||||
var html = '';
|
||||
for (var i = 0; i < filtered.length; i++) {
|
||||
var r = filtered[i];
|
||||
|
||||
@@ -232,38 +232,38 @@ body { background: #f0f2f5; display: flex; justify-content: center; align-items:
|
||||
|
||||
<!-- 一周日期卡片（2行：4+3） -->
|
||||
<div class="day-grid" id="dayGrid">
|
||||
<!-- 周一 - 已记录（蓝牙称） -->
|
||||
<!-- [交互] 点击选中该日，下方显示记录详情（非当日仅查看） -->
|
||||
<!-- [状态] 已记录 - 蓝牙称 -->
|
||||
<div class="day-card" data-day="mon" onclick="selectDay('mon')">
|
||||
<div class="day-card__name">周一</div>
|
||||
<div class="day-card__date">08-10</div>
|
||||
<div class="day-card__weight">62.8<span class="day-card__weight-unit">kg</span></div>
|
||||
<div class="day-card__recommend">推荐<em>56-68</em>kg</div>
|
||||
<span class="day-card__badge day-card__badge--bluetooth">蓝牙</span>
|
||||
</div>
|
||||
<!-- 周一 - 已记录（蓝牙称） -->
|
||||
<!-- [交互] 点击选中该日，下方显示记录详情（非当日仅查看） -->
|
||||
<!-- [状态] 已记录 - 蓝牙称 -->
|
||||
<div class="day-card" data-day="mon" onclick="selectDay('mon')">
|
||||
<div class="day-card__name">周一</div>
|
||||
<div class="day-card__date">08-10</div>
|
||||
<div class="day-card__weight">62.8<span class="day-card__weight-unit">kg</span></div>
|
||||
<div class="day-card__recommend">体脂率 <em>--</em>%</div>
|
||||
<span class="day-card__badge day-card__badge--bluetooth">蓝牙</span>
|
||||
</div>
|
||||
|
||||
<!-- 周二 - 已记录（体脂仪） -->
|
||||
<!-- [交互] 点击选中该日，下方显示记录详情（非当日仅查看） -->
|
||||
<!-- [状态] 已记录 - 体脂仪 -->
|
||||
<div class="day-card" data-day="tue" onclick="selectDay('tue')">
|
||||
<div class="day-card__name">周二</div>
|
||||
<div class="day-card__date">08-11</div>
|
||||
<div class="day-card__weight">62.7<span class="day-card__weight-unit">kg</span></div>
|
||||
<div class="day-card__recommend">推荐<em>56-68</em>kg</div>
|
||||
<span class="day-card__badge day-card__badge--fat">体脂仪</span>
|
||||
</div>
|
||||
<!-- 周二 - 已记录（体脂仪） -->
|
||||
<!-- [交互] 点击选中该日，下方显示记录详情（非当日仅查看） -->
|
||||
<!-- [状态] 已记录 - 体脂仪 -->
|
||||
<div class="day-card" data-day="tue" onclick="selectDay('tue')">
|
||||
<div class="day-card__name">周二</div>
|
||||
<div class="day-card__date">08-11</div>
|
||||
<div class="day-card__weight">62.7<span class="day-card__weight-unit">kg</span></div>
|
||||
<div class="day-card__recommend">体脂率 <em>20.2</em>%</div>
|
||||
<span class="day-card__badge day-card__badge--fat">体脂仪</span>
|
||||
</div>
|
||||
|
||||
<!-- 周三（今天）- 已记录（身高秤） -->
|
||||
<!-- [交互] 默认选中当天，下方显示记录详情 -->
|
||||
<!-- [状态] 已记录 - 身高秤 -->
|
||||
<div class="day-card day-card--today" data-day="wed" onclick="selectDay('wed')">
|
||||
<div class="day-card__name">周三</div>
|
||||
<div class="day-card__date">今天</div>
|
||||
<div class="day-card__weight">62.6<span class="day-card__weight-unit">kg</span></div>
|
||||
<div class="day-card__recommend">推荐<em>56-68</em>kg</div>
|
||||
<span class="day-card__badge day-card__badge--height">身高秤</span>
|
||||
</div>
|
||||
<!-- 周三（今天）- 已记录（身高秤） -->
|
||||
<!-- [交互] 默认选中当天，下方显示记录详情 -->
|
||||
<!-- [状态] 已记录 - 身高秤 -->
|
||||
<div class="day-card day-card--today" data-day="wed" onclick="selectDay('wed')">
|
||||
<div class="day-card__name">周三</div>
|
||||
<div class="day-card__date">今天</div>
|
||||
<div class="day-card__weight">62.6<span class="day-card__weight-unit">kg</span></div>
|
||||
<div class="day-card__recommend">体脂率 <em>20.0</em>%</div>
|
||||
<span class="day-card__badge day-card__badge--height">身高秤</span>
|
||||
</div>
|
||||
|
||||
<!-- 周四 - 未记录 -->
|
||||
<!-- [交互] 不可点击，灰色显示 -->
|
||||
@@ -800,53 +800,74 @@ function confirmSubmit() {
|
||||
showToast('记录成功！');
|
||||
}
|
||||
|
||||
/* 更新日期卡片显示 */
|
||||
function updateDayCard(day) {
|
||||
var card = document.querySelector('.day-card[data-day="' + day + '"]');
|
||||
if (!card) return;
|
||||
/* 更新日期卡片显示 */
|
||||
function updateDayCard(day) {
|
||||
var card = document.querySelector('.day-card[data-day="' + day + '"]');
|
||||
if (!card) return;
|
||||
|
||||
var rec = dayRecords[day] || {};
|
||||
var weightData = rec.weight;
|
||||
var rec = dayRecords[day] || {};
|
||||
var weightData = rec.weight;
|
||||
|
||||
card.classList.remove('day-card--empty');
|
||||
card.classList.remove('day-card--empty');
|
||||
|
||||
// 更新体重显示
|
||||
var weightEl = card.querySelector('.day-card__weight');
|
||||
if (!weightEl) {
|
||||
weightEl = document.createElement('div');
|
||||
weightEl.className = 'day-card__weight';
|
||||
var recEl = card.querySelector('.day-card__recommend, .day-card__empty-rec');
|
||||
if (recEl) {
|
||||
card.insertBefore(weightEl, recEl);
|
||||
} else {
|
||||
card.appendChild(weightEl);
|
||||
}
|
||||
}
|
||||
if (weightData) {
|
||||
weightEl.innerHTML = weightData.val + '<span class="day-card__weight-unit">kg</span>';
|
||||
} else {
|
||||
weightEl.innerHTML = '--<span class="day-card__weight-unit">kg</span>';
|
||||
}
|
||||
// 更新体重显示
|
||||
var weightEl = card.querySelector('.day-card__weight');
|
||||
if (!weightEl) {
|
||||
weightEl = document.createElement('div');
|
||||
weightEl.className = 'day-card__weight';
|
||||
var recEl = card.querySelector('.day-card__recommend, .day-card__empty-rec');
|
||||
if (recEl) {
|
||||
card.insertBefore(weightEl, recEl);
|
||||
} else {
|
||||
card.appendChild(weightEl);
|
||||
}
|
||||
}
|
||||
if (weightData) {
|
||||
weightEl.innerHTML = weightData.val + '<span class="day-card__weight-unit">kg</span>';
|
||||
} else {
|
||||
weightEl.innerHTML = '--<span class="day-card__weight-unit">kg</span>';
|
||||
}
|
||||
|
||||
// 移除空状态提示
|
||||
var emptyHint = card.querySelector('.day-card__empty-hint');
|
||||
if (emptyHint) emptyHint.remove();
|
||||
// 更新体脂率显示（替换推荐体重）
|
||||
var fatEl = card.querySelector('.day-card__recommend');
|
||||
var emptyRecEl = card.querySelector('.day-card__empty-rec');
|
||||
if (weightData) {
|
||||
// 有体重数据：显示体脂率
|
||||
if (!fatEl) {
|
||||
fatEl = document.createElement('div');
|
||||
fatEl.className = 'day-card__recommend';
|
||||
// 插入到 weight 和 badge 之间
|
||||
var badgeEl = card.querySelector('.day-card__badge');
|
||||
if (badgeEl) {
|
||||
card.insertBefore(fatEl, badgeEl);
|
||||
} else {
|
||||
card.appendChild(fatEl);
|
||||
}
|
||||
}
|
||||
if (emptyRecEl) emptyRecEl.remove();
|
||||
var fatVal = (rec.fatVal !== undefined) ? rec.fatVal.toFixed(1) : '--';
|
||||
fatEl.innerHTML = '体脂率 <em>' + fatVal + '</em>%';
|
||||
}
|
||||
|
||||
// 更新标签
|
||||
var oldBadge = card.querySelector('.day-card__badge');
|
||||
if (oldBadge) oldBadge.remove();
|
||||
// 移除空状态提示
|
||||
var emptyHint = card.querySelector('.day-card__empty-hint');
|
||||
if (emptyHint) emptyHint.remove();
|
||||
|
||||
if (weightData) {
|
||||
var badge = document.createElement('span');
|
||||
var typeMap = { height: 'day-card__badge--height', bluetooth: 'day-card__badge--bluetooth', fat: 'day-card__badge--fat', manual: 'day-card__badge--manual' };
|
||||
var labelMap = { height: '身高秤', bluetooth: '蓝牙', fat: '体脂仪', manual: '自记' };
|
||||
badge.className = 'day-card__badge ' + (typeMap[weightData.type] || 'day-card__badge--manual');
|
||||
badge.textContent = labelMap[weightData.type] || '自记';
|
||||
card.appendChild(badge);
|
||||
}
|
||||
// 更新标签
|
||||
var oldBadge = card.querySelector('.day-card__badge');
|
||||
if (oldBadge) oldBadge.remove();
|
||||
|
||||
updateSummaryBar();
|
||||
}
|
||||
if (weightData) {
|
||||
var badge = document.createElement('span');
|
||||
var typeMap = { height: 'day-card__badge--height', bluetooth: 'day-card__badge--bluetooth', fat: 'day-card__badge--fat', manual: 'day-card__badge--manual' };
|
||||
var labelMap = { height: '身高秤', bluetooth: '蓝牙', fat: '体脂仪', manual: '自记' };
|
||||
badge.className = 'day-card__badge ' + (typeMap[weightData.type] || 'day-card__badge--manual');
|
||||
badge.textContent = labelMap[weightData.type] || '自记';
|
||||
card.appendChild(badge);
|
||||
}
|
||||
|
||||
updateSummaryBar();
|
||||
}
|
||||
|
||||
/* 更新摘要栏 */
|
||||
function updateSummaryBar() {
|
||||
|
||||
@@ -572,6 +572,7 @@ const SITE_MAP = [
|
||||
{ file:'hospital-checkin.html', label:'到院体检' },
|
||||
{ file:'reports.html', label:'体检报告' },
|
||||
{ file:'report-query.html', label:'报告查询详情' },
|
||||
{ file:'report-gastro.html', label:'胃肠镜报告详情' },
|
||||
{ file:'project-detail.html', label:'体检项目详情' }
|
||||
] },
|
||||
{ name:'体重管理', dir:'employee-app/weight-management', entry:'weight-main.html', pages:[
|
||||
|
||||
@@ -1175,6 +1175,7 @@ function buildMeasureData(){
|
||||
types.forEach(function(t){
|
||||
var hasRecord = i % 5 !== 4;
|
||||
var count = hasRecord ? (t==='weight' ? Math.floor(Math.random()*12)+2 : Math.floor(Math.random()*50)+10) : 0;
|
||||
var days = hasRecord ? Math.min(count, Math.floor(Math.random()*daysSinceStart)+1) : 0;
|
||||
var firstDay = new Date(today); firstDay.setDate(firstDay.getDate()-daysSinceStart);
|
||||
var lastDay = hasRecord ? new Date(today) : null;
|
||||
var fd = firstDay.getFullYear()+'-'+('0'+(firstDay.getMonth()+1)).slice(-2)+'-'+('0'+firstDay.getDate()).slice(-2);
|
||||
@@ -1187,7 +1188,7 @@ function buildMeasureData(){
|
||||
data[t].push({
|
||||
planId: planIdVal, planName: planNameVal, org: e.org, dept: e.dept,
|
||||
name: e.name, empId: e.empId, gender: e.gender, age: e.age,
|
||||
measureType: t, checkinCount: count, firstDate: fd, lastDate: ld, hasRecord: hasRecord, source: source
|
||||
measureType: t, checkinCount: count, checkinDays: days, firstDate: fd, lastDate: ld, hasRecord: hasRecord, source: source
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -1199,6 +1200,7 @@ var measureData = buildMeasureData();
|
||||
var currentTab = 1;
|
||||
var currentSubTab = 'weight';
|
||||
var sortAsc = false;
|
||||
var sortField = 'count';
|
||||
var pageSize = 10;
|
||||
var currentPage = 0;
|
||||
var filteredData = [];
|
||||
@@ -1435,7 +1437,8 @@ function applyFilter1(){
|
||||
return true;
|
||||
});
|
||||
// 排序
|
||||
filteredData.sort(function(a,b){ return sortAsc ? a.checkinCount - b.checkinCount : b.checkinCount - a.checkinCount; });
|
||||
var fieldKey = sortField === 'days' ? 'checkinDays' : 'checkinCount';
|
||||
filteredData.sort(function(a,b){ return sortAsc ? a[fieldKey] - b[fieldKey] : b[fieldKey] - a[fieldKey]; });
|
||||
currentPage = 0;
|
||||
renderOverviewTable();
|
||||
updateTabBadges();
|
||||
@@ -1460,8 +1463,9 @@ function resetFilter1(){
|
||||
document.getElementById('filterDateFrom1').value = mon.getFullYear()+'-'+('0'+(mon.getMonth()+1)).slice(-2)+'-'+('0'+mon.getDate()).slice(-2);
|
||||
document.getElementById('filterDateTo1').value = sun.getFullYear()+'-'+('0'+(sun.getMonth()+1)).slice(-2)+'-'+('0'+sun.getDate()).slice(-2);
|
||||
document.querySelectorAll('.sub-tab-status .sub-tab-item').forEach(function(el){el.classList.toggle('active', el.dataset.status === 'all');});
|
||||
sortAsc = false;
|
||||
document.getElementById('sortCount').classList.remove('asc','desc');
|
||||
sortAsc = false; sortField = 'count';
|
||||
var sc = document.getElementById('sortCount'); if(sc){ sc.classList.remove('asc','desc'); var a = sc.querySelector('.sort-arrow'); if(a) a.textContent = '↕'; }
|
||||
var sd = document.getElementById('sortDays'); if(sd){ sd.classList.remove('asc','desc'); var a = sd.querySelector('.sort-arrow'); if(a) a.textContent = '↕'; }
|
||||
applyFilter1();
|
||||
}
|
||||
|
||||
@@ -1623,7 +1627,8 @@ function renderDailyTable(){
|
||||
/* ===== 渲染三测记录表头（体重tab为分组两行表头） ===== */
|
||||
function renderOverviewHeader(){
|
||||
var thead = document.getElementById('overviewThead');
|
||||
var sortTh = '<th class="th-sortable" id="sortCount" '+(currentSubTab==='weight'?'rowspan="2" ':'')+'onclick="toggleSort()">打卡次数 <span class="sort-arrow">↕</span></th>';
|
||||
var sortCountTh = '<th class="th-sortable" id="sortCount" '+(currentSubTab==='weight'?'rowspan="2" ':'')+'onclick="toggleSort(\'count\')">打卡次数 <span class="sort-arrow">↕</span></th>';
|
||||
var sortDaysTh = '<th class="th-sortable" id="sortDays" '+(currentSubTab==='weight'?'rowspan="2" ':'')+'onclick="toggleSort(\'days\')">打卡天数 <span class="sort-arrow">↕</span></th>';
|
||||
var html = '';
|
||||
if(currentSubTab === 'weight'){
|
||||
html += '<tr>';
|
||||
@@ -1634,7 +1639,8 @@ function renderOverviewHeader(){
|
||||
html += '<th rowspan="2">年龄</th>';
|
||||
html += '<th rowspan="2">单位</th>';
|
||||
html += '<th rowspan="2">部门</th>';
|
||||
html += sortTh;
|
||||
html += sortCountTh;
|
||||
html += sortDaysTh;
|
||||
html += '<th rowspan="2">首次记录日期</th>';
|
||||
html += '<th rowspan="2">末次记录日期</th>';
|
||||
html += '<th colspan="6">末次记录数据</th>';
|
||||
@@ -1656,7 +1662,8 @@ function renderOverviewHeader(){
|
||||
html += '<th>年龄</th>';
|
||||
html += '<th>单位</th>';
|
||||
html += '<th>部门</th>';
|
||||
html += sortTh;
|
||||
html += sortCountTh;
|
||||
html += '<th class="th-sortable" id="sortDays" onclick="toggleSort(\'days\')">打卡天数 <span class="sort-arrow">↕</span></th>';
|
||||
html += '<th>首次记录日期</th>';
|
||||
html += '<th>末次记录日期</th>';
|
||||
html += '</tr>';
|
||||
@@ -1673,7 +1680,7 @@ function renderOverviewTable(){
|
||||
document.getElementById('pageInfo1').textContent = '显示 ' + pageData.length + ' 条，共 ' + filteredData.length + ' 条记录';
|
||||
document.getElementById('pageNum1').textContent = '第 ' + (currentPage + 1) + '/' + totalPages + ' 页';
|
||||
var isWeight = currentSubTab === 'weight';
|
||||
var colCount = isWeight ? 16 : 10;
|
||||
var colCount = isWeight ? 17 : 11;
|
||||
if(filteredData.length === 0){
|
||||
tbody.innerHTML = '<tr><td colspan="'+colCount+'" class="td-empty">暂无匹配数据</td></tr>';
|
||||
return;
|
||||
@@ -1689,6 +1696,7 @@ function renderOverviewTable(){
|
||||
html += '<td>'+esc(d.org)+'</td>';
|
||||
html += '<td>'+esc(d.dept)+'</td>';
|
||||
html += '<td>'+d.checkinCount+'</td>';
|
||||
html += '<td>'+d.checkinDays+'</td>';
|
||||
html += '<td>'+esc(d.firstDate)+'</td>';
|
||||
html += '<td>'+esc(d.lastDate)+'</td>';
|
||||
if(isWeight){
|
||||
@@ -1713,9 +1721,11 @@ function switchSubTab(type){
|
||||
});
|
||||
// 体重tab为分组两行表头，其余为单行表头
|
||||
renderOverviewHeader();
|
||||
sortAsc = false;
|
||||
sortAsc = false; sortField = 'count';
|
||||
var sortTh = document.getElementById('sortCount');
|
||||
if(sortTh){ sortTh.classList.remove('asc','desc'); var arrow = sortTh.querySelector('.sort-arrow'); if(arrow){ arrow.textContent = '↕'; } }
|
||||
var sortDays = document.getElementById('sortDays');
|
||||
if(sortDays){ sortDays.classList.remove('asc','desc'); var arrow = sortDays.querySelector('.sort-arrow'); if(arrow){ arrow.textContent = '↕'; } }
|
||||
// 重置记录状态为全部
|
||||
document.querySelectorAll('.sub-tab-status .sub-tab-item').forEach(function(el){el.classList.toggle('active', el.dataset.status === 'all');});
|
||||
applyFilter1();
|
||||
@@ -1729,13 +1739,18 @@ function switchRecordStatus(status){
|
||||
applyFilter1();
|
||||
}
|
||||
|
||||
/* [交互] 打卡次数排序切换 */
|
||||
function toggleSort(){
|
||||
sortAsc = !sortAsc;
|
||||
var th = document.getElementById('sortCount');
|
||||
th.classList.remove('asc','desc');
|
||||
th.classList.add(sortAsc ? 'asc' : 'desc');
|
||||
th.querySelector('.sort-arrow').textContent = sortAsc ? '↑' : '↓';
|
||||
/* [交互] 打卡次数/天数排序切换 */
|
||||
function toggleSort(field){
|
||||
if(sortField !== field){ sortField = field; sortAsc = false; }
|
||||
else { sortAsc = !sortAsc; }
|
||||
// 清除两个排序列的样式
|
||||
var thCount = document.getElementById('sortCount');
|
||||
var thDays = document.getElementById('sortDays');
|
||||
if(thCount){ thCount.classList.remove('asc','desc'); var a = thCount.querySelector('.sort-arrow'); if(a) a.textContent = '↕'; }
|
||||
if(thDays){ thDays.classList.remove('asc','desc'); var a = thDays.querySelector('.sort-arrow'); if(a) a.textContent = '↕'; }
|
||||
// 设置当前排序列样式
|
||||
var th = document.getElementById(field === 'count' ? 'sortCount' : 'sortDays');
|
||||
if(th){ th.classList.add(sortAsc ? 'asc' : 'desc'); th.querySelector('.sort-arrow').textContent = sortAsc ? '↑' : '↓'; }
|
||||
applyFilter1();
|
||||
}
|
||||
|
||||
|
||||
@@ -160,7 +160,7 @@ tbody tr:hover td:last-child{background:#F8FBFF;}
|
||||
<div class="page-header__breadcrumb">体重管理 / 档案 / <span>个人体重数据</span></div>
|
||||
</div>
|
||||
|
||||
<!-- [交互] 筛选栏 — 姓名 + 员工编号 + 单位部门 + 日期范围 -->
|
||||
<!-- [交互] 筛选栏 — 姓名 + 员工编号 + 单位部门 + 年份 -->
|
||||
<div class="filter-bar">
|
||||
<div class="filter-item">
|
||||
<label>姓名</label>
|
||||
@@ -190,12 +190,16 @@ tbody tr:hover td:last-child{background:#F8FBFF;}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<label>日期范围</label>
|
||||
<input class="filter-date" type="date" id="filterDateFrom">
|
||||
<span style="font-size:var(--font-xs);color:var(--text-placeholder);">至</span>
|
||||
<input class="filter-date" type="date" id="filterDateTo">
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<label>年份</label>
|
||||
<select class="filter-select" id="filterYear">
|
||||
<option>2026年</option>
|
||||
<option>2025年</option>
|
||||
<option>2024年</option>
|
||||
<option>2023年</option>
|
||||
<option>2022年</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- [交互] 点击查询按钮筛选列表 -->
|
||||
<button class="btn btn-primary" onclick="applyFilter()">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><circle cx="6" cy="6" r="4.5" stroke="#fff" stroke-width="1.3"/><path d="M9.5 9.5L13 13" stroke="#fff" stroke-width="1.3" stroke-linecap="round"/></svg>查询
|
||||
@@ -361,45 +365,37 @@ function selectDept(elem, deptName, deptCode){
|
||||
}
|
||||
|
||||
/* ===== 筛选 ===== */
|
||||
function applyFilter(){
|
||||
var name = document.getElementById('filterName').value.trim().toLowerCase();
|
||||
var empId = document.getElementById('filterEmpId').value.trim().toLowerCase();
|
||||
var unit = selUnitCode;
|
||||
var dept = selDeptCode;
|
||||
var dateFrom = document.getElementById('filterDateFrom').value;
|
||||
var dateTo = document.getElementById('filterDateTo').value;
|
||||
var data = personnelData.slice();
|
||||
if(name){ data = data.filter(function(d){return d.name.toLowerCase().indexOf(name) !== -1;}); }
|
||||
if(empId){ data = data.filter(function(d){return d.empId.toLowerCase().indexOf(empId) !== -1;}); }
|
||||
if(unit){ data = data.filter(function(d){return d.unit === unit;}); }
|
||||
if(dept){ data = data.filter(function(d){return d.dept === dept;}); }
|
||||
// 日期范围筛选 — 基于记录日期（Mock 数据中没有日期字段，保留筛选逻辑用于后续对接真实数据）
|
||||
if(dateFrom || dateTo){
|
||||
// 当前 Mock 数据不含日期字段，日期筛选不影响结果
|
||||
// 对接真实接口后启用：
|
||||
// if(dateFrom){ data = data.filter(function(d){return d.recordDate >= dateFrom;}); }
|
||||
// if(dateTo){ data = data.filter(function(d){return d.recordDate <= dateTo;}); }
|
||||
}
|
||||
filteredData = data;
|
||||
currentPage = 0;
|
||||
renderTable();
|
||||
}
|
||||
function applyFilter(){
|
||||
var name = document.getElementById('filterName').value.trim().toLowerCase();
|
||||
var empId = document.getElementById('filterEmpId').value.trim().toLowerCase();
|
||||
var unit = selUnitCode;
|
||||
var dept = selDeptCode;
|
||||
var year = document.getElementById('filterYear').value.replace('年','');
|
||||
var data = personnelData.slice();
|
||||
if(name){ data = data.filter(function(d){return d.name.toLowerCase().indexOf(name) !== -1;}); }
|
||||
if(empId){ data = data.filter(function(d){return d.empId.toLowerCase().indexOf(empId) !== -1;}); }
|
||||
if(unit){ data = data.filter(function(d){return d.unit === unit;}); }
|
||||
if(dept){ data = data.filter(function(d){return d.dept === dept;}); }
|
||||
// 年份筛选 — Mock 数据不含年份字段，保留逻辑用于后续对接真实数据
|
||||
// 对接真实接口后启用：data = data.filter(function(d){return d.recordYear === year;});
|
||||
filteredData = data;
|
||||
currentPage = 0;
|
||||
renderTable();
|
||||
}
|
||||
|
||||
function resetFilter(){
|
||||
document.getElementById('filterName').value = '';
|
||||
document.getElementById('filterEmpId').value = '';
|
||||
selUnitName = ''; selUnitCode = '';
|
||||
selDeptName = ''; selDeptCode = '';
|
||||
document.getElementById('orgTrigger').textContent = '全部单位/部门';
|
||||
document.querySelectorAll('#unitCol .org-item').forEach(function(item){item.classList.remove('active');});
|
||||
var firstUnit = document.querySelector('#unitCol .org-item');
|
||||
if(firstUnit) firstUnit.classList.add('active');
|
||||
document.getElementById('deptCol').innerHTML = '<div class="org-col__title">部门</div><div class="org-item active" data-dept="" onclick="selectDept(this,\'全部部门\',\'\')">全部部门</div>';
|
||||
var now = new Date();
|
||||
document.getElementById('filterDateFrom').value = now.getFullYear() + '-01-01';
|
||||
document.getElementById('filterDateTo').value = now.getFullYear() + '-' + String(now.getMonth()+1).padStart(2,'0') + '-' + String(now.getDate()).padStart(2,'0');
|
||||
applyFilter();
|
||||
}
|
||||
function resetFilter(){
|
||||
document.getElementById('filterName').value = '';
|
||||
document.getElementById('filterEmpId').value = '';
|
||||
selUnitName = ''; selUnitCode = '';
|
||||
selDeptName = ''; selDeptCode = '';
|
||||
document.getElementById('orgTrigger').textContent = '全部单位/部门';
|
||||
document.querySelectorAll('#unitCol .org-item').forEach(function(item){item.classList.remove('active');});
|
||||
var firstUnit = document.querySelector('#unitCol .org-item');
|
||||
if(firstUnit) firstUnit.classList.add('active');
|
||||
document.getElementById('deptCol').innerHTML = '<div class="org-col__title">部门</div><div class="org-item active" data-dept="" onclick="selectDept(this,\'全部部门\',\'\')">全部部门</div>';
|
||||
document.getElementById('filterYear').value = new Date().getFullYear() + '年';
|
||||
applyFilter();
|
||||
}
|
||||
|
||||
/* ===== 渲染表格 ===== */
|
||||
function renderTable(){
|
||||
@@ -441,7 +437,7 @@ function renderTable(){
|
||||
html += '<td>'+d.dietCount+'</td>';
|
||||
html += '<td>'+d.sportCount+'</td>';
|
||||
html += '<td>'+d.weightCount+'</td>';
|
||||
html += '<td><a class="link" href="archive-personal-weight-detail.html?id='+esc(d.empId)+'&year='+encodeURIComponent(document.getElementById('filterDateFrom').value.substring(0,4))+'">查看</a></td>';
|
||||
html += '<td><a class="link" href="archive-personal-weight-detail.html?id='+esc(d.empId)+'&year='+encodeURIComponent(document.getElementById('filterYear').value.replace('年',''))+'">查看</a></td>';
|
||||
html += '</tr>';
|
||||
});
|
||||
tbody.innerHTML = html;
|
||||
@@ -473,15 +469,11 @@ function showToast(msg){
|
||||
setTimeout(function(){t.classList.remove('show');},2000);
|
||||
}
|
||||
|
||||
/* ===== 初始化 ===== */
|
||||
(function init(){
|
||||
var now = new Date();
|
||||
var yearStart = now.getFullYear() + '-01-01';
|
||||
var today = now.getFullYear() + '-' + String(now.getMonth()+1).padStart(2,'0') + '-' + String(now.getDate()).padStart(2,'0');
|
||||
document.getElementById('filterDateFrom').value = yearStart;
|
||||
document.getElementById('filterDateTo').value = today;
|
||||
renderTable();
|
||||
})();
|
||||
/* ===== 初始化 ===== */
|
||||
(function init(){
|
||||
document.getElementById('filterYear').value = new Date().getFullYear() + '年';
|
||||
renderTable();
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -143,6 +143,7 @@
|
||||
</div>
|
||||
<div class="filter-item"><label>姓名</label><input class="filter-input" placeholder="请输入姓名" style="min-width:120px;"></div>
|
||||
<div class="filter-item"><label>员工编号</label><input class="filter-input" placeholder="请输入员工编号" style="min-width:140px;"></div>
|
||||
<div class="filter-item"><label>是否设置个人目标</label><select class="filter-select"><option value="">全部</option><option value="yes">已设置</option><option value="no">未设置</option></select></div>
|
||||
<button class="btn btn-primary">查询</button>
|
||||
<button class="btn btn-default">重置</button>
|
||||
</div>
|
||||
@@ -225,50 +226,50 @@
|
||||
<td class="change-down">-11.3</td><td class="change-down">-3.5</td><td class="change-down">-6.3</td><td class="change-down">-13</td>
|
||||
<td class="col-fixed-r"><a class="btn-link" href="personal-target-detail.html?empId=EMP-10005">查看</a></td>
|
||||
</tr>
|
||||
<!-- 未设置目标的人员：目标周期/目标指标显示"-"，当前指标和变化有实际称重数据 -->
|
||||
<!-- 未设置目标的人员：目标周期/目标指标/初始指标/变化均显示"-"，仅当前指标有实际称重数据 -->
|
||||
<tr>
|
||||
<td class="col-fixed-l1">孙磊</td><td class="col-fixed-l2">EMP-10101</td><td>男</td><td>29</td><td>采油一厂</td><td>生产运行科</td>
|
||||
<td>-</td><td class="th-divider">-</td>
|
||||
<td>172</td><td>78.0</td><td>26.4</td><td>24.5</td><td class="th-divider">92</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>77.5</td><td>26.2</td><td>24.0</td><td class="th-divider">91</td>
|
||||
<td class="change-down">-0.5</td><td class="change-down">-0.2</td><td class="change-down">-0.5</td><td class="change-down">-1</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td>
|
||||
<td class="col-fixed-r"><a class="btn-link" href="personal-target-detail.html?empId=EMP-10101">查看</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="col-fixed-l1">周婷</td><td class="col-fixed-l2">EMP-10102</td><td>女</td><td>33</td><td>采油二厂</td><td>安全环保科</td>
|
||||
<td>-</td><td class="th-divider">-</td>
|
||||
<td>158</td><td>65.2</td><td>26.1</td><td>31.0</td><td class="th-divider">80</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>64.5</td><td>25.8</td><td>30.2</td><td class="th-divider">78</td>
|
||||
<td class="change-down">-0.7</td><td class="change-down">-0.3</td><td class="change-down">-0.8</td><td class="change-down">-2</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td>
|
||||
<td class="col-fixed-r"><a class="btn-link" href="personal-target-detail.html?empId=EMP-10102">查看</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="col-fixed-l1">吴刚</td><td class="col-fixed-l2">EMP-10103</td><td>男</td><td>45</td><td>采气厂</td><td>综合管理科</td>
|
||||
<td>-</td><td class="th-divider">-</td>
|
||||
<td>168</td><td>90.5</td><td>32.1</td><td>33.5</td><td class="th-divider">108</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>91.2</td><td>32.3</td><td>34.2</td><td class="th-divider">110</td>
|
||||
<td class="change-up">+0.7</td><td class="change-up">+0.2</td><td class="change-up">+0.7</td><td class="change-up">+2</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td>
|
||||
<td class="col-fixed-r"><a class="btn-link" href="personal-target-detail.html?empId=EMP-10103">查看</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="col-fixed-l1">陈静</td><td class="col-fixed-l2">EMP-10104</td><td>女</td><td>26</td><td>采油一厂</td><td>综合管理科</td>
|
||||
<td>-</td><td class="th-divider">-</td>
|
||||
<td>165</td><td>58.0</td><td>21.3</td><td>25.0</td><td class="th-divider">72</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>57.3</td><td>21.0</td><td>24.2</td><td class="th-divider">71</td>
|
||||
<td class="change-down">-0.7</td><td class="change-down">-0.3</td><td class="change-down">-0.8</td><td class="change-down">-1</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td>
|
||||
<td class="col-fixed-r"><a class="btn-link" href="personal-target-detail.html?empId=EMP-10104">查看</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="col-fixed-l1">郑飞</td><td class="col-fixed-l2">EMP-10105</td><td>男</td><td>40</td><td>采油二厂</td><td>生产运行科</td>
|
||||
<td>-</td><td class="th-divider">-</td>
|
||||
<td>175</td><td>86.2</td><td>28.1</td><td>28.5</td><td class="th-divider">98</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>-</td><td>-</td><td>-</td><td class="th-divider">-</td>
|
||||
<td>85.5</td><td>27.9</td><td>28.0</td><td class="th-divider">96</td>
|
||||
<td class="change-down">-0.7</td><td class="change-down">-0.2</td><td class="change-down">-0.5</td><td class="change-down">-2</td>
|
||||
<td>-</td><td>-</td><td>-</td><td>-</td>
|
||||
<td class="col-fixed-r"><a class="btn-link" href="personal-target-detail.html?empId=EMP-10105">查看</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
@@ -150,7 +150,28 @@ body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei
|
||||
.search-select__option.selected{color:var(--primary);background:var(--primary-light);}
|
||||
.search-select__avatar{width:28px;height:28px;border-radius:50%;background:#E6F7FF;display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:var(--font-xs);flex-shrink:0;}
|
||||
|
||||
/* 文件上传 */
|
||||
/* 树形选择器（组织机构） */
|
||||
.tree-select{position:relative;width:100%;}
|
||||
.tree-select__trigger{width:100%;height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 32px 0 12px;font-size:var(--font-sm);background:#fff;cursor:pointer;display:flex;align-items:center;user-select:none;transition:border-color .2s;box-sizing:border-box;position:relative;}
|
||||
.tree-select__trigger:hover{border-color:var(--primary);}
|
||||
.tree-select__trigger::after{content:'';position:absolute;right:12px;top:50%;transform:translateY(-50%);border:4px solid transparent;border-top:5px solid #999;pointer-events:none;}
|
||||
.tree-select__text{color:var(--text-placeholder);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
||||
.tree-select__text.has-value{color:var(--text-primary);}
|
||||
.tree-select__panel{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:500;display:none;max-height:320px;overflow-y:auto;}
|
||||
.tree-select__panel.show{display:block;}
|
||||
.tree-select__group{border-bottom:1px solid #F5F5F5;}
|
||||
.tree-select__group:last-child{border-bottom:none;}
|
||||
.tree-select__group-header{display:flex;align-items:center;gap:6px;padding:9px 16px;font-size:var(--font-sm);font-weight:500;color:var(--text-primary);cursor:pointer;transition:background .1s;user-select:none;}
|
||||
.tree-select__group-header:hover{background:#F5F7FA;}
|
||||
.tree-select__group-arrow{width:16px;height:16px;display:flex;align-items:center;justify-content:center;transition:transform .2s;flex-shrink:0;color:var(--text-placeholder);}
|
||||
.tree-select__group-arrow.expanded{transform:rotate(90deg);}
|
||||
.tree-select__group-label{flex:1;}
|
||||
.tree-select__option{padding:8px 16px 8px 38px;font-size:var(--font-sm);cursor:pointer;transition:background .1s;display:none;color:var(--text-secondary);}
|
||||
.tree-select__option.show{display:block;}
|
||||
.tree-select__option:hover{background:#F5F7FA;}
|
||||
.tree-select__option.selected{color:var(--primary);background:var(--primary-light);}
|
||||
|
||||
/* 文件上传 */
|
||||
.upload-area{border:2px dashed var(--border);border-radius:var(--radius-md);padding:32px;text-align:center;cursor:pointer;transition:all .2s;background:#FAFAFA;}
|
||||
.upload-area:hover{border-color:var(--primary);background:var(--primary-light);}
|
||||
.upload-area svg{width:40px;height:40px;color:var(--text-placeholder);margin-bottom:8px;}
|
||||
@@ -208,17 +229,66 @@ body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei
|
||||
<span id="formCardTitle">新增计划</span>
|
||||
</div>
|
||||
|
||||
<!-- 活动组织单位 -->
|
||||
<div class="form-group">
|
||||
<label>活动组织单位 <span class="req">*</span></label>
|
||||
<select class="form-input" id="planOrg">
|
||||
<option value="">请选择组织单位</option>
|
||||
<option>第四采油厂</option>
|
||||
<option>采油一厂</option>
|
||||
<option>采油二厂</option>
|
||||
<option>采气一厂</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- 活动组织机构 -->
|
||||
<div class="form-group">
|
||||
<label>活动组织机构 <span class="req">*</span></label>
|
||||
<div class="tree-select" id="orgTreeSelect">
|
||||
<input type="hidden" id="planOrg" value="">
|
||||
<div class="tree-select__trigger" onclick="toggleOrgTree()">
|
||||
<span class="tree-select__text" id="orgTreeText">请选择组织机构</span>
|
||||
</div>
|
||||
<div class="tree-select__panel" id="orgTreePanel">
|
||||
<div class="tree-select__group" data-unit="第四采油厂">
|
||||
<div class="tree-select__group-header" onclick="toggleOrgGroup(this, event)">
|
||||
<span class="tree-select__group-arrow">▶</span>
|
||||
<span class="tree-select__group-label">第四采油厂</span>
|
||||
</div>
|
||||
<div class="tree-select__option" data-val="第四采油厂|健康管理部" onclick="selectOrgOption(this,'第四采油厂 / 健康管理部')">健康管理部</div>
|
||||
<div class="tree-select__option" data-val="第四采油厂|安全环保科" onclick="selectOrgOption(this,'第四采油厂 / 安全环保科')">安全环保科</div>
|
||||
<div class="tree-select__option" data-val="第四采油厂|工会办公室" onclick="selectOrgOption(this,'第四采油厂 / 工会办公室')">工会办公室</div>
|
||||
<div class="tree-select__option" data-val="第四采油厂|生产技术部" onclick="selectOrgOption(this,'第四采油厂 / 生产技术部')">生产技术部</div>
|
||||
<div class="tree-select__option" data-val="第四采油厂|财务部" onclick="selectOrgOption(this,'第四采油厂 / 财务部')">财务部</div>
|
||||
<div class="tree-select__option" data-val="第四采油厂|信息中心" onclick="selectOrgOption(this,'第四采油厂 / 信息中心')">信息中心</div>
|
||||
</div>
|
||||
<div class="tree-select__group" data-unit="采油一厂">
|
||||
<div class="tree-select__group-header" onclick="toggleOrgGroup(this, event)">
|
||||
<span class="tree-select__group-arrow">▶</span>
|
||||
<span class="tree-select__group-label">采油一厂</span>
|
||||
</div>
|
||||
<div class="tree-select__option" data-val="采油一厂|健康管理部" onclick="selectOrgOption(this,'采油一厂 / 健康管理部')">健康管理部</div>
|
||||
<div class="tree-select__option" data-val="采油一厂|安全环保科" onclick="selectOrgOption(this,'采油一厂 / 安全环保科')">安全环保科</div>
|
||||
<div class="tree-select__option" data-val="采油一厂|工会办公室" onclick="selectOrgOption(this,'采油一厂 / 工会办公室')">工会办公室</div>
|
||||
<div class="tree-select__option" data-val="采油一厂|生产技术部" onclick="selectOrgOption(this,'采油一厂 / 生产技术部')">生产技术部</div>
|
||||
<div class="tree-select__option" data-val="采油一厂|财务部" onclick="selectOrgOption(this,'采油一厂 / 财务部')">财务部</div>
|
||||
<div class="tree-select__option" data-val="采油一厂|信息中心" onclick="selectOrgOption(this,'采油一厂 / 信息中心')">信息中心</div>
|
||||
</div>
|
||||
<div class="tree-select__group" data-unit="采油二厂">
|
||||
<div class="tree-select__group-header" onclick="toggleOrgGroup(this, event)">
|
||||
<span class="tree-select__group-arrow">▶</span>
|
||||
<span class="tree-select__group-label">采油二厂</span>
|
||||
</div>
|
||||
<div class="tree-select__option" data-val="采油二厂|健康管理部" onclick="selectOrgOption(this,'采油二厂 / 健康管理部')">健康管理部</div>
|
||||
<div class="tree-select__option" data-val="采油二厂|安全环保科" onclick="selectOrgOption(this,'采油二厂 / 安全环保科')">安全环保科</div>
|
||||
<div class="tree-select__option" data-val="采油二厂|工会办公室" onclick="selectOrgOption(this,'采油二厂 / 工会办公室')">工会办公室</div>
|
||||
<div class="tree-select__option" data-val="采油二厂|生产技术部" onclick="selectOrgOption(this,'采油二厂 / 生产技术部')">生产技术部</div>
|
||||
<div class="tree-select__option" data-val="采油二厂|财务部" onclick="selectOrgOption(this,'采油二厂 / 财务部')">财务部</div>
|
||||
<div class="tree-select__option" data-val="采油二厂|信息中心" onclick="selectOrgOption(this,'采油二厂 / 信息中心')">信息中心</div>
|
||||
</div>
|
||||
<div class="tree-select__group" data-unit="采气一厂">
|
||||
<div class="tree-select__group-header" onclick="toggleOrgGroup(this, event)">
|
||||
<span class="tree-select__group-arrow">▶</span>
|
||||
<span class="tree-select__group-label">采气一厂</span>
|
||||
</div>
|
||||
<div class="tree-select__option" data-val="采气一厂|健康管理部" onclick="selectOrgOption(this,'采气一厂 / 健康管理部')">健康管理部</div>
|
||||
<div class="tree-select__option" data-val="采气一厂|安全环保科" onclick="selectOrgOption(this,'采气一厂 / 安全环保科')">安全环保科</div>
|
||||
<div class="tree-select__option" data-val="采气一厂|工会办公室" onclick="selectOrgOption(this,'采气一厂 / 工会办公室')">工会办公室</div>
|
||||
<div class="tree-select__option" data-val="采气一厂|生产技术部" onclick="selectOrgOption(this,'采气一厂 / 生产技术部')">生产技术部</div>
|
||||
<div class="tree-select__option" data-val="采气一厂|财务部" onclick="selectOrgOption(this,'采气一厂 / 财务部')">财务部</div>
|
||||
<div class="tree-select__option" data-val="采气一厂|信息中心" onclick="selectOrgOption(this,'采气一厂 / 信息中心')">信息中心</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 计划名称 -->
|
||||
<div class="form-group">
|
||||
@@ -245,7 +315,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei
|
||||
<div class="person-panel__label">指定部门</div>
|
||||
<div class="multi-select" id="deptSelect">
|
||||
<!-- [交互] 点击展开部门多选下拉 -->
|
||||
<div class="multi-select__trigger placeholder disabled" onclick="toggleDeptPanel()" id="deptTrigger">请先选择组织单位</div>
|
||||
<div class="multi-select__trigger placeholder disabled" onclick="toggleDeptPanel()" id="deptTrigger">请先选择组织机构</div>
|
||||
<div class="multi-select__panel" id="deptPanel">
|
||||
<div class="multi-select__opt" data-val="健康管理部" onclick="toggleDeptOpt(this,'健康管理部')"><span class="multi-select__cb"></span>健康管理部</div>
|
||||
<div class="multi-select__opt" data-val="安全环保科" onclick="toggleDeptOpt(this,'安全环保科')"><span class="multi-select__cb"></span>安全环保科</div>
|
||||
@@ -260,7 +330,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei
|
||||
<div class="person-panel__label">指定员工</div>
|
||||
<!-- [交互] 点击打开员工选择弹窗 -->
|
||||
<div class="emp-trigger" id="empTrigger" onclick="openEmpModal()">
|
||||
<span class="emp-trigger__text" id="empTriggerText">请先选择组织单位</span>
|
||||
<span class="emp-trigger__text" id="empTriggerText">请先选择组织机构</span>
|
||||
<svg class="emp-trigger__icon" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M3 5l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
</div>
|
||||
</div>
|
||||
@@ -321,9 +391,9 @@ body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei
|
||||
<input type="hidden" id="leaderEmpId">
|
||||
</div>
|
||||
|
||||
<!-- 审核人 -->
|
||||
<div class="form-group">
|
||||
<label>审核人 <span class="req">*</span></label>
|
||||
<!-- 审核人 -->
|
||||
<div class="form-group">
|
||||
<label>审核人</label>
|
||||
<div class="search-select" id="reviewerSelect2">
|
||||
<!-- [交互] 按姓名搜索审核人 -->
|
||||
<input class="search-select__input" id="reviewerInput" placeholder="搜索审核人姓名" oninput="searchReviewer2()" onfocus="showReviewerPanel()" autocomplete="off">
|
||||
@@ -340,9 +410,9 @@ body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei
|
||||
<input type="hidden" id="reviewerInfo">
|
||||
</div>
|
||||
|
||||
<!-- 通知文件 -->
|
||||
<div class="form-group">
|
||||
<label>通知文件</label>
|
||||
<!-- 通知文件 -->
|
||||
<div class="form-group">
|
||||
<label>通知文件 <span class="req">*</span></label>
|
||||
<div class="upload-area" id="uploadArea" onclick="document.getElementById('fileInput').click()">
|
||||
<svg viewBox="0 0 40 40" fill="none"><path d="M20 8v24M12 16l8-8 8 8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M8 28v4a2 2 0 002 2h20a2 2 0 002-2v-4" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
|
||||
<div class="upload-area__text">点击或拖拽文件到此区域上传</div>
|
||||
@@ -528,14 +598,14 @@ function togglePersonPanel(){
|
||||
/* ===== 部门多选 ===== */
|
||||
var selectedDepts = [];
|
||||
|
||||
function toggleDeptPanel(){
|
||||
var org = document.getElementById('planOrg').value;
|
||||
if(!org){showToast('请先选择组织单位');return;}
|
||||
var panel = document.getElementById('deptPanel');
|
||||
var isShow = panel.classList.contains('show');
|
||||
closeAllPanels();
|
||||
if(!isShow) panel.classList.add('show');
|
||||
}
|
||||
function toggleDeptPanel(){
|
||||
var orgVal = document.getElementById('planOrg').value;
|
||||
if(!orgVal){showToast('请先选择组织机构');return;}
|
||||
var panel = document.getElementById('deptPanel');
|
||||
var isShow = panel.classList.contains('show');
|
||||
closeAllPanels();
|
||||
if(!isShow) panel.classList.add('show');
|
||||
}
|
||||
|
||||
function toggleDeptOpt(el, val){
|
||||
var cb = el.querySelector('.multi-select__cb');
|
||||
@@ -594,73 +664,157 @@ var mockEmployees = [
|
||||
{org:'采气一厂',dept:'信息中心',name:'马超',id:'CQ001248',gender:'男',age:36,height:179,weight:95,bmi:29.6}
|
||||
];
|
||||
|
||||
// 监听组织单位变化，同步更新部门和员工选择器状态
|
||||
document.getElementById('planOrg').addEventListener('change', updateOrgDependent);
|
||||
// 从组织机构值中提取单位名称（兼容"单位|部门"格式）
|
||||
function getOrgUnit(val){
|
||||
var idx = val.indexOf('|');
|
||||
return idx > -1 ? val.substring(0, idx) : val;
|
||||
}
|
||||
|
||||
// 从组织机构值中提取部门名称（兼容"单位|部门"格式）
|
||||
function getOrgDept(val){
|
||||
var idx = val.indexOf('|');
|
||||
return idx > -1 ? val.substring(idx + 1) : '';
|
||||
}
|
||||
|
||||
function updateOrgDependent(){
|
||||
var org = document.getElementById('planOrg').value;
|
||||
var deptTrigger = document.getElementById('deptTrigger');
|
||||
if(org){
|
||||
deptTrigger.classList.remove('disabled');
|
||||
if(selectedDepts.length===0){
|
||||
deptTrigger.textContent = '请选择部门（可多选）';
|
||||
}
|
||||
} else {
|
||||
deptTrigger.classList.add('disabled');
|
||||
deptTrigger.textContent = '请先选择组织单位';
|
||||
selectedDepts = [];
|
||||
updateDeptTrigger();
|
||||
}
|
||||
var empTrigger = document.getElementById('empTrigger');
|
||||
var text = document.getElementById('empTriggerText');
|
||||
if(org){
|
||||
empTrigger.classList.remove('disabled');
|
||||
text.className = 'emp-trigger__text';
|
||||
text.textContent = '点击选择员工';
|
||||
} else {
|
||||
empTrigger.classList.add('disabled');
|
||||
text.className = 'emp-trigger__text';
|
||||
text.textContent = '请先选择组织单位';
|
||||
selectedEmployees = [];
|
||||
renderSelectedPersons();
|
||||
}
|
||||
}
|
||||
/* ===== 组织机构树形选择器 ===== */
|
||||
// [交互] 点击触发器展开/收起下拉面板
|
||||
function toggleOrgTree(){
|
||||
var panel = document.getElementById('orgTreePanel');
|
||||
var isShow = panel.classList.contains('show');
|
||||
closeAllPanels();
|
||||
if(!isShow) panel.classList.add('show');
|
||||
}
|
||||
|
||||
function openEmpModal(){
|
||||
var org = document.getElementById('planOrg').value;
|
||||
if(!org){showToast('请先选择组织单位');return;}
|
||||
tempSelectedEmps = selectedEmployees.slice();
|
||||
renderEmpTable();
|
||||
document.getElementById('empModal').classList.add('show');
|
||||
}
|
||||
// [交互] 点击单位标题展开/收起部门列表
|
||||
function toggleOrgGroup(headerEl, event){
|
||||
event.stopPropagation();
|
||||
var arrow = headerEl.querySelector('.tree-select__group-arrow');
|
||||
var group = headerEl.parentElement;
|
||||
var options = group.querySelectorAll('.tree-select__option');
|
||||
var isExpanded = arrow.classList.contains('expanded');
|
||||
if(isExpanded){
|
||||
// 收起：隐藏部门选项，并选中该单位
|
||||
arrow.classList.remove('expanded');
|
||||
options.forEach(function(opt){ opt.classList.remove('show'); });
|
||||
var unitName = group.getAttribute('data-unit');
|
||||
selectOrgOptionInner(unitName, unitName);
|
||||
} else {
|
||||
// 收起其他已展开的分组
|
||||
document.querySelectorAll('.tree-select__group-arrow.expanded').forEach(function(a){
|
||||
a.classList.remove('expanded');
|
||||
});
|
||||
document.querySelectorAll('.tree-select__option.show').forEach(function(o){
|
||||
o.classList.remove('show');
|
||||
});
|
||||
// 展开当前分组
|
||||
arrow.classList.add('expanded');
|
||||
options.forEach(function(opt){ opt.classList.add('show'); });
|
||||
}
|
||||
}
|
||||
|
||||
// [交互] 点击部门选项选中
|
||||
function selectOrgOption(el, displayText){
|
||||
var val = el.getAttribute('data-val');
|
||||
selectOrgOptionInner(val, displayText);
|
||||
}
|
||||
|
||||
// 内部选中逻辑
|
||||
function selectOrgOptionInner(val, displayText){
|
||||
// 更新隐藏域
|
||||
var hidden = document.getElementById('planOrg');
|
||||
var oldVal = hidden.value;
|
||||
hidden.value = val;
|
||||
// 更新触发器显示
|
||||
var textEl = document.getElementById('orgTreeText');
|
||||
textEl.textContent = displayText;
|
||||
textEl.className = 'tree-select__text has-value';
|
||||
// 更新面板选中态
|
||||
document.querySelectorAll('#orgTreePanel .tree-select__option.selected').forEach(function(o){
|
||||
o.classList.remove('selected');
|
||||
});
|
||||
var targetOpt = document.querySelector('#orgTreePanel .tree-select__option[data-val="' + val + '"]');
|
||||
if(targetOpt){ targetOpt.classList.add('selected'); }
|
||||
// 关闭面板
|
||||
document.getElementById('orgTreePanel').classList.remove('show');
|
||||
// 触发change事件
|
||||
if(oldVal !== val){
|
||||
var evt = document.createEvent('HTMLEvents');
|
||||
evt.initEvent('change', true, false);
|
||||
hidden.dispatchEvent(evt);
|
||||
}
|
||||
}
|
||||
|
||||
// 监听组织机构变化，同步更新部门和员工选择器状态
|
||||
document.getElementById('planOrg').addEventListener('change', updateOrgDependent);
|
||||
|
||||
function updateOrgDependent(){
|
||||
var orgVal = document.getElementById('planOrg').value;
|
||||
var orgUnit = getOrgUnit(orgVal);
|
||||
var deptTrigger = document.getElementById('deptTrigger');
|
||||
if(orgUnit){
|
||||
deptTrigger.classList.remove('disabled');
|
||||
if(selectedDepts.length===0){
|
||||
deptTrigger.textContent = '请选择部门（可多选）';
|
||||
}
|
||||
} else {
|
||||
deptTrigger.classList.add('disabled');
|
||||
deptTrigger.textContent = '请先选择组织机构';
|
||||
selectedDepts = [];
|
||||
updateDeptTrigger();
|
||||
}
|
||||
var empTrigger = document.getElementById('empTrigger');
|
||||
var text = document.getElementById('empTriggerText');
|
||||
if(orgUnit){
|
||||
empTrigger.classList.remove('disabled');
|
||||
text.className = 'emp-trigger__text';
|
||||
text.textContent = '点击选择员工';
|
||||
} else {
|
||||
empTrigger.classList.add('disabled');
|
||||
text.className = 'emp-trigger__text';
|
||||
text.textContent = '请先选择组织机构';
|
||||
selectedEmployees = [];
|
||||
renderSelectedPersons();
|
||||
}
|
||||
}
|
||||
|
||||
function openEmpModal(){
|
||||
var orgVal = document.getElementById('planOrg').value;
|
||||
if(!orgVal){showToast('请先选择组织机构');return;}
|
||||
tempSelectedEmps = selectedEmployees.slice();
|
||||
renderEmpTable();
|
||||
document.getElementById('empModal').classList.add('show');
|
||||
}
|
||||
|
||||
function closeEmpModal(){
|
||||
document.getElementById('empModal').classList.remove('show');
|
||||
}
|
||||
|
||||
function renderEmpTable(){
|
||||
var org = document.getElementById('planOrg').value;
|
||||
var filterDept = document.getElementById('empFilterDept').value;
|
||||
var filterName = document.getElementById('empFilterName').value.trim().toLowerCase();
|
||||
var filterId = document.getElementById('empFilterId').value.trim().toLowerCase();
|
||||
function renderEmpTable(){
|
||||
var orgVal = document.getElementById('planOrg').value;
|
||||
var orgUnit = getOrgUnit(orgVal);
|
||||
var orgDept = getOrgDept(orgVal);
|
||||
var filterDept = document.getElementById('empFilterDept').value;
|
||||
var filterName = document.getElementById('empFilterName').value.trim().toLowerCase();
|
||||
var filterId = document.getElementById('empFilterId').value.trim().toLowerCase();
|
||||
|
||||
var weightOp = document.getElementById('empFilterWeightOp').value;
|
||||
var weightV1 = document.getElementById('empFilterWeightVal1').value;
|
||||
var weightV2 = document.getElementById('empFilterWeightVal2').value;
|
||||
var weightOp = document.getElementById('empFilterWeightOp').value;
|
||||
var weightV1 = document.getElementById('empFilterWeightVal1').value;
|
||||
var weightV2 = document.getElementById('empFilterWeightVal2').value;
|
||||
|
||||
var bmiOp = document.getElementById('empFilterBmiOp').value;
|
||||
var bmiV1 = document.getElementById('empFilterBmiVal1').value;
|
||||
var bmiV2 = document.getElementById('empFilterBmiVal2').value;
|
||||
var bmiOp = document.getElementById('empFilterBmiOp').value;
|
||||
var bmiV1 = document.getElementById('empFilterBmiVal1').value;
|
||||
var bmiV2 = document.getElementById('empFilterBmiVal2').value;
|
||||
|
||||
var filtered = mockEmployees.filter(function(e){
|
||||
if(e.org !== org) return false;
|
||||
if(filterDept && e.dept !== filterDept) return false;
|
||||
if(filterName && e.name.indexOf(filterName) === -1) return false;
|
||||
if(filterId && e.id.toLowerCase().indexOf(filterId) === -1) return false;
|
||||
if(!applyEmpOpFilter(e.weight, weightOp, weightV1, weightV2)) return false;
|
||||
if(!applyEmpOpFilter(e.bmi, bmiOp, bmiV1, bmiV2)) return false;
|
||||
return true;
|
||||
});
|
||||
var filtered = mockEmployees.filter(function(e){
|
||||
if(e.org !== orgUnit) return false;
|
||||
if(orgDept && e.dept !== orgDept) return false;
|
||||
if(filterDept && e.dept !== filterDept) return false;
|
||||
if(filterName && e.name.indexOf(filterName) === -1) return false;
|
||||
if(filterId && e.id.toLowerCase().indexOf(filterId) === -1) return false;
|
||||
if(!applyEmpOpFilter(e.weight, weightOp, weightV1, weightV2)) return false;
|
||||
if(!applyEmpOpFilter(e.bmi, bmiOp, bmiV1, bmiV2)) return false;
|
||||
return true;
|
||||
});
|
||||
|
||||
var tbody = document.getElementById('empTableBody');
|
||||
if(filtered.length===0){
|
||||
@@ -933,12 +1087,13 @@ function closeAllPanels(){
|
||||
document.getElementById('leaderPanel').classList.remove('show');
|
||||
document.getElementById('reviewerPanel').classList.remove('show');
|
||||
document.getElementById('deptPanel').classList.remove('show');
|
||||
document.getElementById('orgTreePanel').classList.remove('show');
|
||||
}
|
||||
|
||||
/* ===== 保存 ===== */
|
||||
function savePlan(){
|
||||
var org = document.getElementById('planOrg').value.trim();
|
||||
if(!org){showToast('请选择活动组织单位');return;}
|
||||
if(!org){showToast('请选择活动组织机构');return;}
|
||||
var name = document.getElementById('planName').value.trim();
|
||||
if(!name){showToast('请输入计划名称');return;}
|
||||
var personType = document.querySelector('input[name="personType"]:checked').value;
|
||||
@@ -950,8 +1105,8 @@ function savePlan(){
|
||||
if(!dateFrom||!dateTo){showToast('请选择计划起止日期');return;}
|
||||
var dept = document.getElementById('planDept').value.trim();
|
||||
if(!dept){showToast('请选择组织部门');return;}
|
||||
if(!selectedLeader){showToast('请选择负责人');return;}
|
||||
if(!selectedReviewer){showToast('请选择审核人');return;}
|
||||
if(!selectedLeader){showToast('请选择负责人');return;}
|
||||
if(uploadedFiles.length === 0){showToast('请上传通知文件');return;}
|
||||
|
||||
showToast('保存成功！');
|
||||
setTimeout(function(){window.location.href='plan-list.html';},1000);
|
||||
@@ -969,6 +1124,7 @@ document.addEventListener('click',function(e){
|
||||
if(!e.target.closest('#leaderSelect')) document.getElementById('leaderPanel').classList.remove('show');
|
||||
if(!e.target.closest('#reviewerSelect2')) document.getElementById('reviewerPanel').classList.remove('show');
|
||||
if(!e.target.closest('#deptSelect')) document.getElementById('deptPanel').classList.remove('show');
|
||||
if(!e.target.closest('#orgTreeSelect')) document.getElementById('orgTreePanel').classList.remove('show');
|
||||
});
|
||||
|
||||
/* 点击遮罩关闭员工弹窗 */
|
||||
@@ -1000,9 +1156,9 @@ document.getElementById('empModal').addEventListener('click',function(e){
|
||||
var data = editData[id];
|
||||
if(!data) return;
|
||||
|
||||
// 回显表单字段
|
||||
document.getElementById('planOrg').value = data.org;
|
||||
document.getElementById('planName').value = data.name;
|
||||
// 回显表单字段
|
||||
selectOrgOptionInner(data.org, data.org);
|
||||
document.getElementById('planName').value = data.name;
|
||||
|
||||
// 人员筛选 — 编辑时默认选中全体人员
|
||||
var radioAll = document.querySelector('input[name="personType"][value="all"]');
|
||||
|
||||
@@ -673,26 +673,34 @@ function showToast(msg){var t=document.getElementById('toast');t.textContent=msg
|
||||
|
||||
/* ===== 审核操作 ===== */
|
||||
|
||||
/* 渲染基本信息卡片 */
|
||||
function renderBasicInfoCard(row){
|
||||
var items = [
|
||||
{label:'计划名称',value:row.planName,span:4},
|
||||
{label:'姓名',value:row.name},
|
||||
{label:'员工编号',value:row.empId},
|
||||
{label:'性别',value:row.gender},
|
||||
{label:'年龄',value:row.age+' 岁'},
|
||||
{label:'身高',value:row.height+' cm'},
|
||||
{label:'所属单位',value:row.org},
|
||||
{label:'所属部门',value:row.dept},
|
||||
{label:'提交时间',value:row.submitTime}
|
||||
];
|
||||
var html='';
|
||||
items.forEach(function(item){
|
||||
var s = item.span ? ' style="grid-column:span '+item.span+'"' : '';
|
||||
html+='<div class="audit-info-card__item"'+s+'><span class="audit-info-card__label">'+item.label+'</span><span class="audit-info-card__value">'+esc(item.value)+'</span></div>';
|
||||
});
|
||||
document.getElementById('auditInfoGrid').innerHTML=html;
|
||||
}
|
||||
/* 渲染基本信息卡片 */
|
||||
function renderBasicInfoCard(row){
|
||||
var plan = plans.find(function(p){return p.id===row.planId;});
|
||||
var dateRange = '';
|
||||
if(plan){
|
||||
var f = new Date(plan.dateFrom), e = new Date(plan.dateTo);
|
||||
var totalDays = Math.ceil((e - f) / 86400000) + 1;
|
||||
dateRange = plan.dateFrom + ' ~ ' + plan.dateTo + ' (' + totalDays + '天)';
|
||||
}
|
||||
var items = [
|
||||
{label:'计划名称',value:row.planName,span:4},
|
||||
{label:'姓名',value:row.name},
|
||||
{label:'员工编号',value:row.empId},
|
||||
{label:'性别',value:row.gender},
|
||||
{label:'年龄',value:row.age+' 岁'},
|
||||
{label:'身高',value:row.height+' cm'},
|
||||
{label:'所属单位',value:row.org},
|
||||
{label:'所属部门',value:row.dept},
|
||||
{label:'提交时间',value:row.submitTime},
|
||||
{label:'活动起止日期',value:dateRange,span:2}
|
||||
];
|
||||
var html='';
|
||||
items.forEach(function(item){
|
||||
var s = item.span ? ' style="grid-column:span '+item.span+'"' : '';
|
||||
html+='<div class="audit-info-card__item"'+s+'><span class="audit-info-card__label">'+item.label+'</span><span class="audit-info-card__value">'+esc(item.value)+'</span></div>';
|
||||
});
|
||||
document.getElementById('auditInfoGrid').innerHTML=html;
|
||||
}
|
||||
|
||||
/* 渲染指标对比表 */
|
||||
function renderCmpTable(row){
|
||||
|
||||
Reference in New Issue
Block a user