feat: 健康体检检前新增签约单位应检人数页面;检中预约/实时统计页新增体检年份筛选,医院预约情况统计更名为医院预约人数统计并调整表头与筛选条件

This commit is contained in:
liuyunqin
2026-08-24 18:45:50 +08:00
parent 564dd1c1c5
commit ef2dc7dfb4
49 changed files with 330 additions and 20 deletions
+2 -1
View File
@@ -214,13 +214,14 @@ const SITE_MAP = [
{ file:'pre-special-gastro.html', label:'胃肠镜体检人员' },
{ file:'pre-special-cta.html', label:'冠脉CTA体检人员' },
{ file:'pre-special-hospital.html', label:'指定员工体检医院' },
{ file:'pre-unit-expected.html', label:'签约单位应检人数' },
{ file:'mid-appointment-track.html', label:'员工预约跟踪' },
{ file:'mid-unit-appointment.html', label:'单位预约统计' },
{ file:'mid-participation.html', label:'员工参检情况' },
{ file:'mid-hospital-realtime.html', label:'医院实时预约人数' },
{ file:'mid-doctor-realtime.html', label:'医生实时检查情况' },
{ file:'mid-doctor-count.html', label:'医生检查人数统计' },
{ file:'mid-hospital-appointment.html', label:'医院预约情况统计' },
{ file:'mid-hospital-appointment.html', label:'医院预约人数统计' },
{ file:'mid-gastro-questionnaire.html', label:'胃肠镜问卷信息' },
{ file:'post-unit-count.html', label:'单位体检人数统计' },
{ file:'post-hospital-count.html', label:'医院体检人数统计' },
@@ -111,6 +111,7 @@
<a href="archive-personal.html" class="sidebar-item active">个人体检数据</a>
<a href="archive-unit.html" class="sidebar-item">单位报表数据</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -114,6 +114,7 @@
<a href="archive-personal.html" class="sidebar-item">个人体检数据</a>
<a href="archive-unit.html" class="sidebar-item active">单位报表数据</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -181,6 +181,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -172,6 +172,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -167,6 +167,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -188,6 +188,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -201,6 +201,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -216,6 +216,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -220,6 +220,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -155,6 +155,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -121,6 +121,7 @@
<a href="exception-dirty.html" class="sidebar-item active">系统脏数据</a>
<a href="exception-result.html" class="sidebar-item">结果异常</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -123,6 +123,7 @@
<a href="exception-dirty.html" class="sidebar-item">系统脏数据</a>
<a href="exception-result.html" class="sidebar-item active">结果异常</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -143,9 +143,10 @@
<a href="mid-hospital-realtime.html" class="sidebar-item">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -115,15 +115,22 @@
<a href="mid-hospital-realtime.html" class="sidebar-item">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item active">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
<main class="main">
<!-- 筛选栏 -->
<div class="filter-bar">
<div class="filter-item">
<label>体检年份:</label>
<select class="filter-select">
<option>2024</option><option>2025</option><option selected>2026</option><option>2027</option>
</select>
</div>
<div class="filter-item">
<label>所属医院:</label>
<select class="filter-select">
@@ -115,15 +115,22 @@
<a href="mid-hospital-realtime.html" class="sidebar-item">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item active">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
<main class="main">
<!-- 筛选栏 -->
<div class="filter-bar">
<div class="filter-item">
<label>体检年份:</label>
<select class="filter-select">
<option>2024</option><option>2025</option><option selected>2026</option><option>2027</option>
</select>
</div>
<div class="filter-item">
<label>所属医院:</label>
<select class="filter-select">
@@ -110,9 +110,10 @@
<a href="mid-hospital-realtime.html" class="sidebar-item">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item active">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>健康体检 - 医院预约情况统计 | 健康CQ原型</title>
<title>健康体检 - 医院预约人数统计 | 健康CQ原型</title>
<style>
*{box-sizing:border-box;margin:0;padding:0;}
@@ -115,9 +115,10 @@
<a href="mid-hospital-realtime.html" class="sidebar-item">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item active">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item active">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -125,9 +126,15 @@
<!-- 筛选栏 -->
<div class="filter-bar">
<div class="filter-item">
<label>单位</label>
<label>体检年份</label>
<select class="filter-select">
<option>请选择</option><option>第一采油厂</option><option>第二采油厂</option><option>第三采油厂</option><option>公司机关</option>
<option>2024</option><option>2025</option><option selected>2026</option><option>2027</option>
</select>
</div>
<div class="filter-item">
<label>医院:</label>
<select class="filter-select">
<option>请选择</option><option>泾河医院</option><option>庆阳医院</option><option>延安医院</option>
</select>
</div>
<button class="btn btn-primary">
@@ -152,22 +159,18 @@
<!-- 数据表格 -->
<div class="table-card">
<div class="table-card__header">
<div class="table-card__title">医院预约情况统计</div>
<div class="table-card__title">医院预约人数统计</div>
</div>
<div class="table-card__content">
<table>
<thead>
<!-- 合并表头:已预约情况包含三个子列 -->
<tr>
<th rowspan="2">序号</th><th rowspan="2">单位</th><th rowspan="2">已选项目人数</th><th colspan="3" style="text-align:center;">已预约情况</th><th rowspan="2">未预约人数</th><th rowspan="2">体检年份</th>
</tr>
<tr>
<th>已预约人数</th><th>已参检人数</th><th>未参检人数</th>
<th>序号</th><th>医院</th><th>已选项目人数</th><th>已预约人数</th><th>未预约人数</th><th>体检年份</th>
</tr>
</thead>
<tbody>
<tr><td>1</td><td>第一采油厂</td><td>5000</td><td>4000</td><td>3000</td><td>1000</td><td>1000</td><td>2025</td></tr>
<tr><td>2</td><td>第二采油厂</td><td>5000</td><td>4000</td><td>3000</td><td>1000</td><td>1000</td><td>2025</td></tr>
<tr><td>1</td><td>泾河医院</td><td>5000</td><td>4000</td><td>1000</td><td>2025</td></tr>
<tr><td>2</td><td>庆阳医院</td><td>5000</td><td>4000</td><td>1000</td><td>2025</td></tr>
</tbody>
</table>
</div>
@@ -115,15 +115,22 @@
<a href="mid-hospital-realtime.html" class="sidebar-item active">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
<main class="main">
<!-- 筛选栏 -->
<div class="filter-bar">
<div class="filter-item">
<label>体检年份:</label>
<select class="filter-select">
<option>2024</option><option>2025</option><option selected>2026</option><option>2027</option>
</select>
</div>
<div class="filter-item">
<label>医院:</label>
<select class="filter-select">
@@ -147,9 +147,10 @@
<a href="mid-hospital-realtime.html" class="sidebar-item">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -126,9 +126,10 @@
<a href="mid-hospital-realtime.html" class="sidebar-item">医院实时预约人数</a>
<a href="mid-doctor-realtime.html" class="sidebar-item">医生实时检查情况</a>
<a href="mid-doctor-count.html" class="sidebar-item">医生检查人数统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约情况统计</a>
<a href="mid-hospital-appointment.html" class="sidebar-item">医院预约人数统计</a>
<a href="mid-gastro-questionnaire.html" class="sidebar-item">胃肠镜问卷信息</a>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -166,6 +166,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -135,6 +135,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -141,6 +141,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -162,6 +162,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
@@ -162,6 +162,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
@@ -169,6 +169,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
@@ -216,6 +216,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -216,6 +216,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -207,6 +207,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -225,6 +225,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -208,6 +208,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -179,6 +179,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
+1
View File
@@ -161,6 +161,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -154,6 +154,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -183,6 +183,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -221,6 +221,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -208,6 +208,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -224,6 +224,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item active">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -197,6 +197,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -219,6 +219,7 @@
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
@@ -0,0 +1,242 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>健康体检 - 签约单位应检人数 | 健康CQ原型</title>
<style>
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;background:#F5F7FA;color:#333;min-width:1280px;}
:root{
--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--warning:#FAAD14;--danger:#FF4D4F;
--text-primary:#333;--text-secondary:#666;--text-placeholder:#999;--border:#E8E8E8;--background:#F5F7FA;
--font-xs:11px;--font-sm:13px;--font-base:15px;--font-lg:17px;--font-xl:20px;--font-xxl:24px;
--radius-sm:4px;--radius-md:8px;--radius-lg:12px;
--shadow-sm:0 1px 4px rgba(0,0,0,0.08);--shadow-md:0 4px 12px rgba(0,0,0,0.12);
}
/* 顶部导航 */
.top-bar{display:flex;align-items:center;height:56px;background:#001529;padding:0 24px;position:fixed;top:0;left:0;right:0;z-index:100;}
.top-bar__logo{display:flex;align-items:center;gap:8px;color:#fff;font-size:var(--font-lg);font-weight:600;white-space:nowrap;width:240px;flex-shrink:0;}
.top-bar__logo svg{width:28px;height:28px;}
.top-bar__nav{display:flex;align-items:center;gap:4px;flex:1;}
.top-bar__nav a{color:rgba(255,255,255,0.65);text-decoration:none;padding:6px 16px;border-radius:var(--radius-sm);font-size:var(--font-sm);transition:all .2s;}
.top-bar__nav a:hover{color:#fff;background:rgba(255,255,255,0.08);}
.top-bar__nav a.active{color:#fff;background:var(--primary);}
.top-bar__right{display:flex;align-items:center;gap:16px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);}
.top-bar__right .btn-back{color:rgba(255,255,255,0.65);cursor:pointer;display:flex;align-items:center;gap:4px;text-decoration:none;}
.top-bar__right .btn-back:hover{color:#fff;}
.avatar{width:32px;height:32px;border-radius:50%;background:#1890FF;display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-sm);cursor:pointer;}
/* 侧边栏 */
.sidebar{position:fixed;top:56px;left:0;bottom:0;width:240px;background:#001529;overflow-y:auto;z-index:90;padding-top:8px;}
.sidebar-menu__title{color:rgba(255,255,255,0.35);font-size:var(--font-xs);padding:16px 24px 8px;text-transform:uppercase;letter-spacing:.5px;}
.sidebar-item{display:flex;align-items:center;gap:8px;padding:10px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .15s;text-decoration:none;}
.sidebar-item:hover{color:#fff;background:rgba(255,255,255,0.06);}
.sidebar-item.active{color:#fff;background:var(--primary);}
.sidebar-subgroup__header{display:flex;align-items:center;gap:6px;padding:10px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .15s;user-select:none;}
.sidebar-subgroup__header:hover{color:rgba(255,255,255,0.85);background:rgba(255,255,255,0.04);}
.sidebar-subgroup__header .arrow{width:10px;height:10px;transition:transform .2s;flex-shrink:0;}
.sidebar-subgroup__header .arrow path{stroke:rgba(255,255,255,0.45);}
.sidebar-subgroup.open>.sidebar-subgroup__header{color:rgba(255,255,255,0.85);}
.sidebar-subgroup.open>.sidebar-subgroup__header .arrow{transform:rotate(90deg);}
.sidebar-subgroup__body{display:none;padding-left:16px;}
.sidebar-subgroup.open>.sidebar-subgroup__body{display:block;}
.sidebar-subgroup__body .sidebar-item{padding-left:36px;font-size:12px;}
/* 主内容 */
.main{margin-left:240px;margin-top:56px;padding:24px;min-height:calc(100vh - 56px);}
.filter-bar{background:#fff;border-radius:var(--radius-md);padding:20px 24px;margin-bottom:16px;box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.filter-item{display:flex;align-items:center;gap:8px;}
.filter-item label{font-size:var(--font-sm);color:var(--text-secondary);white-space:nowrap;}
.filter-input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px;font-size:var(--font-sm);color:var(--text-primary);outline:none;background:#fff;min-width:200px;}
.filter-input:focus{border-color:var(--primary);}
.filter-select{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 28px 0 12px;font-size:var(--font-sm);color:var(--text-primary);outline:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E") no-repeat right 10px center;appearance:none;cursor:pointer;min-width:120px;}
.btn{height:36px;padding:0 16px;border-radius:var(--radius-sm);font-size:var(--font-sm);cursor:pointer;border:none;transition:all .2s;display:inline-flex;align-items:center;gap:6px;}
.btn-primary{background:var(--primary);color:#fff;}.btn-primary:hover{background:#40a9ff;}
.btn-default{background:#fff;color:var(--text-primary);border:1px solid var(--border);}.btn-default:hover{color:var(--primary);border-color:var(--primary);}
.table-card{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;}
.table-card__header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);}
.table-card__title{font-size:var(--font-base);font-weight:600;}
.table-card__content{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;}
.table-card__content table{min-width:100%;white-space:nowrap;}
table{width:100%;border-collapse:collapse;}
thead th{background:#FAFAFA;padding:12px 16px;text-align:left;font-size:var(--font-sm);color:var(--text-secondary);font-weight:500;border-bottom:1px solid var(--border);white-space:nowrap;}
tbody td{padding:14px 16px;font-size:var(--font-sm);color:var(--text-primary);border-bottom:1px solid var(--border);white-space:nowrap;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover{background:#F8FBFF;}
.link{color:var(--primary);cursor:pointer;font-size:var(--font-sm);}.link:hover{color:#40a9ff;}
.pagination{display:flex;align-items:center;justify-content:flex-end;padding:16px 24px;gap:8px;border-top:1px solid var(--border);}
.pagination span{font-size:var(--font-sm);color:var(--text-secondary);}
.page-btn{width:32px;height:32px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;cursor:pointer;font-size:var(--font-sm);display:inline-flex;align-items:center;justify-content:center;transition:all .2s;}
.page-btn:hover,.page-btn.active{background:var(--primary);color:#fff;border-color:var(--primary);}
</style>
</head>
<body>
<!-- 顶部导航 -->
<div class="top-bar">
<div class="top-bar__logo">
<svg viewBox="0 0 28 28" fill="none"><rect width="28" height="28" rx="6" fill="#1890FF"/><path d="M7 14h14M14 7v14" stroke="#fff" stroke-width="2.5" stroke-linecap="round"/></svg>
健康体检
</div>
<nav class="top-bar__nav">
<a href="archive-personal.html">档案</a>
<a href="config-material-notice.html">基础配置</a>
<a href="pre-hospital-scope.html" class="active">检前</a>
<a href="mid-appointment-track.html">检中</a>
<a href="post-unit-count.html">检后</a>
<a href="exception-dirty.html">异常事件</a>
</nav>
<div class="top-bar__right">
<a class="btn-back" href="../../index.html">
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M10 3L5 8l5 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
返回首页
</a>
<div class="avatar"></div>
<span style="color:rgba(255,255,255,0.65);">系统管理员 ▾</span>
</div>
</div>
<!-- 侧边栏 -->
<aside class="sidebar">
<div class="sidebar-menu__title">检前</div>
<a href="pre-hospital-scope.html" class="sidebar-item">医院承检范围配置</a>
<a href="pre-plan.html" class="sidebar-item">体检计划管理</a>
<div class="sidebar-subgroup">
<div class="sidebar-subgroup__header" onclick="toggleSubgroup(this)">
<svg class="arrow" viewBox="0 0 12 12"><path d="M4 2l4 4-4 4" fill="none" stroke-width="1.5" stroke-linecap="round"/></svg>
常规体检额度配置
</div>
<div class="sidebar-subgroup__body">
<a href="pre-quota-group.html" class="sidebar-item">群体额度</a>
<a href="pre-quota-personal.html" class="sidebar-item">个人额度</a>
</div>
</div>
<div class="sidebar-subgroup">
<div class="sidebar-subgroup__header" onclick="toggleSubgroup(this)">
<svg class="arrow" viewBox="0 0 12 12"><path d="M4 2l4 4-4 4" fill="none" stroke-width="1.5" stroke-linecap="round"/></svg>
常规体检项目配置
</div>
<div class="sidebar-subgroup__body">
<a href="pre-item-hospital-fee.html" class="sidebar-item">医院体检项目费用</a>
<a href="pre-item-unit-fee.html" class="sidebar-item">单位体检项目费用</a>
<a href="pre-item-combo-template.html" class="sidebar-item">体检项目组合模板</a>
<a href="pre-item-exception.html" class="sidebar-item">组合模板例外配置</a>
<a href="pre-item-required.html" class="sidebar-item">必检/选检项目配置</a>
</div>
</div>
<div class="sidebar-subgroup">
<div class="sidebar-subgroup__header" onclick="toggleSubgroup(this)">
<svg class="arrow" viewBox="0 0 12 12"><path d="M4 2l4 4-4 4" fill="none" stroke-width="1.5" stroke-linecap="round"/></svg>
常规体检人员配置
</div>
<div class="sidebar-subgroup__body">
<a href="pre-special-cancer.html" class="sidebar-item">防癌筛查人员</a>
<a href="pre-special-occupation.html" class="sidebar-item">职业体检人员</a>
<a href="pre-special-cta.html" class="sidebar-item">冠脉CTA体检人员</a>
<a href="pre-special-hospital.html" class="sidebar-item">指定员工体检医院</a>
</div>
</div>
<a href="pre-special-gastro.html" class="sidebar-item">胃肠镜体检人员配置</a>
<a href="pre-unit-expected.html" class="sidebar-item active">签约单位应检人数</a>
</aside>
<!-- 主内容 -->
<main class="main">
<!-- 筛选栏 -->
<div class="filter-bar">
<div class="filter-item">
<label>体检年份:</label>
<select class="filter-select" id="filter-year" style="min-width:100px;">
<option>2026</option>
<option>2025</option>
<option>2024</option>
<option>2023</option>
</select>
</div>
<div class="filter-item">
<label>单位:</label>
<select class="filter-select" style="min-width:160px;">
<option>请选择单位</option>
<option>第一采油厂</option>
<option>第二采油厂</option>
<option>第三采油厂</option>
<option>钻井公司</option>
<option>运输公司</option>
</select>
</div>
<div class="filter-item">
<label>医院:</label>
<select class="filter-select" style="min-width:160px;">
<option>请选择医院</option>
<option>延安医院</option>
<option>庆阳医院</option>
<option>兴隆园医院</option>
<option>泾河医院</option>
<option>西安市中心医院</option>
<option>陕西省人民医院</option>
<option>咸阳市中心医院</option>
<option>宝鸡市人民医院</option>
</select>
</div>
<button class="btn btn-primary">查询</button>
<button class="btn btn-default">重置</button>
</div>
<!-- 操作按钮 -->
<div style="display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap;align-items:center;">
<button class="btn btn-primary">导出列表数据</button>
<button class="btn btn-default">导出员工清单</button>
<button class="btn btn-default">查看导出任务</button>
</div>
<!-- 数据表格 -->
<div class="table-card">
<div class="table-card__header">
<div class="table-card__title">签约单位应检人数</div>
</div>
<div class="table-card__content">
<table>
<thead>
<tr>
<th>医院名称</th><th>单位</th><th>应检人数</th>
</tr>
</thead>
<tbody>
<tr><td>延安医院</td><td>第一采油厂</td><td>1268</td></tr>
<tr><td>延安医院</td><td>第二采油厂</td><td>976</td></tr>
<tr><td>庆阳医院</td><td>第三采油厂</td><td>854</td></tr>
<tr><td>兴隆园医院</td><td>钻井公司</td><td>642</td></tr>
<tr><td>泾河医院</td><td>运输公司</td><td>530</td></tr>
</tbody>
</table>
</div>
<div class="pagination">
<span>共 5 条数据</span>
<button class="page-btn active">1</button>
<span>10 条/页</span>
</div>
</div>
</main>
<script>
/* 侧边栏展开/折叠交互 */
function toggleSubgroup(header){
header.parentElement.classList.toggle('open');
}
/* 页面加载时自动展开当前页面所在的子分组 */
(function(){
var active=document.querySelector('.sidebar-item.active');
if(!active)return;
var sub=active.closest('.sidebar-subgroup');
if(sub)sub.classList.add('open');
})();
/* 体检年份默认当年 */
(function(){
var sel=document.getElementById('filter-year');
var year=String(new Date().getFullYear());
for(var i=0;i<sel.options.length;i++){
if(sel.options[i].text===year){sel.selectedIndex=i;break;}
}
})();
</script>
</body>
</html>