主要改动: - SQL: biz_support_unit → biz_org, 加 org_type, 加 business_nature; 删 biz_execution_unit, biz_service_org - SQL: biz_project.support_unit_id/name + service_org_id/name → org_id/name/type - SQL: biz_meeting.support_unit_name → org_name - SQL: biz_person.work_unit → org_id (FK) - 后端: 新 BizOrg entity/mapper/service/controller - 后端: BizProject/BizMeeting 字段重命名 - 后端: 删 12 个 BizSupportUnit/BizExecutionUnit/BizServiceOrg Java 文件 - 后端: BizPersonImportVO.workUnit → orgName (导入时查 biz_org 取 org_id) - 后端: BizAuthController.registerExecutor 完整实现 (原 registerSupplier stub) - 前端: 新 admin/Orgs.vue + manager/Orgs.vue (原 SupportUnits) - 前端: RegisterExecutor.vue (原 RegisterSupplier, 单页 2 步) - 前端: sponsor/executor/manager 多个文件 workUnit → orgId/orgName 重命名 - 前端: 统一 supplier → executor, 业务命名 sponsor(赞助方) / executor(执行方=供应商) - 前端: 全工程 execution → executor (company type / role / person unit_type)
851 lines
33 KiB
HTML
851 lines
33 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>专家审核 - 项目管理系统</title>
|
||
<style>
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
|
||
body {
|
||
font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
|
||
color: #333;
|
||
background: #fafafa;
|
||
min-height: 100vh;
|
||
}
|
||
|
||
.content {
|
||
padding: 24px 32px;
|
||
}
|
||
|
||
/* ============= 页头 ============= */
|
||
.page-header {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
justify-content: space-between;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.page-title {
|
||
font-size: 22px;
|
||
font-weight: 600;
|
||
color: #1a1a1a;
|
||
margin-bottom: 4px;
|
||
}
|
||
|
||
.page-subtitle {
|
||
font-size: 13px;
|
||
color: #8c8c8c;
|
||
}
|
||
|
||
/* ============= 卡片 ============= */
|
||
.card {
|
||
background: #fff;
|
||
border-radius: 8px;
|
||
padding: 20px 24px;
|
||
margin-bottom: 16px;
|
||
border: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.card-title {
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
color: #1a1a1a;
|
||
margin-bottom: 16px;
|
||
padding-left: 10px;
|
||
border-left: 3px solid #1890ff;
|
||
line-height: 1;
|
||
}
|
||
|
||
/* ============= 筛选区 ============= */
|
||
.filter-row {
|
||
display: grid;
|
||
grid-template-columns: repeat(4, 1fr) auto;
|
||
gap: 12px;
|
||
align-items: center;
|
||
}
|
||
|
||
.filter-row.row-2 {
|
||
margin-top: 12px;
|
||
}
|
||
|
||
.filter-field {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
}
|
||
|
||
.filter-label {
|
||
font-size: 14px;
|
||
color: #595959;
|
||
white-space: nowrap;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.filter-input,
|
||
.filter-select {
|
||
flex: 1;
|
||
height: 32px;
|
||
padding: 0 10px;
|
||
border: 1px solid #d9d9d9;
|
||
border-radius: 4px;
|
||
font-size: 13px;
|
||
color: #333;
|
||
background: #fff;
|
||
outline: none;
|
||
}
|
||
|
||
.filter-input:focus,
|
||
.filter-select:focus {
|
||
border-color: #1890ff;
|
||
box-shadow: 0 0 0 3px rgba(24,144,255,0.1);
|
||
}
|
||
|
||
.filter-select {
|
||
cursor: pointer;
|
||
appearance: none;
|
||
background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
|
||
background-repeat: no-repeat;
|
||
background-position: right 10px center;
|
||
background-size: 14px;
|
||
padding-right: 24px;
|
||
}
|
||
|
||
.filter-btn {
|
||
height: 32px;
|
||
padding: 0 20px;
|
||
background: #1890ff;
|
||
color: #fff;
|
||
border: none;
|
||
border-radius: 4px;
|
||
font-size: 13px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.filter-btn:hover { background: #096dd9; }
|
||
|
||
/* ============= 红色 / 蓝色提示 ============= */
|
||
.hint-list {
|
||
background: #fff;
|
||
border: 1px solid #f0f0f0;
|
||
border-radius: 8px;
|
||
padding: 14px 20px;
|
||
margin-bottom: 16px;
|
||
font-size: 12px;
|
||
color: #ff4d4f;
|
||
line-height: 1.8;
|
||
}
|
||
|
||
.hint-list p { margin-bottom: 4px; }
|
||
.hint-list p:last-child { margin-bottom: 0; }
|
||
|
||
.hint-blue {
|
||
font-size: 12px;
|
||
color: #1890ff;
|
||
margin-bottom: 12px;
|
||
}
|
||
|
||
/* ============= 操作按钮区 ============= */
|
||
.table-actions {
|
||
display: flex;
|
||
gap: 12px;
|
||
margin-bottom: 12px;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.bulk-btn {
|
||
height: 36px;
|
||
padding: 0 24px;
|
||
background: #1890ff;
|
||
color: #fff;
|
||
border: none;
|
||
border-radius: 4px;
|
||
font-size: 14px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.bulk-btn:hover { background: #096dd9; }
|
||
|
||
.bulk-btn.secondary {
|
||
background: #fff;
|
||
color: #1890ff;
|
||
border: 1px solid #1890ff;
|
||
}
|
||
|
||
.bulk-btn.secondary:hover { background: #e6f7ff; }
|
||
|
||
/* ============= Tabs ============= */
|
||
.tabs {
|
||
display: flex;
|
||
gap: 32px;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
margin-bottom: 16px;
|
||
}
|
||
|
||
.tab {
|
||
position: relative;
|
||
padding: 10px 0;
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
color: #1a1a1a;
|
||
cursor: pointer;
|
||
user-select: none;
|
||
}
|
||
|
||
.tab:hover { color: #1890ff; }
|
||
|
||
.tab.active { color: #1890ff; }
|
||
|
||
.tab.active::after {
|
||
content: '';
|
||
position: absolute;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: -1px;
|
||
height: 3px;
|
||
background: #1890ff;
|
||
border-radius: 2px;
|
||
}
|
||
|
||
.tab-count {
|
||
color: #1890ff;
|
||
font-weight: 500;
|
||
}
|
||
|
||
/* ============= 表格 ============= */
|
||
.table-wrap {
|
||
background: #fff;
|
||
border: 1px solid #f0f0f0;
|
||
border-radius: 8px;
|
||
overflow-x: auto;
|
||
}
|
||
|
||
.data-table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
font-size: 13px;
|
||
table-layout: auto;
|
||
min-width: 1600px;
|
||
}
|
||
|
||
.data-table thead th {
|
||
background: #fafafa;
|
||
padding: 12px 10px;
|
||
text-align: left;
|
||
color: #1a1a1a;
|
||
font-weight: 600;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.data-table tbody td {
|
||
padding: 12px 10px;
|
||
border-bottom: 1px solid #f5f5f5;
|
||
color: #595959;
|
||
vertical-align: middle;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.data-table tbody tr:hover { background: #fafcff; }
|
||
.data-table tbody tr.hidden { display: none; }
|
||
|
||
.col-check { width: 36px; }
|
||
.data-table input[type="checkbox"] {
|
||
cursor: pointer;
|
||
width: 14px;
|
||
height: 14px;
|
||
accent-color: #1890ff;
|
||
}
|
||
|
||
.col-name { color: #1a1a1a; font-weight: 500; }
|
||
|
||
.status-tag {
|
||
display: inline-block;
|
||
padding: 2px 10px;
|
||
border-radius: 10px;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.status-pending { background: #fff7e6; color: #fa8c16; }
|
||
.status-done { background: #f6ffed; color: #52c41a; }
|
||
.status-reject { background: #fff1f0; color: #ff4d4f; }
|
||
|
||
.op-link {
|
||
color: #1890ff;
|
||
text-decoration: none;
|
||
margin-right: 8px;
|
||
font-size: 13px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.op-link:last-child { margin-right: 0; }
|
||
.op-link:hover { text-decoration: underline; }
|
||
.op-link.disabled { color: #bfbfbf; cursor: not-allowed; }
|
||
.op-link.disabled:hover { text-decoration: none; }
|
||
|
||
/* ============= 模态框 ============= */
|
||
.modal-overlay {
|
||
position: fixed;
|
||
inset: 0;
|
||
background: rgba(0,0,0,0.45);
|
||
display: none;
|
||
align-items: center;
|
||
justify-content: center;
|
||
z-index: 999;
|
||
}
|
||
|
||
.modal-overlay.show { display: flex; }
|
||
|
||
.modal {
|
||
background: #fff;
|
||
border-radius: 8px;
|
||
box-shadow: 0 6px 24px rgba(0,0,0,0.18);
|
||
width: 540px;
|
||
max-width: calc(100vw - 48px);
|
||
}
|
||
|
||
.modal-header {
|
||
padding: 16px 24px;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
color: #1a1a1a;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.modal-close {
|
||
background: none;
|
||
border: none;
|
||
font-size: 18px;
|
||
color: #8c8c8c;
|
||
cursor: pointer;
|
||
padding: 0;
|
||
line-height: 1;
|
||
}
|
||
|
||
.modal-close:hover { color: #333; }
|
||
|
||
.modal-body { padding: 24px; }
|
||
|
||
.modal-field {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
margin-bottom: 16px;
|
||
}
|
||
|
||
.modal-field label {
|
||
font-size: 14px;
|
||
color: #595959;
|
||
width: 80px;
|
||
flex-shrink: 0;
|
||
padding-top: 6px;
|
||
text-align: right;
|
||
padding-right: 12px;
|
||
}
|
||
|
||
.modal-input,
|
||
.modal-textarea {
|
||
flex: 1;
|
||
border: 1px solid #d9d9d9;
|
||
border-radius: 4px;
|
||
padding: 6px 10px;
|
||
font-size: 13px;
|
||
color: #333;
|
||
outline: none;
|
||
font-family: inherit;
|
||
}
|
||
|
||
.modal-input { height: 32px; }
|
||
.modal-textarea { height: 120px; resize: none; }
|
||
|
||
.modal-input:focus,
|
||
.modal-textarea:focus {
|
||
border-color: #1890ff;
|
||
box-shadow: 0 0 0 3px rgba(24,144,255,0.1);
|
||
}
|
||
|
||
.radio-group {
|
||
display: flex;
|
||
gap: 32px;
|
||
padding-top: 4px;
|
||
}
|
||
|
||
.radio-group label {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 6px;
|
||
cursor: pointer;
|
||
font-size: 14px;
|
||
color: #333;
|
||
}
|
||
|
||
.modal-hint {
|
||
color: #ff4d4f;
|
||
font-size: 12px;
|
||
margin-top: -8px;
|
||
margin-bottom: 16px;
|
||
padding-left: 92px;
|
||
}
|
||
|
||
.modal-footer {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
gap: 12px;
|
||
padding: 16px 24px;
|
||
border-top: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.modal-btn {
|
||
height: 32px;
|
||
padding: 0 20px;
|
||
border-radius: 4px;
|
||
font-size: 13px;
|
||
cursor: pointer;
|
||
border: 1px solid #d9d9d9;
|
||
background: #fff;
|
||
color: #333;
|
||
}
|
||
|
||
.modal-btn:hover { border-color: #1890ff; color: #1890ff; }
|
||
|
||
.modal-btn.primary {
|
||
background: #1890ff;
|
||
color: #fff;
|
||
border-color: #1890ff;
|
||
}
|
||
|
||
.modal-btn.primary:hover { background: #096dd9; border-color: #096dd9; color: #fff; }
|
||
|
||
@media (max-width: 768px) {
|
||
.filter-row,
|
||
.filter-row.row-2 { grid-template-columns: 1fr; }
|
||
.content { padding: 16px; }
|
||
.data-table { font-size: 12px; }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<main class="content">
|
||
|
||
<!-- ============= 页头 ============= -->
|
||
<div class="page-header">
|
||
<div>
|
||
<h1 class="page-title">专家审核</h1>
|
||
<p class="page-subtitle">对注册的专家进行资质审核与管理</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============= 红色提示 ============= -->
|
||
<div class="hint-list">
|
||
<p>*新建和批量导入审核状态直接为审核通过</p>
|
||
<p>*退回后,如专家重新提交,则审核状态变为待审核</p>
|
||
<p>*审核通过后,进入专家库,管理后台可查看专家库</p>
|
||
<p>*禁用后则无法登录,提示您的账号已被禁用</p>
|
||
</div>
|
||
|
||
<!-- ============= 筛选区 ============= -->
|
||
<div class="card">
|
||
<div class="card-title">筛选条件</div>
|
||
<div class="filter-row">
|
||
<div class="filter-field">
|
||
<span class="filter-label">姓名:</span>
|
||
<input type="text" class="filter-input" placeholder="输入姓名">
|
||
</div>
|
||
<div class="filter-field">
|
||
<span class="filter-label">手机号:</span>
|
||
<input type="text" class="filter-input" placeholder="输入手机号">
|
||
</div>
|
||
<div class="filter-field">
|
||
<span class="filter-label">工作单位:</span>
|
||
<input type="text" class="filter-input" placeholder="输入工作单位">
|
||
</div>
|
||
<div class="filter-field">
|
||
<span class="filter-label">审核状态:</span>
|
||
<select class="filter-select" id="statusFilter">
|
||
<option value="">请选择</option>
|
||
<option value="pending">待审核</option>
|
||
<option value="done">审核通过</option>
|
||
<option value="reject">已退回</option>
|
||
</select>
|
||
</div>
|
||
<button class="filter-btn">查找</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============= 操作按钮区(放 tab 上方) ============= -->
|
||
<div class="table-actions">
|
||
<button class="bulk-btn" id="btnNewExpert">+ 新建专家</button>
|
||
<button class="bulk-btn secondary" id="btnBatchReview">批量审核</button>
|
||
<button class="bulk-btn secondary" id="btnBatchImport">批量导入</button>
|
||
<button class="bulk-btn secondary">批量导入执业证书/证明</button>
|
||
<button class="bulk-btn secondary">批量导入职称证明</button>
|
||
</div>
|
||
|
||
<!-- ============= Tab 切换 ============= -->
|
||
<div class="tabs">
|
||
<div class="tab active" data-tab="all">全部</div>
|
||
<div class="tab" data-tab="pending">待审核 <span class="tab-count">(50)</span></div>
|
||
<div class="tab" data-tab="done">审核通过</div>
|
||
<div class="tab" data-tab="reject">已退回</div>
|
||
</div>
|
||
|
||
<!-- ============= 蓝色提示 ============= -->
|
||
<p class="hint-blue">*提示:需将证明文件名称修改为手机号进行导入</p>
|
||
|
||
<!-- ============= 表格 ============= -->
|
||
<div class="table-wrap">
|
||
<table class="data-table">
|
||
<thead>
|
||
<tr>
|
||
<th class="col-check"><input type="checkbox" id="selectAll"></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 data-status="pending">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">张三</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>呼吸科</td>
|
||
<td>主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-pending">待审核</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>张三</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link disabled js-toggle" href="javascript:void(0)" data-disabled="true">禁用</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-status="done">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">李四</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>血液科</td>
|
||
<td>副主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-done">审核通过</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>李四</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link js-toggle" href="javascript:void(0)" data-disabled="false">恢复</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-status="reject">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">张三</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>呼吸科</td>
|
||
<td>主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-reject">已退回</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>张三</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link disabled js-toggle" href="javascript:void(0)" data-disabled="true">禁用</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-status="pending">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">李四</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>血液科</td>
|
||
<td>副主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-pending">待审核</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>李四</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link disabled js-toggle" href="javascript:void(0)" data-disabled="true">禁用</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-status="pending">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">张三</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>呼吸科</td>
|
||
<td>主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-pending">待审核</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>张三</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link disabled js-toggle" href="javascript:void(0)" data-disabled="true">禁用</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-status="reject">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">李四</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>血液科</td>
|
||
<td>副主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-reject">已退回</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>李四</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link disabled js-toggle" href="javascript:void(0)" data-disabled="true">禁用</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-status="pending">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">张三</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>呼吸科</td>
|
||
<td>主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-pending">待审核</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>张三</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link disabled js-toggle" href="javascript:void(0)" data-disabled="true">禁用</a>
|
||
</td>
|
||
</tr>
|
||
<tr data-status="done">
|
||
<td><input type="checkbox" class="row-check"></td>
|
||
<td><a class="col-name op-link" href="javascript:void(0)" style="margin:0;">李四</a></td>
|
||
<td>13534621147</td>
|
||
<td>北京XXXXXXX医院</td>
|
||
<td>血液科</td>
|
||
<td>副主任医师</td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><a class="op-link" href="javascript:void(0)">查看</a><a class="op-link" href="javascript:void(0)">下载</a></td>
|
||
<td><span class="status-tag status-done">审核通过</span></td>
|
||
<td>2026.05.11 14:30</td>
|
||
<td>李四</td>
|
||
<td>
|
||
<a class="op-link js-review" href="javascript:void(0)">审核</a>
|
||
<a class="op-link" href="javascript:void(0)">查看</a>
|
||
<a class="op-link" href="javascript:void(0)">修改</a>
|
||
<a class="op-link disabled js-toggle" href="javascript:void(0)" data-disabled="true">禁用</a>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
</main>
|
||
|
||
<!-- ============= 批量导入 Modal ============= -->
|
||
<div class="modal-overlay" id="modalImport">
|
||
<div class="modal" style="width: 480px;">
|
||
<div class="modal-header">
|
||
<span>批量导入</span>
|
||
<button class="modal-close" data-close="modalImport">×</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="modal-field">
|
||
<label>选择文件</label>
|
||
<input type="text" class="modal-input" placeholder="请选择文件">
|
||
<button class="modal-btn" style="margin-left: 8px;">上传</button>
|
||
</div>
|
||
<div style="display: flex; gap: 12px; align-items: center; padding-left: 92px; margin-bottom: 4px;">
|
||
<a class="op-link" href="javascript:void(0)" style="margin:0;">批量导入模板下载</a>
|
||
</div>
|
||
<p class="modal-hint">*批量导入模板xls与列表表项一致</p>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button class="modal-btn" data-close="modalImport">取消</button>
|
||
<button class="modal-btn primary" data-close="modalImport">确定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ============= 专家审核 Modal ============= -->
|
||
<div class="modal-overlay" id="modalReview">
|
||
<div class="modal" style="width: 520px;">
|
||
<div class="modal-header">
|
||
<span>专家审核</span>
|
||
<button class="modal-close" data-close="modalReview">×</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="modal-field" style="padding-left: 92px;">
|
||
<div class="radio-group">
|
||
<label>
|
||
<input type="radio" name="reviewResult" value="pass" checked> 通过
|
||
</label>
|
||
<label>
|
||
<input type="radio" name="reviewResult" value="reject"> 退回
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<div class="modal-field">
|
||
<label>审核意见</label>
|
||
<textarea class="modal-textarea" placeholder="请输入审核意见..."></textarea>
|
||
</div>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button class="modal-btn" data-close="modalReview">取消</button>
|
||
<button class="modal-btn primary" id="btnConfirmReview">确认</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
// ============= Tab 切换 =============
|
||
const tabs = document.querySelectorAll('.tab');
|
||
const rows = document.querySelectorAll('.data-table tbody tr');
|
||
|
||
tabs.forEach(tab => {
|
||
tab.addEventListener('click', () => {
|
||
tabs.forEach(t => t.classList.remove('active'));
|
||
tab.classList.add('active');
|
||
const key = tab.dataset.tab;
|
||
rows.forEach(row => {
|
||
row.classList.toggle('hidden', key !== 'all' && row.dataset.status !== key);
|
||
});
|
||
});
|
||
});
|
||
|
||
// ============= 全选 =============
|
||
document.getElementById('selectAll').addEventListener('change', function() {
|
||
document.querySelectorAll('.data-table tbody tr:not(.hidden) .row-check').forEach(cb => {
|
||
cb.checked = this.checked;
|
||
});
|
||
});
|
||
|
||
// ============= Modal =============
|
||
function openModal(id) {
|
||
document.getElementById(id).classList.add('show');
|
||
}
|
||
function closeModal(id) {
|
||
document.getElementById(id).classList.remove('show');
|
||
}
|
||
|
||
document.querySelectorAll('[data-close]').forEach(btn => {
|
||
btn.addEventListener('click', () => closeModal(btn.dataset.close));
|
||
});
|
||
|
||
document.querySelectorAll('.modal-overlay').forEach(overlay => {
|
||
overlay.addEventListener('click', e => {
|
||
if (e.target === overlay) overlay.classList.remove('show');
|
||
});
|
||
});
|
||
|
||
// iframe 路由
|
||
function navigateTo(href) {
|
||
try {
|
||
if (window.parent && window.parent.document.getElementById('contentFrame')) {
|
||
window.parent.document.getElementById('contentFrame').src = href;
|
||
} else {
|
||
window.location.href = href;
|
||
}
|
||
} catch (e) { window.location.href = href; }
|
||
}
|
||
|
||
// ============= 按钮事件 =============
|
||
document.getElementById('btnNewExpert').addEventListener('click', () => {
|
||
navigateTo('new-expert.html');
|
||
});
|
||
|
||
document.getElementById('btnBatchImport').addEventListener('click', () => openModal('modalImport'));
|
||
|
||
document.getElementById('btnBatchReview').addEventListener('click', () => {
|
||
const checked = document.querySelectorAll('.row-check:checked');
|
||
if (checked.length === 0) {
|
||
alert('请先选择要审核的专家');
|
||
return;
|
||
}
|
||
openModal('modalReview');
|
||
});
|
||
|
||
// 单行「审核」
|
||
document.querySelectorAll('.js-review').forEach(link => {
|
||
link.addEventListener('click', e => {
|
||
e.preventDefault();
|
||
openModal('modalReview');
|
||
});
|
||
});
|
||
|
||
// 确认审核
|
||
document.getElementById('btnConfirmReview').addEventListener('click', () => {
|
||
const result = document.querySelector('input[name="reviewResult"]:checked').value;
|
||
const checked = document.querySelectorAll('.row-check:checked');
|
||
if (checked.length === 0) {
|
||
// 单行审核模式
|
||
const reviewLink = document.querySelector('.js-review:focus');
|
||
if (reviewLink) {
|
||
const row = reviewLink.closest('tr');
|
||
const tag = row.querySelector('.status-tag');
|
||
tag.className = 'status-tag ' + (result === 'pass' ? 'status-done' : 'status-reject');
|
||
tag.textContent = result === 'pass' ? '审核通过' : '已退回';
|
||
}
|
||
} else {
|
||
checked.forEach(cb => {
|
||
const row = cb.closest('tr');
|
||
const tag = row.querySelector('.status-tag');
|
||
tag.className = 'status-tag ' + (result === 'pass' ? 'status-done' : 'status-reject');
|
||
tag.textContent = result === 'pass' ? '审核通过' : '已退回';
|
||
row.dataset.status = result === 'pass' ? 'done' : 'reject';
|
||
cb.checked = false;
|
||
});
|
||
}
|
||
alert(result === 'pass' ? '审核已通过' : '已退回');
|
||
closeModal('modalReview');
|
||
});
|
||
|
||
// 禁用 / 恢复 切换
|
||
document.querySelectorAll('.js-toggle').forEach(link => {
|
||
link.addEventListener('click', e => {
|
||
e.preventDefault();
|
||
const disabled = link.dataset.disabled === 'true';
|
||
if (disabled) {
|
||
link.textContent = '恢复';
|
||
link.dataset.disabled = 'false';
|
||
link.classList.remove('disabled');
|
||
} else {
|
||
link.textContent = '禁用';
|
||
link.dataset.disabled = 'true';
|
||
link.classList.add('disabled');
|
||
}
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |