fix: 清理健康咨询孤岛页面，补齐PRD缺失页面描述，优化多模块原型
- 删除无入口跳转的 record-detail.html 及其截图 - PRD页面清单补入 record-detail-rated/unrated/timeout、select-record、consult-flowchart - PRD正文新增5个页面的功能说明、业务规则、交互说明 - 补充 video-detail-ongoing.jpg 截图 - 同步 index.html SITE_MAP 移除已删除页面条目 - 优化应急就医及管理端多个原型页面 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Claude Opus 4.6
@@ -0,0 +1,374 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>应急就医 - 新增AED设备 | 健康长庆原型</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);}
|
||||
|
||||
/* 顶部导航栏 */
|
||||
.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;width:240px;flex-shrink:0;white-space:nowrap;}
|
||||
.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);}
|
||||
.btn-back{color:rgba(255,255,255,0.65);cursor:pointer;display:flex;align-items:center;gap:4px;text-decoration:none;}
|
||||
.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);}
|
||||
|
||||
/* 侧边栏 */
|
||||
.sidebar{position:fixed;top:56px;left:0;bottom:0;width:240px;background:#001529;overflow-y:auto;z-index:90;}
|
||||
.sidebar-group-title{color:rgba(255,255,255,0.35);font-size:var(--font-xs);padding:16px 24px 8px;letter-spacing:.5px;}
|
||||
.sidebar-item{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;text-decoration:none;}
|
||||
.sidebar-item:hover{color:#fff;background:rgba(255,255,255,0.06);}
|
||||
.sidebar-item.active{color:#fff;background:var(--primary);}
|
||||
.sidebar-item svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-submenu{max-height:0;overflow:hidden;transition:max-height .3s ease;}
|
||||
.sidebar-submenu.open{max-height:500px;}
|
||||
.sidebar-parent{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;justify-content:space-between;}
|
||||
.sidebar-parent:hover{color:#fff;background:rgba(255,255,255,0.06);}
|
||||
.sidebar-parent.active{color:#fff;}
|
||||
.sidebar-parent__left{display:flex;align-items:center;gap:10px;}
|
||||
.sidebar-parent__left svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-parent .arrow{width:12px;height:12px;transition:transform .3s;flex-shrink:0;}
|
||||
.sidebar-parent .arrow.open{transform:rotate(90deg);}
|
||||
.sidebar-submenu .sidebar-item{padding-left:50px;font-size:var(--font-xs);}
|
||||
|
||||
/* 主内容区域 */
|
||||
.main{margin-left:240px;margin-top:56px;padding:24px;padding-bottom:80px;}
|
||||
|
||||
/* 面包屑 */
|
||||
.breadcrumb{font-size:var(--font-sm);color:var(--text-secondary);margin-bottom:16px;display:flex;align-items:center;gap:6px;}
|
||||
.breadcrumb a{color:var(--primary);text-decoration:none;}
|
||||
.breadcrumb a:hover{text-decoration:underline;}
|
||||
|
||||
/* 表单卡片 */
|
||||
.form-card{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:24px;margin-bottom:16px;}
|
||||
.form-card__title{font-size:var(--font-base);font-weight:600;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);}
|
||||
.form-row{display:flex;align-items:flex-start;gap:16px;margin-bottom:16px;}
|
||||
.form-label{width:130px;text-align:right;font-size:var(--font-sm);color:var(--text-secondary);flex-shrink:0;line-height:36px;}
|
||||
.form-label .required{color:var(--danger);margin-right:2px;}
|
||||
.form-input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px;font-size:var(--font-sm);outline:none;min-width:320px;}
|
||||
.form-input:focus{border-color:var(--primary);}
|
||||
.form-select{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 28px 0 12px;font-size:var(--font-sm);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;min-width:320px;}
|
||||
.form-select:focus{border-color:var(--primary);}
|
||||
.form-textarea{border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;font-size:var(--font-sm);outline:none;min-width:320px;resize:vertical;font-family:inherit;min-height:80px;}
|
||||
.form-textarea:focus{border-color:var(--primary);}
|
||||
.radio-group{display:flex;align-items:center;gap:20px;font-size:var(--font-sm);line-height:36px;}
|
||||
.radio-group label{display:flex;align-items:center;gap:6px;cursor:pointer;color:var(--text-primary);}
|
||||
.form-hint{font-size:var(--font-xs);color:var(--text-placeholder);margin-top:4px;}
|
||||
|
||||
/* 图片上传 */
|
||||
.upload-area{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;}
|
||||
.upload-item{width:104px;height:104px;border-radius:var(--radius-sm);overflow:hidden;position:relative;border:1px solid var(--border);}
|
||||
.upload-item img{width:100%;height:100%;object-fit:cover;}
|
||||
.upload-item__delete{position:absolute;top:2px;right:2px;width:20px;height:20px;background:rgba(0,0,0,0.5);color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;}
|
||||
.upload-btn{width:104px;height:104px;border:1px dashed var(--border);border-radius:var(--radius-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:var(--text-placeholder);font-size:var(--font-xs);gap:4px;transition:all .2s;}
|
||||
.upload-btn:hover{border-color:var(--primary);color:var(--primary);}
|
||||
.upload-btn svg{width:24px;height:24px;}
|
||||
|
||||
/* 视频上传 */
|
||||
.upload-video-btn{width:200px;height:120px;border:1px dashed var(--border);border-radius:var(--radius-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:var(--text-placeholder);font-size:var(--font-xs);gap:4px;transition:all .2s;}
|
||||
.upload-video-btn:hover{border-color:var(--primary);color:var(--primary);}
|
||||
.upload-video-btn svg{width:28px;height:28px;}
|
||||
|
||||
/* 按钮 */
|
||||
.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);}
|
||||
|
||||
/* 底部操作栏 */
|
||||
.bottom-bar{position:fixed;bottom:0;left:240px;right:0;height:60px;background:#fff;box-shadow:0 -2px 8px rgba(0,0,0,0.06);display:flex;align-items:center;justify-content:center;gap:16px;z-index:50;}
|
||||
</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="M14 6v7l5 3" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><circle cx="14" cy="14" r="8" stroke="#fff" stroke-width="2" fill="none"/></svg>
|
||||
应急就医–管理员
|
||||
</div>
|
||||
<nav class="top-bar__nav">
|
||||
<a href="archive-personal.html">档案</a>
|
||||
<a href="resource-hospital.html" class="active">应急资源</a>
|
||||
<a href="center-basic-info.html">应急中心</a>
|
||||
<a href="exception-result.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-group-title">应急资源</div>
|
||||
<a href="resource-hospital.html" class="sidebar-item">
|
||||
<svg viewBox="0 0 16 16" fill="none"><path d="M2 14V6l6-4 6 4v8" stroke="currentColor" stroke-width="1.4"/><rect x="5" y="9" width="3" height="5" rx=".5" stroke="currentColor" stroke-width="1.2"/><rect x="9" y="9" width="3" height="3" rx=".5" stroke="currentColor" stroke-width="1.2"/></svg>
|
||||
医院信息
|
||||
</a>
|
||||
<a href="resource-medical-point.html" class="sidebar-item">
|
||||
<svg viewBox="0 0 16 16" fill="none"><path d="M8 1v14M1 8h14" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/></svg>
|
||||
医疗点信息
|
||||
</a>
|
||||
<div class="sidebar-parent active" onclick="this.classList.toggle('active');this.querySelector('.arrow').classList.toggle('open');this.nextElementSibling.classList.toggle('open');">
|
||||
<span class="sidebar-parent__left">
|
||||
<svg viewBox="0 0 16 16" fill="none"><path d="M4 8l3 3 5-6" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/><rect x="1" y="1" width="14" height="14" rx="3" stroke="currentColor" stroke-width="1.4"/></svg>
|
||||
AED设备信息
|
||||
</span>
|
||||
<svg class="arrow open" viewBox="0 0 12 12" fill="none"><path d="M4.5 2l4 4-4 4" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</div>
|
||||
<div class="sidebar-submenu open">
|
||||
<a href="resource-aed.html" class="sidebar-item active">设备管理</a>
|
||||
<a href="resource-aed-deploy.html" class="sidebar-item">布点管理</a>
|
||||
<a href="resource-aed-map.html" class="sidebar-item">AED地图</a>
|
||||
<a href="resource-aed-certifier.html" class="sidebar-item">取证人员</a>
|
||||
<a href="resource-aed-maintenance.html" class="sidebar-item">维护记录</a>
|
||||
<a href="resource-aed-training.html" class="sidebar-item">培演记录</a>
|
||||
<a href="resource-aed-usage.html" class="sidebar-item">应用记录</a>
|
||||
</div>
|
||||
<a href="resource-ambulance.html" class="sidebar-item">
|
||||
<svg viewBox="0 0 16 16" fill="none"><rect x="1" y="4" width="10" height="8" rx="1" stroke="currentColor" stroke-width="1.4"/><path d="M11 7h3l1 3v2h-4" stroke="currentColor" stroke-width="1.4"/><circle cx="4" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/><circle cx="12" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/></svg>
|
||||
救护车信息
|
||||
</a>
|
||||
<a href="resource-first-aid-kit.html" class="sidebar-item">
|
||||
<svg viewBox="0 0 16 16" fill="none"><rect x="2" y="4" width="12" height="9" rx="2" stroke="currentColor" stroke-width="1.4"/><path d="M6 4V3a2 2 0 014 0v1M8 7v4M6 9h4" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>
|
||||
急救包信息
|
||||
</a>
|
||||
<a href="resource-doctor.html" class="sidebar-item">
|
||||
<svg viewBox="0 0 16 16" fill="none"><path d="M8 2a3 3 0 110 6 3 3 0 010-6zM3 14c0-2.8 2.2-5 5-5s5 2.2 5 5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/><path d="M8 6v2M7 7h2" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>
|
||||
急救医生信息
|
||||
</a>
|
||||
<a href="resource-emergency-contact.html" class="sidebar-item">
|
||||
<svg viewBox="0 0 16 16" fill="none"><path d="M11 2h3v12h-3M2 2h3v12H2" stroke="currentColor" stroke-width="1.4"/><path d="M8 5a2 2 0 110 4 2 2 0 010-4zM5 13c0-1.7 1.3-3 3-3s3 1.3 3 3" stroke="currentColor" stroke-width="1.2"/></svg>
|
||||
紧急联系人信息
|
||||
</a>
|
||||
</aside>
|
||||
|
||||
<!-- 主内容区域 -->
|
||||
<main class="main">
|
||||
<!-- 面包屑 -->
|
||||
<div class="breadcrumb">
|
||||
<a href="resource-aed.html">AED设备管理</a>
|
||||
<span>/</span>
|
||||
<span>新增AED设备</span>
|
||||
</div>
|
||||
|
||||
<!-- 基本信息 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">基本信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>设备编号</div>
|
||||
<input class="form-input" type="text" placeholder="请输入设备编号，如 AED-2025-006">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>是否对接</div>
|
||||
<div class="radio-group">
|
||||
<label><input type="radio" name="isDocked" value="yes" checked onchange="toggleDocked()"> 是</label>
|
||||
<label><input type="radio" name="isDocked" value="no" onchange="toggleDocked()"> 否</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 对接模式：下拉选择 -->
|
||||
<div class="form-row docked-select">
|
||||
<div class="form-label"><span class="required">*</span>设备厂家</div>
|
||||
<select class="form-select">
|
||||
<option value="">请选择设备厂家</option>
|
||||
<option>迈瑞</option>
|
||||
<option>飞利浦</option>
|
||||
<option>卓尔</option>
|
||||
<option>日本光电</option>
|
||||
<option>其他</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row docked-select">
|
||||
<div class="form-label"><span class="required">*</span>设备型号</div>
|
||||
<select class="form-select">
|
||||
<option value="">请选择设备型号</option>
|
||||
<option>BeneHeart C1A</option>
|
||||
<option>BeneHeart C2</option>
|
||||
<option>HeartStart FRx</option>
|
||||
<option>HeartStart HS1</option>
|
||||
<option>AED Plus</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- 非对接模式：手动输入 -->
|
||||
<div class="form-row docked-input" style="display:none;">
|
||||
<div class="form-label"><span class="required">*</span>设备厂家</div>
|
||||
<input class="form-input" type="text" placeholder="请输入设备厂家名称">
|
||||
</div>
|
||||
<div class="form-row docked-input" style="display:none;">
|
||||
<div class="form-label"><span class="required">*</span>设备型号</div>
|
||||
<input class="form-input" type="text" placeholder="请输入设备型号">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>所属单位</div>
|
||||
<select class="form-select">
|
||||
<option value="">请选择所属单位</option>
|
||||
<option>长庆油田总部</option>
|
||||
<option>第一采油厂</option>
|
||||
<option>第二采油厂</option>
|
||||
<option>第三采油厂</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>所属部门</div>
|
||||
<select class="form-select">
|
||||
<option value="">请选择所属部门</option>
|
||||
<option>安全环保部</option>
|
||||
<option>综合管理部</option>
|
||||
<option>生产运行部</option>
|
||||
<option>人力资源部</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>设备类型</div>
|
||||
<div class="radio-group">
|
||||
<label><input type="radio" name="deviceType" value="standing" checked> 立式</label>
|
||||
<label><input type="radio" name="deviceType" value="wall"> 挂式</label>
|
||||
<label><input type="radio" name="deviceType" value="vehicle"> 车载</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label">出厂日期</div>
|
||||
<input class="form-input" type="date">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>入库日期</div>
|
||||
<input class="form-input" type="date">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 设备状态 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">设备状态</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>电量</div>
|
||||
<div style="display:flex;align-items:center;gap:8px;">
|
||||
<input class="form-input" type="number" placeholder="请输入电量" style="min-width:200px;" min="0" max="100">
|
||||
<span style="font-size:var(--font-sm);color:var(--text-secondary);">%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>电极片是否完好</div>
|
||||
<div class="radio-group">
|
||||
<label><input type="radio" name="electrodeOk" value="yes" checked> 是</label>
|
||||
<label><input type="radio" name="electrodeOk" value="no"> 否</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>电池有效期</div>
|
||||
<input class="form-input" type="date">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>电极片有效期</div>
|
||||
<input class="form-input" type="date">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 摄像头信息 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">摄像头信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label">摄像头序列号</div>
|
||||
<input class="form-input" type="text" placeholder="请输入摄像头序列号">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label">摄像头验证码</div>
|
||||
<input class="form-input" type="text" placeholder="请输入摄像头验证码">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 操作资料 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">操作资料</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label">操作图片</div>
|
||||
<div>
|
||||
<div class="upload-area">
|
||||
<div class="upload-item">
|
||||
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='104'%3E%3Crect width='104' height='104' fill='%23f0f0f0'/%3E%3Ctext x='52' y='56' text-anchor='middle' fill='%23999' font-size='12'%3EAED操作1%3C/text%3E%3C/svg%3E" alt="操作图片1">
|
||||
<button class="upload-item__delete">×</button>
|
||||
</div>
|
||||
<div class="upload-btn">
|
||||
<svg viewBox="0 0 24 24" fill="none"><path d="M12 5v14M5 12h14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
上传图片
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-hint">支持 JPG/PNG 格式，单张不超过 5MB，最多上传 9 张</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label">操作视频</div>
|
||||
<div>
|
||||
<div class="upload-video-btn">
|
||||
<svg viewBox="0 0 28 28" fill="none"><rect x="2" y="5" width="24" height="18" rx="3" stroke="currentColor" stroke-width="1.5"/><path d="M11 10l7 4-7 4V10z" fill="currentColor" opacity=".4"/></svg>
|
||||
上传视频
|
||||
</div>
|
||||
<div class="form-hint">支持 MP4/MOV 格式，不超过 200MB</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label">免责声明</div>
|
||||
<div>
|
||||
<div class="upload-video-btn">
|
||||
<svg viewBox="0 0 28 28" fill="none"><rect x="2" y="5" width="24" height="18" rx="3" stroke="currentColor" stroke-width="1.5"/><path d="M11 10l7 4-7 4V10z" fill="currentColor" opacity=".4"/></svg>
|
||||
上传文件
|
||||
</div>
|
||||
<div class="form-hint">支持 DOC和PDF 格式，不超过 20MB</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 管理信息 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">管理信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>管理部门</div>
|
||||
<select class="form-select">
|
||||
<option value="">请选择管理部门</option>
|
||||
<option>安全环保部</option>
|
||||
<option>综合管理部</option>
|
||||
<option>生产运行部</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>管理人</div>
|
||||
<input class="form-input" type="text" placeholder="请输入管理人姓名">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>管理人电话</div>
|
||||
<input class="form-input" type="tel" placeholder="请输入管理人联系电话">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>厂家电话</div>
|
||||
<input class="form-input" type="tel" placeholder="请输入厂家联系电话">
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 底部操作栏 -->
|
||||
<div class="bottom-bar">
|
||||
<button class="btn btn-primary" onclick="alert('提交成功！');location.href='resource-aed.html';">提 交</button>
|
||||
<button class="btn btn-default" onclick="location.href='resource-aed.html';">取 消</button>
|
||||
</div>
|
||||
<script>
|
||||
function toggleDocked(){
|
||||
var isDocked=document.querySelector('input[name="isDocked"]:checked').value==='yes';
|
||||
document.querySelectorAll('.docked-select').forEach(function(el){el.style.display=isDocked?'flex':'none';});
|
||||
document.querySelectorAll('.docked-input').forEach(function(el){el.style.display=isDocked?'none':'flex';});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,238 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>应急就医 - AED设备信息 - 新增取证人员 | 健康长庆原型</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);}
|
||||
.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;width:240px;flex-shrink:0;white-space:nowrap;}
|
||||
.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);}
|
||||
.btn-back{color:rgba(255,255,255,0.65);cursor:pointer;display:flex;align-items:center;gap:4px;text-decoration:none;}
|
||||
.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);}
|
||||
.sidebar{position:fixed;top:56px;left:0;bottom:0;width:240px;background:#001529;overflow-y:auto;z-index:90;}
|
||||
.sidebar-group-title{color:rgba(255,255,255,0.35);font-size:var(--font-xs);padding:16px 24px 8px;letter-spacing:.5px;}
|
||||
.sidebar-item{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;text-decoration:none;}
|
||||
.sidebar-item:hover{color:#fff;background:rgba(255,255,255,0.06);}
|
||||
.sidebar-item.active{color:#fff;background:var(--primary);}
|
||||
.sidebar-item svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-submenu{max-height:0;overflow:hidden;transition:max-height .3s ease;}
|
||||
.sidebar-submenu.open{max-height:500px;}
|
||||
.sidebar-parent{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;justify-content:space-between;}
|
||||
.sidebar-parent:hover{color:#fff;background:rgba(255,255,255,0.06);}
|
||||
.sidebar-parent.active{color:#fff;}
|
||||
.sidebar-parent__left{display:flex;align-items:center;gap:10px;}
|
||||
.sidebar-parent__left svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-parent .arrow{width:12px;height:12px;transition:transform .3s;flex-shrink:0;}
|
||||
.sidebar-parent .arrow.open{transform:rotate(90deg);}
|
||||
.sidebar-submenu .sidebar-item{padding-left:50px;font-size:var(--font-xs);}
|
||||
.main{margin-left:240px;margin-top:56px;padding:24px;padding-bottom:80px;}
|
||||
.breadcrumb{font-size:var(--font-sm);color:var(--text-secondary);margin-bottom:16px;display:flex;align-items:center;gap:6px;}
|
||||
.breadcrumb a{color:var(--primary);text-decoration:none;}
|
||||
.breadcrumb a:hover{text-decoration:underline;}
|
||||
.form-card{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:24px;margin-bottom:16px;}
|
||||
.form-card__title{font-size:var(--font-base);font-weight:600;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);}
|
||||
.form-row{display:flex;align-items:flex-start;gap:16px;margin-bottom:16px;}
|
||||
.form-label{width:130px;text-align:right;font-size:var(--font-sm);color:var(--text-secondary);flex-shrink:0;line-height:36px;}
|
||||
.form-label .required{color:var(--danger);margin-right:2px;}
|
||||
.form-input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px;font-size:var(--font-sm);outline:none;min-width:320px;}
|
||||
.form-input:focus{border-color:var(--primary);}
|
||||
.form-select{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 28px 0 12px;font-size:var(--font-sm);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;min-width:320px;}
|
||||
.search-select{position:relative;min-width:320px;}
|
||||
.search-select__input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 32px 0 12px;font-size:var(--font-sm);outline:none;width:100%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M10 10l3 3M6.5 2a4.5 4.5 0 110 9 4.5 4.5 0 010-9z' stroke='%23999' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 10px center;}
|
||||
.search-select__input:focus{border-color:var(--primary);}
|
||||
.search-select__dropdown{position:absolute;top:40px;left:0;right:0;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:0 4px 12px rgba(0,0,0,0.1);z-index:10;max-height:220px;overflow-y:auto;display:none;}
|
||||
.search-select__item{padding:10px 12px;font-size:var(--font-sm);cursor:pointer;transition:background .15s;display:flex;justify-content:space-between;align-items:center;}
|
||||
.search-select__item:hover{background:var(--primary-light);}
|
||||
.search-select__item-name{font-weight:500;color:var(--text-primary);}
|
||||
.search-select__item-info{color:var(--text-placeholder);font-size:var(--font-xs);}
|
||||
.emp-card{background:var(--primary-light);border:1px solid #91d5ff;border-radius:var(--radius-md);padding:16px;margin-top:12px;display:none;}
|
||||
.emp-card__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;}
|
||||
.emp-card__item{font-size:var(--font-sm);}
|
||||
.emp-card__label{color:var(--text-placeholder);font-size:var(--font-xs);margin-bottom:2px;}
|
||||
.emp-card__value{color:var(--text-primary);}
|
||||
.form-select:focus{border-color:var(--primary);}
|
||||
.upload-area{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;}
|
||||
.upload-btn{width:104px;height:104px;border:1px dashed var(--border);border-radius:var(--radius-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:var(--text-placeholder);font-size:var(--font-xs);gap:4px;transition:all .2s;}
|
||||
.upload-btn:hover{border-color:var(--primary);color:var(--primary);}
|
||||
.upload-btn svg{width:24px;height:24px;}
|
||||
.upload-item{width:104px;height:104px;border-radius:var(--radius-sm);overflow:hidden;position:relative;border:1px solid var(--border);}
|
||||
.upload-item img{width:100%;height:100%;object-fit:cover;}
|
||||
.upload-item__delete{position:absolute;top:2px;right:2px;width:20px;height:20px;background:rgba(0,0,0,0.5);color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;}
|
||||
.form-hint{font-size:var(--font-xs);color:var(--text-placeholder);margin-top:4px;}
|
||||
.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);}
|
||||
.bottom-bar{position:fixed;bottom:0;left:240px;right:0;height:60px;background:#fff;box-shadow:0 -2px 8px rgba(0,0,0,0.06);display:flex;align-items:center;justify-content:center;gap:16px;z-index:50;}
|
||||
</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="M14 6v7l5 3" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><circle cx="14" cy="14" r="8" stroke="#fff" stroke-width="2" fill="none"/></svg>
|
||||
应急就医–管理员
|
||||
</div>
|
||||
<nav class="top-bar__nav">
|
||||
<a href="archive-personal.html">档案</a>
|
||||
<a href="resource-hospital.html" class="active">应急资源</a>
|
||||
<a href="center-basic-info.html">应急中心</a>
|
||||
<a href="exception-result.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-group-title">应急资源</div>
|
||||
<a href="resource-hospital.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M2 14V6l6-4 6 4v8" stroke="currentColor" stroke-width="1.4"/><rect x="5" y="9" width="3" height="5" rx=".5" stroke="currentColor" stroke-width="1.2"/><rect x="9" y="9" width="3" height="3" rx=".5" stroke="currentColor" stroke-width="1.2"/></svg>医院信息</a>
|
||||
<a href="resource-medical-point.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M8 1v14M1 8h14" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/></svg>医疗点信息</a>
|
||||
<div class="sidebar-parent active" onclick="this.classList.toggle('active');this.querySelector('.arrow').classList.toggle('open');this.nextElementSibling.classList.toggle('open');">
|
||||
<span class="sidebar-parent__left"><svg viewBox="0 0 16 16" fill="none"><path d="M4 8l3 3 5-6" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/><rect x="1" y="1" width="14" height="14" rx="3" stroke="currentColor" stroke-width="1.4"/></svg>AED设备信息</span>
|
||||
<svg class="arrow open" viewBox="0 0 12 12" fill="none"><path d="M4.5 2l4 4-4 4" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</div>
|
||||
<div class="sidebar-submenu open">
|
||||
<a href="resource-aed.html" class="sidebar-item">设备管理</a>
|
||||
<a href="resource-aed-deploy.html" class="sidebar-item">布点管理</a>
|
||||
<a href="resource-aed-map.html" class="sidebar-item">AED地图</a>
|
||||
<a href="resource-aed-certifier.html" class="sidebar-item active">取证人员</a>
|
||||
<a href="resource-aed-maintenance.html" class="sidebar-item">维护记录</a>
|
||||
<a href="resource-aed-training.html" class="sidebar-item">培演记录</a>
|
||||
<a href="resource-aed-usage.html" class="sidebar-item">应用记录</a>
|
||||
</div>
|
||||
<a href="resource-ambulance.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><rect x="1" y="4" width="10" height="8" rx="1" stroke="currentColor" stroke-width="1.4"/><path d="M11 7h3l1 3v2h-4" stroke="currentColor" stroke-width="1.4"/><circle cx="4" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/><circle cx="12" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/></svg>救护车信息</a>
|
||||
<a href="resource-first-aid-kit.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><rect x="2" y="4" width="12" height="9" rx="2" stroke="currentColor" stroke-width="1.4"/><path d="M6 4V3a2 2 0 014 0v1M8 7v4M6 9h4" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>急救包信息</a>
|
||||
<a href="resource-doctor.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M8 2a3 3 0 110 6 3 3 0 010-6zM3 14c0-2.8 2.2-5 5-5s5 2.2 5 5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/><path d="M8 6v2M7 7h2" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>急救医生信息</a>
|
||||
<a href="resource-emergency-contact.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M11 2h3v12h-3M2 2h3v12H2" stroke="currentColor" stroke-width="1.4"/><path d="M8 5a2 2 0 110 4 2 2 0 010-4zM5 13c0-1.7 1.3-3 3-3s3 1.3 3 3" stroke="currentColor" stroke-width="1.2"/></svg>紧急联系人信息</a>
|
||||
</aside>
|
||||
|
||||
<!-- 主内容区域 -->
|
||||
<main class="main">
|
||||
<div class="breadcrumb">
|
||||
<a href="resource-aed-certifier.html">取证人员</a>
|
||||
<span>/</span>
|
||||
<span>新增取证人员</span>
|
||||
</div>
|
||||
|
||||
<!-- 人员信息 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">人员信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>选择员工</div>
|
||||
<div>
|
||||
<div class="search-select" id="empSearch">
|
||||
<input class="search-select__input" type="text" placeholder="输入员工姓名或工号搜索" onfocus="document.getElementById('empDropdown').style.display='block'" oninput="filterEmp(this.value)">
|
||||
<div class="search-select__dropdown" id="empDropdown">
|
||||
<div class="search-select__item" onclick="selectEmp('张明','EMP-10021','长庆油田总部 / 安全环保部','138****1001')"><span class="search-select__item-name">张明</span><span class="search-select__item-info">EMP-10021 · 安全环保部</span></div>
|
||||
<div class="search-select__item" onclick="selectEmp('李华','EMP-10035','长庆油田总部 / 综合管理部','139****2002')"><span class="search-select__item-name">李华</span><span class="search-select__item-info">EMP-10035 · 综合管理部</span></div>
|
||||
<div class="search-select__item" onclick="selectEmp('王强','EMP-20018','第一采油厂 / 生产运行部','137****3003')"><span class="search-select__item-name">王强</span><span class="search-select__item-info">EMP-20018 · 生产运行部</span></div>
|
||||
<div class="search-select__item" onclick="selectEmp('赵丽','EMP-30042','第二采油厂 / 安全环保部','136****4004')"><span class="search-select__item-name">赵丽</span><span class="search-select__item-info">EMP-30042 · 安全环保部</span></div>
|
||||
<div class="search-select__item" onclick="selectEmp('陈伟','EMP-40056','第三采油厂 / 综合管理部','135****5005')"><span class="search-select__item-name">陈伟</span><span class="search-select__item-info">EMP-40056 · 综合管理部</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="emp-card" id="empCard">
|
||||
<div class="emp-card__grid">
|
||||
<div class="emp-card__item"><div class="emp-card__label">姓名</div><div class="emp-card__value" id="empName">—</div></div>
|
||||
<div class="emp-card__item"><div class="emp-card__label">员工编号</div><div class="emp-card__value" id="empNo">—</div></div>
|
||||
<div class="emp-card__item"><div class="emp-card__label">所属单位部门</div><div class="emp-card__value" id="empDept">—</div></div>
|
||||
<div class="emp-card__item"><div class="emp-card__label">联系电话</div><div class="emp-card__value" id="empPhone">—</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 证书信息 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">证书信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>证书编号</div>
|
||||
<input class="form-input" type="text" placeholder="请输入证书编号">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>证书类型</div>
|
||||
<select class="form-select">
|
||||
<option value="">请选择证书类型</option>
|
||||
<option>红十字救护员</option>
|
||||
<option>AHA急救证书</option>
|
||||
<option>EFR急救证书</option>
|
||||
<option>其他</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>发证机构</div>
|
||||
<select class="form-select">
|
||||
<option value="">请选择发证机构</option>
|
||||
<option>中国红十字会</option>
|
||||
<option>美国心脏协会(AHA)</option>
|
||||
<option>其他</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>取证日期</div>
|
||||
<input class="form-input" type="date">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>有效期至</div>
|
||||
<input class="form-input" type="date">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>证书照片</div>
|
||||
<div>
|
||||
<div class="upload-area">
|
||||
<div class="upload-btn">
|
||||
<svg viewBox="0 0 24 24" fill="none"><path d="M12 5v14M5 12h14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>
|
||||
上传照片
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-hint">支持 JPG/PNG 格式，单张不超过 5MB</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 底部操作栏 -->
|
||||
<div class="bottom-bar">
|
||||
<button class="btn btn-primary" onclick="alert('新增成功！');location.href='resource-aed-certifier.html';">提 交</button>
|
||||
<button class="btn btn-default" onclick="location.href='resource-aed-certifier.html';">取 消</button>
|
||||
</div>
|
||||
<script>
|
||||
function filterEmp(val){
|
||||
var dd=document.getElementById('empDropdown');
|
||||
dd.style.display='block';
|
||||
dd.querySelectorAll('.search-select__item').forEach(function(item){
|
||||
var match=!val||item.textContent.toLowerCase().indexOf(val.toLowerCase())>-1;
|
||||
item.style.display=match?'flex':'none';
|
||||
});
|
||||
}
|
||||
function selectEmp(name,no,dept,phone){
|
||||
document.querySelector('.search-select__input').value=name+' ('+no+')';
|
||||
document.getElementById('empDropdown').style.display='none';
|
||||
var card=document.getElementById('empCard');
|
||||
card.style.display='block';
|
||||
document.getElementById('empName').textContent=name;
|
||||
document.getElementById('empNo').textContent=no;
|
||||
document.getElementById('empDept').textContent=dept;
|
||||
document.getElementById('empPhone').textContent=phone;
|
||||
}
|
||||
document.addEventListener('click',function(e){
|
||||
if(!document.getElementById('empSearch').contains(e.target))
|
||||
document.getElementById('empDropdown').style.display='none';
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -173,7 +173,7 @@
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<div style="display:flex;gap:12px;margin-bottom:16px;">
|
||||
<button class="btn btn-primary">
|
||||
<button class="btn btn-primary" onclick="location.href='resource-aed-certifier-add.html';">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 2v10M2 7h10" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
|
||||
新增取证人员
|
||||
</button>
|
||||
|
||||
@@ -0,0 +1,295 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>应急就医 - AED设备信息 - 新增布点 | 健康长庆原型</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);}
|
||||
|
||||
/* 顶部导航栏 */
|
||||
.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;width:240px;flex-shrink:0;white-space:nowrap;}
|
||||
.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);}
|
||||
.btn-back{color:rgba(255,255,255,0.65);cursor:pointer;display:flex;align-items:center;gap:4px;text-decoration:none;}
|
||||
.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);}
|
||||
|
||||
/* 侧边栏 */
|
||||
.sidebar{position:fixed;top:56px;left:0;bottom:0;width:240px;background:#001529;overflow-y:auto;z-index:90;}
|
||||
.sidebar-group-title{color:rgba(255,255,255,0.35);font-size:var(--font-xs);padding:16px 24px 8px;letter-spacing:.5px;}
|
||||
.sidebar-item{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;text-decoration:none;}
|
||||
.sidebar-item:hover{color:#fff;background:rgba(255,255,255,0.06);}
|
||||
.sidebar-item.active{color:#fff;background:var(--primary);}
|
||||
.sidebar-item svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-submenu{max-height:0;overflow:hidden;transition:max-height .3s ease;}
|
||||
.sidebar-submenu.open{max-height:500px;}
|
||||
.sidebar-parent{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;justify-content:space-between;}
|
||||
.sidebar-parent:hover{color:#fff;background:rgba(255,255,255,0.06);}
|
||||
.sidebar-parent.active{color:#fff;}
|
||||
.sidebar-parent__left{display:flex;align-items:center;gap:10px;}
|
||||
.sidebar-parent__left svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-parent .arrow{width:12px;height:12px;transition:transform .3s;flex-shrink:0;}
|
||||
.sidebar-parent .arrow.open{transform:rotate(90deg);}
|
||||
.sidebar-submenu .sidebar-item{padding-left:50px;font-size:var(--font-xs);}
|
||||
|
||||
/* 主内容区域 */
|
||||
.main{margin-left:240px;margin-top:56px;padding:24px;}
|
||||
|
||||
/* 筛选栏 */
|
||||
.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);outline:none;background:#fff;min-width:180px;}
|
||||
.filter-select{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 28px 0 12px;font-size:var(--font-sm);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;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;}
|
||||
.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);border-bottom:1px solid var(--border);white-space:nowrap;}
|
||||
tbody tr:last-child td{border-bottom:none;}
|
||||
tbody tr:hover{background:#F8FBFF;}
|
||||
.tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:10px;font-size:var(--font-xs);}
|
||||
.tag-green{background:#F6FFED;color:var(--success);}
|
||||
.tag-red{background:#FFF1F0;color:var(--danger);}
|
||||
.tag-orange{background:#FFF7E6;color:#FA8C16;}
|
||||
.tag-gray{background:#F5F5F5;color:var(--text-secondary);}
|
||||
.action-btns{display:flex;gap:8px;align-items:center;}
|
||||
.link{color:var(--primary);cursor:pointer;font-size:var(--font-sm);text-decoration:none;}
|
||||
.link:hover{color:#40a9ff;}
|
||||
.link-danger{color:var(--danger);cursor:pointer;font-size:var(--font-sm);}
|
||||
.link-danger:hover{color:#ff7875;}
|
||||
.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);}
|
||||
.thumb{width:60px;height:40px;border-radius:var(--radius-sm);object-fit:cover;background:#f0f0f0;border:1px solid var(--border);}
|
||||
|
||||
/* 抽屉遮罩 */
|
||||
.drawer-mask{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.45);z-index:200;}
|
||||
/* 抽屉 */
|
||||
.drawer{position:fixed;top:0;right:0;bottom:0;width:640px;background:#fff;z-index:210;display:flex;flex-direction:column;box-shadow:-4px 0 24px rgba(0,0,0,0.15);animation:slideIn .3s ease;}
|
||||
@keyframes slideIn{from{transform:translateX(100%);}to{transform:translateX(0);}}
|
||||
.drawer__header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);flex-shrink:0;}
|
||||
.drawer__title{font-size:var(--font-lg);font-weight:600;}
|
||||
.drawer__close{width:32px;height:32px;border:none;background:none;cursor:pointer;font-size:18px;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:all .2s;}
|
||||
.drawer__close:hover{background:#f5f5f5;color:var(--text-primary);}
|
||||
.drawer__body{flex:1;overflow-y:auto;padding:24px;}
|
||||
.drawer__footer{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 24px;border-top:1px solid var(--border);flex-shrink:0;}
|
||||
/* 抽屉表单 */
|
||||
.form-row{display:flex;align-items:flex-start;gap:12px;margin-bottom:20px;}
|
||||
.form-label{width:100px;text-align:right;font-size:var(--font-sm);color:var(--text-secondary);flex-shrink:0;line-height:36px;}
|
||||
.form-label .required{color:var(--danger);margin-right:2px;}
|
||||
.form-input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px;font-size:var(--font-sm);outline:none;width:100%;}
|
||||
.form-input:focus{border-color:var(--primary);}
|
||||
.form-control{flex:1;min-width:0;}
|
||||
.search-select{position:relative;}
|
||||
.search-select__input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 32px 0 12px;font-size:var(--font-sm);outline:none;width:100%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M10 10l3 3M6.5 2a4.5 4.5 0 110 9 4.5 4.5 0 010-9z' stroke='%23999' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 10px center;}
|
||||
.search-select__input:focus{border-color:var(--primary);}
|
||||
.search-select__dropdown{position:absolute;top:40px;left:0;right:0;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:0 4px 12px rgba(0,0,0,0.1);z-index:10;max-height:200px;overflow-y:auto;}
|
||||
.search-select__item{padding:10px 12px;font-size:var(--font-sm);cursor:pointer;transition:background .15s;display:flex;justify-content:space-between;align-items:center;}
|
||||
.search-select__item:hover{background:var(--primary-light);}
|
||||
.search-select__item-id{font-weight:500;color:var(--text-primary);}
|
||||
.search-select__item-info{color:var(--text-placeholder);font-size:var(--font-xs);}
|
||||
.device-card{background:var(--primary-light);border:1px solid #91d5ff;border-radius:var(--radius-md);padding:16px;margin-top:8px;}
|
||||
.device-card__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;}
|
||||
.device-card__item{font-size:var(--font-sm);}
|
||||
.device-card__label{color:var(--text-placeholder);font-size:var(--font-xs);margin-bottom:2px;}
|
||||
.device-card__value{color:var(--text-primary);}
|
||||
.map-picker{width:100%;height:200px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#e6f7ff;display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:var(--font-sm);gap:6px;cursor:pointer;position:relative;overflow:hidden;transition:border-color .2s;}
|
||||
.map-picker:hover{border-color:var(--primary);}
|
||||
.map-picker__bg{position:absolute;inset:0;opacity:.15;background:repeating-linear-gradient(0deg,transparent,transparent 19px,#91d5ff 19px,#91d5ff 20px),repeating-linear-gradient(90deg,transparent,transparent 19px,#91d5ff 19px,#91d5ff 20px);}
|
||||
.map-picker__pin{position:absolute;top:50%;left:50%;transform:translate(-50%,-100%);z-index:2;}
|
||||
.map-picker__label{position:relative;z-index:2;display:flex;align-items:center;gap:6px;}
|
||||
.map-picker--selected .map-picker__label{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,0.9);padding:4px 12px;border-radius:12px;font-size:var(--font-xs);box-shadow:0 1px 4px rgba(0,0,0,0.1);}
|
||||
.divider{height:1px;background:var(--border);margin:4px 0 20px;}
|
||||
</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="M14 6v7l5 3" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><circle cx="14" cy="14" r="8" stroke="#fff" stroke-width="2" fill="none"/></svg>
|
||||
应急就医–管理员
|
||||
</div>
|
||||
<nav class="top-bar__nav">
|
||||
<a href="archive-personal.html">档案</a>
|
||||
<a href="resource-hospital.html" class="active">应急资源</a>
|
||||
<a href="center-basic-info.html">应急中心</a>
|
||||
<a href="exception-result.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-group-title">应急资源</div>
|
||||
<a href="resource-hospital.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M2 14V6l6-4 6 4v8" stroke="currentColor" stroke-width="1.4"/><rect x="5" y="9" width="3" height="5" rx=".5" stroke="currentColor" stroke-width="1.2"/><rect x="9" y="9" width="3" height="3" rx=".5" stroke="currentColor" stroke-width="1.2"/></svg>医院信息</a>
|
||||
<a href="resource-medical-point.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M8 1v14M1 8h14" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/></svg>医疗点信息</a>
|
||||
<div class="sidebar-parent active" onclick="this.classList.toggle('active');this.querySelector('.arrow').classList.toggle('open');this.nextElementSibling.classList.toggle('open');">
|
||||
<span class="sidebar-parent__left"><svg viewBox="0 0 16 16" fill="none"><path d="M4 8l3 3 5-6" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/><rect x="1" y="1" width="14" height="14" rx="3" stroke="currentColor" stroke-width="1.4"/></svg>AED设备信息</span>
|
||||
<svg class="arrow open" viewBox="0 0 12 12" fill="none"><path d="M4.5 2l4 4-4 4" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</div>
|
||||
<div class="sidebar-submenu open">
|
||||
<a href="resource-aed.html" class="sidebar-item">设备管理</a>
|
||||
<a href="resource-aed-deploy.html" class="sidebar-item active">布点管理</a>
|
||||
<a href="resource-aed-map.html" class="sidebar-item">AED地图</a>
|
||||
<a href="resource-aed-certifier.html" class="sidebar-item">取证人员</a>
|
||||
<a href="resource-aed-maintenance.html" class="sidebar-item">维护记录</a>
|
||||
<a href="resource-aed-training.html" class="sidebar-item">培演记录</a>
|
||||
<a href="resource-aed-usage.html" class="sidebar-item">应用记录</a>
|
||||
</div>
|
||||
<a href="resource-ambulance.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><rect x="1" y="4" width="10" height="8" rx="1" stroke="currentColor" stroke-width="1.4"/><path d="M11 7h3l1 3v2h-4" stroke="currentColor" stroke-width="1.4"/><circle cx="4" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/><circle cx="12" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/></svg>救护车信息</a>
|
||||
<a href="resource-first-aid-kit.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><rect x="2" y="4" width="12" height="9" rx="2" stroke="currentColor" stroke-width="1.4"/><path d="M6 4V3a2 2 0 014 0v1M8 7v4M6 9h4" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>急救包信息</a>
|
||||
<a href="resource-doctor.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M8 2a3 3 0 110 6 3 3 0 010-6zM3 14c0-2.8 2.2-5 5-5s5 2.2 5 5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/><path d="M8 6v2M7 7h2" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>急救医生信息</a>
|
||||
<a href="resource-emergency-contact.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M11 2h3v12h-3M2 2h3v12H2" stroke="currentColor" stroke-width="1.4"/><path d="M8 5a2 2 0 110 4 2 2 0 010-4zM5 13c0-1.7 1.3-3 3-3s3 1.3 3 3" stroke="currentColor" stroke-width="1.2"/></svg>紧急联系人信息</a>
|
||||
</aside>
|
||||
|
||||
<!-- 主内容（布点管理列表页） -->
|
||||
<main class="main">
|
||||
<div class="filter-bar">
|
||||
<div class="filter-item"><label>设备编号：</label><input class="filter-input" type="text" placeholder="请输入设备编号"></div>
|
||||
<div class="filter-item"><label>单位部门：</label><select class="filter-select"><option>全部单位</option><option>长庆油田总部</option><option>第一采油厂</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">查询</button>
|
||||
<button class="btn btn-default">重置</button>
|
||||
</div>
|
||||
<div style="display:flex;gap:12px;margin-bottom:16px;">
|
||||
<button class="btn btn-primary" onclick="location.href='resource-aed-deploy-add.html';"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 2v10M2 7h10" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>新增布点</button>
|
||||
<button class="btn btn-default"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 10v2h10v-2M7 2v7M4.5 6.5L7 9l2.5-2.5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>批量导入</button>
|
||||
<button class="btn btn-default"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 4v-2h10v2M7 12V5M4.5 7.5L7 5l2.5 2.5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>导出列表数据</button>
|
||||
</div>
|
||||
<div class="table-card">
|
||||
<div class="table-card__header">
|
||||
<div class="table-card__title">布点管理列表</div>
|
||||
<div style="font-size:var(--font-sm);color:var(--text-secondary);">共 28 条</div>
|
||||
</div>
|
||||
<div class="table-card__content">
|
||||
<table>
|
||||
<thead><tr><th>序号</th><th>设备编号</th><th>设备厂家</th><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 style="font-weight:500;">AED-2025-001</td><td>迈瑞</td><td>BeneHeart C1A</td><td>长庆油田总部</td><td>总部办公楼1层大厅</td><td><div class="thumb" style="display:inline-flex;align-items:center;justify-content:center;color:var(--text-placeholder);font-size:10px;">图片</div></td><td><span class="tag tag-green">正常</span></td><td>95%</td><td>张明</td><td>138****1001</td><td><div class="action-btns"><span class="link">详情</span><span class="link">编辑</span><span class="link-danger">删除</span></div></td></tr>
|
||||
<tr><td>2</td><td style="font-weight:500;">AED-2025-002</td><td>飞利浦</td><td>HeartStart FRx</td><td>长庆油田总部</td><td>职工食堂入口处</td><td><div class="thumb" style="display:inline-flex;align-items:center;justify-content:center;color:var(--text-placeholder);font-size:10px;">图片</div></td><td><span class="tag tag-green">正常</span></td><td>88%</td><td>李华</td><td>139****2002</td><td><div class="action-btns"><span class="link">详情</span><span class="link">编辑</span><span class="link-danger">删除</span></div></td></tr>
|
||||
<tr><td>3</td><td style="font-weight:500;">AED-2025-003</td><td>迈瑞</td><td>BeneHeart C2</td><td>第一采油厂</td><td>调度中心1层</td><td><div class="thumb" style="display:inline-flex;align-items:center;justify-content:center;color:var(--text-placeholder);font-size:10px;">图片</div></td><td><span class="tag tag-red">异常</span></td><td>12%</td><td>王强</td><td>137****3003</td><td><div class="action-btns"><span class="link">详情</span><span class="link">编辑</span><span class="link-danger">删除</span></div></td></tr>
|
||||
<tr><td>4</td><td style="font-weight:500;">AED-2025-004</td><td>卓尔</td><td>AED Plus</td><td>第二采油厂</td><td>值班室门口</td><td><div class="thumb" style="display:inline-flex;align-items:center;justify-content:center;color:var(--text-placeholder);font-size:10px;">图片</div></td><td><span class="tag tag-orange">维修中</span></td><td>0%</td><td>赵丽</td><td>136****4004</td><td><div class="action-btns"><span class="link">详情</span><span class="link">编辑</span><span class="link-danger">删除</span></div></td></tr>
|
||||
<tr><td>5</td><td style="font-weight:500;">AED-2025-005</td><td>飞利浦</td><td>HeartStart HS1</td><td>第三采油厂</td><td>体育馆入口</td><td><div class="thumb" style="display:inline-flex;align-items:center;justify-content:center;color:var(--text-placeholder);font-size:10px;">图片</div></td><td><span class="tag tag-green">正常</span></td><td>76%</td><td>陈伟</td><td>135****5005</td><td><div class="action-btns"><span class="link">详情</span><span class="link">编辑</span><span class="link-danger">删除</span></div></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="pagination">
|
||||
<span>共 28 条</span>
|
||||
<button class="page-btn">‹</button><button class="page-btn active">1</button><button class="page-btn">2</button><button class="page-btn">3</button><button class="page-btn">›</button>
|
||||
<select class="filter-select" style="min-width:70px;height:32px;"><option>10条/页</option><option>20条/页</option></select>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 抽屉遮罩 -->
|
||||
<div class="drawer-mask" onclick="location.href='resource-aed-deploy.html';"></div>
|
||||
|
||||
<!-- 右侧抽屉 -->
|
||||
<div class="drawer">
|
||||
<div class="drawer__header">
|
||||
<div class="drawer__title">新增布点</div>
|
||||
<button class="drawer__close" onclick="location.href='resource-aed-deploy.html';">×</button>
|
||||
</div>
|
||||
<div class="drawer__body">
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>选择设备</div>
|
||||
<div class="form-control">
|
||||
<div class="search-select" id="deviceSearch">
|
||||
<input class="search-select__input" type="text" placeholder="输入设备编号搜索未布点设备" onfocus="showDropdown()" oninput="filterDevices(this.value)">
|
||||
<div class="search-select__dropdown" id="deviceDropdown" style="display:none;">
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-006','迈瑞','BeneHeart C1A','长庆油田总部')"><span class="search-select__item-id">AED-2025-006</span><span class="search-select__item-info">迈瑞 · BeneHeart C1A</span></div>
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-007','飞利浦','HeartStart FRx','第一采油厂')"><span class="search-select__item-id">AED-2025-007</span><span class="search-select__item-info">飞利浦 · HeartStart FRx</span></div>
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-008','卓尔','AED Plus','第二采油厂')"><span class="search-select__item-id">AED-2025-008</span><span class="search-select__item-info">卓尔 · AED Plus</span></div>
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-009','迈瑞','BeneHeart C2','第三采油厂')"><span class="search-select__item-id">AED-2025-009</span><span class="search-select__item-info">迈瑞 · BeneHeart C2</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-card" id="deviceCard" style="display:none;">
|
||||
<div class="device-card__grid">
|
||||
<div class="device-card__item"><div class="device-card__label">设备编号</div><div class="device-card__value" id="cardNo">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">设备厂家</div><div class="device-card__value" id="cardVendor">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">设备型号</div><div class="device-card__value" id="cardModel">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">所属单位</div><div class="device-card__value" id="cardUnit">—</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>布点日期</div>
|
||||
<div class="form-control"><input class="form-input" type="date" value="2026-04-21"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>布点地址</div>
|
||||
<div class="form-control">
|
||||
<div class="map-picker map-picker--selected">
|
||||
<div class="map-picker__bg"></div>
|
||||
<svg class="map-picker__pin" width="28" height="36" viewBox="0 0 28 36" fill="none"><path d="M14 0C6.27 0 0 6.27 0 14c0 10.5 14 22 14 22s14-11.5 14-22C28 6.27 21.73 0 14 0z" fill="#1890FF"/><circle cx="14" cy="14" r="6" fill="#fff"/></svg>
|
||||
<span class="map-picker__label"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 1C4.24 1 2 3.24 2 6c0 3.75 5 7 5 7s5-3.25 5-7c0-2.76-2.24-5-5-5z" stroke="currentColor" stroke-width="1.2"/><circle cx="7" cy="6" r="1.5" stroke="currentColor" stroke-width="1"/></svg>在地图上点击选择具体坐标位置</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label">详细地址</div>
|
||||
<div class="form-control"><input class="form-input" type="text" placeholder="请补充详细地址，如：总部办公楼1层大厅东侧"></div>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>责任人</div>
|
||||
<div class="form-control"><input class="form-input" type="text" placeholder="请输入责任人姓名"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>责任人电话</div>
|
||||
<div class="form-control"><input class="form-input" type="tel" placeholder="请输入责任人联系电话"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="drawer__footer">
|
||||
<button class="btn btn-default" onclick="location.href='resource-aed-deploy.html';">取 消</button>
|
||||
<button class="btn btn-primary" onclick="alert('新增布点成功！');location.href='resource-aed-deploy.html';">确 定</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function showDropdown(){document.getElementById('deviceDropdown').style.display='block';}
|
||||
function filterDevices(val){
|
||||
var items=document.getElementById('deviceDropdown').querySelectorAll('.search-select__item');
|
||||
document.getElementById('deviceDropdown').style.display='block';
|
||||
items.forEach(function(item){var match=!val||item.textContent.toLowerCase().indexOf(val.toLowerCase())>-1;item.style.display=match?'flex':'none';});
|
||||
}
|
||||
function selectDevice(no,vendor,model,unit){
|
||||
document.querySelector('.search-select__input').value=no;
|
||||
document.getElementById('deviceDropdown').style.display='none';
|
||||
document.getElementById('deviceCard').style.display='block';
|
||||
document.getElementById('cardNo').textContent=no;
|
||||
document.getElementById('cardVendor').textContent=vendor;
|
||||
document.getElementById('cardModel').textContent=model;
|
||||
document.getElementById('cardUnit').textContent=unit;
|
||||
}
|
||||
document.addEventListener('click',function(e){if(!document.getElementById('deviceSearch').contains(e.target))document.getElementById('deviceDropdown').style.display='none';});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -199,7 +199,7 @@
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<div style="display:flex;gap:12px;margin-bottom:16px;">
|
||||
<button class="btn btn-primary">
|
||||
<button class="btn btn-primary" onclick="location.href='resource-aed-deploy-add.html';">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 2v10M2 7h10" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
|
||||
新增布点
|
||||
</button>
|
||||
|
||||
@@ -0,0 +1,194 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>应急就医 - AED设备信息 - 新增维护记录 | 健康长庆原型</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);}
|
||||
.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;width:240px;flex-shrink:0;white-space:nowrap;}
|
||||
.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);}
|
||||
.btn-back{color:rgba(255,255,255,0.65);cursor:pointer;display:flex;align-items:center;gap:4px;text-decoration:none;}
|
||||
.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);}
|
||||
.sidebar{position:fixed;top:56px;left:0;bottom:0;width:240px;background:#001529;overflow-y:auto;z-index:90;}
|
||||
.sidebar-group-title{color:rgba(255,255,255,0.35);font-size:var(--font-xs);padding:16px 24px 8px;letter-spacing:.5px;}
|
||||
.sidebar-item{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;text-decoration:none;}
|
||||
.sidebar-item:hover{color:#fff;background:rgba(255,255,255,0.06);}
|
||||
.sidebar-item.active{color:#fff;background:var(--primary);}
|
||||
.sidebar-item svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-submenu{max-height:0;overflow:hidden;transition:max-height .3s ease;}.sidebar-submenu.open{max-height:500px;}
|
||||
.sidebar-parent{display:flex;align-items:center;gap:10px;padding:12px 24px;color:rgba(255,255,255,0.65);font-size:var(--font-sm);cursor:pointer;transition:all .2s;justify-content:space-between;}
|
||||
.sidebar-parent:hover{color:#fff;background:rgba(255,255,255,0.06);}.sidebar-parent.active{color:#fff;}
|
||||
.sidebar-parent__left{display:flex;align-items:center;gap:10px;}.sidebar-parent__left svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.sidebar-parent .arrow{width:12px;height:12px;transition:transform .3s;flex-shrink:0;}.sidebar-parent .arrow.open{transform:rotate(90deg);}
|
||||
.sidebar-submenu .sidebar-item{padding-left:50px;font-size:var(--font-xs);}
|
||||
.main{margin-left:240px;margin-top:56px;padding:24px;padding-bottom:80px;}
|
||||
.breadcrumb{font-size:var(--font-sm);color:var(--text-secondary);margin-bottom:16px;display:flex;align-items:center;gap:6px;}
|
||||
.breadcrumb a{color:var(--primary);text-decoration:none;}.breadcrumb a:hover{text-decoration:underline;}
|
||||
.form-card{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:24px;margin-bottom:16px;}
|
||||
.form-card__title{font-size:var(--font-base);font-weight:600;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);}
|
||||
.form-row{display:flex;align-items:flex-start;gap:16px;margin-bottom:16px;}
|
||||
.form-label{width:130px;text-align:right;font-size:var(--font-sm);color:var(--text-secondary);flex-shrink:0;line-height:36px;}
|
||||
.form-label .required{color:var(--danger);margin-right:2px;}
|
||||
.form-input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px;font-size:var(--font-sm);outline:none;min-width:320px;}
|
||||
.form-input:focus{border-color:var(--primary);}
|
||||
.form-textarea{border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;font-size:var(--font-sm);outline:none;min-width:320px;width:480px;height:120px;resize:vertical;font-family:inherit;}
|
||||
.form-textarea:focus{border-color:var(--primary);}
|
||||
.search-select{position:relative;min-width:320px;}
|
||||
.search-select__input{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 32px 0 12px;font-size:var(--font-sm);outline:none;width:100%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Cpath d='M10 10l3 3M6.5 2a4.5 4.5 0 110 9 4.5 4.5 0 010-9z' stroke='%23999' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 10px center;}
|
||||
.search-select__input:focus{border-color:var(--primary);}
|
||||
.search-select__dropdown{position:absolute;top:40px;left:0;right:0;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:0 4px 12px rgba(0,0,0,0.1);z-index:10;max-height:220px;overflow-y:auto;display:none;}
|
||||
.search-select__item{padding:10px 12px;font-size:var(--font-sm);cursor:pointer;transition:background .15s;display:flex;justify-content:space-between;align-items:center;}
|
||||
.search-select__item:hover{background:var(--primary-light);}
|
||||
.search-select__item-name{font-weight:500;color:var(--text-primary);}
|
||||
.search-select__item-info{color:var(--text-placeholder);font-size:var(--font-xs);}
|
||||
.device-card{background:var(--primary-light);border:1px solid #91d5ff;border-radius:var(--radius-md);padding:16px;margin-top:12px;display:none;}
|
||||
.device-card__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;}
|
||||
.device-card__item{font-size:var(--font-sm);}
|
||||
.device-card__label{color:var(--text-placeholder);font-size:var(--font-xs);margin-bottom:2px;}
|
||||
.device-card__value{color:var(--text-primary);}
|
||||
.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);}
|
||||
.bottom-bar{position:fixed;bottom:0;left:240px;right:0;height:60px;background:#fff;box-shadow:0 -2px 8px rgba(0,0,0,0.06);display:flex;align-items:center;justify-content:center;gap:16px;z-index:50;}
|
||||
</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="M14 6v7l5 3" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><circle cx="14" cy="14" r="8" stroke="#fff" stroke-width="2" fill="none"/></svg>
|
||||
应急就医–管理员
|
||||
</div>
|
||||
<nav class="top-bar__nav">
|
||||
<a href="archive-personal.html">档案</a>
|
||||
<a href="resource-hospital.html" class="active">应急资源</a>
|
||||
<a href="center-basic-info.html">应急中心</a>
|
||||
<a href="exception-result.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-group-title">应急资源</div>
|
||||
<a href="resource-hospital.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M2 14V6l6-4 6 4v8" stroke="currentColor" stroke-width="1.4"/><rect x="5" y="9" width="3" height="5" rx=".5" stroke="currentColor" stroke-width="1.2"/><rect x="9" y="9" width="3" height="3" rx=".5" stroke="currentColor" stroke-width="1.2"/></svg>医院信息</a>
|
||||
<a href="resource-medical-point.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M8 1v14M1 8h14" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/></svg>医疗点信息</a>
|
||||
<div class="sidebar-parent active" onclick="this.classList.toggle('active');this.querySelector('.arrow').classList.toggle('open');this.nextElementSibling.classList.toggle('open');">
|
||||
<span class="sidebar-parent__left"><svg viewBox="0 0 16 16" fill="none"><path d="M4 8l3 3 5-6" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/><rect x="1" y="1" width="14" height="14" rx="3" stroke="currentColor" stroke-width="1.4"/></svg>AED设备信息</span>
|
||||
<svg class="arrow open" viewBox="0 0 12 12" fill="none"><path d="M4.5 2l4 4-4 4" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
</div>
|
||||
<div class="sidebar-submenu open">
|
||||
<a href="resource-aed.html" class="sidebar-item">设备管理</a>
|
||||
<a href="resource-aed-deploy.html" class="sidebar-item">布点管理</a>
|
||||
<a href="resource-aed-map.html" class="sidebar-item">AED地图</a>
|
||||
<a href="resource-aed-certifier.html" class="sidebar-item">取证人员</a>
|
||||
<a href="resource-aed-maintenance.html" class="sidebar-item active">维护记录</a>
|
||||
<a href="resource-aed-training.html" class="sidebar-item">培演记录</a>
|
||||
<a href="resource-aed-usage.html" class="sidebar-item">应用记录</a>
|
||||
</div>
|
||||
<a href="resource-ambulance.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><rect x="1" y="4" width="10" height="8" rx="1" stroke="currentColor" stroke-width="1.4"/><path d="M11 7h3l1 3v2h-4" stroke="currentColor" stroke-width="1.4"/><circle cx="4" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/><circle cx="12" cy="13" r="1.5" stroke="currentColor" stroke-width="1.2"/></svg>救护车信息</a>
|
||||
<a href="resource-first-aid-kit.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><rect x="2" y="4" width="12" height="9" rx="2" stroke="currentColor" stroke-width="1.4"/><path d="M6 4V3a2 2 0 014 0v1M8 7v4M6 9h4" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>急救包信息</a>
|
||||
<a href="resource-doctor.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M8 2a3 3 0 110 6 3 3 0 010-6zM3 14c0-2.8 2.2-5 5-5s5 2.2 5 5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/><path d="M8 6v2M7 7h2" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>急救医生信息</a>
|
||||
<a href="resource-emergency-contact.html" class="sidebar-item"><svg viewBox="0 0 16 16" fill="none"><path d="M11 2h3v12h-3M2 2h3v12H2" stroke="currentColor" stroke-width="1.4"/><path d="M8 5a2 2 0 110 4 2 2 0 010-4zM5 13c0-1.7 1.3-3 3-3s3 1.3 3 3" stroke="currentColor" stroke-width="1.2"/></svg>紧急联系人信息</a>
|
||||
</aside>
|
||||
<!-- 主内容区域 -->
|
||||
<main class="main">
|
||||
<div class="breadcrumb">
|
||||
<a href="resource-aed-maintenance.html">维护记录</a>
|
||||
<span>/</span>
|
||||
<span>新增维护记录</span>
|
||||
</div>
|
||||
|
||||
<!-- 设备信息 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">设备信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>选择设备</div>
|
||||
<div>
|
||||
<div class="search-select" id="deviceSearch">
|
||||
<input class="search-select__input" type="text" placeholder="输入设备编号搜索" onfocus="document.getElementById('deviceDropdown').style.display='block'" oninput="filterDevice(this.value)">
|
||||
<div class="search-select__dropdown" id="deviceDropdown">
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-001','迈瑞','BeneHeart C1A','长庆油田总部','安全环保部','总部办公楼1层大厅')"><span class="search-select__item-name">AED-2025-001</span><span class="search-select__item-info">迈瑞 · 总部办公楼1层大厅</span></div>
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-002','飞利浦','HeartStart FRx','长庆油田总部','综合管理部','职工食堂入口处')"><span class="search-select__item-name">AED-2025-002</span><span class="search-select__item-info">飞利浦 · 职工食堂入口处</span></div>
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-003','迈瑞','BeneHeart C2','第一采油厂','生产运行部','调度中心1层')"><span class="search-select__item-name">AED-2025-003</span><span class="search-select__item-info">迈瑞 · 调度中心1层</span></div>
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-004','卓尔','AED Plus','第二采油厂','安全环保部','值班室门口')"><span class="search-select__item-name">AED-2025-004</span><span class="search-select__item-info">卓尔 · 值班室门口</span></div>
|
||||
<div class="search-select__item" onclick="selectDevice('AED-2025-005','飞利浦','HeartStart HS1','第三采油厂','综合管理部','体育馆入口')"><span class="search-select__item-name">AED-2025-005</span><span class="search-select__item-info">飞利浦 · 体育馆入口</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device-card" id="deviceCard">
|
||||
<div class="device-card__grid">
|
||||
<div class="device-card__item"><div class="device-card__label">设备编号</div><div class="device-card__value" id="devNo">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">设备厂家</div><div class="device-card__value" id="devBrand">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">设备型号</div><div class="device-card__value" id="devModel">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">所属单位</div><div class="device-card__value" id="devUnit">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">所属部门</div><div class="device-card__value" id="devDept">—</div></div>
|
||||
<div class="device-card__item"><div class="device-card__label">布放地址</div><div class="device-card__value" id="devAddr">—</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 维护信息 -->
|
||||
<div class="form-card">
|
||||
<div class="form-card__title">维护信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>维护内容</div>
|
||||
<textarea class="form-textarea" placeholder="请输入维护内容，如：更换电极片、电池检测、软件升级等"></textarea>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>维护人</div>
|
||||
<input class="form-input" type="text" placeholder="请输入维护人姓名">
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-label"><span class="required">*</span>维护日期</div>
|
||||
<input class="form-input" type="date">
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 底部操作栏 -->
|
||||
<div class="bottom-bar">
|
||||
<button class="btn btn-primary" onclick="alert('新增成功！');location.href='resource-aed-maintenance.html';">提 交</button>
|
||||
<button class="btn btn-default" onclick="location.href='resource-aed-maintenance.html';">取 消</button>
|
||||
</div>
|
||||
<script>
|
||||
function filterDevice(val){
|
||||
var dd=document.getElementById('deviceDropdown');
|
||||
dd.style.display='block';
|
||||
dd.querySelectorAll('.search-select__item').forEach(function(item){
|
||||
var match=!val||item.textContent.toLowerCase().indexOf(val.toLowerCase())>-1;
|
||||
item.style.display=match?'flex':'none';
|
||||
});
|
||||
}
|
||||
function selectDevice(no,brand,model,unit,dept,addr){
|
||||
document.querySelector('.search-select__input').value=no;
|
||||
document.getElementById('deviceDropdown').style.display='none';
|
||||
var card=document.getElementById('deviceCard');
|
||||
card.style.display='block';
|
||||
document.getElementById('devNo').textContent=no;
|
||||
document.getElementById('devBrand').textContent=brand;
|
||||
document.getElementById('devModel').textContent=model;
|
||||
document.getElementById('devUnit').textContent=unit;
|
||||
document.getElementById('devDept').textContent=dept;
|
||||
document.getElementById('devAddr').textContent=addr;
|
||||
}
|
||||
document.addEventListener('click',function(e){
|
||||
if(!document.getElementById('deviceSearch').contains(e.target))
|
||||
document.getElementById('deviceDropdown').style.display='none';
|
||||
});
|
||||
</script></body>
|
||||
</html>
|
||||
@@ -109,7 +109,7 @@
|
||||
</div>
|
||||
|
||||
<div style="display:flex;gap:12px;margin-bottom:16px;">
|
||||
<button class="btn btn-primary"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 2v10M2 7h10" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>新增维护记录</button>
|
||||
<button class="btn btn-primary" onclick="location.href='resource-aed-maintenance-add.html';"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 2v10M2 7h10" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>新增维护记录</button>
|
||||
</div>
|
||||
|
||||
<div class="table-card">
|
||||
|
||||
@@ -188,7 +188,7 @@
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<div style="display:flex;gap:12px;margin-bottom:16px;">
|
||||
<button class="btn btn-primary">
|
||||
<button class="btn btn-primary" onclick="location.href='resource-aed-add.html';">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 2v10M2 7h10" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
|
||||
新增
|
||||
</button>
|
||||
|
||||
@@ -187,10 +187,21 @@
|
||||
<select class="filter-select">
|
||||
<option>全部等级</option>
|
||||
<option>三级甲等</option>
|
||||
<option>三级</option>
|
||||
<option>三级乙等</option>
|
||||
<option>三级丙等</option>
|
||||
<option>二级甲等</option>
|
||||
<option>二级</option>
|
||||
<option>二级乙等</option>
|
||||
<option>二级丙等</option>
|
||||
<option>一级</option>
|
||||
<option>其他</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<label>医院类型：</label>
|
||||
<select class="filter-select">
|
||||
<option>全部类型</option>
|
||||
<option>合作医院</option>
|
||||
<option>油田医院</option>
|
||||
</select>
|
||||
</div>
|
||||
<button class="btn btn-primary">查询</button>
|
||||
@@ -218,6 +229,7 @@
|
||||
<tr>
|
||||
<th>序号</th>
|
||||
<th>医院名称</th>
|
||||
<th>医院类型</th>
|
||||
<th>等级</th>
|
||||
<th>地址</th>
|
||||
<th>联系电话</th>
|
||||
@@ -231,7 +243,8 @@
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td style="font-weight:500;">西安交通大学第一附属医院</td>
|
||||
<td><span class="hospital-level level-3a">三级甲等</span></td>
|
||||
<td><span class="hospital-level level-2">油田医院</span></td>
|
||||
<td>三级甲等</td>
|
||||
<td>陕西省西安市雁塔区</td>
|
||||
<td>029-85323112</td>
|
||||
<td>综合性三甲教学医院，西北地区医疗中心</td>
|
||||
@@ -242,7 +255,8 @@
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td style="font-weight:500;">长庆油田职工医院</td>
|
||||
<td><span class="hospital-level level-3">三级</span></td>
|
||||
<td><span class="hospital-level level-3">合作医院</span></td>
|
||||
<td>三级甲等</td>
|
||||
<td>陕西省西安市未央区</td>
|
||||
<td>029-86518000</td>
|
||||
<td>长庆油田直属职工医疗保障机构</td>
|
||||
@@ -253,7 +267,8 @@
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td style="font-weight:500;">陕西省人民医院</td>
|
||||
<td><span class="hospital-level level-3a">三级甲等</span></td>
|
||||
<td><span class="hospital-level level-2">油田医院</span></td>
|
||||
<td>三级甲等</td>
|
||||
<td>陕西省西安市碑林区</td>
|
||||
<td>029-85251331</td>
|
||||
<td>省属大型综合三甲医院</td>
|
||||
@@ -264,7 +279,9 @@
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td style="font-weight:500;">庆阳市人民医院</td>
|
||||
<td><span class="hospital-level level-2">二级甲等</span></td>
|
||||
<td><span class="hospital-level level-3">合作医院</span></td>
|
||||
<!-- <td><span class="hospital-level level-2">二级甲等</span></td>-->
|
||||
<td>三级甲等</td>
|
||||
<td>甘肃省庆阳市西峰区</td>
|
||||
<td>0934-8612116</td>
|
||||
<td>庆阳地区综合性二甲医院</td>
|
||||
@@ -275,7 +292,9 @@
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td style="font-weight:500;">延安大学附属医院</td>
|
||||
<td><span class="hospital-level level-3">三级</span></td>
|
||||
<td><span class="hospital-level level-3">合作医院</span></td>
|
||||
<!-- <td><span class="hospital-level level-3">三级</span></td>-->
|
||||
<td>三级甲等</td>
|
||||
<td>陕西省延安市宝塔区</td>
|
||||
<td>0911-2881111</td>
|
||||
<td>延安区域重点综合医院</td>
|
||||
@@ -330,6 +349,18 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 医院类型 -->
|
||||
<div class="form-group">
|
||||
<div class="form-label"><span class="required">*</span> 医院类型</div>
|
||||
<div style="display:flex;gap:24px;">
|
||||
<label style="display:flex;align-items:center;gap:6px;font-size:var(--font-sm);cursor:pointer;">
|
||||
<input type="radio" name="hospitalType" value="oil" checked style="accent-color:var(--primary);width:16px;height:16px;"> 油田医院
|
||||
</label>
|
||||
<label style="display:flex;align-items:center;gap:6px;font-size:var(--font-sm);cursor:pointer;">
|
||||
<input type="radio" name="hospitalType" value="partner" style="accent-color:var(--primary);width:16px;height:16px;"> 合作医院
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 应急专长 -->
|
||||
<div class="form-group">
|
||||
<div class="form-label"><span class="required">*</span> 应急专长</div>
|
||||
|
||||
@@ -0,0 +1,126 @@
|
||||
<!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>
|
||||
*{box-sizing:border-box;margin:0;padding:0;}
|
||||
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;background:#fff;color:#333;}
|
||||
: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;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--shadow-sm:0 1px 4px rgba(0,0,0,0.08);}
|
||||
|
||||
/* 详情容器 */
|
||||
.detail{padding:0;}
|
||||
.detail__cover{width:100%;height:200px;object-fit:cover;display:block;background:#e6f7ff;}
|
||||
.detail__cover-placeholder{width:100%;height:200px;background:linear-gradient(135deg,#e6f7ff 0%,#bae7ff 100%);display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:14px;gap:8px;}
|
||||
.detail__cover-placeholder svg{width:48px;height:48px;opacity:.5;}
|
||||
|
||||
.detail__body{padding:24px;}
|
||||
.detail__name{font-size:var(--font-xl);font-weight:700;color:var(--text-primary);margin-bottom:4px;}
|
||||
.detail__status{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:10px;font-size:var(--font-xs);font-weight:600;margin-left:8px;vertical-align:middle;}
|
||||
.detail__status--on{background:#F6FFED;color:var(--success);border:1px solid #b7eb8f;}
|
||||
.detail__status--off{background:#F5F5F5;color:var(--text-secondary);border:1px solid var(--border);}
|
||||
|
||||
.detail__section{margin-top:24px;}
|
||||
.detail__section-title{font-size:var(--font-sm);font-weight:600;color:var(--text-primary);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:6px;}
|
||||
.detail__section-title svg{width:16px;height:16px;color:var(--primary);}
|
||||
|
||||
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;}
|
||||
.info-item{padding:12px 0;border-bottom:1px solid #f5f5f5;}
|
||||
.info-item--full{grid-column:1/-1;}
|
||||
.info-item__label{font-size:var(--font-xs);color:var(--text-placeholder);margin-bottom:4px;}
|
||||
.info-item__value{font-size:var(--font-sm);color:var(--text-primary);word-break:break-all;}
|
||||
.info-item__value a{color:var(--primary);text-decoration:none;}
|
||||
.info-item__value a:hover{text-decoration:underline;}
|
||||
|
||||
.tag-list{display:flex;flex-wrap:wrap;gap:6px;}
|
||||
.tag{display:inline-flex;align-items:center;padding:3px 10px;border-radius:4px;font-size:var(--font-xs);background:var(--primary-light);color:var(--primary);border:1px solid #91d5ff;}
|
||||
|
||||
.detail__intro{font-size:var(--font-sm);color:var(--text-secondary);line-height:1.8;white-space:pre-wrap;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="detail">
|
||||
<!-- 医疗点图片 -->
|
||||
<div class="detail__cover-placeholder">
|
||||
<svg viewBox="0 0 48 48" fill="none"><rect x="4" y="10" width="40" height="28" rx="4" stroke="currentColor" stroke-width="2.5"/><circle cx="18" cy="22" r="4" stroke="currentColor" stroke-width="2"/><path d="M4 34l10-8 6 4 10-10 14 14" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
医疗点实景图
|
||||
</div>
|
||||
|
||||
<div class="detail__body">
|
||||
<!-- 名称 + 状态 -->
|
||||
<div>
|
||||
<span class="detail__name">公司机关医疗点</span>
|
||||
<!-- <span class="detail__status detail__status--on">状态：开启</span>-->
|
||||
</div>
|
||||
|
||||
<!-- 基本信息 -->
|
||||
<div class="detail__section">
|
||||
<div class="detail__section-title">
|
||||
<svg viewBox="0 0 16 16" fill="none"><path d="M8 1v14M1 8h14" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/></svg>
|
||||
基本信息
|
||||
</div>
|
||||
<div class="info-grid">
|
||||
<div class="info-item info-item--full">
|
||||
<div class="info-item__label">医疗点地址</div>
|
||||
<div class="info-item__value">西安市未央区长庆大厦1楼东侧医务室</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-item__label">所属单位</div>
|
||||
<div class="info-item__value">公司机关</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-item__label">所属医院</div>
|
||||
<div class="info-item__value">宝石花医院</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-item__label">负责人</div>
|
||||
<div class="info-item__value">王医生</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-item__label">联系电话</div>
|
||||
<div class="info-item__value"><a href="tel:029-86518001">029-86518001</a></div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-item__label">设立时间</div>
|
||||
<div class="info-item__value">2019-06-15</div>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<div class="info-item__label">合同签订金额</div>
|
||||
<div class="info-item__value" style="color:#fa541c;font-weight:600;">¥ 120,000.00</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 辐射单位 -->
|
||||
<div class="detail__section">
|
||||
<div class="detail__section-title">
|
||||
<svg viewBox="0 0 16 16" fill="none"><circle cx="8" cy="8" r="6.5" stroke="currentColor" stroke-width="1.4"/><circle cx="8" cy="8" r="2" stroke="currentColor" stroke-width="1.2"/><path d="M8 1.5v2M8 12.5v2M1.5 8h2M12.5 8h2" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>
|
||||
辐射单位
|
||||
</div>
|
||||
<div class="tag-list">
|
||||
<span class="tag">公司机关</span>
|
||||
<span class="tag">生产运行处</span>
|
||||
<span class="tag">工程监督处</span>
|
||||
<span class="tag">安全环保处</span>
|
||||
<span class="tag">科技发展处</span>
|
||||
<span class="tag">物资装备处</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 医疗点简介 -->
|
||||
<div class="detail__section">
|
||||
<div class="detail__section-title">
|
||||
<svg viewBox="0 0 16 16" fill="none"><path d="M3 2h10v12H3z" stroke="currentColor" stroke-width="1.4"/><line x1="5.5" y1="5" x2="10.5" y2="5" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/><line x1="5.5" y1="8" x2="10.5" y2="8" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/><line x1="5.5" y1="11" x2="8.5" y2="11" stroke="currentColor" stroke-width="1.2" stroke-linecap="round"/></svg>
|
||||
医疗点简介
|
||||
</div>
|
||||
<div class="detail__intro">公司机关医疗点位于长庆大厦1楼东侧，由宝石花医院派驻医护人员值守，为公司机关及周边驻地单位员工提供日常诊疗、急救处置、健康咨询、职业健康检查等基本医疗服务。
|
||||
|
||||
医疗点配备有基础诊疗器械、AED设备、常用药品及急救物资，可进行常见疾病诊治、外伤处理、血压血糖监测等。同时承担公司机关区域内的应急医疗保障任务，与120急救中心建立联动响应机制。
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -69,6 +69,16 @@
|
||||
.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);}
|
||||
.drawer-mask{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.45);z-index:200;opacity:0;visibility:hidden;transition:all .3s;}
|
||||
.drawer-mask.open{opacity:1;visibility:visible;}
|
||||
.drawer{position:fixed;top:0;right:-560px;bottom:0;width:560px;background:#fff;z-index:201;box-shadow:-4px 0 16px rgba(0,0,0,0.12);transition:right .3s;display:flex;flex-direction:column;}
|
||||
.drawer.open{right:0;}
|
||||
.drawer__header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);flex-shrink:0;}
|
||||
.drawer__title{font-size:var(--font-lg);font-weight:600;}
|
||||
.drawer__close{width:32px;height:32px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);color:var(--text-secondary);font-size:20px;}
|
||||
.drawer__close:hover{background:var(--background);color:var(--text-primary);}
|
||||
.drawer__body{flex:1;overflow:hidden;}
|
||||
.drawer__body iframe{width:100%;height:100%;border:none;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -143,11 +153,11 @@
|
||||
<table>
|
||||
<thead><tr><th>序号</th><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 style="font-weight:500;">公司机关医疗点</td><td>公司机关</td><td>宝石花医院</td><td>西安市未央区长庆大厦1楼</td><td>王医生</td><td>029-86518001</td><td>3</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link">详情</span></div></td></tr>
|
||||
<tr><td>2</td><td style="font-weight:500;">采油一厂医疗点</td><td>采油一厂</td><td>宝石花医院</td><td>庆阳市西峰区采油一厂办公楼</td><td>李医生</td><td>0934-8612001</td><td>5</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link">详情</span></div></td></tr>
|
||||
<tr><td>3</td><td style="font-weight:500;">采油二厂医疗点</td><td>采油二厂</td><td>宝石花医院</td><td>庆阳市庆城县采油二厂基地</td><td>张医生</td><td>0934-3221001</td><td>4</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link">详情</span></div></td></tr>
|
||||
<tr><td>4</td><td style="font-weight:500;">采气一厂医疗点</td><td>采气一厂</td><td>宝石花医院</td><td>榆林市靖边县采气一厂</td><td>赵护士</td><td>0912-4837001</td><td>2</td><td><div class="switch" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link">详情</span></div></td></tr>
|
||||
<tr><td>5</td><td style="font-weight:500;">输油处医疗点</td><td>输油处</td><td>宝石花医院</td><td>西安市灞桥区输油处办公区</td><td>刘医生</td><td>029-83518001</td><td>2</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link">详情</span></div></td></tr>
|
||||
<tr><td>1</td><td style="font-weight:500;">公司机关医疗点</td><td>公司机关</td><td>宝石花医院</td><td>西安市未央区长庆大厦1楼</td><td>王医生</td><td>029-86518001</td><td>3</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link" onclick="openDrawer()">详情</span></div></td></tr>
|
||||
<tr><td>2</td><td style="font-weight:500;">采油一厂医疗点</td><td>采油一厂</td><td>宝石花医院</td><td>庆阳市西峰区采油一厂办公楼</td><td>李医生</td><td>0934-8612001</td><td>5</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link" onclick="openDrawer()">详情</span></div></td></tr>
|
||||
<tr><td>3</td><td style="font-weight:500;">采油二厂医疗点</td><td>采油二厂</td><td>宝石花医院</td><td>庆阳市庆城县采油二厂基地</td><td>张医生</td><td>0934-3221001</td><td>4</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link" onclick="openDrawer()">详情</span></div></td></tr>
|
||||
<tr><td>4</td><td style="font-weight:500;">采气一厂医疗点</td><td>采气一厂</td><td>宝石花医院</td><td>榆林市靖边县采气一厂</td><td>赵护士</td><td>0912-4837001</td><td>2</td><td><div class="switch" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link" onclick="openDrawer()">详情</span></div></td></tr>
|
||||
<tr><td>5</td><td style="font-weight:500;">输油处医疗点</td><td>输油处</td><td>宝石花医院</td><td>西安市灞桥区输油处办公区</td><td>刘医生</td><td>029-83518001</td><td>2</td><td><div class="switch on" onclick="this.classList.toggle('on')"></div></td><td><div class="action-btns"><span class="link" onclick="openDrawer()">详情</span></div></td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -163,5 +173,28 @@
|
||||
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div class="drawer-mask" id="drawerMask" onclick="closeDrawer()"></div>
|
||||
<div class="drawer" id="drawer">
|
||||
<div class="drawer__header">
|
||||
<div class="drawer__title">医疗点详情</div>
|
||||
<button class="drawer__close" onclick="closeDrawer()">×</button>
|
||||
</div>
|
||||
<div class="drawer__body">
|
||||
<iframe id="detailFrame" src="about:blank"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openDrawer(){
|
||||
document.getElementById('detailFrame').src='resource-medical-point-detail.html';
|
||||
document.getElementById('drawerMask').classList.add('open');
|
||||
document.getElementById('drawer').classList.add('open');
|
||||
}
|
||||
function closeDrawer(){
|
||||
document.getElementById('drawerMask').classList.remove('open');
|
||||
document.getElementById('drawer').classList.remove('open');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -329,8 +329,8 @@
|
||||
<th>年龄</th>
|
||||
<th>单位</th>
|
||||
<th>部门</th>
|
||||
<th>咨询专家次数</th>
|
||||
<th>咨询小助手次数</th>
|
||||
<th>咨询专家次数 ↕</th>
|
||||
<th>咨询小助手次数 ↕</th>
|
||||
<th>最近咨询时间</th>
|
||||
<th class="col-fixed col-fixed-end">操作</th>
|
||||
</tr>
|
||||
|
||||
@@ -202,7 +202,7 @@
|
||||
<tr>
|
||||
<th class="col-fixed col-fixed-1">序号</th>
|
||||
<th class="col-fixed col-fixed-2">单位名称</th>
|
||||
<th class="col-fixed col-fixed-3">员工人数</th>
|
||||
<th class="col-fixed col-fixed-3">员工人数 ↕</th>
|
||||
<th class="sortable">咨询专家次数 ↕</th>
|
||||
<th class="sortable">咨询小助手次数 ↕</th>
|
||||
<th>咨询占比</th>
|
||||
|
||||
Reference in New Issue
Block a user