feat: 健康咨询三端原型大规模更新，新增13个页面/弹窗，优化22个页面
- 员工端APP：新增综合搜索、选择咨询人、咨询人档案、健康档案、历史对话只读页、视频待确认详情页；重构找专家页、我的记录页、医院详情页；优化对话页面交互 - 小助手后台：新增专家管理模块（列表+详情+导入导出）；重构当前咨询页和员工档案弹窗 - 管理端后台：重构咨询须知配置（分TAB+双栏预览）；优化咨询记录和结算页 - 应急APP专家端：新增咨询人档案页；优化工作台和对话页面 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Claude Opus 4.6
@@ -108,6 +108,7 @@
|
||||
<a href="current-consult.html">当前咨询</a>
|
||||
<a href="chat-message.html" class="active">对话消息</a>
|
||||
<a href="history-consult.html">历史咨询</a>
|
||||
<a href="expert-manage.html">专家管理</a>
|
||||
<a href="checkup-standard.html">体检标准化</a>
|
||||
<a href="sms-send.html">短信发送</a>
|
||||
<a href="consult-settle.html">咨询结算</a>
|
||||
|
||||
@@ -63,6 +63,7 @@
|
||||
<a href="current-consult.html">当前咨询</a>
|
||||
<a href="chat-message.html">对话消息</a>
|
||||
<a href="history-consult.html">历史咨询</a>
|
||||
<a href="expert-manage.html">专家管理</a>
|
||||
<a href="checkup-standard.html" class="active">体检标准化</a>
|
||||
<a href="sms-send.html">短信发送</a>
|
||||
<a href="consult-settle.html">咨询结算</a>
|
||||
|
||||
@@ -73,6 +73,7 @@
|
||||
<a href="current-consult.html">当前咨询</a>
|
||||
<a href="chat-message.html">对话消息</a>
|
||||
<a href="history-consult.html">历史咨询</a>
|
||||
<a href="expert-manage.html">专家管理</a>
|
||||
<a href="checkup-standard.html">体检标准化</a>
|
||||
<a href="sms-send.html">短信发送</a>
|
||||
<a href="consult-settle.html" class="active">咨询结算</a>
|
||||
|
||||
@@ -30,6 +30,9 @@
|
||||
.conv-list__header{padding:16px;border-bottom:1px solid var(--border);}
|
||||
.conv-list__search{width:100%;height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px 0 36px;font-size:var(--font-sm);outline:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Ccircle cx='6' cy='6' r='4' stroke='%23999' stroke-width='1.4'/%3E%3Cpath d='M10 10l2.5 2.5' stroke='%23999' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 12px center;}
|
||||
.conv-list__search:focus{border-color:var(--primary);}
|
||||
.conv-list__filters{display:flex;gap:16px;padding:10px 10px 0;font-size:var(--font-sm);}
|
||||
.conv-list__filters label{display:flex;align-items:center;gap:6px;cursor:pointer;color:var(--text-secondary);user-select:none;}
|
||||
.conv-list__filters input[type="checkbox"]{width:10px;height:10px;accent-color:var(--primary);cursor:pointer;}
|
||||
.conv-list__body{flex:1;overflow-y:auto;}
|
||||
.conv-item{display:flex;gap:12px;padding:14px 16px;cursor:pointer;border-bottom:1px solid #F5F5F5;transition:background .15s;}
|
||||
.conv-item:hover{background:#FAFAFA;}
|
||||
@@ -48,6 +51,11 @@
|
||||
.chat-header__left{display:flex;align-items:center;gap:12px;}
|
||||
.chat-header__name{font-size:var(--font-base);font-weight:600;}
|
||||
.chat-header__tag{font-size:var(--font-xs);padding:2px 8px;border-radius:10px;background:#F6FFED;color:var(--success);}
|
||||
.chat-header__tag--ended{background:#F5F5F5;color:#999;}
|
||||
/* 咨询结束卡片（员工侧发出） */
|
||||
.end-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);padding:14px 18px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-sm);}
|
||||
.end-card__icon{width:36px;height:36px;border-radius:50%;background:#FFF1F0;color:var(--danger);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
|
||||
.end-card__text{font-size:var(--font-sm);color:var(--text-secondary);font-weight:500;}
|
||||
.chat-header__actions{display:flex;gap:8px;}
|
||||
.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;}
|
||||
@@ -125,6 +133,7 @@
|
||||
<a href="current-consult.html" class="active">当前咨询</a>
|
||||
<a href="chat-message.html">对话消息</a>
|
||||
<a href="history-consult.html">历史咨询</a>
|
||||
<a href="expert-manage.html">专家管理</a>
|
||||
<a href="checkup-standard.html">体检标准化</a>
|
||||
<a href="sms-send.html">短信发送</a>
|
||||
<a href="consult-settle.html">咨询结算</a>
|
||||
@@ -147,6 +156,11 @@
|
||||
<div class="conv-list">
|
||||
<div class="conv-list__header">
|
||||
<input class="conv-list__search" type="text" placeholder="搜索员工姓名/工号">
|
||||
<div class="conv-list__filters">
|
||||
<label><input type="checkbox"> 咨询专家</label>
|
||||
<label><input type="checkbox"> 咨询小助手</label>
|
||||
<label><input type="checkbox"> 专家未回复</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="conv-list__body">
|
||||
<!-- [交互] 点击切换右侧对话内容 -->
|
||||
@@ -220,13 +234,13 @@
|
||||
<div class="chat-header">
|
||||
<div class="chat-header__left">
|
||||
<span class="chat-header__name" id="chatName">李明</span>
|
||||
<span class="chat-header__tag">咨询中</span>
|
||||
<span class="chat-header__tag" id="chatTag">咨询中</span>
|
||||
</div>
|
||||
<div class="chat-header__actions">
|
||||
<!-- [交互] 点击打开咨询人档案弹窗 -->
|
||||
<button class="btn btn-default btn-sm" onclick="openOverlay('employee-profile-dialog.html',680,720)">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><circle cx="7" cy="5" r="3" stroke="currentColor" stroke-width="1.2"/><path d="M2 13c0-2.8 2.2-5 5-5s5 2.2 5 5" stroke="currentColor" stroke-width="1.2"/></svg>
|
||||
查看档案
|
||||
咨询人档案
|
||||
</button>
|
||||
<!-- [交互] 点击结束当前咨询 -->
|
||||
<button class="btn btn-default btn-sm" style="color:var(--danger);border-color:var(--danger);">
|
||||
@@ -323,7 +337,7 @@
|
||||
</button>
|
||||
</div>
|
||||
<div class="chat-input-wrap">
|
||||
<textarea class="chat-input" rows="1" placeholder="输入消息..."></textarea>
|
||||
<textarea class="chat-input" rows="4" placeholder="输入消息..."></textarea>
|
||||
<button class="btn btn-primary">发送</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -358,13 +372,61 @@ window.addEventListener('message', function(e) {
|
||||
if (e.data === 'close-dialog') closeOverlay();
|
||||
});
|
||||
|
||||
/* 各对话的聊天内容 */
|
||||
var convContents = {};
|
||||
convContents[0] = document.getElementById('chatBody').innerHTML;
|
||||
convContents[1] = ''
|
||||
+ '<div class="system-msg">会话开始 · 2026-04-10 09:40</div>'
|
||||
+ '<div class="msg right"><div class="msg__avatar asst">助</div><div class="msg__content"><div class="msg__name">健康小助手</div><div class="msg__bubble">您好！我是健康咨询小助手，很高兴为您服务。请问您有什么健康问题需要咨询？</div><div class="msg__time">09:40</div></div></div>'
|
||||
+ '<div class="msg"><div class="msg__avatar emp">张</div><div class="msg__content"><div class="msg__name">张伟（钻井工程公司）</div><div class="msg__bubble">最近总是头疼，尤其是下午比较严重，已经持续一周了。</div><div class="msg__time">09:42</div></div></div>'
|
||||
+ '<div class="msg right"><div class="msg__avatar asst">助</div><div class="msg__content"><div class="msg__name">健康小助手</div><div class="msg__bubble">请问头疼的位置是前额、太阳穴还是后脑勺？有没有伴随恶心、视力模糊等情况？平时睡眠和用眼情况如何？</div><div class="msg__time">09:44</div></div></div>'
|
||||
+ '<div class="msg"><div class="msg__avatar emp">张</div><div class="msg__content"><div class="msg__name">张伟（钻井工程公司）</div><div class="msg__bubble">主要是太阳穴两侧，有时候会恶心。最近加班比较多，睡眠不太好。</div><div class="msg__time">09:50</div></div></div>'
|
||||
+ '<div class="msg right"><div class="msg__avatar asst">助</div><div class="msg__content"><div class="msg__name">健康小助手</div><div class="msg__bubble">根据您的描述，可能是紧张性头痛，与疲劳和睡眠不足有关。建议：<br>1. 保证充足睡眠，每天7-8小时<br>2. 适当放松，避免长时间伏案<br>3. 如持续不缓解，建议做头颅CT排查</div><div class="msg__time">09:52</div></div></div>'
|
||||
+ '<div class="msg"><div class="msg__avatar emp">张</div><div class="msg__content"><div class="msg__name">张伟（钻井工程公司）</div><div class="msg__bubble">好的，谢谢！我先注意休息看看。</div><div class="msg__time">09:55</div></div></div>'
|
||||
+ '<div class="msg"><div class="msg__avatar emp">张</div><div class="msg__content"><div class="msg__name">张伟（钻井工程公司）</div><div class="end-card"><div class="end-card__icon">✕</div><div class="end-card__text">本次咨询已结束</div></div><div class="msg__time">09:58</div></div></div>';
|
||||
|
||||
/* 各对话的状态配置：tag文字 + 是否已结束 */
|
||||
var convStatus = {
|
||||
0: { text: '咨询中', ended: false },
|
||||
1: { text: '已结束', ended: true },
|
||||
2: { text: '咨询中', ended: false },
|
||||
3: { text: '咨询中', ended: false },
|
||||
4: { text: '咨询中', ended: false },
|
||||
5: { text: '咨询中', ended: false }
|
||||
};
|
||||
|
||||
var currentConvIdx = 0;
|
||||
|
||||
function selectConv(el, idx) {
|
||||
/* 保存当前对话内容 */
|
||||
convContents[currentConvIdx] = document.getElementById('chatBody').innerHTML;
|
||||
currentConvIdx = idx;
|
||||
|
||||
document.querySelectorAll('.conv-item').forEach(i => i.classList.remove('active'));
|
||||
el.classList.add('active');
|
||||
const badge = el.querySelector('.conv-badge');
|
||||
if (badge) badge.remove();
|
||||
const name = el.querySelector('.conv-info__name').textContent;
|
||||
document.getElementById('chatName').textContent = name;
|
||||
|
||||
/* 切换状态标签 */
|
||||
var tag = document.getElementById('chatTag');
|
||||
var status = convStatus[idx] || { text: '咨询中', ended: false };
|
||||
tag.textContent = status.text;
|
||||
if (status.ended) {
|
||||
tag.classList.add('chat-header__tag--ended');
|
||||
} else {
|
||||
tag.classList.remove('chat-header__tag--ended');
|
||||
}
|
||||
|
||||
/* 切换聊天内容 */
|
||||
var body = document.getElementById('chatBody');
|
||||
if (convContents[idx]) {
|
||||
body.innerHTML = convContents[idx];
|
||||
} else {
|
||||
body.innerHTML = '<div class="system-msg">暂无消息记录</div>';
|
||||
}
|
||||
body.scrollTop = body.scrollHeight;
|
||||
}
|
||||
|
||||
/* 常用语弹出 */
|
||||
|
||||
@@ -1,5 +1,32 @@
|
||||
# 变更记录 - 专家咨询·小助手角色（后台管理系统）
|
||||
|
||||
## 2026-04-13
|
||||
|
||||
### feat: 新增专家管理模块
|
||||
|
||||
**涉及文件：**
|
||||
|
||||
- `expert-manage.html` — 新增专家管理列表页（筛选、表格、操作按钮、导入导出）
|
||||
- `expert-detail-dialog.html` — 新增专家详情弹窗（新增/编辑/查看共用）
|
||||
- `expert-import-dialog.html` — 新增批量导入专家弹窗（下载模板+上传文件）
|
||||
- `export-task-dialog.html` — 新增导出任务列表弹窗
|
||||
- `import-task-dialog.html` — 新增导入任务列表弹窗
|
||||
- `current-consult.html` — 顶部导航栏增加"专家管理"链接
|
||||
- `chat-message.html` — 顶部导航栏增加"专家管理"链接
|
||||
- `history-consult.html` — 顶部导航栏增加"专家管理"链接
|
||||
- `checkup-standard.html` — 顶部导航栏增加"专家管理"链接
|
||||
- `sms-send.html` — 顶部导航栏增加"专家管理"链接
|
||||
- `consult-settle.html` — 顶部导航栏增加"专家管理"链接
|
||||
|
||||
**变更说明：**
|
||||
|
||||
- 新增"专家管理"一级菜单，位于"历史咨询"之后，用于管理平台咨询专家信息
|
||||
- 列表页支持按姓名、科室、咨询状态筛选，操作列包含查看详情、编辑、关闭/开启咨询、重置密码、删除
|
||||
- 顶部操作区支持新增专家、导出列表数据、查看导出任务、批量导入专家、查看导入任务
|
||||
- 专家详情弹窗包含基本信息、执业信息、咨询设置三个区块
|
||||
- 批量导入弹窗支持下载模板和拖拽上传
|
||||
- 同步更新全部6个同级页面的顶部导航栏
|
||||
|
||||
## 2026-04-10
|
||||
|
||||
### feat: 新增对话消息模块及通讯录功能
|
||||
|
||||
@@ -11,6 +11,7 @@
|
||||
├── 当前咨询（IM对话）
|
||||
├── 对话消息（内部IM）
|
||||
├── 历史咨询（列表）
|
||||
├── 专家管理（列表）
|
||||
├── 体检标准化（分类+列表）
|
||||
├── 短信发送（列表）
|
||||
└── 咨询结算（列表）
|
||||
@@ -40,13 +41,18 @@ stateDiagram-v2
|
||||
| 5 | | 通讯录弹窗 | contacts-dialog.html |
|
||||
| 6 | 历史咨询 | 历史咨询列表页 | history-consult.html |
|
||||
| 7 | | 历史对话详情弹窗 | chat-detail-dialog.html |
|
||||
| 8 | 体检标准化 | 体检标准化页面 | checkup-standard.html |
|
||||
| 9 | | 体检项目明细弹窗 | item-detail-dialog.html |
|
||||
| 10 | 短信发送 | 短信发送记录列表 | sms-send.html |
|
||||
| 11 | | 新建短信弹窗 | send-dialog.html |
|
||||
| 12 | | 短信发送详情弹窗 | sms-detail-dialog.html |
|
||||
| 13 | 咨询结算 | 咨询结算列表页 | consult-settle.html |
|
||||
| 14 | | 报表详情弹窗 | report-detail-dialog.html |
|
||||
| 8 | 专家管理 | 专家管理列表页 | expert-manage.html |
|
||||
| 9 | | 专家详情弹窗 | expert-detail-dialog.html |
|
||||
| 10 | | 批量导入专家弹窗 | expert-import-dialog.html |
|
||||
| 11 | | 导出任务列表弹窗 | export-task-dialog.html |
|
||||
| 12 | | 导入任务列表弹窗 | import-task-dialog.html |
|
||||
| 13 | 体检标准化 | 体检标准化页面 | checkup-standard.html |
|
||||
| 14 | | 体检项目明细弹窗 | item-detail-dialog.html |
|
||||
| 15 | 短信发送 | 短信发送记录列表 | sms-send.html |
|
||||
| 16 | | 新建短信弹窗 | send-dialog.html |
|
||||
| 17 | | 短信发送详情弹窗 | sms-detail-dialog.html |
|
||||
| 18 | 咨询结算 | 咨询结算列表页 | consult-settle.html |
|
||||
| 19 | | 报表详情弹窗 | report-detail-dialog.html |
|
||||
|
||||
---
|
||||
|
||||
@@ -157,7 +163,85 @@ stateDiagram-v2
|
||||
- 中部为完整对话消息流
|
||||
- 转专家记录以黄色提示条展示
|
||||
|
||||
### 8. 体检标准化页面
|
||||
### 8. 专家管理列表页
|
||||
|
||||
**功能说明：** 展示平台所有咨询专家信息，支持新增、编辑、删除专家，以及开启/关闭咨询状态、重置密码等操作。支持批量导入导出。
|
||||
|
||||
**业务规则：**
|
||||
- 列表字段：专家姓名（含头像）、科室、职称、手机号、咨询状态、创建时间
|
||||
- 咨询状态：已开启（绿色）、已关闭（红色）
|
||||
- 关闭咨询后该专家不再出现在员工端可选专家列表中
|
||||
|
||||
**交互说明：**
|
||||
- 筛选条件：专家姓名、科室、咨询状态
|
||||
- 点击「新增专家」→ 打开专家详情弹窗（新增模式）
|
||||
- 点击行末「详情」→ 打开专家详情弹窗（查看模式）
|
||||
- 点击行末「编辑」→ 打开专家详情弹窗（编辑模式）
|
||||
- 点击行末「关闭咨询」→ 确认后关闭该专家的咨询服务
|
||||
- 点击行末「开启咨询」→ 确认后开启该专家的咨询服务（仅已关闭状态显示）
|
||||
- 点击行末「重置密码」→ 确认后重置专家登录密码
|
||||
- 点击行末「删除」→ 二次确认后删除专家
|
||||
- 点击「导出列表数据」→ 导出当前筛选结果
|
||||
- 点击「查看导出任务」→ 打开导出任务列表弹窗
|
||||
- 点击「批量导入专家」→ 打开批量导入弹窗
|
||||
- 点击「查看导入任务」→ 打开导入任务列表弹窗
|
||||
|
||||
### 9. 专家详情弹窗
|
||||
|
||||
**功能说明：** 新增/编辑/查看专家信息，包含基本信息、执业信息和咨询设置三个区块。
|
||||
|
||||
**交互说明：**
|
||||
- 以弹窗形式打开
|
||||
- 新增模式：所有字段可编辑，底部显示「取消」和「保存」按钮
|
||||
- 编辑模式：回填已有数据，可修改
|
||||
- 查看模式：所有字段只读
|
||||
|
||||
| 字段名 | 类型 | 必填 | 规则 |
|
||||
|--------|------|------|------|
|
||||
| 头像 | 图片上传 | 是 | 支持jpg/png |
|
||||
| 姓名 | 文本 | 是 | — |
|
||||
| 性别 | 下拉 | 是 | 男/女 |
|
||||
| 手机号 | 文本 | 是 | 11位手机号 |
|
||||
| 身份证号 | 文本 | 否 | 18位 |
|
||||
| 科室 | 下拉 | 是 | 预设科室列表 |
|
||||
| 职称 | 下拉 | 是 | 主任医师/副主任医师/主治医师/住院医师 |
|
||||
| 执业证号 | 文本 | 否 | — |
|
||||
| 执业年限 | 数字 | 否 | — |
|
||||
| 擅长领域 | 文本 | 否 | 逗号分隔 |
|
||||
| 图文单价 | 数字 | 否 | 默认30 |
|
||||
| 视频单价 | 数字 | 否 | 默认80 |
|
||||
| 个人简介 | 文本域 | 否 | — |
|
||||
|
||||
### 10. 批量导入专家弹窗
|
||||
|
||||
**功能说明：** 通过Excel模板批量导入专家信息，分两步操作：下载模板、上传文件。
|
||||
|
||||
**交互说明：**
|
||||
- 点击「下载导入模板」→ 下载xlsx模板文件
|
||||
- 拖拽或点击上传区域 → 选择填好的xlsx文件
|
||||
- 点击「开始导入」→ 提交导入任务
|
||||
- 支持xlsx、xls格式，单次最多500条
|
||||
|
||||
### 11. 导出任务列表弹窗
|
||||
|
||||
**功能说明：** 展示历史导出任务记录，支持下载已完成的导出文件或重试失败任务。
|
||||
|
||||
**交互说明：**
|
||||
- 列表字段：任务名称、创建时间、状态、操作
|
||||
- 状态：已完成（绿色）、已失败（红色）
|
||||
- 已完成 → 点击「下载」获取文件
|
||||
- 已失败 → 点击「重试」重新执行
|
||||
|
||||
### 12. 导入任务列表弹窗
|
||||
|
||||
**功能说明：** 展示历史导入任务记录，包含导入结果统计（成功/失败条数）。
|
||||
|
||||
**交互说明：**
|
||||
- 列表字段：文件名、导入时间、状态、结果、操作
|
||||
- 有失败记录时 → 点击「下载失败记录」获取失败明细
|
||||
- 已失败 → 点击「重新导入」
|
||||
|
||||
### 13. 体检标准化页面
|
||||
|
||||
**功能说明：** 左侧体检分类树 + 右侧项目列表，供小助手查阅体检项目明细以回答员工相关问题。
|
||||
|
||||
@@ -169,7 +253,7 @@ stateDiagram-v2
|
||||
- 点击左侧分类 → 右侧切换为该分类下的项目列表
|
||||
- 点击行末「查看明细」→ 打开体检项目明细弹窗
|
||||
|
||||
### 9. 体检项目明细弹窗
|
||||
### 14. 体检项目明细弹窗
|
||||
|
||||
**功能说明：** 展示单个体检项目的详细信息，包括参考范围、临床意义、关联套餐和注意事项。
|
||||
|
||||
@@ -177,7 +261,7 @@ stateDiagram-v2
|
||||
- 以新窗口弹窗形式打开
|
||||
- 参考范围以可视化条形图辅助展示
|
||||
|
||||
### 10. 短信发送记录列表
|
||||
### 15. 短信发送记录列表
|
||||
|
||||
**功能说明：** 展示短信发送历史记录和统计概览，支持新建短信。
|
||||
|
||||
@@ -190,7 +274,7 @@ stateDiagram-v2
|
||||
- 点击行末「查看详情」→ 打开短信发送详情弹窗
|
||||
- 支持按状态和时间范围筛选
|
||||
|
||||
### 11. 新建短信弹窗
|
||||
### 16. 新建短信弹窗
|
||||
|
||||
**功能说明：** 创建并发送通知短信，支持选择发送对象和定时发送。
|
||||
|
||||
@@ -208,7 +292,7 @@ stateDiagram-v2
|
||||
| 短信内容 | 文本域 | 是 | 不超过70字 |
|
||||
| 定时发送 | 开关+时间 | 否 | 开启后必填时间 |
|
||||
|
||||
### 12. 短信发送详情弹窗
|
||||
### 17. 短信发送详情弹窗
|
||||
|
||||
**功能说明：** 展示某批次短信的发送结果，包括基本信息、短信内容预览、发送统计和失败记录。
|
||||
|
||||
@@ -216,7 +300,7 @@ stateDiagram-v2
|
||||
- 以新窗口弹窗形式打开
|
||||
- 失败记录列出失败人员和原因
|
||||
|
||||
### 13. 咨询结算列表页
|
||||
### 18. 咨询结算列表页
|
||||
|
||||
**功能说明：** 按月展示各专家的咨询结算数据，支持生成和下载结算报表。
|
||||
|
||||
@@ -230,7 +314,7 @@ stateDiagram-v2
|
||||
- 点击「下载报表」→ 下载报表文件
|
||||
- 点击行末「查看明细」→ 打开报表详情弹窗
|
||||
|
||||
### 14. 报表详情弹窗
|
||||
### 19. 报表详情弹窗
|
||||
|
||||
**功能说明：** 展示单个专家的结算明细，包括专家信息、结算金额、咨询明细和月度趋势。
|
||||
|
||||
|
||||
@@ -6,146 +6,148 @@
|
||||
<title>咨询人档案 | 健康长庆原型</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;}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--warning:#FAAD14;--danger:#FF4D4F;--text-primary:#333;--text-secondary:#666;--border:#E8E8E8;--font-xs:11px;--font-sm:13px;--font-base:15px;--font-lg:17px;--radius-sm:4px;--radius-md:8px;--shadow-sm:0 1px 4px rgba(0,0,0,0.08);}
|
||||
.dialog{max-width:640px;margin:0 auto;background:#fff;min-height:100vh;}
|
||||
.dialog-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);position:sticky;top:0;background:#fff;z-index:10;}
|
||||
.dialog-title{font-size:var(--font-lg);font-weight:600;}
|
||||
.dialog-close{background:none;border:none;font-size:20px;cursor:pointer;color:var(--text-secondary);width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);}
|
||||
.dialog-close:hover{background:#F5F5F5;color:var(--text-primary);}
|
||||
.dialog-body{padding:24px;}
|
||||
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;background:#fff;color:#333;padding:24px;overflow-y:auto;}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--text-secondary:#666;--border:#E8E8E8;--font-xs:12px;--font-sm:13px;--font-base:15px;--radius-sm:4px;}
|
||||
|
||||
/* 头部信息卡 */
|
||||
.profile-header{display:flex;gap:16px;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--border);margin-bottom:20px;}
|
||||
.profile-avatar{width:56px;height:56px;border-radius:50%;background:var(--primary-light);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:600;flex-shrink:0;}
|
||||
.profile-name{font-size:var(--font-lg);font-weight:600;}
|
||||
.profile-meta{font-size:var(--font-xs);color:var(--text-secondary);margin-top:4px;}
|
||||
.tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:10px;font-size:var(--font-xs);margin-left:8px;}
|
||||
.tag-green{background:#F6FFED;color:var(--success);}
|
||||
.section{margin-bottom:28px;}
|
||||
.section__title{font-size:var(--font-base);font-weight:700;padding-bottom:10px;border-bottom:2px solid var(--primary);margin-bottom:0;}
|
||||
.info-table{width:100%;border-collapse:collapse;border:1px solid var(--border);}
|
||||
.info-table td{padding:12px 16px;font-size:var(--font-sm);border:1px solid var(--border);}
|
||||
.info-table .label{color:var(--primary);width:90px;white-space:nowrap;background:#FAFBFC;}
|
||||
.info-table .value{color:#333;min-width:120px;}
|
||||
|
||||
/* 信息区块 */
|
||||
.section{margin-bottom:24px;}
|
||||
.section__title{font-size:var(--font-base);font-weight:600;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
|
||||
.section__title::before{content:'';width:3px;height:16px;background:var(--primary);border-radius:2px;}
|
||||
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 24px;}
|
||||
.info-item{display:flex;flex-direction:column;gap:4px;}
|
||||
.info-item__label{font-size:var(--font-xs);color:var(--text-secondary);}
|
||||
.info-item__value{font-size:var(--font-sm);color:var(--text-primary);}
|
||||
/* 咨询人信息 */
|
||||
.consult-header{display:flex;align-items:baseline;gap:16px;margin-bottom:16px;}
|
||||
.consult-header__title{font-size:var(--font-base);font-weight:700;}
|
||||
.tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-bottom:20px;}
|
||||
.tab{padding:8px 20px;font-size:var(--font-sm);cursor:pointer;color:var(--text-secondary);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .15s;user-select:none;}
|
||||
.tab:hover{color:var(--primary);}
|
||||
.tab.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:500;}
|
||||
.tab-panel{display:none;}
|
||||
.tab-panel.active{display:block;}
|
||||
|
||||
/* 健康指标 */
|
||||
.health-indicators{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
|
||||
.indicator{background:#FAFAFA;border-radius:var(--radius-md);padding:12px;text-align:center;}
|
||||
.indicator__value{font-size:var(--font-lg);font-weight:700;}
|
||||
.indicator__label{font-size:var(--font-xs);color:var(--text-secondary);margin-top:4px;}
|
||||
.indicator--normal .indicator__value{color:var(--success);}
|
||||
.indicator--warning .indicator__value{color:var(--warning);}
|
||||
.indicator--danger .indicator__value{color:var(--danger);}
|
||||
|
||||
/* 咨询历史 */
|
||||
.history-list{display:flex;flex-direction:column;gap:10px;}
|
||||
.history-item{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:#FAFAFA;border-radius:var(--radius-sm);font-size:var(--font-sm);}
|
||||
.history-item__left{display:flex;flex-direction:column;gap:2px;}
|
||||
.history-item__title{color:var(--text-primary);}
|
||||
.history-item__time{font-size:var(--font-xs);color:var(--text-secondary);}
|
||||
.history-item__type{font-size:var(--font-xs);padding:2px 6px;border-radius:8px;}
|
||||
.type-expert{background:var(--primary-light);color:var(--primary);}
|
||||
.type-assistant{background:#F6FFED;color:var(--success);}
|
||||
.sub-title{font-size:var(--font-sm);font-weight:600;color:#333;margin:20px 0 10px;padding-left:8px;border-left:3px solid var(--primary);}
|
||||
.sub-title:first-child{margin-top:0;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="dialog">
|
||||
<div class="dialog-header">
|
||||
<div class="dialog-title">咨询人档案</div>
|
||||
|
||||
<!-- 基本信息 -->
|
||||
<div class="section">
|
||||
<div class="section__title">基本信息</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<td class="label">姓名</td><td class="value">张伟</td>
|
||||
<td class="label">员工编号</td><td class="value">CQ001234</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">性别</td><td class="value">男</td>
|
||||
<td class="label">年龄</td><td class="value">38岁</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">单位</td><td class="value">采油一厂</td>
|
||||
<td class="label">部门</td><td class="value">心血管科</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- 咨询人信息 -->
|
||||
<div class="section">
|
||||
<div class="consult-header">
|
||||
<span class="consult-header__title">咨询人信息</span>
|
||||
</div>
|
||||
<div class="tabs" style="display:none;">
|
||||
<div class="tab active" onclick="switchTab(0)">本人</div>
|
||||
<div class="tab" onclick="switchTab(1)">配偶</div>
|
||||
<div class="tab" onclick="switchTab(2)">子女</div>
|
||||
</div>
|
||||
<div class="dialog-body">
|
||||
<!-- 头部信息 -->
|
||||
<div class="profile-header">
|
||||
<div class="profile-avatar">李</div>
|
||||
<div>
|
||||
<div class="profile-name">李明 <span class="tag tag-green">在职</span></div>
|
||||
<div class="profile-meta">工号：CQ002571 · 采油二厂 · 生产运行科 · 班长</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 基本信息 -->
|
||||
<div class="section">
|
||||
<div class="section__title">基本信息</div>
|
||||
<div class="info-grid">
|
||||
<div class="info-item"><span class="info-item__label">性别</span><span class="info-item__value">男</span></div>
|
||||
<div class="info-item"><span class="info-item__label">年龄</span><span class="info-item__value">38岁</span></div>
|
||||
<div class="info-item"><span class="info-item__label">联系电话</span><span class="info-item__value">138****5678</span></div>
|
||||
<div class="info-item"><span class="info-item__label">入职日期</span><span class="info-item__value">2012-07-01</span></div>
|
||||
<div class="info-item"><span class="info-item__label">所属单位</span><span class="info-item__value">采油二厂</span></div>
|
||||
<div class="info-item"><span class="info-item__label">所属部门</span><span class="info-item__value">生产运行科</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Tab: 本人 -->
|
||||
<div class="tab-panel active" id="tabPanel0">
|
||||
<div class="sub-title">基本信息</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<td class="label">咨询人姓名</td><td class="value">张伟父亲</td>
|
||||
<td class="label">性别</td><td class="value">男</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">出生日期</td><td class="value">1960-02-18</td>
|
||||
<td class="label">与本人关系</td><td class="value">父亲</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<!-- 健康概况 -->
|
||||
<div class="section">
|
||||
<div class="section__title">健康概况</div>
|
||||
<div class="health-indicators">
|
||||
<div class="indicator indicator--warning">
|
||||
<div class="indicator__value">6.8</div>
|
||||
<div class="indicator__label">空腹血糖(mmol/L)</div>
|
||||
</div>
|
||||
<div class="indicator indicator--normal">
|
||||
<div class="indicator__value">125/82</div>
|
||||
<div class="indicator__label">血压(mmHg)</div>
|
||||
</div>
|
||||
<div class="indicator indicator--normal">
|
||||
<div class="indicator__value">24.5</div>
|
||||
<div class="indicator__label">BMI</div>
|
||||
</div>
|
||||
<div class="indicator indicator--normal">
|
||||
<div class="indicator__value">4.8</div>
|
||||
<div class="indicator__label">总胆固醇(mmol/L)</div>
|
||||
</div>
|
||||
<div class="indicator indicator--warning">
|
||||
<div class="indicator__value">1.9</div>
|
||||
<div class="indicator__label">甘油三酯(mmol/L)</div>
|
||||
</div>
|
||||
<div class="indicator indicator--normal">
|
||||
<div class="indicator__value">68</div>
|
||||
<div class="indicator__label">心率(次/分)</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sub-title">生活习惯</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<td class="label">是否抽烟</td><td class="value">否</td>
|
||||
<td class="label">是否饮酒</td><td class="value">偶尔</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">饮食喜好</td><td class="value">清淡</td>
|
||||
<td class="label">睡眠质量</td><td class="value">一般</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<!-- 最近咨询记录 -->
|
||||
<div class="section">
|
||||
<div class="section__title">最近咨询记录</div>
|
||||
<div class="history-list">
|
||||
<div class="history-item">
|
||||
<div class="history-item__left">
|
||||
<span class="history-item__title">空腹血糖偏高咨询</span>
|
||||
<span class="history-item__time">2026-04-10 10:20</span>
|
||||
</div>
|
||||
<span class="history-item__type type-assistant">小助手</span>
|
||||
</div>
|
||||
<div class="history-item">
|
||||
<div class="history-item__left">
|
||||
<span class="history-item__title">体检报告解读</span>
|
||||
<span class="history-item__time">2026-03-15 14:30</span>
|
||||
</div>
|
||||
<span class="history-item__type type-expert">专家</span>
|
||||
</div>
|
||||
<div class="history-item">
|
||||
<div class="history-item__left">
|
||||
<span class="history-item__title">颈椎不适咨询</span>
|
||||
<span class="history-item__time">2026-02-20 09:10</span>
|
||||
</div>
|
||||
<span class="history-item__type type-assistant">小助手</span>
|
||||
</div>
|
||||
<div class="history-item">
|
||||
<div class="history-item__left">
|
||||
<span class="history-item__title">高血脂饮食建议</span>
|
||||
<span class="history-item__time">2025-12-08 16:45</span>
|
||||
</div>
|
||||
<span class="history-item__type type-expert">专家</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sub-title">身体情况</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<td class="label">身高</td><td class="value">175cm</td>
|
||||
<td class="label">体重</td><td class="value">72kg</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">过敏史</td><td class="value">无</td>
|
||||
<td class="label">遗传史</td><td class="value">高血压家族史</td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">既往史</td><td class="value">无</td>
|
||||
<td class="label">其他疾病</td><td class="value">无</td>
|
||||
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Tab: 配偶 -->
|
||||
<div class="tab-panel" id="tabPanel1">
|
||||
<div class="sub-title">基本信息</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<td class="label">咨询人姓名</td><td class="value">李芳</td>
|
||||
<td class="label">性别</td><td class="value">女</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">出生日期</td><td class="value">1990-03-22</td>
|
||||
<td class="label">与本人关系</td><td class="value">配偶</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Tab: 子女 -->
|
||||
<div class="tab-panel" id="tabPanel2">
|
||||
<div class="sub-title">基本信息</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<td class="label">咨询人姓名</td><td class="value">张小明</td>
|
||||
<td class="label">性别</td><td class="value">男</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label">出生日期</td><td class="value">2015-09-10</td>
|
||||
<td class="label">与本人关系</td><td class="value">子女</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function switchTab(idx) {
|
||||
document.querySelectorAll('.tab').forEach(function(t, i) {
|
||||
t.classList.toggle('active', i === idx);
|
||||
});
|
||||
document.querySelectorAll('.tab-panel').forEach(function(p, i) {
|
||||
p.classList.toggle('active', i === idx);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -0,0 +1,150 @@
|
||||
<!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:#F5F7FA;color:#333;min-width:1280px;}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--danger:#FF4D4F;--warning:#FAAD14;--text-primary:#333;--text-secondary:#666;--border:#E8E8E8;--font-xs:11px;--font-sm:13px;--font-base:15px;--font-lg:17px;--radius-sm:4px;--radius-md:8px;--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;font-size:var(--font-sm);margin-left:auto;}
|
||||
.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:var(--success);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-sm);}
|
||||
.main{margin-top:56px;padding:24px;}
|
||||
.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{color:#40a9ff;}
|
||||
.breadcrumb span{color:var(--text-secondary);}
|
||||
.form-card{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:28px 32px;max-width:960px;}
|
||||
.page-title{font-size:var(--font-lg);font-weight:700;margin-bottom:24px;}
|
||||
.form-group{margin-bottom:18px;display:flex;align-items:center;gap:12px;}
|
||||
.form-group label{width:90px;font-size:var(--font-sm);color:var(--text-secondary);text-align:right;flex-shrink:0;white-space:nowrap;}
|
||||
.form-group label .required{color:var(--danger);margin-right:2px;}
|
||||
.form-input{flex:1;height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px;font-size:var(--font-sm);outline:none;max-width:320px;}
|
||||
.form-input:focus{border-color:var(--primary);}
|
||||
.form-select{flex:1;height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 28px 0 12px;font-size:var(--font-sm);outline:none;appearance: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;max-width:320px;}
|
||||
.form-textarea{flex:1;min-height:90px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 12px;font-size:var(--font-sm);outline:none;resize:vertical;font-family:inherit;max-width:320px;}
|
||||
.form-textarea:focus,.form-select:focus{border-color:var(--primary);}
|
||||
.form-row{display:flex;gap:0;}
|
||||
.form-row .form-group{flex:1;min-width:0;}
|
||||
.section-title{font-size:var(--font-base);font-weight:600;color:#333;margin:28px 0 16px;padding-left:10px;border-left:3px solid var(--primary);}
|
||||
.section-title:first-of-type{margin-top:0;}
|
||||
.avatar-upload{width:80px;height:80px;border-radius:var(--radius-sm);background:#F5F7FA;border:2px dashed var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-secondary);font-size:var(--font-xs);flex-direction:column;gap:4px;transition:all .15s;}
|
||||
.avatar-upload:hover{border-color:var(--primary);color:var(--primary);}
|
||||
.radio-group{display:flex;align-items:center;gap:20px;flex:1;font-size:var(--font-sm);}
|
||||
.radio-group label{width:auto;color:var(--text-primary);display:flex;align-items:center;gap:5px;cursor:pointer;}
|
||||
.radio-group input[type="radio"]{margin:0;accent-color:var(--primary);}
|
||||
.form-hint{font-size:var(--font-xs);color:var(--danger);white-space:nowrap;}
|
||||
.form-footer{display:flex;justify-content:flex-end;gap:12px;margin-top:32px;padding-top:20px;border-top:1px solid var(--border);}
|
||||
.btn{height:36px;padding:0 24px;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:#333;border:1px solid var(--border);}.btn-default:hover{color:var(--primary);border-color:var(--primary);}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="top-bar">
|
||||
<div class="top-bar__logo"><svg viewBox="0 0 28 28" fill="none"><rect width="28" height="28" rx="6" fill="#52C41A"/><path d="M9 14.5l3 3 7-7" stroke="#fff" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>专家咨询–小助手</div>
|
||||
<nav class="top-bar__nav">
|
||||
<a href="current-consult.html">当前咨询</a>
|
||||
<a href="chat-message.html">对话消息</a>
|
||||
<a href="history-consult.html">历史咨询</a>
|
||||
<a href="expert-manage.html" class="active">专家管理</a>
|
||||
<a href="checkup-standard.html">体检标准化</a>
|
||||
<a href="sms-send.html">短信发送</a>
|
||||
<a href="consult-settle.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>
|
||||
<main class="main">
|
||||
<div class="breadcrumb">
|
||||
<a href="expert-manage.html">专家管理</a><span>/</span><span>新增专家</span>
|
||||
</div>
|
||||
<div class="form-card">
|
||||
<div class="page-title">新增专家</div>
|
||||
|
||||
<div class="section-title">基本信息</div>
|
||||
<div class="form-group">
|
||||
<label>头像</label>
|
||||
<div class="avatar-upload"><svg width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M10 4v12M4 10h12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>上传</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label><span class="required">*</span>账号</label><input class="form-input" placeholder="请输入"></div>
|
||||
<div class="form-group"><label><span class="required">*</span>密码</label><input class="form-input" type="password" placeholder="请输入"> <span class="form-hint">密码不能少于12位，必须包含大小写字母、数字、特殊符号。</span></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label><span class="required">*</span>姓名</label><input class="form-input" placeholder="请输入"></div>
|
||||
<div class="form-group"><label><span class="required">*</span>性别</label><div class="radio-group"><label><input type="radio" name="gender"> 男</label><label><input type="radio" name="gender"> 女</label></div></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>身份证号</label><input class="form-input" placeholder="请输入"></div>
|
||||
<div class="form-group"><label>手机号</label><input class="form-input" placeholder="请输入"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label><span class="required">*</span>医院</label><select class="form-select"><option>请选择</option><option>西安市第九医院</option><option>西安交大一附院</option><option>西京医院</option><option>唐都医院</option><option>西安市中心医院</option></select></div>
|
||||
<div class="form-group"><label><span class="required">*</span>科室</label><select class="form-select"><option>请选择</option><option>心脏内科</option><option>内分泌科</option><option>神经内科</option><option>骨科</option><option>消化内科</option><option>呼吸内科</option></select></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label><span class="required">*</span>职称</label><select class="form-select"><option>请选择</option><option>主任医师</option><option>副主任医师</option><option>主治医师</option><option>住院医师</option></select></div>
|
||||
<div class="form-group"><label>职务</label><select class="form-select"><option>请选择</option><option>科室主任</option><option>副主任</option><option>无</option></select></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label><span class="required">*</span>专家类型</label><div class="radio-group"><label><input type="radio" name="expertType"> 收费专家</label><label><input type="radio" name="expertType"> 免费专家</label><label><input type="radio" name="expertType"> 其他专家</label></div></div>
|
||||
<div class="form-group"><label><span class="required">*</span>专家状态</label><div class="radio-group"><label><input type="radio" name="expertStatus"> 有效</label><label><input type="radio" name="expertStatus"> 无效</label></div></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>专家编号</label><input class="form-input" placeholder="请输入"></div>
|
||||
<div class="form-group"><label>擅长疾病</label><input class="form-input" placeholder="请输入"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>注册日期</label><input class="form-input" type="date"></div>
|
||||
<div class="form-group"><label>出库如期</label><input class="form-input" type="date"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>是否推荐</label><div class="radio-group"><label><input type="radio" name="recommend"> 是</label><label><input type="radio" name="recommend" checked> 否</label></div></div>
|
||||
<div class="form-group"><label>排序</label><input class="form-input" type="number" placeholder="请输入"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>邮箱</label><input class="form-input" placeholder="请输入"></div>
|
||||
<div class="form-group"></div>
|
||||
</div>
|
||||
|
||||
<div class="section-title">扩展信息</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>学历</label><select class="form-select"><option>请选择</option><option>博士</option><option>硕士</option><option>本科</option><option>大专</option><option>其他</option></select></div>
|
||||
<div class="form-group"><label>毕业院校</label><input class="form-input" placeholder="请输入"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>毕业时间</label><input class="form-input" type="date"></div>
|
||||
<div class="form-group"><label>参加工作时间</label><input class="form-input" type="date"></div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-group"><label>民族</label><select class="form-select"><option>请选择</option><option>汉族</option><option>回族</option><option>藏族</option><option>其他</option></select></div>
|
||||
<div class="form-group"><label>籍贯</label><select class="form-select"><option>请选择</option><option>陕西</option><option>北京</option><option>上海</option><option>其他</option></select></div>
|
||||
</div>
|
||||
<div class="form-row" style="align-items:flex-start;">
|
||||
<div class="form-group" style="align-items:flex-start;"><label style="margin-top:8px;">个人简介</label><textarea class="form-textarea" placeholder="请输入"></textarea></div>
|
||||
<div class="form-group" style="align-items:flex-start;"><label style="margin-top:8px;">职业经历</label><textarea class="form-textarea" placeholder="请输入"></textarea></div>
|
||||
</div>
|
||||
<div class="form-row" style="align-items:flex-start;">
|
||||
<div class="form-group" style="align-items:flex-start;"><label style="margin-top:8px;">获奖/论文</label><textarea class="form-textarea" placeholder="请输入"></textarea></div>
|
||||
<div class="form-group"></div>
|
||||
</div>
|
||||
|
||||
<div class="form-footer">
|
||||
<a class="btn btn-default" href="expert-manage.html">取消</a>
|
||||
<button class="btn btn-primary">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,52 @@
|
||||
<!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;padding:24px;overflow-y:auto;}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--danger:#FF4D4F;--text-secondary:#666;--border:#E8E8E8;--font-xs:12px;--font-sm:13px;--font-base:15px;--radius-sm:4px;--radius-md:8px;}
|
||||
.dialog-title{font-size:var(--font-base);font-weight:700;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);}
|
||||
.step{margin-bottom:24px;}
|
||||
.step__label{font-size:var(--font-sm);font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:8px;}
|
||||
.step__num{width:22px;height:22px;border-radius:50%;background:var(--primary);color:#fff;font-size:var(--font-xs);display:inline-flex;align-items:center;justify-content:center;font-weight:700;}
|
||||
.step__desc{font-size:var(--font-sm);color:var(--text-secondary);margin-bottom:12px;}
|
||||
.link{color:var(--primary);cursor:pointer;font-size:var(--font-sm);text-decoration:none;}.link:hover{color:#40a9ff;}
|
||||
.upload-area{border:2px dashed var(--border);border-radius:var(--radius-md);padding:32px;text-align:center;cursor:pointer;transition:all .15s;}
|
||||
.upload-area:hover{border-color:var(--primary);background:var(--primary-light);}
|
||||
.upload-area__icon{font-size:32px;color:var(--primary);margin-bottom:8px;}
|
||||
.upload-area__text{font-size:var(--font-sm);color:var(--text-secondary);}
|
||||
.upload-area__hint{font-size:var(--font-xs);color:#999;margin-top:6px;}
|
||||
.dialog-footer{display:flex;justify-content:flex-end;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border);}
|
||||
.btn{height:36px;padding:0 20px;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:#333;border:1px solid var(--border);}.btn-default:hover{color:var(--primary);border-color:var(--primary);}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="dialog-title">批量导入专家</div>
|
||||
|
||||
<div class="step">
|
||||
<div class="step__label"><span class="step__num">1</span>下载导入模板</div>
|
||||
<div class="step__desc">请先下载标准模板，按模板格式填写专家信息后上传</div>
|
||||
<a class="link">下载导入模板（.xlsx）</a>
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<div class="step__label"><span class="step__num">2</span>上传文件</div>
|
||||
<div class="step__desc">支持 .xlsx、.xls 格式，单次最多导入 500 条</div>
|
||||
<div class="upload-area">
|
||||
<div class="upload-area__icon"><svg width="40" height="40" viewBox="0 0 40 40" fill="none"><path d="M20 6v20M12 14l8-8 8 8" stroke="#1890FF" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M6 28v6h28v-6" stroke="#1890FF" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg></div>
|
||||
<div class="upload-area__text">点击或拖拽文件到此区域上传</div>
|
||||
<div class="upload-area__hint">仅支持 .xlsx、.xls 格式文件</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-footer">
|
||||
<button class="btn btn-default" onclick="parent.postMessage('close-dialog','*')">取消</button>
|
||||
<button class="btn btn-primary">开始导入</button>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,258 @@
|
||||
<!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:#F5F7FA;color:#333;min-width:1280px;}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--warning:#FAAD14;--danger:#FF4D4F;--text-primary:#333;--text-secondary:#666;--border:#E8E8E8;--font-xs:11px;--font-sm:13px;--font-base:15px;--font-lg:17px;--font-xl:20px;--font-xxl:24px;--radius-sm:4px;--radius-md:8px;--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;font-size:var(--font-sm);margin-left:auto;}
|
||||
.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:var(--success);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-sm);}
|
||||
.main{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-input:focus{border-color:var(--primary);}
|
||||
.filter-select{height:36px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 28px 0 12px;font-size:var(--font-sm);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);}
|
||||
.btn-success{background:var(--success);color:#fff;}.btn-success:hover{background:#73d13d;}
|
||||
.btn-danger{background:#fff;color:var(--danger);border:1px solid var(--danger);}.btn-danger:hover{background:#FFF1F0;}
|
||||
.btn-warning{background:#fff;color:var(--warning);border:1px solid var(--warning);}.btn-warning:hover{background:#FFFBE6;}
|
||||
.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{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-blue{background:var(--primary-light);color:var(--primary);}
|
||||
.expert-info{display:flex;align-items:center;gap:10px;}
|
||||
.expert-avatar{width:36px;height:36px;border-radius:50%;background:var(--primary-light);display:flex;align-items:center;justify-content:center;color:var(--primary);font-weight:600;font-size:var(--font-sm);flex-shrink:0;}
|
||||
.expert-name{font-weight:500;}
|
||||
.expert-dept{font-size:var(--font-xs);color:var(--text-secondary);}
|
||||
.link{color:var(--primary);cursor:pointer;font-size:var(--font-sm);}.link:hover{color:#40a9ff;}
|
||||
.link-danger{color:var(--danger);cursor:pointer;font-size:var(--font-sm);}.link-danger:hover{color:#ff7875;}
|
||||
.link-warning{color:var(--warning);cursor:pointer;font-size:var(--font-sm);}.link-warning:hover{color:#ffc53d;}
|
||||
.op-divider{color:var(--border);margin:0 4px;}
|
||||
.toggle{position:relative;width:40px;height:22px;background:#ccc;border-radius:11px;cursor:pointer;transition:background .2s;display:inline-block;vertical-align:middle;}
|
||||
.toggle.on{background:var(--primary);}
|
||||
.toggle::after{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;background:#fff;border-radius:50%;transition:left .2s;}
|
||||
.toggle.on::after{left:20px;}
|
||||
.sort-num{display:inline-flex;align-items:center;justify-content:center;width:28px;height:24px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--font-sm);background:#fff;text-align:center;}
|
||||
.dropdown{position:relative;display:inline-block;}
|
||||
.dropdown__trigger{color:var(--primary);cursor:pointer;font-size:var(--font-sm);user-select:none;}.dropdown__trigger:hover{color:#40a9ff;}
|
||||
.dropdown__menu{display:none;position:absolute;right:0;top:100%;margin-top:4px;background:#fff;border-radius:var(--radius-sm);box-shadow:0 2px 8px rgba(0,0,0,0.15);min-width:110px;z-index:50;padding:4px 0;}
|
||||
.dropdown.open .dropdown__menu{display:block;}
|
||||
.dropdown__item{display:block;padding:8px 16px;font-size:var(--font-sm);color:var(--text-primary);cursor:pointer;white-space:nowrap;transition:background .15s;}
|
||||
.dropdown__item:hover{background:#F5F7FA;color:var(--primary);}
|
||||
.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);}
|
||||
.action-bar{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
|
||||
.overlay-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.45);z-index:1000;align-items:center;justify-content:center;}
|
||||
.overlay-modal.open{display:flex;}
|
||||
.overlay-modal__box{background:#fff;border-radius:var(--radius-md);overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,0.15);position:relative;max-height:90vh;display:flex;flex-direction:column;}
|
||||
.overlay-modal__close{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:50%;background:rgba(0,0,0,0.04);border:none;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#999;z-index:10;transition:all .15s;}
|
||||
.overlay-modal__close:hover{background:rgba(0,0,0,0.08);color:#333;}
|
||||
.overlay-modal iframe{border:none;display:block;}
|
||||
</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="#52C41A"/><path d="M9 14.5l3 3 7-7" stroke="#fff" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/></svg>专家咨询–小助手</div>
|
||||
<nav class="top-bar__nav">
|
||||
<a href="current-consult.html">当前咨询</a>
|
||||
<a href="chat-message.html">对话消息</a>
|
||||
<a href="history-consult.html">历史咨询</a>
|
||||
<a href="expert-manage.html" class="active">专家管理</a>
|
||||
<a href="checkup-standard.html">体检标准化</a>
|
||||
<a href="sms-send.html">短信发送</a>
|
||||
<a href="consult-settle.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>
|
||||
<main class="main">
|
||||
<div class="filter-bar">
|
||||
<div class="filter-item"><label>用户账号</label><input class="filter-input" type="text" placeholder="请输入用户账号" style="min-width:140px;"></div>
|
||||
<div class="filter-item"><label>专家编号</label><input class="filter-input" type="text" placeholder="请输入专家编号" style="min-width:140px;"></div>
|
||||
<div class="filter-item"><label>专家姓名</label><input class="filter-input" type="text" placeholder="请输入专家姓名" style="min-width:140px;"></div>
|
||||
<div class="filter-item"><label>医院</label>
|
||||
<select class="filter-select"><option>全部医院</option></select></div>
|
||||
<div class="filter-item"><label>科室</label>
|
||||
<select class="filter-select"><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>
|
||||
<div class="filter-item"><label>咨询状态</label>
|
||||
<select class="filter-select"><option>全部状态</option><option>开启咨询</option><option>关闭咨询</option></select>
|
||||
</div>
|
||||
<button class="btn btn-primary"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><circle cx="6" cy="6" r="4" stroke="currentColor" stroke-width="1.4"/><path d="M10 10l2.5 2.5" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/></svg>查询</button>
|
||||
<button class="btn btn-default">重置</button>
|
||||
</div>
|
||||
<div class="action-bar">
|
||||
<a class="btn btn-primary" href="expert-detail-dialog.html" style="text-decoration:none;"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 2v10M2 7h10" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/></svg>新增专家</a>
|
||||
<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" onclick="openOverlay('export-task-dialog.html',720,520)"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><rect x="2" y="2" width="10" height="10" rx="2" stroke="currentColor" stroke-width="1.3" fill="none"/><path d="M5 7h4M7 5v4" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/></svg>查看导出任务</button>
|
||||
<button class="btn btn-success" onclick="openOverlay('expert-import-dialog.html',600,480)"><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>
|
||||
<button class="btn btn-default" onclick="openOverlay('import-task-dialog.html',720,520)"><svg width="14" height="14" viewBox="0 0 14 14" fill="none"><rect x="2" y="2" width="10" height="10" rx="2" stroke="currentColor" stroke-width="1.3" fill="none"/><path d="M5 7h4M7 5v4" stroke="currentColor" stroke-width="1.3" stroke-linecap="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);">共 86 位专家</div>
|
||||
</div>
|
||||
<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><th>操作</th></tr></thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>guojianqiang</td><td>CQZJ20250018</td>
|
||||
<td><div class="expert-info"><div class="expert-avatar">郭</div><div class="expert-name">郭建强</div></div></td>
|
||||
<td>西安市第九医院</td><td>心脏内科</td><td>副主任医师</td>
|
||||
<td><span class="tag tag-green">有效</span></td>
|
||||
<td><span class="tag tag-green">开启咨询</span></td>
|
||||
<td>免费专家</td><td><span class="sort-num">1</span></td>
|
||||
<td><span class="toggle on"></span></td>
|
||||
<td>
|
||||
<span class="link-warning">关闭咨询</span><span class="op-divider">|</span>
|
||||
<span class="link" onclick="location.href='expert-detail-dialog.html'">详情</span><span class="op-divider">|</span>
|
||||
<div class="dropdown"><span class="dropdown__trigger" onclick="toggleDropdown(this)">更多></span><div class="dropdown__menu"><span class="dropdown__item" onclick="location.href='expert-detail-dialog.html'">编辑</span><span class="dropdown__item">重置密码</span><span class="dropdown__item">排班配置</span></div></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2</td>
|
||||
<td>wangxiuying</td><td>CQZJ20250025</td>
|
||||
<td><div class="expert-info"><div class="expert-avatar">王</div><div class="expert-name">王秀英</div></div></td>
|
||||
<td>西安交大一附院</td><td>内分泌科</td><td>主任医师</td>
|
||||
<td><span class="tag tag-green">有效</span></td>
|
||||
<td><span class="tag tag-green">开启咨询</span></td>
|
||||
<td>收费专家</td><td><span class="sort-num">2</span></td>
|
||||
<td><span class="toggle on"></span></td>
|
||||
<td>
|
||||
<span class="link-warning">关闭咨询</span><span class="op-divider">|</span>
|
||||
<span class="link" onclick="location.href='expert-detail-dialog.html'">详情</span><span class="op-divider">|</span>
|
||||
<div class="dropdown"><span class="dropdown__trigger" onclick="toggleDropdown(this)">更多></span><div class="dropdown__menu"><span class="dropdown__item" onclick="location.href='expert-detail-dialog.html'">编辑</span><span class="dropdown__item">重置密码</span><span class="dropdown__item">排班配置</span></div></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3</td>
|
||||
<td>zhangweiqiang</td><td>CQZJ20260003</td>
|
||||
<td><div class="expert-info"><div class="expert-avatar">张</div><div class="expert-name">张伟强</div></div></td>
|
||||
<td>西安市中心医院</td><td>神经内科</td><td>主治医师</td>
|
||||
<td><span class="tag tag-red">无效</span></td>
|
||||
<td><span class="tag tag-red">关闭咨询</span></td>
|
||||
<td>收费专家</td><td><span class="sort-num">3</span></td>
|
||||
<td><span class="toggle"></span></td>
|
||||
<td>
|
||||
<span class="link" style="color:var(--success)">开启咨询</span><span class="op-divider">|</span>
|
||||
<span class="link" onclick="location.href='expert-detail-dialog.html'">详情</span><span class="op-divider">|</span>
|
||||
<div class="dropdown"><span class="dropdown__trigger" onclick="toggleDropdown(this)">更多></span><div class="dropdown__menu"><span class="dropdown__item" onclick="location.href='expert-detail-dialog.html'">编辑</span><span class="dropdown__item">重置密码</span><span class="dropdown__item">排班配置</span></div></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>chenjianguo</td><td>CQZJ20260008</td>
|
||||
<td><div class="expert-info"><div class="expert-avatar">陈</div><div class="expert-name">陈建国</div></div></td>
|
||||
<td>唐都医院</td><td>骨科</td><td>主任医师</td>
|
||||
<td><span class="tag tag-green">有效</span></td>
|
||||
<td><span class="tag tag-green">开启咨询</span></td>
|
||||
<td>免费专家</td><td><span class="sort-num">4</span></td>
|
||||
<td><span class="toggle on"></span></td>
|
||||
<td>
|
||||
<span class="link-warning">关闭咨询</span><span class="op-divider">|</span>
|
||||
<span class="link" onclick="location.href='expert-detail-dialog.html'">详情</span><span class="op-divider">|</span>
|
||||
<div class="dropdown"><span class="dropdown__trigger" onclick="toggleDropdown(this)">更多></span><div class="dropdown__menu"><span class="dropdown__item" onclick="location.href='expert-detail-dialog.html'">编辑</span><span class="dropdown__item">重置密码</span><span class="dropdown__item">排班配置</span></div></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>5</td>
|
||||
<td>sunliping</td><td>CQZJ20260012</td>
|
||||
<td><div class="expert-info"><div class="expert-avatar">孙</div><div class="expert-name">孙丽萍</div></div></td>
|
||||
<td>西京医院</td><td>消化内科</td><td>副主任医师</td>
|
||||
<td><span class="tag tag-green">有效</span></td>
|
||||
<td><span class="tag tag-green">开启咨询</span></td>
|
||||
<td>收费专家</td><td><span class="sort-num">5</span></td>
|
||||
<td><span class="toggle on"></span></td>
|
||||
<td>
|
||||
<span class="link-warning">关闭咨询</span><span class="op-divider">|</span>
|
||||
<span class="link" onclick="location.href='expert-detail-dialog.html'">详情</span><span class="op-divider">|</span>
|
||||
<div class="dropdown"><span class="dropdown__trigger" onclick="toggleDropdown(this)">更多></span><div class="dropdown__menu"><span class="dropdown__item" onclick="location.href='expert-detail-dialog.html'">编辑</span><span class="dropdown__item">重置密码</span><span class="dropdown__item">排班配置</span></div></div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="pagination">
|
||||
<span>共 86 条</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">4</button>
|
||||
<button class="page-btn">5</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="overlay-modal" id="overlayModal" onclick="if(event.target===this)closeOverlay()">
|
||||
<div class="overlay-modal__box" id="overlayBox">
|
||||
<button class="overlay-modal__close" onclick="closeOverlay()">✕</button>
|
||||
<iframe id="overlayFrame" src=""></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function openOverlay(url, w, h) {
|
||||
var box = document.getElementById('overlayBox');
|
||||
box.style.width = w + 'px';
|
||||
var frame = document.getElementById('overlayFrame');
|
||||
frame.style.width = w + 'px';
|
||||
frame.style.height = h + 'px';
|
||||
frame.src = url;
|
||||
document.getElementById('overlayModal').classList.add('open');
|
||||
document.body.style.overflow = 'hidden';
|
||||
}
|
||||
function closeOverlay() {
|
||||
document.getElementById('overlayModal').classList.remove('open');
|
||||
document.getElementById('overlayFrame').src = '';
|
||||
document.body.style.overflow = '';
|
||||
}
|
||||
window.addEventListener('message', function(e) {
|
||||
if (e.data === 'close-dialog') closeOverlay();
|
||||
});
|
||||
function toggleDropdown(el) {
|
||||
var dd = el.parentElement;
|
||||
var wasOpen = dd.classList.contains('open');
|
||||
document.querySelectorAll('.dropdown.open').forEach(function(d){ d.classList.remove('open'); });
|
||||
if (!wasOpen) dd.classList.add('open');
|
||||
}
|
||||
document.addEventListener('click', function(e) {
|
||||
if (!e.target.closest('.dropdown')) {
|
||||
document.querySelectorAll('.dropdown.open').forEach(function(d){ d.classList.remove('open'); });
|
||||
}
|
||||
});
|
||||
</script></main>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,58 @@
|
||||
<!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;padding:24px;overflow-y:auto;}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--warning:#FAAD14;--danger:#FF4D4F;--text-secondary:#666;--border:#E8E8E8;--font-xs:12px;--font-sm:13px;--font-base:15px;--radius-sm:4px;}
|
||||
.dialog-title{font-size:var(--font-base);font-weight:700;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);}
|
||||
table{width:100%;border-collapse:collapse;}
|
||||
thead th{background:#FAFAFA;padding:10px 14px;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:12px 14px;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-blue{background:var(--primary-light);color:var(--primary);}
|
||||
.tag-orange{background:#FFF7E6;color:var(--warning);}
|
||||
.tag-red{background:#FFF1F0;color:var(--danger);}
|
||||
.link{color:var(--primary);cursor:pointer;font-size:var(--font-sm);}.link:hover{color:#40a9ff;}
|
||||
.empty{text-align:center;padding:40px;color:var(--text-secondary);font-size:var(--font-sm);}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="dialog-title">导出任务列表</div>
|
||||
<table>
|
||||
<thead><tr><th>任务名称</th><th>创建时间</th><th>状态</th><th>操作</th></tr></thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>专家列表导出_20260413</td>
|
||||
<td>2026-04-13 14:30:22</td>
|
||||
<td><span class="tag tag-green">已完成</span></td>
|
||||
<td><span class="link">下载</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>专家列表导出_20260410</td>
|
||||
<td>2026-04-10 09:15:08</td>
|
||||
<td><span class="tag tag-green">已完成</span></td>
|
||||
<td><span class="link">下载</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>专家列表导出_20260405</td>
|
||||
<td>2026-04-05 16:42:11</td>
|
||||
<td><span class="tag tag-red">已失败</span></td>
|
||||
<td><span class="link">重试</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>专家列表导出_20260401</td>
|
||||
<td>2026-04-01 10:20:33</td>
|
||||
<td><span class="tag tag-green">已完成</span></td>
|
||||
<td><span class="link">下载</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
@@ -84,6 +84,7 @@
|
||||
<a href="current-consult.html">当前咨询</a>
|
||||
<a href="chat-message.html">对话消息</a>
|
||||
<a href="history-consult.html" class="active">历史咨询</a>
|
||||
<a href="expert-manage.html">专家管理</a>
|
||||
<a href="checkup-standard.html">体检标准化</a>
|
||||
<a href="sms-send.html">短信发送</a>
|
||||
<a href="consult-settle.html">咨询结算</a>
|
||||
|
||||
@@ -0,0 +1,57 @@
|
||||
<!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;padding:24px;overflow-y:auto;}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--warning:#FAAD14;--danger:#FF4D4F;--text-secondary:#666;--border:#E8E8E8;--font-xs:12px;--font-sm:13px;--font-base:15px;--radius-sm:4px;}
|
||||
.dialog-title{font-size:var(--font-base);font-weight:700;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--border);}
|
||||
table{width:100%;border-collapse:collapse;}
|
||||
thead th{background:#FAFAFA;padding:10px 14px;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:12px 14px;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-blue{background:var(--primary-light);color:var(--primary);}
|
||||
.tag-orange{background:#FFF7E6;color:var(--warning);}
|
||||
.tag-red{background:#FFF1F0;color:var(--danger);}
|
||||
.link{color:var(--primary);cursor:pointer;font-size:var(--font-sm);}.link:hover{color:#40a9ff;}
|
||||
.result{font-size:var(--font-xs);color:var(--text-secondary);}
|
||||
.result-success{color:var(--success);}
|
||||
.result-fail{color:var(--danger);}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="dialog-title">导入任务列表</div>
|
||||
<table>
|
||||
<thead><tr><th>文件名</th><th>导入时间</th><th>状态</th><th>结果</th><th>操作</th></tr></thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>专家信息_批量导入.xlsx</td>
|
||||
<td>2026-04-12 11:20:15</td>
|
||||
<td><span class="tag tag-green">已完成</span></td>
|
||||
<td><span class="result">成功 <span class="result-success">48</span> 条，失败 <span class="result-fail">2</span> 条</span></td>
|
||||
<td><span class="link">下载失败记录</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>新增专家名单.xlsx</td>
|
||||
<td>2026-04-08 09:45:30</td>
|
||||
<td><span class="tag tag-green">已完成</span></td>
|
||||
<td><span class="result">成功 <span class="result-success">25</span> 条，失败 <span class="result-fail">0</span> 条</span></td>
|
||||
<td>—</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>专家补录_0401.xlsx</td>
|
||||
<td>2026-04-01 14:10:22</td>
|
||||
<td><span class="tag tag-red">已失败</span></td>
|
||||
<td><span class="result">文件格式错误</span></td>
|
||||
<td><span class="link">重新导入</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
@@ -70,6 +70,7 @@
|
||||
<a href="current-consult.html">当前咨询</a>
|
||||
<a href="chat-message.html">对话消息</a>
|
||||
<a href="history-consult.html">历史咨询</a>
|
||||
<a href="expert-manage.html">专家管理</a>
|
||||
<a href="checkup-standard.html">体检标准化</a>
|
||||
<a href="sms-send.html" class="active">短信发送</a>
|
||||
<a href="consult-settle.html">咨询结算</a>
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<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;--border:#E8E8E8;--font-xs:11px;--font-sm:13px;--font-base:15px;--font-lg:17px;--font-xl:20px;--radius-sm:4px;--radius-md:8px;--shadow-sm:0 1px 4px rgba(0,0,0,0.08);}
|
||||
:root{--primary:#1890FF;--primary-light:#E6F7FF;--success:#52C41A;--warning:#FAAD14;--danger:#FF4D4F;--text-primary:#333;--text-secondary:#666;--text-placeholder:#999;--border:#E8E8E8;--font-xs:11px;--font-sm:13px;--font-base:15px;--font-lg:17px;--font-xl:20px;--radius-sm:4px;--radius-md:8px;--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;}
|
||||
@@ -17,6 +17,7 @@
|
||||
.top-bar__nav a.active{color:#fff;background:var(--primary);}
|
||||
.top-bar__right{display:flex;align-items:center;gap:16px;font-size:var(--font-sm);}
|
||||
.btn-back{color:rgba(255,255,255,0.65);cursor:pointer;display:flex;align-items:center;gap:4px;}
|
||||
.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;}
|
||||
@@ -25,61 +26,71 @@
|
||||
.sidebar-item.active{color:#fff;background:var(--primary);}
|
||||
.sidebar-item svg{width:16px;height:16px;flex-shrink:0;}
|
||||
.main{margin-left:240px;margin-top:56px;padding:24px;}
|
||||
.page-header{margin-bottom:20px;display:flex;align-items:flex-start;justify-content:space-between;}
|
||||
.page-header__left{}
|
||||
.page-header__title{font-size:var(--font-xl);font-weight:600;}
|
||||
.page-header__desc{font-size:var(--font-sm);color:var(--text-secondary);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);}
|
||||
/* 须知编辑区 */
|
||||
/* TAB 切换 */
|
||||
.notice-tabs{display:flex;gap:0;margin-bottom:20px;border-bottom:2px solid var(--border);background:#fff;border-radius:var(--radius-md) var(--radius-md) 0 0;box-shadow:var(--shadow-sm);}
|
||||
.notice-tab{padding:14px 32px;font-size:var(--font-base);color:var(--text-secondary);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s;font-weight:500;}
|
||||
.notice-tab:hover{color:var(--primary);}
|
||||
.notice-tab.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600;}
|
||||
/* 双栏布局 */
|
||||
.notice-card{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;}
|
||||
.notice-card__header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);}
|
||||
.notice-card__header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);}
|
||||
.notice-card__title{font-size:var(--font-base);font-weight:600;}
|
||||
.notice-card__actions{display:flex;gap:8px;}
|
||||
.notice-card__body{padding:24px;}
|
||||
.preview-box{background:#F8FBFF;border:1px solid #D6E8FF;border-radius:var(--radius-md);padding:20px 24px;margin-bottom:24px;}
|
||||
.preview-box__label{font-size:var(--font-xs);color:var(--primary);margin-bottom:12px;font-weight:500;display:flex;align-items:center;gap:6px;}
|
||||
.preview-box__label svg{width:14px;height:14px;}
|
||||
.preview-title{font-size:var(--font-base);font-weight:600;margin-bottom:12px;}
|
||||
.preview-content{font-size:var(--font-sm);color:var(--text-secondary);line-height:1.8;}
|
||||
.preview-content p{margin-bottom:8px;}
|
||||
.preview-content strong{color:var(--text-primary);}
|
||||
.editor-section{}
|
||||
.notice-layout{display:flex;gap:24px;padding:24px;}
|
||||
.notice-editor{flex:1;min-width:0;}
|
||||
.notice-preview{width:340px;flex-shrink:0;}
|
||||
/* 编辑器 */
|
||||
.editor-section__label{font-size:var(--font-sm);color:var(--text-secondary);margin-bottom:8px;font-weight:500;}
|
||||
.editor-title-input{width:100%;height:44px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 14px;font-size:var(--font-base);outline:none;margin-bottom:16px;font-weight:600;}
|
||||
.editor-title-input:focus{border-color:var(--primary);}
|
||||
.editor-title-input:focus{border-color:var(--primary);box-shadow:0 0 0 2px rgba(24,144,255,0.2);}
|
||||
.editor-toolbar{display:flex;gap:4px;padding:8px 12px;border:1px solid var(--border);border-bottom:none;border-radius:var(--radius-sm) var(--radius-sm) 0 0;background:#FAFAFA;flex-wrap:wrap;}
|
||||
.toolbar-btn{padding:4px 8px;border:none;background:transparent;cursor:pointer;border-radius:var(--radius-sm);font-size:var(--font-sm);color:var(--text-secondary);display:inline-flex;align-items:center;justify-content:center;}
|
||||
.toolbar-btn:hover{background:#E8E8E8;color:var(--text-primary);}
|
||||
.toolbar-divider{width:1px;background:var(--border);margin:2px 4px;}
|
||||
.editor-body{width:100%;min-height:240px;border:1px solid var(--border);border-radius:0 0 var(--radius-sm) var(--radius-sm);padding:14px;font-size:var(--font-sm);outline:none;line-height:1.8;color:var(--text-primary);}
|
||||
.editor-body{width:100%;min-height:280px;border:1px solid var(--border);border-radius:0 0 var(--radius-sm) var(--radius-sm);padding:14px;font-size:var(--font-sm);outline:none;line-height:1.8;color:var(--text-primary);}
|
||||
.editor-body:focus{border-color:var(--primary);}
|
||||
.editor-footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px;}
|
||||
.editor-footer__hint{font-size:var(--font-xs);color:#999;}
|
||||
/* 历史版本 */
|
||||
.version-list{margin-top:24px;}
|
||||
.version-list__title{font-size:var(--font-sm);font-weight:500;margin-bottom:12px;color:var(--text-secondary);}
|
||||
.version-item{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);}
|
||||
/* 预览区 */
|
||||
.preview-panel{background:#F8FBFF;border:1px solid #D6E8FF;border-radius:var(--radius-md);padding:16px;}
|
||||
.preview-panel__label{font-size:var(--font-xs);color:var(--primary);margin-bottom:12px;font-weight:500;display:flex;align-items:center;gap:6px;}
|
||||
.preview-panel__label svg{width:14px;height:14px;}
|
||||
.preview-phone{border:1px solid var(--border);border-radius:12px;padding:20px;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.08);}
|
||||
.preview-phone__title{font-size:var(--font-base);font-weight:600;margin-bottom:12px;}
|
||||
.preview-phone__content{font-size:var(--font-sm);color:var(--text-secondary);line-height:1.8;min-height:160px;white-space:pre-wrap;}
|
||||
.preview-phone__content p{margin-bottom:8px;}
|
||||
.preview-phone__content strong{color:var(--text-primary);}
|
||||
.preview-phone__btns{margin-top:16px;display:flex;gap:8px;}
|
||||
.preview-phone__btn{flex:1;height:36px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;}
|
||||
.preview-phone__btn--cancel{border:1px solid var(--border);color:#666;}
|
||||
.preview-phone__btn--ok{background:var(--primary);color:#fff;}
|
||||
/* 历史版本弹窗 */
|
||||
.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.45);z-index:999;display:none;align-items:center;justify-content:center;}
|
||||
.modal-overlay.open{display:flex;}
|
||||
.modal{background:#fff;border-radius:var(--radius-md);box-shadow:0 4px 16px rgba(0,0,0,0.15);width:560px;max-height:80vh;display:flex;flex-direction:column;}
|
||||
.modal__header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);flex-shrink:0;}
|
||||
.modal__title{font-size:var(--font-lg);font-weight:600;}
|
||||
.modal__close{width:32px;height:32px;border-radius:50%;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);font-size:18px;}
|
||||
.modal__close:hover{background:#F5F5F5;}
|
||||
.modal__body{flex:1;overflow-y:auto;padding:24px;}
|
||||
.version-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);}
|
||||
.version-item:last-child{border-bottom:none;}
|
||||
.version-tag{font-size:var(--font-xs);background:var(--primary-light);color:var(--primary);padding:2px 8px;border-radius:10px;}
|
||||
.version-tag.current{background:#F6FFED;color:var(--success);}
|
||||
.version-info{flex:1;font-size:var(--font-sm);color:var(--text-secondary);}
|
||||
.version-time{font-size:var(--font-xs);color:#999;}
|
||||
.version-tag{font-size:var(--font-xs);padding:2px 8px;border-radius:10px;}
|
||||
.version-tag--current{background:#F6FFED;color:var(--success);}
|
||||
.version-tag--history{background:var(--primary-light);color:var(--primary);}
|
||||
.version-info{flex:1;}
|
||||
.version-info__title{font-size:var(--font-sm);color:var(--text-primary);margin-bottom:2px;}
|
||||
.version-info__meta{font-size:var(--font-xs);color:#999;}
|
||||
.link{color:var(--primary);cursor:pointer;font-size:var(--font-sm);}
|
||||
/* 编辑弹窗 */
|
||||
.edit-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.45);z-index:999;display:none;align-items:center;justify-content:center;}
|
||||
.edit-modal-overlay.open{display:flex;}
|
||||
.edit-modal{background:#fff;border-radius:var(--radius-md);box-shadow:0 4px 16px rgba(0,0,0,0.15);width:90%;max-width:600px;max-height:90vh;overflow-y:auto;display:flex;flex-direction:column;}
|
||||
.edit-modal__header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);flex-shrink:0;}
|
||||
.edit-modal__title{font-size:var(--font-lg);font-weight:600;}
|
||||
.edit-modal__close{width:32px;height:32px;border-radius:50%;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);font-size:18px;}
|
||||
.edit-modal__close:hover{background:#F5F5F5;}
|
||||
.edit-modal__body{flex:1;padding:24px;overflow-y:auto;}
|
||||
.edit-modal__footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid var(--border);flex-shrink:0;}
|
||||
|
||||
.link:hover{color:#40a9ff;}
|
||||
/* TAB内容切换 */
|
||||
.tab-pane{display:none;}
|
||||
.tab-pane.active{display:block;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -127,98 +138,222 @@
|
||||
</a>
|
||||
</aside>
|
||||
<main class="main">
|
||||
<div class="notice-card">
|
||||
<div class="notice-card__header">
|
||||
<div class="notice-card__title">当前生效版本预览</div>
|
||||
<div class="notice-card__actions">
|
||||
<!-- [交互] 点击进入编辑模式（打开编辑弹窗） -->
|
||||
<button class="btn btn-primary" onclick="openEditModal()">>
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 10L10 2l2 2-8 8-2.5.5.5-2.5z" stroke="currentColor" stroke-width="1.4" stroke-linejoin="round"/></svg>
|
||||
编辑内容
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice-card__body">
|
||||
<!-- 移动端弹窗预览 -->
|
||||
<div class="preview-box">
|
||||
<div class="preview-box__label">
|
||||
<svg viewBox="0 0 14 14" fill="none"><rect x="3" y="1" width="8" height="12" rx="1.5" stroke="currentColor" stroke-width="1.2"/><path d="M5.5 3h3M5.5 5h3M5.5 7h1.5" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>
|
||||
移动端弹窗预览效果
|
||||
</div>
|
||||
<div style="max-width:320px;margin:0 auto;border:1px solid var(--border);border-radius:12px;padding:20px;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.08);">
|
||||
<div class="preview-title">咨询须知</div>
|
||||
<div class="preview-content">
|
||||
<p><strong>1. 服务说明</strong></p>
|
||||
<p>本平台提供图文咨询和视频咨询两种方式，专家将在24小时内回复您的问题。</p>
|
||||
<p><strong>2. 使用规范</strong></p>
|
||||
<p>请详细描述您的症状或健康问题，上传相关检查报告有助于专家准确判断。</p>
|
||||
<p><strong>3. 注意事项</strong></p>
|
||||
<p>本咨询服务仅供健康指导参考，不作为正式医疗诊断依据。如病情紧急，请立即前往医院就诊或拨打急救电话120。</p>
|
||||
<p><strong>4. 隐私保护</strong></p>
|
||||
<p>您的咨询内容将严格保密，仅接诊专家可查看。</p>
|
||||
</div>
|
||||
<div style="margin-top:16px;display:flex;gap:8px;">
|
||||
<div style="flex:1;height:36px;border:1px solid var(--border);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;color:#666;">不同意</div>
|
||||
<div style="flex:1;height:36px;background:var(--primary);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;color:#fff;">同意并继续</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- TAB 切换 -->
|
||||
<div class="notice-tabs">
|
||||
<div class="notice-tab active" onclick="switchTab('text')">图文咨询</div>
|
||||
<div class="notice-tab" onclick="switchTab('video')">视频咨询</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 编辑弹窗 -->
|
||||
<div class="edit-modal-overlay" id="edit-modal-overlay" onclick="if(event.target===this)closeEditModal()">
|
||||
<div class="edit-modal">
|
||||
<div class="edit-modal__header">
|
||||
<div class="edit-modal__title">编辑咨询须知</div>
|
||||
<button class="edit-modal__close" onclick="closeEditModal()">✕</button>
|
||||
</div>
|
||||
<div class="edit-modal__body">
|
||||
<div class="editor-section__label">弹窗标题</div>
|
||||
<input class="editor-title-input" type="text" value="咨询须知" placeholder="请输入弹窗标题">
|
||||
<div class="editor-section__label" style="margin-top:16px;">须知内容</div>
|
||||
<div class="editor-toolbar">
|
||||
<button class="toolbar-btn" title="加粗"><strong>B</strong></button>
|
||||
<button class="toolbar-btn" title="斜体"><em>I</em></button>
|
||||
<button class="toolbar-btn" title="下划线"><u>U</u></button>
|
||||
<div class="toolbar-divider"></div>
|
||||
<button class="toolbar-btn">有序列表</button>
|
||||
<button class="toolbar-btn">无序列表</button>
|
||||
<div class="toolbar-divider"></div>
|
||||
<button class="toolbar-btn">字号 ▾</button>
|
||||
<button class="toolbar-btn">颜色 ▾</button>
|
||||
<!-- 图文咨询 -->
|
||||
<div class="tab-pane active" id="pane-text">
|
||||
<div class="notice-card">
|
||||
<div class="notice-card__header">
|
||||
<div class="notice-card__title">图文咨询须知</div>
|
||||
<div class="notice-card__actions">
|
||||
<button class="btn btn-default" onclick="openHistory('text')">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 1a6 6 0 106 6" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/><path d="M7 4v3.5l2.5 1.5" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/></svg>
|
||||
历史版本
|
||||
</button>
|
||||
<button class="btn btn-primary" onclick="saveNotice('text')">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 7l3.5 3.5L12 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
发布生效
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="editor-body" contenteditable="true">
|
||||
1. 服务说明
|
||||
本平台提供图文咨询和视频咨询两种方式，专家将在24小时内回复您的问题。
|
||||
<div class="notice-layout">
|
||||
<div class="notice-editor">
|
||||
<div class="editor-section__label">弹窗标题</div>
|
||||
<input class="editor-title-input" id="title-text" type="text" value="图文咨询须知" placeholder="请输入弹窗标题" oninput="syncPreview('text')">
|
||||
<div class="editor-section__label">须知内容</div>
|
||||
<div class="editor-toolbar">
|
||||
<button class="toolbar-btn" title="加粗"><strong>B</strong></button>
|
||||
<button class="toolbar-btn" title="斜体"><em>I</em></button>
|
||||
<button class="toolbar-btn" title="下划线"><u>U</u></button>
|
||||
<div class="toolbar-divider"></div>
|
||||
<button class="toolbar-btn">有序列表</button>
|
||||
<button class="toolbar-btn">无序列表</button>
|
||||
<div class="toolbar-divider"></div>
|
||||
<button class="toolbar-btn">字号 ▾</button>
|
||||
<button class="toolbar-btn">颜色 ▾</button>
|
||||
</div>
|
||||
<div class="editor-body" id="editor-text" contenteditable="true" oninput="syncPreview('text')">1. 服务说明
|
||||
本平台提供在线图文咨询服务，专家将在接诊后24小时内回复您的问题。单次咨询有效期为48小时。
|
||||
|
||||
2. 使用规范
|
||||
请详细描述您的症状或健康问题，上传相关检查报告有助于专家准确判断。
|
||||
请详细描述您的症状或健康问题，上传相关检查报告有助于专家准确判断。每次咨询限一个主要问题。
|
||||
|
||||
3. 注意事项
|
||||
本咨询服务仅供健康指导参考，不作为正式医疗诊断依据。如病情紧急，请立即前往医院就诊或拨打急救电话120。
|
||||
|
||||
4. 隐私保护
|
||||
您的咨询内容将严格保密，仅接诊专家可查看。</div>
|
||||
<div class="editor-footer">
|
||||
<span class="editor-footer__hint">支持富文本编辑，内容将展示在员工端咨询发起弹窗中</span>
|
||||
<div class="editor-footer">
|
||||
<span class="editor-footer__hint">支持富文本编辑，内容将展示在员工端发起图文咨询时的弹窗中</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice-preview">
|
||||
<div class="preview-panel">
|
||||
<div class="preview-panel__label">
|
||||
<svg viewBox="0 0 14 14" fill="none"><rect x="3" y="1" width="8" height="12" rx="1.5" stroke="currentColor" stroke-width="1.2"/><path d="M5.5 3h3M5.5 5h3M5.5 7h1.5" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>
|
||||
移动端弹窗预览
|
||||
</div>
|
||||
<div class="preview-phone">
|
||||
<div class="preview-phone__title" id="preview-title-text">图文咨询须知</div>
|
||||
<div class="preview-phone__content" id="preview-content-text"></div>
|
||||
<div class="preview-phone__btns">
|
||||
<div class="preview-phone__btn preview-phone__btn--cancel">不同意</div>
|
||||
<div class="preview-phone__btn preview-phone__btn--ok">同意并继续</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="edit-modal__footer">
|
||||
<button class="btn btn-default" onclick="closeEditModal()">取消</button>
|
||||
<button class="btn btn-primary">发布生效</button>
|
||||
</div>
|
||||
|
||||
<!-- 视频咨询 -->
|
||||
<div class="tab-pane" id="pane-video">
|
||||
<div class="notice-card">
|
||||
<div class="notice-card__header">
|
||||
<div class="notice-card__title">视频咨询须知</div>
|
||||
<div class="notice-card__actions">
|
||||
<button class="btn btn-default" onclick="openHistory('video')">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M7 1a6 6 0 106 6" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/><path d="M7 4v3.5l2.5 1.5" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/></svg>
|
||||
历史版本
|
||||
</button>
|
||||
<button class="btn btn-primary" onclick="saveNotice('video')">
|
||||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2 7l3.5 3.5L12 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
||||
发布生效
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice-layout">
|
||||
<div class="notice-editor">
|
||||
<div class="editor-section__label">弹窗标题</div>
|
||||
<input class="editor-title-input" id="title-video" type="text" value="视频咨询须知" placeholder="请输入弹窗标题" oninput="syncPreview('video')">
|
||||
<div class="editor-section__label">须知内容</div>
|
||||
<div class="editor-toolbar">
|
||||
<button class="toolbar-btn" title="加粗"><strong>B</strong></button>
|
||||
<button class="toolbar-btn" title="斜体"><em>I</em></button>
|
||||
<button class="toolbar-btn" title="下划线"><u>U</u></button>
|
||||
<div class="toolbar-divider"></div>
|
||||
<button class="toolbar-btn">有序列表</button>
|
||||
<button class="toolbar-btn">无序列表</button>
|
||||
<div class="toolbar-divider"></div>
|
||||
<button class="toolbar-btn">字号 ▾</button>
|
||||
<button class="toolbar-btn">颜色 ▾</button>
|
||||
</div>
|
||||
<div class="editor-body" id="editor-video" contenteditable="true" oninput="syncPreview('video')">1. 服务说明
|
||||
本平台提供在线视频咨询服务，您将与专家进行实时视频沟通。单次视频时长不超过30分钟。
|
||||
|
||||
2. 设备要求
|
||||
请确保手机摄像头和麦克风权限已开启，建议在安静、光线充足的环境下进行视频咨询，使用WiFi或4G/5G网络以保证通话质量。
|
||||
|
||||
3. 预约规则
|
||||
视频咨询需提前预约，请在预约时段前5分钟进入等候。超过预约时间10分钟未接入，本次预约将自动取消。
|
||||
|
||||
4. 注意事项
|
||||
本咨询服务仅供健康指导参考，不作为正式医疗诊断依据。如病情紧急，请立即前往医院就诊或拨打急救电话120。
|
||||
|
||||
5. 隐私保护
|
||||
视频咨询过程不会被录制，您的咨询内容将严格保密。</div>
|
||||
<div class="editor-footer">
|
||||
<span class="editor-footer__hint">支持富文本编辑，内容将展示在员工端发起视频咨询时的弹窗中</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice-preview">
|
||||
<div class="preview-panel">
|
||||
<div class="preview-panel__label">
|
||||
<svg viewBox="0 0 14 14" fill="none"><rect x="3" y="1" width="8" height="12" rx="1.5" stroke="currentColor" stroke-width="1.2"/><path d="M5.5 3h3M5.5 5h3M5.5 7h1.5" stroke="currentColor" stroke-width="1" stroke-linecap="round"/></svg>
|
||||
移动端弹窗预览
|
||||
</div>
|
||||
<div class="preview-phone">
|
||||
<div class="preview-phone__title" id="preview-title-video">视频咨询须知</div>
|
||||
<div class="preview-phone__content" id="preview-content-video"></div>
|
||||
<div class="preview-phone__btns">
|
||||
<div class="preview-phone__btn preview-phone__btn--cancel">不同意</div>
|
||||
<div class="preview-phone__btn preview-phone__btn--ok">同意并继续</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 历史版本弹窗 -->
|
||||
<div class="modal-overlay" id="history-modal" onclick="if(event.target===this)closeHistory()">
|
||||
<div class="modal">
|
||||
<div class="modal__header">
|
||||
<div class="modal__title" id="history-modal-title">历史版本</div>
|
||||
<button class="modal__close" onclick="closeHistory()">✕</button>
|
||||
</div>
|
||||
<div class="modal__body">
|
||||
<div class="version-item">
|
||||
<span class="version-tag version-tag--current">当前版本</span>
|
||||
<div class="version-info">
|
||||
<div class="version-info__title">V3 — 新增隐私保护条款</div>
|
||||
<div class="version-info__meta">2026-04-10 14:30 · 张管理员 发布</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="version-item">
|
||||
<span class="version-tag version-tag--history">历史</span>
|
||||
<div class="version-info">
|
||||
<div class="version-info__title">V2 — 补充使用规范说明</div>
|
||||
<div class="version-info__meta">2026-03-20 09:15 · 李管理员 发布</div>
|
||||
</div>
|
||||
<span class="link">查看</span>
|
||||
<span class="link" style="margin-left:4px;">恢复</span>
|
||||
</div>
|
||||
<div class="version-item">
|
||||
<span class="version-tag version-tag--history">历史</span>
|
||||
<div class="version-info">
|
||||
<div class="version-info__title">V1 — 初始版本</div>
|
||||
<div class="version-info__meta">2026-02-01 10:00 · 张管理员 发布</div>
|
||||
</div>
|
||||
<span class="link">查看</span>
|
||||
<span class="link" style="margin-left:4px;">恢复</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openEditModal() {
|
||||
document.getElementById('edit-modal-overlay').classList.add('open');
|
||||
// TAB 切换
|
||||
function switchTab(type) {
|
||||
document.querySelectorAll('.notice-tab').forEach(function(t){ t.classList.remove('active'); });
|
||||
document.querySelectorAll('.tab-pane').forEach(function(p){ p.classList.remove('active'); });
|
||||
event.currentTarget.classList.add('active');
|
||||
document.getElementById('pane-' + type).classList.add('active');
|
||||
}
|
||||
|
||||
function closeEditModal() {
|
||||
document.getElementById('edit-modal-overlay').classList.remove('open');
|
||||
// 实时同步预览
|
||||
function syncPreview(type) {
|
||||
var title = document.getElementById('title-' + type).value;
|
||||
var content = document.getElementById('editor-' + type).innerText;
|
||||
document.getElementById('preview-title-' + type).textContent = title || '咨询须知';
|
||||
document.getElementById('preview-content-' + type).textContent = content;
|
||||
}
|
||||
|
||||
// 初始化预览
|
||||
syncPreview('text');
|
||||
syncPreview('video');
|
||||
|
||||
// 历史版本弹窗
|
||||
function openHistory(type) {
|
||||
var label = type === 'text' ? '图文咨询' : '视频咨询';
|
||||
document.getElementById('history-modal-title').textContent = label + ' — 历史版本';
|
||||
document.getElementById('history-modal').classList.add('open');
|
||||
}
|
||||
function closeHistory() {
|
||||
document.getElementById('history-modal').classList.remove('open');
|
||||
}
|
||||
|
||||
// 发布（原型演示）
|
||||
function saveNotice(type) {
|
||||
alert((type === 'text' ? '图文' : '视频') + '咨询须知已发布生效');
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,5 +1,20 @@
|
||||
# 专家咨询（管理端）变更记录
|
||||
|
||||
## 2026-04-13
|
||||
|
||||
### refactor: 重构咨询须知配置页面
|
||||
|
||||
将咨询须知页面从单一须知改为按咨询类型分TAB管理，新增实时预览和历史版本弹窗。
|
||||
|
||||
**涉及文件：**
|
||||
|
||||
- `config-notice.html` — 咨询须知配置页
|
||||
- 新增「图文咨询」「视频咨询」TAB标签切换
|
||||
- 改为左侧编辑区 + 右侧移动端预览的双栏布局
|
||||
- 编辑内容实时同步到右侧预览窗口
|
||||
- 底部历史版本区域改为按钮触发弹窗显示
|
||||
- 图文/视频各自独立编辑和发布
|
||||
|
||||
## 2026-04-09
|
||||
|
||||
### init: 初始化专家咨询管理端原型
|
||||
|
||||
@@ -155,6 +155,10 @@
|
||||
<main class="main">
|
||||
<div class="filter-bar">
|
||||
<div class="filter-bar__row">
|
||||
<div class="filter-item">
|
||||
<label>咨询单号</label>
|
||||
<input class="filter-input" type="text" placeholder="请输入咨询单号">
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<label>姓名</label>
|
||||
<input class="filter-input" type="text" placeholder="请输入姓名">
|
||||
@@ -281,6 +285,7 @@
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>咨询单号</th>
|
||||
<th>姓名</th>
|
||||
<th>员工工号</th>
|
||||
<th>所属单位</th>
|
||||
@@ -301,6 +306,7 @@
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260409001</td>
|
||||
<td>张伟</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP001</td>
|
||||
<td>采油一厂</td>
|
||||
@@ -319,6 +325,7 @@
|
||||
<td><span class="link" onclick="openChat('张伟','李医生','长庆医院','心血管内科','2026-04-09 09:12')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260409002</td>
|
||||
<td>李明</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP002</td>
|
||||
<td>采油二厂</td>
|
||||
@@ -337,6 +344,7 @@
|
||||
<td><span class="link" onclick="openChat('李明','王医生','长庆医院','内分泌科','2026-04-09 10:30')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260409003</td>
|
||||
<td>王芳</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP003</td>
|
||||
<td>勘探开发研究院</td>
|
||||
@@ -355,6 +363,7 @@
|
||||
<td><span class="link" onclick="openChat('王芳','张医生','长庆医院','神经内科','2026-04-09 11:05')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260408004</td>
|
||||
<td>刘洋</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP004</td>
|
||||
<td>采油三厂</td>
|
||||
@@ -373,6 +382,7 @@
|
||||
<td><span class="link" onclick="openChat('刘洋','陈医生','长庆医院','骨科','2026-04-08 14:22')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260408005</td>
|
||||
<td>赵静</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP005</td>
|
||||
<td>机关事务服务中心</td>
|
||||
@@ -391,6 +401,26 @@
|
||||
<td><span class="link" onclick="openChat('赵静','孙医生','长庆医院','消化内科','2026-04-08 16:40')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260407006</td>
|
||||
<td>孙丽</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP010</td>
|
||||
<td>采油二厂</td>
|
||||
<td>技术部</td>
|
||||
<td><span class="tag tag-orange">视频咨询</span></td>
|
||||
<td>陈医生</td>
|
||||
<td>长庆医院</td>
|
||||
<td>骨科</td>
|
||||
<td><span class="tag tag-green">收费专家</span></td>
|
||||
<td><span class="tag tag-gray">已取消</span></td>
|
||||
<td>2026-04-07 08:20</td>
|
||||
<td>—</td>
|
||||
<td>2026-04-07 08:45</td>
|
||||
<td>—</td>
|
||||
<td>—</td>
|
||||
<td><span class="link" onclick="openChat('孙丽','陈医生','长庆医院','骨科','2026-04-07 08:20')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260407007</td>
|
||||
<td>陈磊</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP006</td>
|
||||
<td>采油一厂</td>
|
||||
@@ -409,6 +439,7 @@
|
||||
<td><span class="link" onclick="openChat('陈磊','李医生','长庆医院','心血管内科','2026-04-07 09:55')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260409008</td>
|
||||
<td>周华</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP007</td>
|
||||
<td>采油一厂</td>
|
||||
@@ -427,6 +458,7 @@
|
||||
<td><span class="link" onclick="openChat('周华','刘医生','长庆医院','呼吸科','2026-04-09 14:30')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260409009</td>
|
||||
<td>吴娟</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP008</td>
|
||||
<td>采油二厂</td>
|
||||
@@ -445,6 +477,7 @@
|
||||
<td><span class="link" onclick="openChat('吴娟','王医生','长庆医院','内分泌科','2026-04-09 15:10')">查看对话</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">ZJ20260409010</td>
|
||||
<td>何军</td>
|
||||
<td style="font-family:monospace;color:var(--text-secondary);">EMP009</td>
|
||||
<td>勘探开发研究院</td>
|
||||
@@ -519,7 +552,7 @@ const deptMap = {
|
||||
// 咨询状态映射
|
||||
const consultStatusMap = {
|
||||
'text': ['待回复', '进行中', '已完成'],
|
||||
'video': ['待确认', '待开始', '已拒绝', '已完成']
|
||||
'video': ['待确认', '待开始', '已完成', '已取消', '已拒绝']
|
||||
};
|
||||
|
||||
function updateConsultStatus() {
|
||||
|
||||
@@ -117,28 +117,6 @@
|
||||
</a>
|
||||
</aside>
|
||||
<main class="main">
|
||||
<div class="stat-cards">
|
||||
<div class="stat-card">
|
||||
<div class="stat-card__label">本月待结算金额</div>
|
||||
<div class="stat-card__value" style="color:var(--warning);">¥ 32,450</div>
|
||||
<div class="stat-card__sub">2026年4月</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-card__label">本月已结算金额</div>
|
||||
<div class="stat-card__value" style="color:var(--success);">¥ 18,200</div>
|
||||
<div class="stat-card__sub">已完成结算</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-card__label">本年累计结算</div>
|
||||
<div class="stat-card__value" style="color:var(--primary);">¥ 248,600</div>
|
||||
<div class="stat-card__sub">2026年度</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-card__label">待结算专家数</div>
|
||||
<div class="stat-card__value">28</div>
|
||||
<div class="stat-card__sub">本月待处理</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-bar">
|
||||
<div class="filter-item">
|
||||
<label>结算周期</label>
|
||||
|
||||
Reference in New Issue
Block a user