1329 lines
65 KiB
HTML
1329 lines
65 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||
<title>中医馆内部管理系统 — 需求分析报告</title>
|
||
<style>
|
||
:root {
|
||
--bg: #f5f5f7;
|
||
--card: #ffffff;
|
||
--border: #e5e7eb;
|
||
--text: #1d1d1f;
|
||
--text2: #6e6e73;
|
||
--accent: #0071e3;
|
||
--accent-bg: #f0f5ff;
|
||
--red: #e53935;
|
||
--red-bg: #fef2f2;
|
||
--red-bd: #fecaca;
|
||
--orange: #e65100;
|
||
--orange-bg: #fff8e1;
|
||
--orange-bd: #ffe0b2;
|
||
--green: #2e7d32;
|
||
--green-bg: #e8f5e9;
|
||
--green-bd: #c8e6c9;
|
||
--purple: #6a1b9a;
|
||
--purple-bg: #f3e5f5;
|
||
--purple-bd: #e1bee7;
|
||
--safe-bottom: env(safe-area-inset-bottom, 0px);
|
||
}
|
||
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
|
||
html { scroll-behavior: smooth; }
|
||
body {
|
||
font-family: -apple-system, "SF Pro Text", "PingFang SC", "Helvetica Neue", sans-serif;
|
||
background: var(--bg); color: var(--text);
|
||
font-size: 15px; line-height: 1.6;
|
||
padding-bottom: calc(72px + var(--safe-bottom));
|
||
-webkit-font-smoothing: antialiased;
|
||
}
|
||
|
||
/* ===== Header ===== */
|
||
.header {
|
||
position: sticky; top: 0; z-index: 100;
|
||
background: rgba(255,255,255,0.88); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
|
||
border-bottom: 0.5px solid rgba(0,0,0,0.1);
|
||
padding: 12px 16px;
|
||
}
|
||
.header h1 { font-size: 17px; font-weight: 700; letter-spacing: -0.3px; }
|
||
.header .sub { font-size: 12px; color: var(--text2); margin-top: 2px; }
|
||
|
||
/* ===== Stats ===== */
|
||
.stats {
|
||
display: grid; grid-template-columns: repeat(4, 1fr);
|
||
gap: 8px; padding: 12px 16px;
|
||
}
|
||
.stat { background: var(--card); border-radius: 12px; padding: 12px 8px; text-align: center; }
|
||
.stat .n { font-size: 24px; font-weight: 800; line-height: 1.1; }
|
||
.stat .n.r { color: var(--red); }
|
||
.stat .n.o { color: var(--orange); }
|
||
.stat .n.g { color: var(--green); }
|
||
.stat .n.p { color: var(--purple); }
|
||
.stat .l { font-size: 11px; color: var(--text2); margin-top: 2px; }
|
||
|
||
/* ===== Nav tabs ===== */
|
||
.nav-wrap {
|
||
position: sticky; top: var(--header-h, 64px); z-index: 90;
|
||
background: rgba(255,255,255,0.88); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
|
||
border-bottom: 0.5px solid rgba(0,0,0,0.06);
|
||
}
|
||
.nav-tabs {
|
||
display: flex; gap: 0; overflow-x: auto; -webkit-overflow-scrolling: touch;
|
||
scrollbar-width: none; padding: 0 8px;
|
||
}
|
||
.nav-tabs::-webkit-scrollbar { display: none; }
|
||
.nav-tab {
|
||
flex-shrink: 0; padding: 10px 14px; font-size: 13px; font-weight: 500;
|
||
color: var(--text2); cursor: pointer; border-bottom: 2px solid transparent;
|
||
white-space: nowrap; transition: all 0.15s;
|
||
}
|
||
.nav-tab.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
|
||
|
||
/* ===== Sections ===== */
|
||
.section { padding: 16px; display: none; }
|
||
.section.active { display: block; }
|
||
.sec-title {
|
||
font-size: 20px; font-weight: 800; letter-spacing: -0.4px;
|
||
margin-bottom: 16px; display: flex; align-items: center; gap: 8px;
|
||
}
|
||
.sec-title .badge {
|
||
width: 24px; height: 24px; border-radius: 7px; background: var(--accent); color: #fff;
|
||
font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center;
|
||
flex-shrink: 0;
|
||
}
|
||
.sub-label {
|
||
font-size: 14px; font-weight: 700; color: var(--text);
|
||
margin: 20px 0 10px; padding-left: 10px;
|
||
border-left: 3px solid var(--accent);
|
||
}
|
||
|
||
/* ===== Flow ===== */
|
||
.flow-card {
|
||
background: var(--card); border-radius: 14px; padding: 16px;
|
||
margin-bottom: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.04);
|
||
}
|
||
.flow-card h4 { font-size: 13px; font-weight: 700; color: var(--text2); margin-bottom: 10px; }
|
||
.flow-list { display: flex; flex-direction: column; gap: 6px; }
|
||
.flow-item {
|
||
display: flex; align-items: center; gap: 8px;
|
||
font-size: 13px; line-height: 1.4;
|
||
}
|
||
.flow-dot {
|
||
width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0;
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-size: 10px; font-weight: 700; color: #fff;
|
||
background: var(--accent);
|
||
}
|
||
.flow-dot.new { background: var(--green); }
|
||
.flow-line { width: 2px; height: 8px; background: #e0e0e0; margin-left: 10px; border-radius: 1px; }
|
||
.flow-item span { flex: 1; }
|
||
.flow-item .new-tag {
|
||
font-size: 10px; padding: 1px 6px; border-radius: 8px;
|
||
background: var(--green-bg); color: var(--green); border: 1px solid var(--green-bd);
|
||
font-weight: 600; flex-shrink: 0;
|
||
}
|
||
|
||
/* ===== Analysis cards ===== */
|
||
.card {
|
||
background: var(--card); border-radius: 14px;
|
||
margin-bottom: 10px; overflow: hidden;
|
||
box-shadow: 0 1px 3px rgba(0,0,0,0.04);
|
||
}
|
||
.card-head {
|
||
display: flex; align-items: center; gap: 10px;
|
||
padding: 14px 16px; cursor: pointer;
|
||
-webkit-user-select: none; user-select: none;
|
||
}
|
||
.card-head:active { background: #f9f9fb; }
|
||
.card-head .title { flex: 1; font-size: 15px; font-weight: 600; line-height: 1.3; }
|
||
.tag {
|
||
display: inline-block; padding: 2px 8px; border-radius: 10px;
|
||
font-size: 11px; font-weight: 600; white-space: nowrap; flex-shrink: 0;
|
||
}
|
||
.tag-missing { background: var(--red-bg); color: var(--red); border: 1px solid var(--red-bd); }
|
||
.tag-optimize { background: var(--orange-bg); color: var(--orange); border: 1px solid var(--orange-bd); }
|
||
.tag-add { background: var(--green-bg); color: var(--green); border: 1px solid var(--green-bd); }
|
||
.tag-risk { background: var(--purple-bg); color: var(--purple); border: 1px solid var(--purple-bd); }
|
||
.card-arrow {
|
||
width: 20px; height: 20px; flex-shrink: 0;
|
||
color: #ccc; transition: transform 0.2s;
|
||
}
|
||
.card.open .card-arrow { transform: rotate(90deg); }
|
||
.card-body {
|
||
max-height: 0; overflow: hidden;
|
||
transition: max-height 0.3s ease;
|
||
}
|
||
.card.open .card-body { max-height: 2000px; }
|
||
.card-inner { padding: 0 16px 16px; }
|
||
|
||
.block-label {
|
||
font-size: 11px; font-weight: 700; color: var(--text2);
|
||
text-transform: uppercase; letter-spacing: 0.5px;
|
||
margin: 12px 0 6px; display: flex; align-items: center; gap: 6px;
|
||
}
|
||
.block-label::before {
|
||
content: ""; width: 8px; height: 2px; border-radius: 1px;
|
||
}
|
||
.block-label.orig::before { background: #ccc; }
|
||
.block-label.suggest::before { background: var(--accent); }
|
||
.block-label.reason::before { background: var(--purple); }
|
||
|
||
.orig-text { font-size: 13px; color: var(--text2); line-height: 1.5; }
|
||
.orig-text em { color: var(--red); font-style: italic; }
|
||
.suggest-list { list-style: none; }
|
||
.suggest-list li {
|
||
font-size: 13px; line-height: 1.6; padding: 4px 0 4px 16px;
|
||
position: relative;
|
||
}
|
||
.suggest-list li::before {
|
||
content: "\2192"; position: absolute; left: 0; color: var(--accent); font-weight: 700;
|
||
}
|
||
.hl { background: #fef9c3; padding: 0 2px; border-radius: 2px; }
|
||
.reason-box {
|
||
margin-top: 8px; padding: 10px 12px;
|
||
background: #f9fafb; border-left: 3px solid var(--purple);
|
||
border-radius: 0 8px 8px 0; font-size: 12px; color: var(--text2); line-height: 1.6;
|
||
}
|
||
.reason-box b { color: var(--text); }
|
||
|
||
/* ===== Priority section ===== */
|
||
.pri-card {
|
||
background: var(--card); border-radius: 14px; padding: 16px;
|
||
margin-bottom: 10px; box-shadow: 0 1px 3px rgba(0,0,0,0.04);
|
||
}
|
||
.pri-card h3 { font-size: 14px; font-weight: 700; margin-bottom: 10px; }
|
||
.pri-list { list-style: none; }
|
||
.pri-list li {
|
||
font-size: 13px; padding: 5px 0 5px 16px; position: relative; line-height: 1.5;
|
||
}
|
||
.pri-list li::before { content: "\2022"; position: absolute; left: 0; font-weight: 700; }
|
||
.pri-card.p0 .pri-list li::before { color: var(--red); }
|
||
.pri-card.p1 .pri-list li::before { color: var(--orange); }
|
||
.pri-card.p2 .pri-list li::before { color: var(--green); }
|
||
.pri-card.pq .pri-list li::before { color: var(--purple); }
|
||
|
||
/* ===== Bottom nav ===== */
|
||
.bottom-nav {
|
||
position: fixed; bottom: 0; left: 0; right: 0;
|
||
background: rgba(255,255,255,0.92); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
|
||
border-top: 0.5px solid rgba(0,0,0,0.1);
|
||
display: flex; padding: 6px 0 calc(6px + var(--safe-bottom));
|
||
z-index: 100;
|
||
}
|
||
.bottom-nav .bn {
|
||
flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
|
||
padding: 6px 0; font-size: 10px; color: var(--text2); cursor: pointer;
|
||
}
|
||
.bottom-nav .bn.active { color: var(--accent); }
|
||
.bottom-nav .bn .bi { font-size: 20px; line-height: 1; }
|
||
|
||
/* ===== Expand all btn ===== */
|
||
.expand-all {
|
||
display: inline-flex; align-items: center; gap: 4px;
|
||
padding: 6px 14px; border-radius: 20px;
|
||
background: var(--accent-bg); color: var(--accent);
|
||
font-size: 12px; font-weight: 600; border: none; cursor: pointer;
|
||
margin-bottom: 12px;
|
||
}
|
||
.expand-all:active { opacity: 0.7; }
|
||
|
||
/* ===== Footer ===== */
|
||
.footer {
|
||
text-align: center; padding: 20px 16px; font-size: 11px; color: #aaa;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<!-- Header -->
|
||
<div class="header">
|
||
<h1>中医馆内部管理系统</h1>
|
||
<div class="sub">需求分析对比报告 · 2026/05/23</div>
|
||
</div>
|
||
|
||
<!-- Stats -->
|
||
<div class="stats">
|
||
<div class="stat"><div class="n r">14</div><div class="l">功能缺失</div></div>
|
||
<div class="stat"><div class="n o">15</div><div class="l">优化建议</div></div>
|
||
<div class="stat"><div class="n g">10</div><div class="l">补充新增</div></div>
|
||
<div class="stat"><div class="n p">7</div><div class="l">待确认</div></div>
|
||
</div>
|
||
|
||
<!-- Nav tabs -->
|
||
<div class="nav-wrap">
|
||
<div class="nav-tabs" id="navTabs">
|
||
<div class="nav-tab active" data-tab="flow">核心流程</div>
|
||
<div class="nav-tab" data-tab="doctor">医生端</div>
|
||
<div class="nav-tab" data-tab="warehouse">仓库端</div>
|
||
<div class="nav-tab" data-tab="admin">管理后台</div>
|
||
<div class="nav-tab" data-tab="nonfunc">非功能</div>
|
||
<div class="nav-tab" data-tab="priority">优先级</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ==================== 1. 核心流程 ==================== -->
|
||
<div class="section active" id="sec-flow">
|
||
<div class="sec-title"><span class="badge">1</span>核心业务流程</div>
|
||
|
||
<div class="flow-card">
|
||
<h4>原始流程</h4>
|
||
<div class="flow-list">
|
||
<div class="flow-item"><span class="flow-dot">1</span><span>录入患者信息</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">2</span><span>病历症状（文字+图片）</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">3</span><span>医生诊断（文字）</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">4</span><span>药品类型选择</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">5</span><span>开处方</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">6</span><span>选择药材/用量/先煎后下</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">7</span><span>生成处方（冲突检测）</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">8</span><span>代煎选择</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">9</span><span>邮寄选择</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">10</span><span>结算（收款码）</span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flow-card">
|
||
<h4>建议优化后流程 <span style="font-size:11px;color:var(--green);">（标注 NEW 为新增节点）</span></h4>
|
||
<div class="flow-list">
|
||
<div class="flow-item"><span class="flow-dot new">1</span><span>选择已有患者 / 新建患者</span><span class="new-tag">NEW</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">2</span><span>录入患者信息</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">3</span><span>病历症状（文字+图片）</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">4</span><span>医生诊断（文字）</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot new">5</span><span>四诊信息采集（舌象/脉象）</span><span class="new-tag">NEW</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">6</span><span>药品类型选择</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">7</span><span>开处方</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">8</span><span>选择药材/用量/先煎后下</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">9</span><span>生成处方（冲突检测）</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot new">10</span><span>处方预览确认</span><span class="new-tag">NEW</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">11</span><span>代煎选择</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">12</span><span>邮寄/自取选择</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot">13</span><span>结算（收款码）</span></div>
|
||
<div class="flow-line"></div>
|
||
<div class="flow-item"><span class="flow-dot new">14</span><span>支付确认 → 配药 → 发货/自取</span><span class="new-tag">NEW</span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<button class="expand-all" onclick="toggleAll(this)">展开全部 6 项</button>
|
||
|
||
<!-- Card: 患者来源 -->
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">患者来源</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">直接"录入患者个人信息"，未区分新建和选择已有患者</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>流程起点增加<span class="hl">「选择已有患者 / 新建患者」</span>分支</li>
|
||
<li>已有患者可直接调取历史病历，关联本次就诊</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box"><b>复诊是中医馆的核心场景。</b>若每次就诊都新建患者，会导致同一患者出现多条重复档案，病历数据碎片化，无法形成连续的诊疗记录。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<!-- Card: 四诊信息 -->
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">四诊信息</span>
|
||
<span class="tag tag-add">补充</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">四诊信息采集</span>字段：望（舌象图片）、闻、问、切（脉象描述）</li>
|
||
<li>舌象可复用"上传图片"功能，脉象用文字字段</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box"><b>望闻问切是中医诊疗的基本方法论。</b>不记录四诊信息，复诊时医生无法对比病情变化，也无法支撑证型判断和用药调整。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<!-- Card: 处方预览确认 -->
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">处方预览确认</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">生成处方后直接进入代煎选择，无确认环节</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">「处方预览确认」</span>步骤，检查完整处方内容</li>
|
||
<li>药物冲突检测结果应<span class="hl">醒目高亮展示</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">处方涉及多味药材和复杂配伍，直接跳转容易遗漏检查。确认步骤是防错的最后一道关卡。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<!-- Card: 订单状态流转 -->
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">订单状态流转</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>完整状态链：<span class="hl">待付款 → 已付款 → 配药中 → 待发货 → 已完成</span></li>
|
||
<li>医生端和管理后台均可查看订单当前状态</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">没有订单状态，医生不知道哪些已收款、哪些需配药；仓库不知道哪些需出库。容易出现漏发货、重复发货等问题。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<!-- Card: 处方修改/撤销 -->
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">处方修改/撤销</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>支持结算前的<span class="hl">修改和撤销</span>操作</li>
|
||
<li>已结算处方应有<span class="hl">退款/作废</span>流程</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">医生开完处方后调整用药是常见场景（如患者反馈过敏）。没有修改能力，只能废弃重新开，浪费且产生无效数据。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<!-- Card: 支付确认机制 -->
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">支付确认机制</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">结算（显示收款码），但无支付确认环节</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>收款码展示后需有<span class="hl">确认收款</span>操作</li>
|
||
<li>未确认收款的处方不应进入配药/发货流程</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">展示收款码不等于完成支付。没有确认机制，会导致未收款就发货的资金风险。</div>
|
||
</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ==================== 2. 医生端 ==================== -->
|
||
<div class="section" id="sec-doctor">
|
||
<div class="sec-title"><span class="badge">2</span>医生端</div>
|
||
<div class="sub-label">登录注册</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">实名认证审核</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">上传身份证、执业医师证等资料，后台审核需要实名认证</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>应有<span class="hl">审核状态反馈</span>：待审核/已通过/已驳回（附原因）</li>
|
||
<li>需明确认证未通过时的<span class="hl">功能权限范围</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">没有状态反馈医生会反复提交或流失。医疗行业对执业资格有严格要求，必须明确未认证状态的系统行为，避免无资质人员开方的合规风险。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">账号安全</span>
|
||
<span class="tag tag-add">补充</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">账号密码登录、手机验证码登录、微信授权登录、忘记密码</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">登录设备管理</span>（查看设备、踢出异常设备）</li>
|
||
<li>增加<span class="hl">登录异常提醒</span>（异地/新设备登录时通知）</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">医生账号关联处方权和患者隐私数据。多登录方式增加被盗风险面，设备管理可及时发现和阻止异常访问。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">首页</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">今日数据</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">今日数据、开处方数量</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>"今日数据"定义模糊，建议拆分：<span class="hl">就诊人数、处方数、收入金额、待处理订单数</span></li>
|
||
<li>增加<span class="hl">待办提醒</span>：待发货订单、待处理事项</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">"今日数据"过于笼统，无法落地。明确指标让医生打开首页就看到核心工作状态。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">患者管理</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">患者信息字段</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">填写患者信息、患者症状描述、新建档案</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确<span class="hl">基本信息字段</span>：姓名、性别、年龄、手机号、身份证号、过敏史、既往病史、体重</li>
|
||
<li>区分<span class="hl">必填/选填</span>，避免录入负担过重</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">不定义字段开发无法实施。性别年龄影响剂量；过敏史是安全用药前置条件，遗漏可能导致医疗事故。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">患者列表</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">支持关键字查找、服务过的患者列表、搜索查找患者档案</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>"关键字查找"和"搜索查找"重复，建议<span class="hl">合并为一个搜索组件</span></li>
|
||
<li>列表应有<span class="hl">排序和筛选</span>：按就诊时间、初诊/复诊</li>
|
||
<li>增加<span class="hl">患者标签</span>：慢性病、复诊、VIP等</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-block">重复描述增加开发工作量。医生最常用的场景是"找最近看过的患者"，默认排序应满足此需求。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">档案管理</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及档案的删除/停用</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">归档/停用</span>功能（不建议物理删除）</li>
|
||
<li>归档患者默认不显示，但可通过搜索找到</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">医疗数据有保存时限合规要求，不能随意删除。归档兼顾合规和查找效率。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">医生诊断</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">诊断内容</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">文字说明</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>诊断应结构化：<span class="hl">主诉、现病史、证型/证候、治法</span></li>
|
||
<li>支持<span class="hl">常用诊断模板</span>，保存复用</li>
|
||
<li>小程序端支持<span class="hl">语音输入转文字</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">"文字说明"过于宽泛。证型/治法是中医诊断核心输出，也是选方用药直接依据。模板减少重复录入，语音输入解决手机端打字效率问题。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">开处方（核心模块）</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">处方副数（剂数）</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">处方副数（剂数）</span>字段，默认 7 副，支持修改</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">中药处方必须明确剂数，直接决定药材总用量和总价。缺少此字段，配药和结算均无法执行。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">用法用量说明</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">用法用量</span>字段，如"水煎服，每日一剂，分早晚两次温服"</li>
|
||
<li>提供常用用法模板，支持自定义</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">用法用量是处方法定要素。《处方管理办法》明确要求处方必须包含用法用量，否则患者不知如何煎药和服用。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">禁忌/注意事项</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">禁忌和注意事项</span>字段：忌口说明、特殊人群提示（孕妇慎用等）</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">中药治疗非常注重饮食禁忌，某些药材与特定食物同服会降低药效甚至产生副作用。仅口头告知，患者容易遗忘。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">药物冲突处理</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">系统要判断出，该处方是否有药物冲突（冲突的药物，提前在后台录入）</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确处理策略：仅<span class="hl">警告</span>还是<span class="hl">强制拦截</span>？</li>
|
||
<li>建议分两级：严重冲突（十八反）强制拦截；一般冲突警告但允许确认继续</li>
|
||
<li>冲突检测记录到<span class="hl">操作日志</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">仅"判断出"不够，必须定义判断后的系统行为。十八反是绝对禁忌，应强制拦截；部分配伍注意可由医生临床判断。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">协定方管理</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">选择协定方：展示出自己之前开过的药方，医生可直接选择使用</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>不应只有个人历史方，还应有<span class="hl">医馆统一的协定方库</span></li>
|
||
<li>支持：新增、编辑、停用、分类、搜索</li>
|
||
<li>区分"个人常用方"和"医馆协定方"</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">协定方是医馆标准治疗方案。仅展示个人历史，新入职医生无法使用已有协定方，也不利于统一治疗标准。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">2/3量转换</span>
|
||
<span class="tag tag-risk">待确认</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">要求：可设置转换2/3量</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确：<span class="hl">全方统一转换</span>还是<span class="hl">单味药单独设置</span>？</li>
|
||
<li>转换时机：一键转换还是生成前自动？</li>
|
||
<li>转换后是否保留原始剂量记录？</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">"2/3量"是儿科常用剂量折算方式，但描述过于简略，开发无法理解具体交互逻辑。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">代煎中药</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">选择是否代煎中药（饮片、膏方等特殊药品需有煎药费，按副收取）</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确煎药费<span class="hl">计费标准</span>：固定金额？不同药品不同？</li>
|
||
<li>煎药费应在后台<span class="hl">可配置</span></li>
|
||
<li>颗粒/粉剂不涉及代煎，选择时<span class="hl">自动隐藏</span>代煎选项</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">煎药费直接影响结算金额。硬编码导致每次调价需改代码。颗粒和粉剂不需要煎煮，展示代煎选项造成困惑。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">发货与结算</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">物流管理</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">发货：填写患者收货地址、联系人、电话等</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">物流公司和物流单号</span>字段</li>
|
||
<li>增加<span class="hl">发货通知</span>功能（短信/微信推送）</li>
|
||
<li>自取应有<span class="hl">取药码/核销</span>机制</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">没有物流单号无法追踪包裹；没有发货通知患者会频繁咨询；自取没有核销无法确认取药，订单无法闭环。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">结算明细</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">显示总价结算、展示收款码</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>展示<span class="hl">费用明细</span>：药材费、代煎费、邮费分项</li>
|
||
<li>收款码建议<span class="hl">动态生成</span>对应金额</li>
|
||
<li>缺少<span class="hl">退款流程</span>说明</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">仅显示总价易产生费用争议。动态收款码避免错误付款。退款是必然场景（过敏、处方错误等），没有流程会导致对账混乱。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">积分与业绩</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">积分体系</span>
|
||
<span class="tag tag-risk">待确认</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">积分数量显示、积分明细、积分规则说明、查找</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>定义<span class="hl">积分获取规则</span>：金额比例还是固定值？</li>
|
||
<li>定义<span class="hl">积分用途</span>：提现？兑换？排名？</li>
|
||
<li>如可提现，明确<span class="hl">提现规则和手续费</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">文档仅描述积分展示，完全没定义来源规则和消耗规则。没有明确规则，开发无法实现计算逻辑。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">业绩统计</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">业绩显示：开处方数量；本月总业绩：开处方数量</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">处方金额统计</span></li>
|
||
<li>增加<span class="hl">时间段筛选</span>：本周/本月/自定义</li>
|
||
<li>增加<span class="hl">图表展示</span>：趋势折线图、分布饼图</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">仅用数量衡量业绩不全面——3味药简单方和20味药复杂方工作量差异大。金额统计更全面。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">客服与多终端</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">在线客服 & 多终端同步</span>
|
||
<span class="tag tag-risk">待确认</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确对接<span class="hl">哪个第三方客服系统</span></li>
|
||
<li>PC端和小程序<span class="hl">功能范围是否一致</span>？</li>
|
||
<li>建议PC支持批量操作，小程序侧重<span class="hl">移动快速开方</span></li>
|
||
<li>数据应<span class="hl">实时同步</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">不同客服系统对接方式和成本差异大。PC和小程序使用场景不同，应做功能差异化。</div>
|
||
</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ==================== 3. 仓库端 ==================== -->
|
||
<div class="section" id="sec-warehouse">
|
||
<div class="sec-title"><span class="badge">3</span>仓库端</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">申请采购</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">申请采购</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>细化流程：<span class="hl">创建 → 审批 → 供应商下单 → 验收 → 入库</span></li>
|
||
<li>增加<span class="hl">供应商管理</span>模块</li>
|
||
<li>明确<span class="hl">审批流程</span></li>
|
||
<li>支持<span class="hl">库存预警自动生成采购建议</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">"申请采购"四个字无法支撑完整模块。药品采购涉及资金支出，必须有审批流程。供应商管理是采购基础。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">入库管理</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">入库管理</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>入库需记录：<span class="hl">药品名称、批号、生产日期、有效期、数量、供应商</span></li>
|
||
<li>应有<span class="hl">入库验收</span>环节</li>
|
||
<li>入库后自动<span class="hl">更新库存</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">药品批号和有效期是《药品管理法》要求追溯的信息。不关联采购单无法核对到货完整性。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">出库管理</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">出库管理</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确出库类型：<span class="hl">配药出库、报损、退货、样品</span></li>
|
||
<li>遵循<span class="hl">先进先出（FIFO）</span></li>
|
||
<li>出库自动<span class="hl">扣减库存</span>并记录明细</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">不同出库类型财务处理不同。先进先出避免近效期药品积压过期。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">库存盘点</span>
|
||
<span class="tag tag-add">补充</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">库存盘点</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>支持<span class="hl">全盘</span>和<span class="hl">抽盘</span>两种方式</li>
|
||
<li>盘点差异有<span class="hl">盘盈/盘亏处理流程</span></li>
|
||
<li>明确盘点期间是否<span class="hl">冻结出入库</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">全盘适合月末大盘点，抽盘适合日常抽查。盘点差异没有处理流程就无法平账。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">发货管理</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">发货管理</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确与医生端的<span class="hl">职责划分</span>：医生填收货信息，仓库负责配药打包录入单号</li>
|
||
<li>支持<span class="hl">批量操作</span>：批量打印、批量录入物流</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">医生端和后台都有"发货"，职责不清会导致重复操作或推诿。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">效期管理</span>
|
||
<span class="tag tag-add">补充</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加<span class="hl">药品有效期管理</span></li>
|
||
<li>设置<span class="hl">近效期预警</span>（90/60/30天分级）</li>
|
||
<li>过期药品<span class="hl">锁定和报损</span>流程</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">使用过期药品是严重医疗安全事件，可能面临行政处罚甚至刑事责任。效期管理是药房管理刚需。</div>
|
||
</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ==================== 4. 管理后台 ==================== -->
|
||
<div class="section" id="sec-admin">
|
||
<div class="sec-title"><span class="badge">4</span>管理后台</div>
|
||
|
||
<div class="sub-label">用户与权限</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">账号体系</span>
|
||
<span class="tag tag-risk">待确认</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确是<span class="hl">统一账号体系</span>还是各端独立</li>
|
||
<li>建议统一账号，通过<span class="hl">角色</span>区分权限</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">独立注册会导致同一人有多个账号，数据无法打通，无法统一管理。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">角色权限管理</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>增加角色权限：超级管理员、管理员、仓库管理员、医生</li>
|
||
<li>权限至少到<span class="hl">菜单级别</span></li>
|
||
<li>医生只能看自己的患者和处方数据</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">没有权限控制，仓库员可修改处方、医生可操作采购——在任何系统中都不可接受。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">操作日志</span>
|
||
<span class="tag tag-add">补充</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text"><em>未提及</em></div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>记录关键操作：登录、处方变更、库存变更、权限变更</li>
|
||
<li>含执行人、时间、操作内容、变更前后数据</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">涉及药品和医疗记录，操作追溯是基本安全要求。没有日志无法排查异常和确定责任人。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">药库管理</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">药库分类</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">颗粒药库和中药饮片药库</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>缺少<span class="hl">膏方药库和粉剂药库</span></li>
|
||
<li>四种药品类型应有各自独立的库存管理</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">医生端支持四种药品类型开方，药库只有两种，膏方和粉剂的库存无管理，仓库无法出库。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">药品基础信息</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">手动录入对应的药品情况</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>定义字段：<span class="hl">编码、名称、别名、产地、等级、规格、单位、单价、类型</span></li>
|
||
<li>支持<span class="hl">Excel批量导入</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">不定义字段无法开发。数百种药材逐条手动录入工作量巨大，导入是效率刚需。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">药物冲突数据管理</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">有冲突的中药，会在后台提前录入进去</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>需要<span class="hl">配伍禁忌管理</span>模块</li>
|
||
<li><span class="hl">预置十八反、十九畏</span>数据</li>
|
||
<li>冲突标注<span class="hl">严重等级</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">文档提到"后台录入"但没有管理入口。没有模块，冲突数据无法维护，冲突检测功能无法运行。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">库存不足提醒 & 后台开关</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>预警阈值应<span class="hl">自定义</span>（不同药品不同阈值）</li>
|
||
<li>增加<span class="hl">一键生成补货采购单</span></li>
|
||
<li>"后台开关"需明确<span class="hl">控制什么功能</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">不同药品消耗速度差异大，统一阈值不实用。"后台开关"在文档中出现两次但没说明控制什么，开发无法实现。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">处方管理</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">处方统计 & 导出 & 协定方管理</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>"自己开处方数量"不合理，改为<span class="hl">按医生维度</span>统计</li>
|
||
<li>增加处方<span class="hl">打印和导出 Excel</span></li>
|
||
<li>增加<span class="hl">协定方管理模块</span></li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">管理员核心诉求是看全局数据，不是看自己的。纸质处方是配药依据，不支持打印只能截图或手抄。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="sub-label">其他模块</div>
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">数据统计 / 财务管理 / 系统设置</span>
|
||
<span class="tag tag-add">补充</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>聚焦核心报表：<span class="hl">处方统计、营收统计、库存流水</span></li>
|
||
<li>增加<span class="hl">财务管理</span>：收入统计、对账、退款审批</li>
|
||
<li>增加<span class="hl">系统设置</span>：煎药费、邮费、默认用量等可配置参数</li>
|
||
</ul>
|
||
<div class="block-label reason">理由</div>
|
||
<div class="reason-box">系统涉及收款和采购支出，没有财务模块经营者无法了解经营状况。煎药费等参数如硬编码，每次调价需改代码。</div>
|
||
</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ==================== 5. 非功能性 ==================== -->
|
||
<div class="section" id="sec-nonfunc">
|
||
<div class="sec-title"><span class="badge">5</span>非功能性需求</div>
|
||
<p style="font-size:13px;color:var(--text2);margin-bottom:16px;">原文档完全未涉及以下维度</p>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">数据安全</span>
|
||
<span class="tag tag-missing">缺失</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<ul class="suggest-list">
|
||
<li>患者病历属<span class="hl">敏感医疗数据</span>，需加密存储、传输加密、访问控制</li>
|
||
<li>身份证号、手机号展示时<span class="hl">脱敏处理</span></li>
|
||
</ul>
|
||
<div class="reason-box">患者病历受《个人信息保护法》《数据安全法》保护。数据泄露面临高额罚款和声誉损失。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">医疗合规</span>
|
||
<span class="tag tag-risk">风险</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<ul class="suggest-list">
|
||
<li>需考虑<span class="hl">《处方管理办法》《药品管理法》</span></li>
|
||
<li>电子处方是否有<span class="hl">电子签名</span>要求？数据保存时限？</li>
|
||
</ul>
|
||
<div class="reason-box">医疗系统有明确法律规范。设计不合规，上线后可能面临监管处罚。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">数据备份 & 打印功能</span>
|
||
<span class="tag tag-add">补充</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<ul class="suggest-list">
|
||
<li>医疗数据应有<span class="hl">定期自动备份</span>和灾难恢复</li>
|
||
<li>需支持：<span class="hl">处方笺打印、发货单打印、药品标签打印</span></li>
|
||
</ul>
|
||
<div class="reason-box">处方和病历丢失不可恢复，影响复诊且面临法律纠纷。打印是日常高频需求。</div>
|
||
</div></div>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<div class="card-head" onclick="toggleCard(this)">
|
||
<span class="title">消息通知</span>
|
||
<span class="tag tag-optimize">优化</span>
|
||
<svg class="card-arrow" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
|
||
</div>
|
||
<div class="card-body"><div class="card-inner">
|
||
<div class="block-label orig">原文档</div>
|
||
<div class="orig-text">仅提到"系统推送的消息提醒"</div>
|
||
<div class="block-label suggest">建议</div>
|
||
<ul class="suggest-list">
|
||
<li>明确通知渠道：<span class="hl">微信模板消息、短信、站内信</span></li>
|
||
<li>明确通知场景：发货、库存预警、审核结果、系统公告</li>
|
||
</ul>
|
||
<div class="reason-box">不同渠道成本不同（短信按条计费，微信免费）。不同场景紧急程度不同，对应不同渠道。</div>
|
||
</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ==================== 6. 优先级 ==================== -->
|
||
<div class="section" id="sec-priority">
|
||
<div class="sec-title"><span class="badge">6</span>优先级建议</div>
|
||
|
||
<div class="pri-card p0">
|
||
<h3 style="color:var(--red);">P0 — 必须有（阻塞上线）</h3>
|
||
<ul class="pri-list">
|
||
<li>角色权限管理（管理员/医生/仓库员）</li>
|
||
<li>完整订单状态流转（待付款→配药→发货→完成）</li>
|
||
<li>处方修改/撤销机制</li>
|
||
<li>支付确认与对账流程</li>
|
||
<li>四种药品类型的完整药库管理</li>
|
||
<li>药物冲突配伍数据管理入口</li>
|
||
<li>患者基本信息字段定义</li>
|
||
<li>处方副数（剂数）字段</li>
|
||
<li>统一账号体系确认</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="pri-card p1">
|
||
<h3 style="color:var(--orange);">P1 — 应该有（核心体验）</h3>
|
||
<ul class="pri-list">
|
||
<li>用法用量、禁忌注意事项字段</li>
|
||
<li>发货物流跟踪与患者通知</li>
|
||
<li>费用明细分项展示</li>
|
||
<li>药品效期管理与近效期预警</li>
|
||
<li>采购审批流程与供应商管理</li>
|
||
<li>实名认证审核状态反馈</li>
|
||
<li>打印功能（处方/发货单/标签）</li>
|
||
<li>药物冲突分级处理策略</li>
|
||
<li>退款流程</li>
|
||
<li>操作日志</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="pri-card p2">
|
||
<h3 style="color:var(--green);">P2 — 可以有（体验增强）</h3>
|
||
<ul class="pri-list">
|
||
<li>四诊信息采集（舌象/脉象）</li>
|
||
<li>常用诊断模板</li>
|
||
<li>患者标签功能</li>
|
||
<li>业绩图表展示</li>
|
||
<li>数据导出（Excel/PDF）</li>
|
||
<li>语音输入转文字</li>
|
||
<li>自取核销码</li>
|
||
<li>库存预警自动生成采购单</li>
|
||
<li>药品批量导入</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="pri-card pq">
|
||
<h3 style="color:var(--purple);">P? — 需进一步确认</h3>
|
||
<ul class="pri-list">
|
||
<li>统一账号体系 vs 各端独立账号？</li>
|
||
<li>积分获取规则和用途定义</li>
|
||
<li>第三方客服系统选型</li>
|
||
<li>PC 网站与小程序的功能差异</li>
|
||
<li>电子处方签名的合规要求</li>
|
||
<li>"历史数据"模块的具体含义</li>
|
||
<li>"后台开关"控制的具体功能</li>
|
||
<li>"2/3 量转换"的详细规则</li>
|
||
<li>煎药费计费标准</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Footer -->
|
||
<div class="footer">中医馆内部管理系统 · 需求分析对比报告 · 2026/05/23</div>
|
||
|
||
<!-- Bottom nav -->
|
||
<div class="bottom-nav" id="bottomNav">
|
||
<div class="bn active" data-tab="flow"><div class="bi">🔄</div>流程</div>
|
||
<div class="bn" data-tab="doctor"><div class="bi">🩺</div>医生端</div>
|
||
<div class="bn" data-tab="warehouse"><div class="bi">📦</div>仓库端</div>
|
||
<div class="bn" data-tab="admin"><div class="bi">⚙</div>后台</div>
|
||
<div class="bn" data-tab="nonfunc"><div class="bi">🛡</div>非功能</div>
|
||
<div class="bn" data-tab="priority"><div class="bi">📋</div>优先级</div>
|
||
</div>
|
||
|
||
<script>
|
||
// Tab switching
|
||
var tabs = document.querySelectorAll('.nav-tab');
|
||
var bns = document.querySelectorAll('.bottom-nav .bn');
|
||
var secs = document.querySelectorAll('.section');
|
||
|
||
function switchTab(name) {
|
||
tabs.forEach(function(t) { t.classList.toggle('active', t.dataset.tab === name); });
|
||
bns.forEach(function(b) { b.classList.toggle('active', b.dataset.tab === name); });
|
||
secs.forEach(function(s) { s.classList.toggle('active', s.id === 'sec-' + name); });
|
||
// scroll nav tab into view
|
||
var activeTab = document.querySelector('.nav-tab[data-tab="' + name + '"]');
|
||
if (activeTab) activeTab.scrollIntoView({ behavior: 'smooth', inline: 'center', block: 'nearest' });
|
||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||
}
|
||
|
||
tabs.forEach(function(t) { t.addEventListener('click', function() { switchTab(this.dataset.tab); }); });
|
||
bns.forEach(function(b) { b.addEventListener('click', function() { switchTab(this.dataset.tab); }); });
|
||
|
||
// Card toggle
|
||
function toggleCard(head) {
|
||
var card = head.parentElement;
|
||
card.classList.toggle('open');
|
||
}
|
||
|
||
// Fix nav-wrap top to match actual header height
|
||
function syncNavTop() {
|
||
var h = document.querySelector('.header').offsetHeight;
|
||
document.documentElement.style.setProperty('--header-h', h + 'px');
|
||
}
|
||
syncNavTop();
|
||
window.addEventListener('resize', syncNavTop);
|
||
|
||
// Expand/collapse all
|
||
function toggleAll(btn) {
|
||
var section = btn.parentElement;
|
||
var cards = section.querySelectorAll('.card');
|
||
var allOpen = true;
|
||
cards.forEach(function(c) { if (!c.classList.contains('open')) allOpen = false; });
|
||
cards.forEach(function(c) {
|
||
if (allOpen) c.classList.remove('open');
|
||
else c.classList.add('open');
|
||
});
|
||
btn.textContent = allOpen ? '展开全部 6 项' : '收起全部';
|
||
}
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|