Página inicial Explorar Ajuda
Entrar
WangKang
/
emoon-backend
1
0
Fork 0
Arquivos Issues 0 Pull Requests 0 Wiki
Tree: 99dd8958d3
Branches Tags
emoon-backend
/
docs
/
initiatives
/
FEAT-202606-002-fastgpt-integration
/
医梦深信服FastGPT合作模式演示.html

医梦深信服FastGPT合作模式演示.html 64 KB
Histórico Raw

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049 
  1. <!doctype html>
    2. 

  2. <html lang="zh-CN">
    3. 

  3. <head>
    4. 

  4.   <meta charset="utf-8" />
    5. 

  5.   <meta name="viewport" content="width=device-width, initial-scale=1" />
    6. 

  6.   <title>医梦 × 深信服 FastGPT 医疗智能体联合方案</title>
    7. 

  7.   <style>
    8. 

  8.     :root {
    9. 

  9.       --cyan: #3ad4d8;
    10. 

  10.       --indigo: #2b1f99;
    11. 

  11.       --ink: #17202a;
    12. 

  12.       --muted: #5f6b7a;
    13. 

  13.       --line: #dce5ee;
    14. 

  14.       --soft: #f4f8fb;
    15. 

  15.       --paper: #ffffff;
    16. 

  16.       --warn: #dc2626;
    17. 

  17.       --warn-soft: #fff5f5;
    18. 

  18.       --green: #1a8f92;
    19. 

  19.       --green-soft: #eefbfc;
    20. 

  20.       --orange: #2b1f99;
    21. 

  21.       --orange-soft: #f4f8fb;
    22. 

  22.       --shadow: 0 20px 50px rgba(23, 32, 42, 0.08);
    23. 

  23.     }
    24. 

  24.     * { box-sizing: border-box; margin: 0; }
    25. 

  25.     html, body {
    26. 

  26.       min-height: 100vh;
    27. 

  27.       font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif;
    28. 

  28.       background: linear-gradient(135deg, #f0f4f8 0%, #f8fafc 48%, #f0f4f8 100%);
    29. 

  29.       color: var(--ink);
    30. 

  30.       -webkit-font-smoothing: antialiased;
    31. 

  31.     }
    32. 

  32.     body { display: flex; justify-content: center; padding: 5px 12px; overflow: hidden; }
    33. 

  33.     .stage {
    34. 

  34.       width: min(1320px, calc(100vw - 40px));
    35. 

  35.       height: calc(100vh - 10px);
    36. 

  36.       min-height: 0;
    37. 

  37.       background: rgba(255,255,255,0.92);
    38. 

  38.       border-radius: 28px;
    39. 

  39.       box-shadow: var(--shadow);
    40. 

  40.       border: 1px solid rgba(43, 31, 153, 0.08);
    41. 

  41.       overflow: hidden;
    42. 

  42.       position: relative;
    43. 

  43.       backdrop-filter: blur(18px);
    44. 

  44.     }
    45. 

  45.     .stage::before {
    46. 

  46.       content: ""; position: absolute; left: 0; top: 0; bottom: 0;
    47. 

  47.       width: 5px;
    48. 

  48.       background: linear-gradient(180deg, var(--cyan) 0%, var(--indigo) 100%);
    49. 

  49.       z-index: 5; border-radius: 28px 0 0 28px;
    50. 

  50.     }
    51. 

  51.     /* ── Top bar ── */
    52. 

  52.     .topbar {
    53. 

  53.       padding: 18px 34px 0 46px;
    54. 

  54.       display: flex; justify-content: space-between; gap: 24px; align-items: flex-start;
    55. 

  55.     }
    56. 

  56.     .kicker {
    57. 

  57.       display: flex; align-items: center; gap: 10px; margin-bottom: 6px;
    58. 

  58.       color: var(--muted); font-weight: 600; font-size: 13px;
    59. 

  59.     }
    60. 

  60.     .dot-row { display: flex; gap: 7px; margin-right: 16px; }
    61. 

  61.     .dot-row span { width: 7px; height: 7px; border-radius: 50%; }
    62. 

  62.     .dot-row span:nth-child(1) { background: var(--cyan); }
    63. 

  63.     .dot-row span:nth-child(2) { background: var(--indigo); }
    64. 

  64.     .dot-row span:nth-child(3) { background: var(--green); }
    65. 

  65.     h1 {
    66. 

  66.       margin: 0; font-size: clamp(24px, 2.7vw, 36px); line-height: 1.1;
    67. 

  67.       letter-spacing: 0; color: #0d172a; max-width: 820px; font-weight: 650;
    68. 

  68.     }
    69. 

  69.     .term {
    70. 

  70.       display: inline-block; padding: 4px 13px 6px; border-radius: 11px;
    71. 

  71.       background: rgba(43, 31, 153, 0.08); color: var(--indigo);
    72. 

  72.       font-family: "JetBrains Mono", Menlo, monospace;
    73. 

  73.       font-size: 0.82em; vertical-align: 2px; white-space: nowrap; font-weight: 600;
    74. 

  74.     }
    75. 

  75.     .meeting-card {
    76. 

  76.       flex: 0 0 270px; background: var(--indigo); color: #fff; border-radius: 18px;
    77. 

  77.       padding: 14px 18px; min-height: 104px; position: relative; overflow: hidden;
    78. 

  78.     }
    79. 

  79.     .meeting-card::after {
    80. 

  80.       content: ""; position: absolute; width: 140px; height: 140px; border-radius: 50%;
    81. 

  81.       background: rgba(255,255,255,0.07); right: -50px; bottom: -66px;
    82. 

  82.     }
    83. 

  83.     .meeting-card strong { display: block; font-size: 18px; margin-bottom: 6px; position: relative; z-index: 1; }
    84. 

  84.     .meeting-card span { display: block; color: rgba(255,255,255,0.78); font-size: 13px; line-height: 1.42; position: relative; z-index: 1; }
    85. 

  85.     /* ── Tabs ── */
    86. 

  86.     .tabs {
    87. 

  87.       display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px;
    88. 

  88.       padding: 16px 34px 0 46px;
    89. 

  89.     }
    90. 

  90.     .tab {
    91. 

  91.       border: 1px solid var(--line); background: rgba(255,255,255,0.7);
    92. 

  92.       color: #435166; border-radius: 11px; padding: 8px 6px; font-size: 12px;
    93. 

  93.       font-weight: 700; cursor: pointer; transition: all 180ms ease; white-space: nowrap;
    94. 

  94.       text-align: center;
    95. 

  95.     }
    96. 

  96.     .tab:hover { transform: translateY(-1px); }
    97. 

  97.     .tab.active {
    98. 

  98.       background: rgba(43, 31, 153, 0.08); border-color: rgba(43, 31, 153, 0.25);
    99. 

  99.       color: var(--indigo); box-shadow: 0 8px 20px rgba(43,31,153,0.06);
    100. 

  100.     }
    101. 

  101.     /* ── Content ── */
    102. 

  102.     .content {
    103. 

  103.       padding: 18px 34px 24px 46px;
    104. 

  104.       position: relative;
    105. 

  105.       height: calc(100% - 150px);
    106. 

  106.       display: flex;
    107. 

  107.       align-items: stretch;
    108. 

  108.     }
    109. 

  109.     .scene { display: none; min-height: 0; width: 100%; animation: fadeUp 300ms ease both; }
    110. 

  110.     .scene.active {
    111. 

  111.       display: flex;
    112. 

  112.       flex-direction: column;
    113. 

  113.       justify-content: center;
    114. 

  114.     }
    115. 

  115.     @keyframes fadeUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
    116. 

  116.     /* ── Quote ── */
    117. 

  117.     .quote {
    118. 

  118.       text-align: center; font-size: clamp(21px, 2.35vw, 32px); line-height: 1.18;
    119. 

  119.       font-weight: 700; color: #0d172a; margin: 0 auto 16px; max-width: 1080px;
    120. 

  120.     }
    121. 

  121.     .quote .c-cyan { color: var(--cyan); }
    122. 

  122.     .quote .c-indigo { color: var(--indigo); }
    123. 

  123.     /* ── Split layout (2-col / 3-col) ── */
    124. 

  124.     .split2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 10px; align-items: stretch; }
    125. 

  125.     .split3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 10px; align-items: stretch; }
    126. 

  126.     .split4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 10px; }
    127. 

  127.     .split2-1 { display: grid; grid-template-columns: 1fr 1.18fr; gap: 14px; margin-top: 10px; align-items: stretch; }
    128. 

  128.     .overview-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 10px; align-items: stretch; }
    129. 

  129.     /* ── Cards ── */
    130. 

  130.     .card {
    131. 

  131.       border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,0.9);
    132. 

  132.       padding: 16px 18px; position: relative; overflow: hidden;
    133. 

  133.     }
    134. 

  134.     .card.indigo { border-color: rgba(43,31,153,0.18); background: rgba(43,31,153,0.03); }
    135. 

  135.     .card.cyan   { border-color: rgba(58,212,216,0.30); background: rgba(58,212,216,0.05); }
    136. 

  136.     .card.warn   { border-color: rgba(220,38,38,0.24); background: var(--warn-soft); }
    137. 

  137.     .card.green  { border-color: rgba(58,212,216,0.28); background: var(--green-soft); }
    138. 

  138.     .overview-card {
    139. 

  139.       background: rgba(255,255,255,0.94);
    140. 

  140.       border-color: rgba(43,31,153,0.12);
    141. 

  141.       box-shadow: 0 18px 44px rgba(23,32,42,0.055);
    142. 

  142.       min-height: 430px;
    143. 

  143.       display: flex;
    144. 

  144.       flex-direction: column;
    145. 

  145.     }
    146. 

  146.     .overview-card::before {
    147. 

  147.       content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px;
    148. 

  148.       background: var(--cyan);
    149. 

  149.     }
    150. 

  150.     .overview-card.mode::before { background: var(--indigo); }
    151. 

  151.     .overview-head { min-height: 74px; }
    152. 

  152.     .overview-body { flex: 1; display: flex; flex-direction: column; }
    153. 

  153.     .overview-card table { margin-top: 0; }
    154. 

  154.     .overview-footer {
    155. 

  155.       height: 62px;
    156. 

  156.       display: flex;
    157. 

  157.       flex-direction: column;
    158. 

  158.       justify-content: center;
    159. 

  159.       border-radius: 14px;
    160. 

  160.       padding: 9px 14px;
    161. 

  161.       margin-top: auto;
    162. 

  162.       border: 1px solid rgba(43,31,153,0.14);
    163. 

  163.       background: rgba(43,31,153,0.035);
    164. 

  164.       color: #26313d;
    165. 

  165.       font-size: 13px;
    166. 

  166.       line-height: 1.34;
    167. 

  167.       font-weight: 500;
    168. 

  168.     }
    169. 

  169.     .overview-footer strong {
    170. 

  170.       display: block;
    171. 

  171.       color: var(--indigo);
    172. 

  172.       font-weight: 680;
    173. 

  173.       margin-bottom: 4px;
    174. 

  174.     }
    175. 

  175.     .overview-footer.cyan {
    176. 

  176.       border-color: rgba(58,212,216,0.28);
    177. 

  177.       background: rgba(58,212,216,0.065);
    178. 

  178.       color: #1a5c5e;
    179. 

  179.     }
    180. 

  180.     .overview-footer.cyan strong { color: #116b6f; }
    181. 

  181.     .card h3 { font-size: 22px; font-weight: 650; color: var(--ink); margin-bottom: 8px; line-height: 1.18; }
    182. 

  182.     .card .tag {
    183. 

  183.       display: inline-flex; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
    184. 

  184.       margin-bottom: 8px;
    185. 

  185.     }
    186. 

  186.     .tag.indigo { background: rgba(43,31,153,0.1); color: var(--indigo); }
    187. 

  187.     .tag.cyan   { background: rgba(58,212,216,0.15); color: #1a6b6e; }
    188. 

  188.     .tag.green   { background: rgba(58,212,216,0.14); color: #1a6b6e; }
    189. 

  189.     .tag.orange  { background: rgba(43,31,153,0.08); color: var(--orange); }
    190. 

  190.     /* ── Lists ── */
    191. 

  191.     .items { list-style: none; padding: 0; display: grid; gap: 6px; }
    192. 

  192.     .items li {
    193. 

  193.       display: flex; gap: 8px; align-items: flex-start; font-size: 14px; line-height: 1.35;
    194. 

  194.       color: #26313d; font-weight: 500; padding: 6px 0;
    195. 

  195.     }
    196. 

  196.     .check, .cross, .lock-icon {
    197. 

  197.       min-width: 19px; height: 19px; border-radius: 50%; display: inline-flex;
    198. 

  198.       align-items: center; justify-content: center; color: #fff; font-size: 11px; font-weight: 800; margin-top: 1px;
    199. 

  199.     }
    200. 

  200.     .check { background: var(--green); }
    201. 

  201.     .cross { background: var(--warn); }
    202. 

  202.     .lock-icon { background: var(--indigo); }
    203. 

  203.     /* ── Table ── */
    204. 

  204.     table {
    205. 

  205.       width: 100%; border-collapse: separate; border-spacing: 0; font-size: 15px;
    206. 

  206.       border: 1px solid var(--line); border-radius: 18px; overflow: hidden;
    207. 

  207.       background: rgba(255,255,255,0.92); margin-top: 18px;
    208. 

  208.     }
    209. 

  209.     th, td { padding: 7px 12px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: middle; line-height: 1.22; }
    210. 

  210.     th { color: var(--indigo); font-size: 13px; font-weight: 650; background: rgba(58,212,216,0.08); }
    211. 

  211.     tr:last-child td { border-bottom: 0; }
    212. 

  212.     td { color: #26313d; font-weight: 420; }
    213. 

  213.     td.own { color: var(--indigo); font-weight: 600; white-space: nowrap; }
    214. 

  214.     td.own.emoon {
    215. 

  215.       color: #116b6f; background: rgba(58,212,216,0.08);
    216. 

  216.       border-left: 3px solid rgba(58,212,216,0.65);
    217. 

  217.     }
    218. 

  218.     td.own.sangfor {
    219. 

  219.       color: var(--indigo); background: rgba(43,31,153,0.055);
    220. 

  220.       border-left: 3px solid rgba(43,31,153,0.55);
    221. 

  221.     }
    222. 

  222.     td.dim { color: var(--muted); }
    223. 

  223.     /* ── Flow chain ── */
    224. 

  224.     .chain { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin-top: 20px; align-items: stretch; }
    225. 

  225.     .step {
    226. 

  226.       border: 1px solid var(--line); background: rgba(255,255,255,0.92); border-radius: 18px;
    227. 

  227.       padding: 12px 12px; min-height: 112px; position: relative; display: flex; flex-direction: column; gap: 5px;
    228. 

  228.     }
    229. 

  229.     .step .idx { color: var(--cyan); font-size: 15px; font-weight: 700; }
    230. 

  230.     .step strong { color: var(--ink); font-size: 16px; line-height: 1.2; font-weight: 650; }
    231. 

  231.     .step span { color: var(--muted); font-size: 12px; line-height: 1.32; }
    232. 

  232.     /* ── Boundary cards ── */
    233. 

  233.     .bcard {
    234. 

  234.       border-radius: 18px; padding: 20px 22px; min-height: 130px;
    235. 

  235.       border: 1px solid rgba(43,31,153,0.16); background: rgba(255,255,255,0.88);
    236. 

  236.       font-size: 15px; line-height: 1.4;
    237. 

  237.     }
    238. 

  238.     .bcard strong { display: block; color: var(--indigo); font-size: 20px; font-weight: 650; margin-bottom: 8px; }
    239. 

  239.     /* ── Value layout ── */
    240. 

  240.     .value-layout { display: grid; grid-template-columns: 330px 1fr; gap: 14px; margin-top: 10px; align-items: stretch; }
    241. 

  241.     .value-menu { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
    242. 

  242.     .value-btn {
    243. 

  243.       border: 1px solid var(--line); background: #fff; border-radius: 12px; padding: 9px;
    244. 

  244.       text-align: left; min-height: 64px; cursor: pointer; transition: all 180ms ease;
    245. 

  245.       font-size: 12px; font-weight: 600; color: #26313d; line-height: 1.22;
    246. 

  246.       display: grid; grid-template-columns: 28px 1fr; gap: 8px; align-items: center;
    247. 

  247.     }
    248. 

  248.     .value-btn:hover { transform: translateY(-1px); }
    249. 

  249.     .value-index {
    250. 

  250.       width: 28px; height: 28px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center;
    251. 

  251.       background: rgba(58,212,216,0.12); color: #126b70; font-weight: 720; font-size: 12px;
    252. 

  252.     }
    253. 

  253.     .value-label { display: block; }
    254. 

  254.     .value-btn.active {
    255. 

  255.       border-color: rgba(43,31,153,0.38); box-shadow: 0 16px 34px rgba(43,31,153,0.11);
    256. 

  256.       background: rgba(43,31,153,0.035); color: var(--indigo);
    257. 

  257.     }
    258. 

  258.     .value-btn.active .value-index { background: var(--indigo); color: #fff; }
    259. 

  259.     .value-detail {
    260. 

  260.       border-radius: 18px; background: #fff; color: var(--ink); padding: 22px 24px 22px 30px;
    261. 

  261.       min-height: 360px; position: relative; overflow: hidden;
    262. 

  262.       border: 1px solid rgba(43,31,153,0.16);
    263. 

  263.       box-shadow: 0 22px 50px rgba(23,32,42,0.07);
    264. 

  264.     }
    265. 

  265.     .value-detail::before {
    266. 

  266.       content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 7px;
    267. 

  267.       background: var(--cyan);
    268. 

  268.     }
    269. 

  269.     .value-detail::after {
    270. 

  270.       content: none;
    271. 

  271.     }
    272. 

  272.     .value-detail h2 { margin: 0 0 10px; font-size: 25px; line-height: 1.18; max-width: 700px; position: relative; z-index: 1; font-weight: 650; color: var(--indigo); }
    273. 

  273.     .value-detail p { margin: 0 0 14px; font-size: 15px; line-height: 1.42; color: #4c5968; position: relative; z-index: 1; font-weight: 450; }
    274. 

  274.     .value-points { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; position: relative; z-index: 1; }
    275. 

  275.     .value-point {
    276. 

  276.       min-height: 58px; background: rgba(58,212,216,0.07); border: 1px solid rgba(58,212,216,0.22);
    277. 

  277.       border-radius: 12px; padding: 10px 12px; font-size: 13px; line-height: 1.3; font-weight: 500; color: #22313d;
    278. 

  278.     }
    279. 

  279.     .value-point:nth-child(even) { background: rgba(43,31,153,0.035); border-color: rgba(43,31,153,0.14); }
    280. 

  280.     /* ── Architecture diagram ── */
    281. 

  281.     .arch { display: grid; grid-template-columns: 1fr 46px 1fr 46px 1fr 46px 1fr; align-items: center; gap: 0; margin-top: 16px; }
    282. 

  282.     .node {
    283. 

  283.       min-height: 96px; border: 1px solid var(--line); border-radius: 18px;
    284. 

  284.       background: rgba(255,255,255,0.92); padding: 14px 12px;
    285. 

  285.       display: flex; flex-direction: column; justify-content: center; text-align: center;
    286. 

  286.     }
    287. 

  287.     .node strong { color: var(--ink); font-size: 18px; font-weight: 650; margin-bottom: 5px; }
    288. 

  288.     .node span { color: var(--muted); font-size: 13px; line-height: 1.25; }
    289. 

  289.     .arrow { text-align: center; font-size: 36px; line-height: 1; color: var(--cyan); font-weight: 300; }
    290. 

  290.     .under-arch { margin-top: 20px; display: grid; grid-template-columns: 1.4fr 0.9fr 1fr; gap: 18px; align-items: center; }
    291. 

  291.     .gateway { border: 1px solid rgba(43,31,153,0.2); background: rgba(43,31,153,0.03); border-radius: 20px; padding: 20px; text-align: center; }
    292. 

  292.     .gateway strong { color: var(--indigo); font-size: 24px; font-weight: 650; }
    293. 

  293.     /* ── Guardrails ── */
    294. 

  294.     .guardrails { margin-top: 20px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
    295. 

  295.     .guard {
    296. 

  296.       border-radius: 16px; border: 1px solid rgba(43,31,153,0.16); padding: 16px 18px;
    297. 

  297.       color: var(--indigo); background: rgba(255,255,255,0.82); font-size: 17px; font-weight: 600; text-align: center;
    298. 

  298.     }
    299. 

  299.     /* ── Bottom line ── */
    300. 

  300.     .bottom-line {
    301. 

  301.       margin-top: 14px; border-radius: 16px; background: rgba(43,31,153,0.04);
    302. 

  302.       border: 1px solid rgba(43,31,153,0.12); padding: 13px 18px;
    303. 

  303.       display: flex; align-items: center; justify-content: space-between; gap: 20px;
    304. 

  304.     }
    305. 

  305.     .bottom-line strong { font-size: 18px; line-height: 1.25; color: var(--ink); }
    306. 

  306.     .bottom-line span { color: var(--muted); font-size: 13px; line-height: 1.35; font-weight: 450; max-width: 420px; }
    307. 

  307.     /* ── FAQ ── */
    308. 

  308.     .faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
    309. 

  309.     .faq-item { border: 1px solid var(--line); border-radius: 16px; background: #fff; padding: 16px 18px; }
    310. 

  310.     .faq-item .q { font-size: 15px; font-weight: 700; color: var(--indigo); margin-bottom: 6px; }
    311. 

  311.     .faq-item .a { font-size: 14px; color: var(--muted); line-height: 1.45; }
    312. 

  312.     /* ── Phase cards ── */
    313. 

  313.     .phase-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 10px; }
    314. 

  314.     .phase {
    315. 

  315.       border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,0.9);
    316. 

  316.       padding: 14px 13px; min-height: 174px;
    317. 

  317.     }
    318. 

  318.     .phase .num { display: inline-flex; width: 32px; height: 32px; border-radius: 10px; align-items: center; justify-content: center; background: var(--indigo); color: #fff; font-weight: 800; margin-bottom: 10px; font-size: 16px; }
    319. 

  319.     .phase h3 { font-size: 16px; font-weight: 650; color: var(--ink); margin-bottom: 6px; }
    320. 

  320.     .phase p { font-size: 12px; color: var(--muted); line-height: 1.32; }
    321. 

  321.     /* ── Golden quotes ── */
    322. 

  322.     .golden { margin-top: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    323. 

  323.     .gq { border-radius: 12px; padding: 10px 12px; font-size: 13px; font-weight: 600; line-height: 1.25; text-align: center; display: flex; align-items: center; justify-content: center; }
    324. 

  324.     .gq:nth-child(odd) { background: rgba(58,212,216,0.1); color: #1a5c5e; border: 1px solid rgba(58,212,216,0.2); }
    325. 

  325.     .gq:nth-child(even) { background: rgba(43,31,153,0.06); color: var(--indigo); border: 1px solid rgba(43,31,153,0.12); }
    326. 

  326.     /* ── Check table ── */
    327. 

  327.     .checklist { margin-top: 10px; display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
    328. 

  328.     .cl-item { border: 1px solid var(--line); border-radius: 14px; background: #fff; padding: 10px 12px; display: flex; gap: 8px; align-items: flex-start; }
    329. 

  329.     .cl-item .num { min-width: 28px; height: 28px; border-radius: 8px; background: rgba(43,31,153,0.08); color: var(--indigo); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; }
    330. 

  330.     .cl-item div { font-size: 13px; line-height: 1.3; color: #26313d; }
    331. 

  331.     /* ── Section label ── */
    332. 

  332.     .sect { font-size: 16px; font-weight: 700; color: var(--indigo); margin: 14px 0 8px; display: flex; align-items: center; gap: 8px; }
    333. 

  333.     .sect::before { content: ""; width: 4px; height: 18px; border-radius: 2px; background: var(--cyan); }
    334. 

  334.     /* ── Highlight box ── */
    335. 

  335.     .hl-box { border-radius: 14px; padding: 12px 15px; margin-top: 10px; border: 1px solid rgba(58,212,216,0.3); background: var(--green-soft); font-size: 13px; line-height: 1.35; color: #1a5c5e; font-weight: 500; }
    336. 

  336.     .hl-box.warn { border-color: rgba(220,38,38,0.22); background: var(--warn-soft); color: #991b1b; }
    337. 

  337.     .hl-box.indigo { border-color: rgba(43,31,153,0.14); background: rgba(43,31,153,0.03); color: var(--ink); }
    338. 

  338.     /* ── Mini flow ── */
    339. 

  339.     .mini-flow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 12px 0; font-size: 14px; color: var(--muted); }
    340. 

  340.     .mini-flow .mf-node { padding: 6px 10px; border-radius: 8px; background: rgba(255,255,255,0.9); border: 1px solid var(--line); font-weight: 500; color: #26313d; white-space: nowrap; }
    341. 

  341.     .mini-flow .mf-arrow { color: var(--cyan); font-weight: 600; }
    342. 

  342.     .vertical-flow { display: grid; gap: 7px; margin-top: 12px; justify-items: stretch; }
    343. 

  343.     .vertical-flow .vf-node {
    344. 

  344.       border: 1px solid var(--line); background: rgba(255,255,255,0.92); border-radius: 12px;
    345. 

  345.       padding: 8px 12px; text-align: center; font-size: 13px; font-weight: 560;
    346. 

  346.       color: #26313d; line-height: 1.25;
    347. 

  347.     }
    348. 

  348.     .vertical-flow .vf-node.primary {
    349. 

  349.       border-color: rgba(43,31,153,0.25); background: rgba(43,31,153,0.035); color: var(--indigo);
    350. 

  350.     }
    351. 

  351.     .vertical-flow .vf-arrow { color: var(--cyan); text-align: center; font-size: 18px; line-height: 1; }
    352. 

  352.     .mcp-lane {
    353. 

  353.       display: grid;
    354. 

  354.       grid-template-columns: 58px 1fr;
    355. 

  355.       gap: 10px;
    356. 

  356.       align-items: stretch;
    357. 

  357.       margin-top: 12px;
    358. 

  358.     }
    359. 

  359.     .mcp-lane-label {
    360. 

  360.       writing-mode: vertical-rl;
    361. 

  361.       text-orientation: mixed;
    362. 

  362.       display: flex;
    363. 

  363.       align-items: center;
    364. 

  364.       justify-content: center;
    365. 

  365.       border: 1px solid rgba(43,31,153,0.18);
    366. 

  366.       background: rgba(43,31,153,0.045);
    367. 

  367.       color: var(--indigo);
    368. 

  368.       border-radius: 14px;
    369. 

  369.       font-size: 13px;
    370. 

  370.       font-weight: 680;
    371. 

  371.       letter-spacing: 0;
    372. 

  372.     }
    373. 

  373.     .mcp-lane .vertical-flow { margin-top: 0; }
    374. 

  374.     .risk-flow { display: grid; gap: 8px; margin: 12px 0; }
    375. 

  375.     .risk-flow .risk-node {
    376. 

  376.       background: rgba(220,38,38,0.045); border: 1px dashed rgba(220,38,38,0.28);
    377. 

  377.       border-radius: 12px; padding: 9px 12px; text-align: center; font-size: 13px;
    378. 

  378.       line-height: 1.35; color: #7f1d1d; font-weight: 560;
    379. 

  379.     }
    380. 

  380.     .risk-flow .risk-arrow { text-align: center; color: var(--warn); font-size: 20px; line-height: 1; }
    381. 

  381.     .risk-points { display: grid; gap: 8px; margin-top: 12px; }
    382. 

  382.     .risk-point {
    383. 

  383.       border: 1px solid rgba(220,38,38,0.18); background: rgba(255,255,255,0.78);
    384. 

  384.       border-radius: 12px; padding: 10px 12px; color: #7f1d1d;
    385. 

  385.       font-size: 13px; line-height: 1.38; font-weight: 500;
    386. 

  386.     }
    387. 

  387.     .risk-point strong { display: block; color: var(--warn); margin-bottom: 3px; font-weight: 650; }
    388. 

  388.     .status-table { display: grid; gap: 7px; margin-top: 12px; }
    389. 

  389.     .status-row {
    390. 

  390.       display: grid; grid-template-columns: 68px 1fr; gap: 8px; align-items: stretch;
    391. 

  391.       border: 1px solid rgba(58,212,216,0.22); background: rgba(255,255,255,0.78);
    392. 

  392.       border-radius: 12px; padding: 8px;
    393. 

  393.     }
    394. 

  394.     .status-row strong {
    395. 

  395.       display: flex; align-items: center; justify-content: center; color: #1a6b6e;
    396. 

  396.       background: rgba(58,212,216,0.12); border-radius: 9px; font-size: 12px; font-weight: 650;
    397. 

  397.     }
    398. 

  398.     .status-row span { color: #26313d; font-size: 13px; line-height: 1.35; font-weight: 520; }
    399. 

  399.     .compact-line { padding: 12px 16px; margin-top: 12px; }
    400. 

  400.     .compact-line strong { font-size: 17px; }
    401. 

  401.     .compact-line span { font-size: 13px; max-width: 560px; }
    402. 

  402. 

  403.     @media (min-width: 1600px) and (min-height: 1000px) {
    404. 

  404.       body { padding: 8px 18px; }
    405. 

  405.       .stage { width: min(1500px, calc(100vw - 56px)); height: calc(100vh - 16px); }
    406. 

  406.       .topbar { padding: 24px 44px 0 58px; }
    407. 

  407.       .tabs { padding: 20px 44px 0 58px; gap: 10px; }
    408. 

  408.       .tab { padding: 10px 8px; font-size: 13px; border-radius: 13px; }
    409. 

  409.       h1 { font-size: clamp(28px, 2.25vw, 38px); line-height: 1.12; max-width: 1060px; }
    410. 

  410.       .meeting-card { flex-basis: 300px; min-height: 112px; padding: 17px 21px; }
    411. 

  411.       .meeting-card strong { font-size: 20px; }
    412. 

  412.       .meeting-card span { font-size: 14px; line-height: 1.55; }
    413. 

  413.       .content { height: calc(100% - 172px); padding: 26px 44px 34px 58px; }
    414. 

  414.       .scene.active { justify-content: center; gap: 18px; }
    415. 

  415.       .quote {
    416. 

  416.         font-size: clamp(28px, 2.25vw, 38px);
    417. 

  417.         line-height: 1.26;
    418. 

  418.         margin-bottom: 18px;
    419. 

  419.         max-width: 1360px;
    420. 

  420.       }
    421. 

  421.       .split2 { gap: 24px; margin-top: 12px; }
    422. 

  422.       .split3 { gap: 20px; margin-top: 12px; }
    423. 

  423.       .split2-1 { gap: 24px; margin-top: 12px; }
    424. 

  424.       .overview-layout { gap: 24px; margin-top: 12px; }
    425. 

  425.       .overview-card { min-height: 480px; padding: 20px 24px; }
    426. 

  426.       .overview-head { min-height: 72px; }
    427. 

  427.       .overview-card table { font-size: 13.2px; }
    428. 

  428.       .overview-card th, .overview-card td { padding: 5px 9px; line-height: 1.18; }
    429. 

  429.       .overview-footer { height: 64px; padding: 9px 14px; font-size: 13px; line-height: 1.34; margin-top: auto; }
    430. 

  430.       .card { padding: 24px 26px; border-radius: 22px; }
    431. 

  431.       .card h3 { font-size: 25px; line-height: 1.25; margin-bottom: 12px; }
    432. 

  432.       .card .tag { font-size: 13px; padding: 6px 12px; margin-bottom: 12px; }
    433. 

  433.       .items { gap: 9px; }
    434. 

  434.       .items li { font-size: 15.5px; line-height: 1.58; padding: 7px 0; gap: 10px; }
    435. 

  435.       table { font-size: 16px; margin-top: 20px; }
    436. 

  436.       th, td { padding: 10px 14px; line-height: 1.36; }
    437. 

  437.       th { font-size: 14px; }
    438. 

  438.       .hl-box { font-size: 15px; line-height: 1.55; padding: 15px 18px; margin-top: 14px; }
    439. 

  439.       .bottom-line { padding: 17px 22px; margin-top: 20px; }
    440. 

  440.       .bottom-line strong { font-size: 20px; line-height: 1.35; }
    441. 

  441.       .bottom-line span { font-size: 14.5px; line-height: 1.48; max-width: 520px; }
    442. 

  442.       .golden { gap: 12px; margin-top: 18px; }
    443. 

  443.       .gq { padding: 14px 16px; font-size: 15px; line-height: 1.35; }
    444. 

  444.       .arch { margin-top: 18px; }
    445. 

  445.       .node { min-height: 112px; padding: 16px 14px; }
    446. 

  446.       .node strong { font-size: 19px; }
    447. 

  447.       .node span { font-size: 14px; line-height: 1.38; }
    448. 

  448.       .under-arch { margin-top: 22px; gap: 20px; }
    449. 

  449.       .gateway { padding: 22px; }
    450. 

  450.       .vertical-flow { gap: 10px; margin-top: 18px; }
    451. 

  451.       .vertical-flow .vf-node { padding: 11px 14px; font-size: 14.5px; line-height: 1.42; }
    452. 

  452.       .vertical-flow .vf-arrow { font-size: 20px; }
    453. 

  453.       .risk-flow { gap: 10px; margin: 16px 0; }
    454. 

  454.       .risk-flow .risk-node { padding: 12px 14px; font-size: 14.5px; line-height: 1.48; }
    455. 

  455.       .risk-point { padding: 12px 14px; font-size: 14px; line-height: 1.48; }
    456. 

  456.       .split3 > .card { min-height: 355px; }
    457. 

  457.       .status-table { gap: 9px; margin-top: 16px; }
    458. 

  458.       .status-row { grid-template-columns: 76px 1fr; padding: 10px; }
    459. 

  459.       .status-row strong { font-size: 13px; }
    460. 

  460.       .status-row span { font-size: 14.2px; line-height: 1.45; }
    461. 

  461.       .compact-line { padding: 13px 18px; margin-top: 14px; }
    462. 

  462.       .compact-line strong { font-size: 18px; }
    463. 

  463.       .compact-line span { font-size: 13.5px; line-height: 1.42; max-width: 620px; }
    464. 

  464.       .arch-layout .card { padding: 21px 24px; }
    465. 

  465.       .arch-layout .card h3 { font-size: 23px; margin-bottom: 10px; }
    466. 

  466.       .arch-layout .node { min-height: 94px; padding: 12px 10px; }
    467. 

  467.       .arch-layout .node strong { font-size: 18px; }
    468. 

  468.       .arch-layout .node span { font-size: 13px; line-height: 1.32; }
    469. 

  469.       .arch-layout .vertical-flow { gap: 7px; margin-top: 13px; }
    470. 

  470.       .arch-layout .vertical-flow .vf-node { padding: 8px 12px; font-size: 13.5px; line-height: 1.32; }
    471. 

  471.       .arch-layout .vertical-flow .vf-arrow { font-size: 18px; }
    472. 

  472.       .arch-layout .mcp-lane { grid-template-columns: 58px 1fr; gap: 10px; margin-top: 13px; }
    473. 

  473.       .arch-layout .mcp-lane .vertical-flow { margin-top: 0; }
    474. 

  474.       .arch-layout .under-arch { margin-top: 15px; gap: 14px; }
    475. 

  475.       .arch-layout .gateway { padding: 16px; }
    476. 

  476.       .arch-layout .gateway strong { font-size: 22px; }
    477. 

  477.       .arch-layout .risk-flow { gap: 7px; margin: 12px 0; }
    478. 

  478.       .arch-layout .risk-flow .risk-node { padding: 9px 12px; font-size: 13.5px; line-height: 1.38; }
    479. 

  479.       .arch-layout .risk-point { padding: 9px 12px; font-size: 13.2px; line-height: 1.38; }
    480. 

  480.       .arch-layout .hl-box { padding: 11px 14px; font-size: 13.8px; line-height: 1.42; }
    481. 

  481.       .bcard { padding: 24px 26px; font-size: 16px; line-height: 1.55; }
    482. 

  482.       .value-layout { grid-template-columns: 390px 1fr; gap: 24px; margin-top: 12px; }
    483. 

  483.       .value-menu { gap: 10px; }
    484. 

  484.       .value-btn { min-height: 82px; padding: 13px 14px; font-size: 14px; line-height: 1.38; border-radius: 14px; grid-template-columns: 34px 1fr; gap: 10px; }
    485. 

  485.       .value-index { width: 34px; height: 34px; border-radius: 11px; font-size: 13px; }
    486. 

  486.       .value-detail { min-height: 500px; padding: 34px 38px 34px 46px; border-radius: 22px; }
    487. 

  487.       .value-detail h2 { font-size: 31px; line-height: 1.25; margin-bottom: 18px; max-width: 820px; }
    488. 

  488.       .value-detail p { font-size: 17px; line-height: 1.68; margin-bottom: 22px; }
    489. 

  489.       .value-points { gap: 12px; }
    490. 

  490.       .value-point { min-height: 84px; padding: 15px 17px; font-size: 15px; line-height: 1.5; }
    491. 

  491.       .chain { gap: 14px; margin-top: 18px; }
    492. 

  492.       .step { min-height: 126px; padding: 16px 15px; gap: 8px; }
    493. 

  493.       .step strong { font-size: 17px; line-height: 1.28; }
    494. 

  494.       .step span { font-size: 13.5px; line-height: 1.45; }
    495. 

  495.       .phase-grid { gap: 16px; margin-top: 14px; }
    496. 

  496.       .phase { min-height: 220px; padding: 20px 18px; }
    497. 

  497.       .phase h3 { font-size: 18px; line-height: 1.35; margin-bottom: 8px; }
    498. 

  498.       .phase p { font-size: 13.5px; line-height: 1.5; }
    499. 

  499.       .checklist { gap: 12px; margin-top: 14px; }
    500. 

  500.       .cl-item { padding: 13px 15px; gap: 10px; }
    501. 

  501.       .cl-item div { font-size: 14px; line-height: 1.45; }
    502. 

  502.       .module-layout .card { padding: 21px 22px; }
    503. 

  503.       .module-layout .card h3 { font-size: 23px; margin-bottom: 9px; }
    504. 

  504.       .module-layout .sect { margin: 10px 0 6px; font-size: 15px; }
    505. 

  505.       .module-layout .items { gap: 5px; }
    506. 

  506.       .module-layout .items li { font-size: 14px; line-height: 1.35; padding: 4px 0; }
    507. 

  507.       .module-layout .vertical-flow { gap: 7px; margin-top: 12px; }
    508. 

  508.       .module-layout .vertical-flow .vf-node { padding: 8px 12px; font-size: 13.5px; line-height: 1.28; }
    509. 

  509.       .module-layout .vertical-flow .vf-arrow { font-size: 16px; }
    510. 

  510.       .module-layout table { margin-top: 8px; font-size: 13.5px; }
    511. 

  511.       .module-layout th, .module-layout td { padding: 6px 8px; line-height: 1.22; }
    512. 

  512.       .module-layout .mini-flow { margin-top: 8px; gap: 5px; font-size: 12.5px; }
    513. 

  513.       .module-layout .mf-node { padding: 5px 7px; }
    514. 

  514.       .module-layout .hl-box { padding: 10px 12px; font-size: 13.2px; line-height: 1.34; margin-top: 9px; }
    515. 

  515.       .landing-grid { gap: 12px; margin-top: 8px; }
    516. 

  516.       .landing-grid .phase { min-height: 188px; padding: 15px 14px; }
    517. 

  517.       .landing-grid .phase .num { width: 28px; height: 28px; font-size: 14px; margin-bottom: 7px; }
    518. 

  518.       .landing-grid .phase h3 { font-size: 16px; margin-bottom: 5px; }
    519. 

  519.       .landing-grid .phase p { font-size: 12.5px; line-height: 1.38; }
    520. 

  520.       .landing-checklist { gap: 9px; margin-top: 10px; }
    521. 

  521.       .landing-checklist .cl-item { padding: 9px 11px; }
    522. 

  522.       .landing-checklist .cl-item div { font-size: 12.8px; line-height: 1.32; }
    523. 

  523.       .landing-sample { padding: 11px 14px; font-size: 13.2px; line-height: 1.38; margin-top: 10px; }
    524. 

  524.       .faq-grid { gap: 18px; margin-top: 18px; }
    525. 

  525.       .faq-item { padding: 20px 22px; }
    526. 

  526.       .faq-item .q { font-size: 16px; margin-bottom: 10px; }
    527. 

  527.       .faq-item .a { font-size: 15px; line-height: 1.55; }
    528. 

  528.     }
    529. 

  529.   </style>
    530. 

  530. </head>
    531. 

  531. <body>
    532. 

  532. <div class="stage">
    533. 

  533.   <div class="topbar">
    534. 

  534.     <div>
    535. 

  535.       <div class="kicker"><span class="dot-row"><span></span><span></span><span></span></span>医梦 × 深信服 FastGPT 医疗智能体联合方案</div>
    536. 

  536.       <h1><span class="term">FastGPT</span> AI 能力底座 + <span class="term">医梦</span> 医疗智能体控制层</h1>
    537. 

  537.     </div>
    538. 

  538.     <div class="meeting-card">
    539. 

  539.       <strong>今日目标</strong>
    540. 

  540.       <span>展示联合方案全景：<br/>FastGPT 承载 AI 能力底座，医梦承接医疗智能体落地闭环。</span>
    541. 

  541.     </div>
    542. 

  542.   </div>
    543. 

  543. 

  544.   <!-- 8 Tabs -->
    545. 

  545.   <div class="tabs" id="tabBar"></div>
    546. 

  546. 

  547.   <!-- Content scenes -->
    548. 

  548.   <section class="content" id="sceneContainer"></section>
    549. 

  549. </div>
    550. 

  550. 

  551. <script>
    552. 

  552. // ═══════════════════════════════════════════
    553. 

  553. // DATA
    554. 

  554. // ═══════════════════════════════════════════
    555. 

  555. const TAB_LABELS = ['① 总判断','② 技术架构','③ 协作边界','④ 模块分工','⑤ 业务流程','⑥ 八大价值','⑦ 落地途径','⑧ 协作原则'];
    556. 

  556. 

  557. const values = [
    558. 

  558.   { title:'1. 从通用Agent平台变成医疗可交付系统',
    559. 

  559.     text:'FastGPT 已经能搭 Agent，但医院买的不是“会生成回答”的平台，而是能进业务系统、能被医生确认、能被患者理解、能被甲方验收的场景。医梦补的是医疗 Agent 落地最后一公里，但这一公里工作非常多、非常碎。',
    560. 

  560.     points:['把报告解读、慢病、挂号导诊拆成可交付场景','设计任务状态机、确认点、异常兜底和验收指标','推动医院及厂商完成接口、数据、权限和流程整合','把 Demo 变成医院可上线、可验收、可复制的场景包'] },
    561. 

  561.   { title:'2. 掌握医疗业务接口语义',
    562. 

  562.     text:'医院接口不是普通 REST API。HIS、LIS、EMR、慢病和物联系统背后都有业务状态、权限规则、厂商差异和审计责任。医梦的价值是把这些“医院黑盒接口”翻译成 FastGPT 可安全调用的医疗工具。',
    563. 

  563.     points:['查报告要判断审核、作废、危急值、可见范围','锁号要处理身份、重复锁号、超时释放、支付补偿','慢病任务要区分草案、医生确认、居民下发','医梦 MCP Gateway 把非标接口封装成受控标准工具'] },
    564. 

  564.   { title:'3. 负责医疗安全边界',
    565. 

  565.     text:'医疗输出不是越完整越好，也不是越像医生越好。患者端不能自动诊断、不能自动开药、不能制造恐慌；医生端又要保留专业结构和依据。这里需要一层医疗安全规则，而不是只靠 Prompt。',
    566. 

  566.     points:['禁止自动诊断、自动处方和越权建议','患者端做通俗化和风险提示，医生端保留专业摘要','危急值、用药、高风险内容进入医生确认或转人工','输出做 Schema 校验、风险分层和审计留痕'] },
    567. 

  567.   { title:'4. 拥有医疗知识库工程能力',
    568. 

  568.     text:'FastGPT 可以跑知识库，但医疗知识库的难点在“怎么拆、怎么写、谁审核、怎么迭代”。上传指南只能得到泛泛回答，真正可用的知识库要被拆成医学规则、患者表达、医生模板、禁止表达和反馈优化池。',
    569. 

  569.     points:['血常规拆成指标解释、异常组合、风险分层、趋势分析','慢病拆成饮食、运动、用药、复诊、危险信号规则','维护患者端表达、医生端模板、禁止表达和审核流程','医梦维护源资产，审核后同步 FastGPT 运行副本'] },
    570. 

  570.   { title:'5. 设计医生反馈闭环',
    571. 

  571.     text:'医疗场景里，点赞点踩不够。真正有价值的是医生有没有采纳、改了哪句话、哪个指标解释错了、是否漏了异常、是否有风险。医梦把这些反馈结构化，才能持续优化知识库和流程。',
    572. 

  572.     points:['记录采纳率、修改率、风险标注和错误类型','反馈关联指标、文本段落、知识条目、模型和流程版本','医生修正文案进入知识库源资产和 Prompt 优化池','形成医疗场景 Benchmark，支撑专病和持续运营'] },
    573. 

  573.   { title:'6. 用Card Runtime承接关键动作',
    574. 

  574.     text:'医疗 Agent 不能只输出一段聊天文本。挂号、报告解读、慢病任务、随访计划都需要卡片承接，因为卡片能表达状态、确认动作、过期时间、审计记录和后续写操作。',
    575. 

  575.     points:['报告异常摘要卡、患者通俗解读卡、医生反馈卡','慢病任务草案卡、医生审核卡、随访风险提醒卡','卡片动作绑定幂等、过期、审计和状态流转','医生或患者确认后，才进入医院系统写操作'] },
    576. 

  576.   { title:'7. 包装成甲方可采购的场景包',
    577. 

  577.     text:'医院不会采购“一个很强的 Workflow 节点”，医院采购的是报告解读、慢病管理、导诊分诊这类明确场景。医梦把平台能力翻译成医院能理解、能试点、能验收、能复制的场景包。',
    578. 

  578.     points:['每个场景包包含流程、工具、知识库、卡片和风险规则','提供 Prompt 模板、Card Schema、测试用例和验收指标','定义解析成功率、医生采纳率、严重错误率、追溯能力','把平台能力变成可采购、可交付、可复制的方案'] },
    579. 

  579.   { title:'8. 补齐医疗商业化计量',
    580. 

  580.     text:'Token 和调用量只能说明 AI 成本，不能说明医疗服务价值。医院项目后续要运营，就要按医院、科室、医生、患者端、报告类型、场景包、采纳率和质量评分计量。',
    581. 

  581.     points:['按医院、科室、医生、患者端和医生端统计','按智能体、设备、报告类型、任务类型归因','结合采纳率、修改率、任务生成量和服务包转化','支撑能力值、场景包授权、知识库建设和运营服务费'] }
    582. 

  582. ];
    583. 

  583. 

  584. // ═══════════════════════════════════════════
    585. 

  585. // RENDER
    586. 

  586. // ═══════════════════════════════════════════
    587. 

  587. function h(tag, attrs, ...children) {
    588. 

  588.   const el = document.createElement(tag);
    589. 

  589.   if (attrs) Object.entries(attrs).forEach(([k,v]) => { if (v !== undefined) el.setAttribute(k,v); });
    590. 

  590.   children.forEach(c => { if (c != null) el.append(typeof c === 'string' ? document.createTextNode(c) : c); });
    591. 

  591.   return el;
    592. 

  592. }
    593. 

  593. 

  594. function renderTabBar() {
    595. 

  595.   const bar = document.getElementById('tabBar');
    596. 

  596.   bar.innerHTML = TAB_LABELS.map((l,i) =>
    597. 

  597.     `<button class="tab${i===0?' active':''}" data-idx="${i}">${l}</button>`
    598. 

  598.   ).join('');
    599. 

  599.   bar.querySelectorAll('.tab').forEach(btn => {
    600. 

  600.     btn.addEventListener('click', () => showScene(Number(btn.dataset.idx)));
    601. 

  601.   });
    602. 

  602. }
    603. 

  603. 

  604. function renderScenes() {
    605. 

  605.   const container = document.getElementById('sceneContainer');
    606. 

  606.   const scenes = [
    607. 

  607.     scene01(), scene02(), scene03(), scene04(),
    608. 

  608.     scene05(), scene06(), scene07(), scene08()
    609. 

  609.   ];
    610. 

  610.   scenes.forEach((html, i) => {
    611. 

  611.     const article = document.createElement('article');
    612. 

  612.     article.id = 'scene-' + i;
    613. 

  613.     article.className = 'scene' + (i === 0 ? ' active' : '');
    614. 

  614.     article.innerHTML = html;
    615. 

  615.     container.appendChild(article);
    616. 

  616.   });
    617. 

  617.   // Init value panel in scene 5
    618. 

  618.   initValuePanel();
    619. 

  619. }
    620. 

  620. 

  621. /* ── Scene 1: 总判断 ── */
    622. 

  622. function scene01() {
    623. 

  623.   return `
    624. 

  624.     <div class="quote">先把合作全景说清楚：<span class="c-indigo">医梦负责医疗控制层</span>，<span class="c-cyan">深信服负责 AI 与基础设施底座</span></div>
    625. 

  625.     <div class="overview-layout">
    626. 

  626.       <div class="card overview-card">
    627. 

  627.         <div class="overview-head">
    628. 

  628.           <span class="tag cyan">能力边界全景图</span>
    629. 

  629.           <h3>从入口到算力的分层协作</h3>
    630. 

  630.         </div>
    631. 

  631.         <div class="overview-body">
    632. 

  632.           <table style="font-size:14px">
    633. 

  633.             <colgroup>
    634. 

  634.               <col style="width:30%">
    635. 

  635.               <col style="width:52%">
    636. 

  636.               <col style="width:18%">
    637. 

  637.             </colgroup>
    638. 

  638.             <thead><tr><th>模块</th><th>产品 / 能力</th><th>主责</th></tr></thead>
    639. 

  639.             <tbody>
    640. 

  640.               <tr><td>客户端</td><td>统一入口、智能体入口能力增强</td><td class="own emoon">医梦</td></tr>
    641. 

  641.               <tr><td>权限、路由、CARD</td><td>AI 中台：身份权限、场景路由、医疗卡片</td><td class="own emoon">医梦</td></tr>
    642. 

  642.               <tr><td rowspan="3">智能体构建客户端</td><td>Workflow Build Service：医疗流程设计、确认点、输出结构</td><td class="own emoon">医梦</td></tr>
    643. 

  643.               <tr><td>Workflow Panel：工作流画布面板</td><td class="own sangfor">深信服</td></tr>
    644. 

  644.               <tr><td>FastGPT：模型、RAG、工具调用能力</td><td class="own sangfor">深信服</td></tr>
    645. 

  645.               <tr><td>智能体构建服务端</td><td>MCP Server、医疗工具网关、知识库源资产</td><td class="own emoon">医梦</td></tr>
    646. 

  646.               <tr><td>负载均衡</td><td>AGI 调度、平台运行、资源编排</td><td class="own sangfor">深信服</td></tr>
    647. 

  647.               <tr><td>GPU</td><td>超融合、算力、安全、私有化部署</td><td class="own sangfor">深信服</td></tr>
    648. 

  648.             </tbody>
    649. 

  649.           </table>
    650. 

  650.           <div class="overview-footer cyan"><strong>分工原则</strong>医梦承接医疗控制层和医院侧复杂度；深信服承接 FastGPT、AGI 调度、算力和私有化底座。</div>
    651. 

  651.         </div>
    652. 

  652.       </div>
    653. 

  653.       <div class="card overview-card mode">
    654. 

  654.         <div class="overview-head">
    655. 

  655.           <span class="tag indigo">合作模式</span>
    656. 

  656.           <h3>FastGPT 进入医疗场景，需要医疗控制层承接</h3>
    657. 

  657.         </div>
    658. 

  658.         <div class="overview-body">
    659. 

  659.           <ul class="items" style="margin-top:0">
    660. 

  660.             <li><span class="check">✓</span> 医梦承接统一入口、身份权限、场景路由和 Card 交互，保证医患端体验一致。</li>
    661. 

  661.             <li><span class="check">✓</span> 医梦定义医疗 Workflow、MCP Server、医院接口语义和知识库源资产。</li>
    662. 

  662.             <li><span class="check">✓</span> 深信服提供 FastGPT、AGI 调度、GPU、超融合、安全和私有化平台能力。</li>
    663. 

  663.             <li><span class="check">✓</span> FastGPT 不直接面对医院业务，而是通过医梦医疗控制层执行 AI 子流程。</li>
    664. 

  664.           </ul>
    665. 

  665.           <div class="overview-footer"><strong>适配原则</strong>医梦已有自研 AI 引擎并支持 Dify；本次联合方案优先适配 FastGPT。</div>
    666. 

  666.         </div>
    667. 

  667.       </div>
    668. 

  668.     </div>
    669. 

  669.     <div class="bottom-line" style="margin-top:18px">
    670. 

  670.       <strong>一句话：深信服提供 AI 运行底座与基础设施，医梦提供医疗智能体控制层</strong>
    671. 

  671.       <span>医疗场景不是只搭通用引擎，还需要权限、脱敏、审计、安全、医生确认、患者端表达和业务状态闭环。</span>
    672. 

  672.     </div>
    673. 

  673.     <div class="golden" style="margin-top:16px">
    674. 

  674.       <div class="gq">"FastGPT 承载 AI 子流程，医梦承接医疗主流程"</div>
    675. 

  675.       <div class="gq">"深信服保持平台通用性，医梦承接医疗行业复杂度"</div>
    676. 

  676.     </div>`;
    677. 

  677. }
    678. 

  678. 

  679. /* ── Scene 2: 技术架构 ── */
    680. 

  680. function scene02() {
    681. 

  681.   return `
    682. 

  682.     <div class="quote">用户入口、医院系统与 FastGPT 通过<span class="c-indigo">医梦医疗控制层</span>完成协作</div>
    683. 

  683.     <div class="split2 arch-layout">
    684. 

  684.       <div class="card green">
    685. 

  685.         <span class="tag green">✓ 推荐架构</span>
    686. 

  686.         <h3>医梦承接医疗主链路，FastGPT 承接 AI 子流程</h3>
    687. 

  687.         <div class="arch" style="grid-template-columns:1fr 40px 1fr 40px 1fr 40px 1fr;margin-top:14px">
    688. 

  688.           <div class="node"><strong>用户入口</strong><span>患者端/医生端/设备端</span></div>
    689. 

  689.           <div class="arrow" style="font-size:28px">→</div>
    690. 

  690.           <div class="node" style="border-color:rgba(43,31,153,0.25);background:rgba(43,31,153,0.03)"><strong>医梦统一入口</strong><span>身份·权限·场景判断</span></div>
    691. 

  691.           <div class="arrow" style="font-size:28px">→</div>
    692. 

  692.           <div class="node" style="border-color:rgba(43,31,153,0.25);background:rgba(43,31,153,0.03)"><strong>医梦控制层</strong><span>状态机·安全·Card</span></div>
    693. 

  693.           <div class="arrow" style="font-size:28px">→</div>
    694. 

  694.           <div class="node"><strong>FastGPT</strong><span>LLM·RAG·Workflow</span></div>
    695. 

  695.         </div>
    696. 

  696.         <div class="mcp-lane">
    697. 

  697.           <div class="mcp-lane-label">MCP 流程</div>
    698. 

  698.           <div class="vertical-flow">
    699. 

  699.             <div class="vf-node primary">医梦控制层</div>
    700. 

  700.             <div class="vf-arrow">↓</div>
    701. 

  701.             <div class="vf-node primary">医梦 MCP Gateway</div>
    702. 

  702.             <div class="vf-arrow">↓</div>
    703. 

  703.             <div class="vf-node">医院系统 HIS / LIS / EMR / 慢病 / 物联</div>
    704. 

  704.             <div class="vf-arrow">↓</div>
    705. 

  705.             <div class="vf-node primary">受控结果回传</div>
    706. 

  706.           </div>
    707. 

  707.         </div>
    708. 

  708.         <div class="under-arch" style="grid-template-columns:1fr 1fr">
    709. 

  709.           <div class="gateway"><strong>FastGPT Adapter</strong><br/><span style="font-size:14px;color:var(--muted)">标准输入输出、traceId、错误降级</span></div>
    710. 

  710.           <div class="node"><strong>医院系统</strong><span>HIS·LIS·EMR·慢病·物联</span></div>
    711. 

  711.         </div>
    712. 

  712.         <div class="hl-box" style="margin-top:14px">协作原则：用户体验、医疗业务状态和医院系统连接由医梦承接；FastGPT 通过标准 Adapter / Tool API 执行 AI 子流程。</div>
    713. 

  713.       </div>
    714. 

  714.       <div class="card warn">
    715. 

  715.         <span class="tag" style="background:rgba(220,38,38,0.10);color:var(--warn)">不推荐</span>
    716. 

  716.         <h3>FastGPT 直接承接医疗业务</h3>
    717. 

  717.         <div class="risk-flow">
    718. 

  718.           <div class="risk-node">用户端 / 医生端 / 医院系统</div>
    719. 

  719.           <div class="risk-arrow">↓</div>
    720. 

  720.           <div class="risk-node">通用 AI 平台直接面对医疗业务</div>
    721. 

  721.           <div class="risk-arrow">↓</div>
    722. 

  722.           <div class="risk-node">医疗状态、接口权限、医生反馈、患者输出分散处理</div>
    723. 

  723.         </div>
    724. 

  724.         <div class="hl-box warn"><strong>不推荐原因：</strong>医院接口差异、写操作审计、患者端安全表达、医生反馈闭环和知识库版本治理会被拆散，平台会被迫进入大量医疗实施细节，复制效率下降。</div>
    725. 

  725.         <div class="risk-points">
    726. 

  726.           <div class="risk-point"><strong>接口风险</strong>每家医院 HIS、LIS、EMR 和慢病系统差异很大，平台会从通用产品被拉进项目实施细节。</div>
    727. 

  727.           <div class="risk-point"><strong>医疗风险</strong>患者端表达、危急值、用药建议、医生确认点如果分散处理，安全责任和审计链路会变得不清晰。</div>
    728. 

  728.           <div class="risk-point"><strong>复制风险</strong>医生反馈、知识库版本和场景验收无法沉淀成统一闭环，后续医院复制成本会持续升高。</div>
    729. 

  729.         </div>
    730. 

  730.       </div>
    731. 

  731.     </div>`;
    732. 

  732. }
    733. 

  733. 

  734. /* ── Scene 3: 协作边界 ── */
    735. 

  735. function scene03() {
    736. 

  736.   return `
    737. 

  737.     <div class="quote">医疗项目需要清晰的<span class="c-indigo">数据、写操作、业务状态</span>协作边界</div>
    738. 

  738.     <div class="split3">
    739. 

  739.       <div class="card indigo">
    740. 

  740.         <span class="tag indigo">边界一</span>
    741. 

  741.         <h3>医疗数据安全</h3>
    742. 

  742.         <p style="color:var(--muted);font-size:15px;line-height:1.45;margin-bottom:10px">医疗数据包含患者身份、检验报告、诊断记录、病历、慢病标签、用药信息、物联数据、医生反馈，需要由医疗控制层统一做权限、脱敏和审计。</p>
    743. 

  743.         <div class="vertical-flow">
    744. 

  744.           <div class="vf-node">医院系统 HIS / LIS / EMR / 慢病 / 物联</div>
    745. 

  745.           <div class="vf-arrow">↓</div>
    746. 

  746.           <div class="vf-node primary">医梦 MCP Gateway</div>
    747. 

  747.           <div class="vf-arrow">↓</div>
    748. 

  748.           <div class="vf-node primary">权限校验 · 数据裁剪 · 脱敏 · 场景判断</div>
    749. 

  749.           <div class="vf-arrow">↓</div>
    750. 

  750.           <div class="vf-node">FastGPT 仅接收本次任务所需上下文</div>
    751. 

  751.         </div>
    752. 

  752.         <ul class="items" style="margin-top:8px">
    753. 

  753.           <li><span class="lock-icon">🔒</span> 权限校验 → 数据最小化 → 脱敏 → 场景判断 → 审计记录 → 风险分层</li>
    754. 

  754.         </ul>
    755. 

  755.       </div>
    756. 

  756.       <div class="card orange" style="border-color:rgba(43,31,153,0.14);background:var(--orange-soft)">
    757. 

  757.         <span class="tag orange">边界二</span>
    758. 

  758.         <h3>医疗写操作受控</h3>
    759. 

  759.         <p style="color:var(--muted);font-size:15px;line-height:1.45;margin-bottom:10px">挂号锁号、创建挂号订单、发起支付、建档、写入 EMR、发布慢病任务、创建随访计划等动作，应通过医梦控制层完成确认、幂等和审计。</p>
    760. 

  760.         <div class="vertical-flow">
    761. 

  761.           <div class="vf-node">FastGPT 生成候选建议</div>
    762. 

  762.           <div class="vf-arrow">↓</div>
    763. 

  763.           <div class="vf-node primary">医梦控制层校验场景、权限和风险</div>
    764. 

  764.           <div class="vf-arrow">↓</div>
    765. 

  765.           <div class="vf-node primary">Card Runtime 完成医生/患者确认</div>
    766. 

  766.           <div class="vf-arrow">↓</div>
    767. 

  767.           <div class="vf-node primary">MCP Gateway 执行幂等与审计</div>
    768. 

  768.           <div class="vf-arrow">↓</div>
    769. 

  769.           <div class="vf-node">医院系统写入或状态变更</div>
    770. 

  770.         </div>
    771. 

  771.       </div>
    772. 

  772.       <div class="card cyan">
    773. 

  773.         <span class="tag cyan">边界三</span>
    774. 

  774.         <h3>医疗业务状态在医梦</h3>
    775. 

  775.         <p style="color:var(--muted);font-size:15px;line-height:1.45;margin-bottom:10px">报告解读不是一次AI调用，而是完整状态流：</p>
    776. 

  776.         <div class="status-table">
    777. 

  777.           <div class="status-row"><strong>取数</strong><span>报告待查询 → OCR解析中</span></div>
    778. 

  778.           <div class="status-row"><strong>理解</strong><span>结构化完成 → 异常识别完成</span></div>
    779. 

  779.           <div class="status-row"><strong>输出</strong><span>医生端解读完成 → 患者端解读完成</span></div>
    780. 

  780.           <div class="status-row"><strong>闭环</strong><span>反馈待提交 → 知识库待优化</span></div>
    781. 

  781.         </div>
    782. 

  782.         <p style="color:var(--muted);font-size:14px;margin-top:10px">这些状态由医梦控制层统一管理，并把适合 AI 处理的子任务交给 FastGPT 执行。</p>
    783. 

  783.       </div>
    784. 

  784.     </div>
    785. 

  785.     <div class="bottom-line compact-line">
    786. 

  786.       <strong>FastGPT 承接 AI 子流程，医梦承接医疗主流程</strong>
    787. 

  787.       <span>三条边界的本质：医疗数据、写操作和业务状态需要在医疗控制层闭环；深信服侧 FastGPT 聚焦模型、RAG、Workflow 和工具调用运行。</span>
    788. 

  788.     </div>`;
    789. 

  789. }
    790. 

  790. 

  791. /* ── Scene 4: 模块分工 ── */
    792. 

  792. function scene04() {
    793. 

  793.   return `
    794. 

  794.     <div class="quote">三层边界：<span class="c-cyan">Workflow</span> · <span class="c-indigo">MCP/Tool</span> · 知识库</div>
    795. 

  795.     <div class="split3 module-layout">
    796. 

  796.       <div class="card">
    797. 

  797.         <span class="tag indigo">Workflow 怎么分</span>
    798. 

  798.         <h3>引擎 vs 设计</h3>
    799. 

  799.         <div class="sect" style="margin-top:12px">深信服 — Workflow 引擎</div>
    800. 

  800.         <ul class="items">
    801. 

  801.           <li><span class="check">✓</span> Workflow 画布、节点运行</li>
    802. 

  802.           <li><span class="check">✓</span> RAG节点、LLM节点、OCR节点</li>
    803. 

  803.           <li><span class="check">✓</span> 工具调用节点、运行日志、版本发布</li>
    804. 

  804.         </ul>
    805. 

  805.         <div class="sect">医梦 — 医疗 Workflow 设计</div>
    806. 

  806.         <ul class="items">
    807. 

  807.           <li><span class="check">✓</span> 中医舌诊流程、检验报告解读流程</li>
    808. 

  808.           <li><span class="check">✓</span> 分诊问诊、挂号槽位补全流程</li>
    809. 

  809.           <li><span class="check">✓</span> 医生确认点、患者确认点、高风险转人工点</li>
    810. 

  810.           <li><span class="check">✓</span> 卡片输出结构、医疗安全规则、验收用例</li>
    811. 

  811.         </ul>
    812. 

  812.         <div class="hl-box" style="margin-top:10px">"Workflow引擎用你们的，医疗Workflow的业务设计、模板和验收标准由医梦提供。"</div>
    813. 

  813.       </div>
    814. 

  814.       <div class="card">
    815. 

  815.         <span class="tag cyan">MCP / Tool 怎么分</span>
    816. 

  816.         <h3>调用能力 vs 工具语义</h3>
    817. 

  817.         <div class="vertical-flow">
    818. 

  818.           <div class="vf-node">FastGPT Workflow</div>
    819. 

  819.           <div class="vf-arrow">↓</div>
    820. 

  820.           <div class="vf-node">Tool Runtime</div>
    821. 

  821.           <div class="vf-arrow">↓</div>
    822. 

  822.           <div class="vf-node primary">医梦受控 API</div>
    823. 

  823.           <div class="vf-arrow">↓</div>
    824. 

  824.           <div class="vf-node primary">MCP Gateway</div>
    825. 

  825.           <div class="vf-arrow">↓</div>
    826. 

  826.           <div class="vf-node">医院系统</div>
    827. 

  827.         </div>
    828. 

  828.         <div class="hl-box indigo" style="margin-top:10px;font-size:14px">
    829. 

  829.           协作原则：<br/>
    830. 

  830.           • 医院业务接口由医梦封装为受控工具<br/>
    831. 

  831.           • FastGPT 通过标准 Tool API 调用医疗能力<br/>
    832. 

  832.           • 医院接口账号、密钥和写权限由医梦控制层统一治理
    833. 

  833.         </div>
    834. 

  834.       </div>
    835. 

  835.       <div class="card">
    836. 

  836.         <span class="tag green">知识库怎么分</span>
    837. 

  837.         <h3>源资产 vs 运行副本</h3>
    838. 

  838.         <table style="margin-top:12px;font-size:14px">
    839. 

  839.           <thead><tr><th>内容</th><th>医梦</th><th>深信服</th></tr></thead>
    840. 

  840.           <tbody>
    841. 

  841.             <tr><td>源文件</td><td class="own">主责维护</td><td class="dim">接收运行副本</td></tr>
    842. 

  842.             <tr><td>医学规则</td><td class="own">主责维护</td><td class="dim">配合运行</td></tr>
    843. 

  843.             <tr><td>医生审核</td><td class="own">负责</td><td class="dim">配合</td></tr>
    844. 

  844.             <tr><td>向量化</td><td class="dim">提供源数据</td><td class="own">负责</td></tr>
    845. 

  845.             <tr><td>RAG检索</td><td class="dim">定义规则</td><td class="own">负责运行</td></tr>
    846. 

  846.             <tr><td>反馈迭代</td><td class="own">负责</td><td class="dim">接收新版本</td></tr>
    847. 

  847.           </tbody>
    848. 

  848.         </table>
    849. 

  849.         <div class="mini-flow" style="margin-top:10px">
    850. 

  850.           <span class="mf-node" style="border-color:rgba(43,31,153,0.25);background:rgba(43,31,153,0.03)">医梦维护源文件</span><span class="mf-arrow">→</span><span class="mf-node" style="border-color:rgba(43,31,153,0.25);background:rgba(43,31,153,0.03)">医学审核</span><span class="mf-arrow">→</span><span class="mf-node">发布版本</span><span class="mf-arrow">→</span><span class="mf-node">同步FastGPT</span><span class="mf-arrow">→</span><span class="mf-node">RAG检索</span><span class="mf-arrow">→</span><span class="mf-node" style="border-color:rgba(43,31,153,0.25);background:rgba(43,31,153,0.03)">医生反馈回医梦</span>
    851. 

  851.         </div>
    852. 

  852.       </div>
    853. 

  853.     </div>
    854. 

  854.     <div class="bottom-line compact-line">
    855. 

  855.       <strong>FastGPT 做知识库运行平台，医梦做医疗知识库源资产</strong>
    856. 

  856.       <span>医梦负责知识怎么拆、怎么写、怎么审核、怎么版本化、怎么根据医生反馈迭代；深信服负责向量化、检索和运行能力。</span>
    857. 

  857.     </div>`;
    858. 

  858. }
    859. 

  859. 

  860. /* ── Scene 5: 业务流程 ── */
    861. 

  861. function scene05() {
    862. 

  862.   return `
    863. 

  863.     <div class="quote">三条关键业务链路：医疗智能体不是聊天机器人，是<span class="c-indigo">可控的任务系统</span></div>
    864. 

  864.     <div class="split3" style="margin-top:12px">
    865. 

  865.       <div class="card indigo">
    866. 

  866.         <span class="tag indigo">链路一</span>
    867. 

  867.         <h3>中医舌诊智能体</h3>
    868. 

  868.         <div class="chain" style="grid-template-columns:repeat(3,1fr);margin-top:10px">
    869. 

  869.           <div class="step"><span class="idx">采集阶段</span><strong>舌象上传</strong><span>患者信息、主诉、舌象图片、项目编码统一入库</span></div>
    870. 

  870.           <div class="step"><span class="idx">诊断阶段</span><strong>AI辨识</strong><span>舌色、舌苔、舌形、关键特征、证候建议结构化输出</span></div>
    871. 

  871.           <div class="step"><span class="idx">交付阶段</span><strong>H5展示</strong><span>诊断详情、历史记录、医生查看、健康建议闭环</span></div>
    872. 

  872.         </div>
    873. 

  873.         <div class="hl-box" style="margin-top:10px;font-size:14px">
    874. 

  874.           <strong>关键协作点：</strong>医梦将患者基础信息、历史诊断、舌象图片和证候知识封装为标品 MCP Server，供 FastGPT 受控调用。
    875. 

  875.         </div>
    876. 

  876.       </div>
    877. 

  877.       <div class="card cyan">
    878. 

  878.         <span class="tag cyan">链路二</span>
    879. 

  879.         <h3>分诊挂号智能体</h3>
    880. 

  880.         <div class="chain" style="grid-template-columns:repeat(3,1fr);margin-top:10px">
    881. 

  881.           <div class="step"><span class="idx">识别阶段</span><strong>症状分诊</strong><span>主诉、年龄、性别、时间、部位和伴随症状结构化</span></div>
    882. 

  882.           <div class="step"><span class="idx">推荐阶段</span><strong>科室医生</strong><span>匹配科室、医生、号源、就诊时间并补充追问</span></div>
    883. 

  883.           <div class="step"><span class="idx">执行阶段</span><strong>挂号确认</strong><span>患者确认后锁号、订单、支付和成功卡片闭环</span></div>
    884. 

  884.         </div>
    885. 

  885.         <div class="hl-box warn" style="margin-top:10px;font-size:14px">
    886. 

  886.           <strong>关键协作点：</strong>医梦负责医院号源、锁号、订单和支付确认；FastGPT 负责意图理解、追问和推荐理由生成。
    887. 

  887.         </div>
    888. 

  888.       </div>
    889. 

  889.       <div class="card" style="border-color:rgba(43,31,153,0.14);background:var(--orange-soft)">
    890. 

  890.         <span class="tag orange">链路三</span>
    891. 

  891.         <h3>检验报告解读智能体</h3>
    892. 

  892.         <div class="chain" style="grid-template-columns:repeat(3,1fr);margin-top:10px">
    893. 

  893.           <div class="step"><span class="idx">取数阶段</span><strong>报告获取</strong><span>LIS报告、指标、参考区间、历史趋势和权限校验</span></div>
    894. 

  894.           <div class="step"><span class="idx">理解阶段</span><strong>异常解读</strong><span>异常组合、风险分层、医生端摘要和患者端表达</span></div>
    895. 

  895.           <div class="step"><span class="idx">闭环阶段</span><strong>反馈迭代</strong><span>医生采纳、修正、风险标注回流知识库源资产</span></div>
    896. 

  896.         </div>
    897. 

  897.         <div class="hl-box warn" style="margin-top:10px;font-size:14px">
    898. 

  898.           <strong>关键协作点：</strong>医梦负责 LIS 对接、权限脱敏和医患端差异化输出；FastGPT 负责结构化解读和语言生成。
    899. 

  899.         </div>
    900. 

  900.       </div>
    901. 

  901.     </div>
    902. 

  902.     <div class="bottom-line" style="margin-top:18px">
    903. 

  903.       <strong>通用平台链路：输入→意图→工具→回答</strong>
    904. 

  904.       <span>医梦控制层负责场景判断、权限、状态、卡片和医生确认；MCP Gateway 负责把患者基础信息、历史诊断、报告、号源等医院接口封装为受控工具。</span>
    905. 

  905.     </div>`;
    906. 

  906. }
    907. 

  907. 

  908. /* ── Scene 6: 八大价值 ── */
    909. 

  909. function scene06() {
    910. 

  910.   return `
    911. 

  911.     <div class="quote">医梦把 FastGPT 从"通用 Agent 平台"变成"<span class="c-indigo">医疗可交付系统</span>"</div>
    912. 

  912.     <div class="value-layout">
    913. 

  913.       <div class="value-menu" id="valueMenu"></div>
    914. 

  914.       <div class="value-detail">
    915. 

  915.         <h2 id="valueTitle"></h2>
    916. 

  916.         <p id="valueText"></p>
    917. 

  917.         <div class="value-points" id="valuePoints"></div>
    918. 

  918.       </div>
    919. 

  919.     </div>`;
    920. 

  920. }
    921. 

  921. 

  922. function initValuePanel() {
    923. 

  923.   const menu = document.getElementById('valueMenu');
    924. 

  924.   const title = document.getElementById('valueTitle');
    925. 

  925.   const text = document.getElementById('valueText');
    926. 

  926.   const points = document.getElementById('valuePoints');
    927. 

  927.   if (!menu) return;
    928. 

  928.   let idx = 0;
    929. 

  929.   function setValue(i) {
    930. 

  930.     idx = i;
    931. 

  931.     const v = values[i];
    932. 

  932.     menu.querySelectorAll('.value-btn').forEach((b,j) => b.classList.toggle('active', j===i));
    933. 

  933.     title.textContent = v.title;
    934. 

  934.     text.textContent = v.text;
    935. 

  935.     points.innerHTML = v.points.map(p => `<div class="value-point">${p}</div>`).join('');
    936. 

  936.   }
    937. 

  937.   menu.innerHTML = values.map((v,i) =>
    938. 

  938.     `<button class="value-btn${i===0?' active':''}" data-idx="${i}"><span class="value-index">${String(i + 1).padStart(2,'0')}</span><span class="value-label">${v.title.replace(/^\d+\.\s*/,'')}</span></button>`
    939. 

  939.   ).join('');
    940. 

  940.   menu.querySelectorAll('.value-btn').forEach(b => {
    941. 

  941.     b.addEventListener('click', () => setValue(Number(b.dataset.idx)));
    942. 

  942.   });
    943. 

  943.   setValue(0);
    944. 

  944. }
    945. 

  945. 

  946. /* ── Scene 7: 落地途径 ── */
    947. 

  947. function scene07() {
    948. 

  948.   return `
    949. 

  949.     <div class="quote">落地策略：先用<span class="c-cyan">中医舌诊智能体</span>跑通联合样板</div>
    950. 

  950.     <div class="phase-grid landing-grid">
    951. 

  951.       <div class="phase">
    952. 

  952.         <span class="num">1</span>
    953. 

  953.         <h3>舌诊现有链路盘点</h3>
    954. 

  954.         <p>基于 emoon-tongue 已有 H5、内外部接口、签名校验、图片上传、患者信息、诊断详情和历史记录，快速确认可演示闭环。</p>
    955. 

  955.         <div style="margin-top:8px;font-size:13px;color:var(--muted)">交付：舌诊能力清单 · H5样板入口 · API清单 · 演示数据</div>
    956. 

  956.       </div>
    957. 

  957.       <div class="phase">
    958. 

  958.         <span class="num">2</span>
    959. 

  959.         <h3>FastGPT 适配舌诊</h3>
    960. 

  960.         <p>把患者基础信息、历史诊断、舌象图片和证候知识封装为标品 MCP Server，供 FastGPT 通过 MCP Gateway 受控调用。</p>
    961. 

  961.         <div style="margin-top:8px;font-size:13px;color:var(--muted)">交付：舌诊 MCP Server · FastGPT Adapter · 证候知识运行副本 · 输出Schema</div>
    962. 

  962.       </div>
    963. 

  963.       <div class="phase">
    964. 

  964.         <span class="num">3</span>
    965. 

  965.         <h3>医生端审核闭环</h3>
    966. 

  966.         <p>把舌诊结果封装为医生可读卡片，支持确认、修正、采纳和反馈，让 AI 输出进入医疗控制层而不是直接面向患者。</p>
    967. 

  967.         <div style="margin-top:8px;font-size:13px;color:var(--muted)">交付：医生审核卡 · 舌象详情卡 · 反馈字段 · 版本追溯</div>
    968. 

  968.       </div>
    969. 

  969.       <div class="phase">
    970. 

  970.         <span class="num">4</span>
    971. 

  971.         <h3>复制到多产品矩阵</h3>
    972. 

  972.         <p>以舌诊为首个成熟样板，再复制到分诊挂号、检验报告解读、慢病随访和院内智能服务，形成联合场景包。</p>
    973. 

  973.         <div style="margin-top:8px;font-size:13px;color:var(--muted)">交付：舌诊场景包 · 复制模板 · 联合方案PPT · 商务授权清单</div>
    974. 

  974.       </div>
    975. 

  975.     </div>
    976. 

  976.     <div class="sect">联合对接工作包</div>
    977. 

  977.     <div class="checklist landing-checklist">
    978. 

  978.       <div class="cl-item"><span class="num">1</span><div>舌诊 H5：复用现有页面入口，支持 projectId、patientId 直达详情。</div></div>
    979. 

  979.       <div class="cl-item"><span class="num">2</span><div>图片与记录：复用上传、MinIO、落盘路径、上传状态和推理状态。</div></div>
    980. 

  980.       <div class="cl-item"><span class="num">3</span><div>安全接口：保留内网快速演示接口和外部签名接口，适配医院集成。</div></div>
    981. 

  981.       <div class="cl-item"><span class="num">4</span><div>标品 MCP Server：封装患者基础信息、历史诊断、舌象图片和证候知识，供 FastGPT 受控调用。</div></div>
    982. 

  982.       <div class="cl-item"><span class="num">5</span><div>证候知识资产：医梦维护舌象证候关联、互斥规则和医生审核版本。</div></div>
    983. 

  983.       <div class="cl-item"><span class="num">6</span><div>医生反馈：采纳、修正、风险标注回流医梦知识库源资产。</div></div>
    984. 

  984.       <div class="cl-item"><span class="num">7</span><div>场景验收：围绕图片有效率、诊断结构完整率、医生采纳率建立指标。</div></div>
    985. 

  985.       <div class="cl-item"><span class="num">8</span><div>联合复制：舌诊样板跑通后，扩展分诊挂号、检验报告和慢病随访。</div></div>
    986. 

  986.     </div>
    987. 

  987.     <div class="hl-box landing-sample"><strong>首个联合样板：</strong>患者完成舌象采集 → 医梦 MCP Server 提供患者信息、历史诊断和舌象上下文 → FastGPT 生成解释与调理建议 → 医梦封装 H5/医生审核卡 → 医生反馈进入证候知识库迭代。</div>`;
    988. 

  988. }
    989. 

  989. 

  990. /* ── Scene 8: 协作原则 ── */
    991. 

  991. function scene08() {
    992. 

  992.   return `
    993. 

  993.     <div class="quote">双方各守优势，共同复制<span class="c-indigo">医疗AI联合解决方案</span></div>
    994. 

  994.     <div class="split2" style="margin-top:10px">
    995. 

  995.       <div class="card green">
    996. 

  996.         <span class="tag green">医梦主责</span>
    997. 

  997.         <h3>医疗智能体控制层</h3>
    998. 

  998.         <ul class="items" style="margin-top:8px">
    999. 

  999.           <li><span class="check">✓</span> 统一入口、身份权限、场景路由和医患端体验</li>
    1000. 

  1000.           <li><span class="check">✓</span> MCP Gateway 对接 HIS、LIS、EMR、慢病、物联</li>
    1001. 

  1001.           <li><span class="check">✓</span> 医疗任务状态、写操作确认、Card Runtime 和审计</li>
    1002. 

  1002.           <li><span class="check">✓</span> 知识库源资产、医疗模板、医生反馈和场景包</li>
    1003. 

  1003.         </ul>
    1004. 

  1004.       </div>
    1005. 

  1005.       <div class="card indigo">
    1006. 

  1006.         <span class="tag indigo">深信服主责</span>
    1007. 

  1007.         <h3>FastGPT AI 能力底座</h3>
    1008. 

  1008.         <ul class="items" style="margin-top:8px">
    1009. 

  1009.           <li><span class="check">✓</span> FastGPT 提供智能体构建、Workflow、Tool Runtime 和运行编排</li>
    1010. 

  1010.           <li><span class="check">✓</span> FastGPT 承载 RAG、向量化、检索、OCR、多模态和模型调用</li>
    1011. 

  1011.           <li><span class="check">✓</span> 深信服提供 GPU、超融合、私有化部署、安全和平台运维能力</li>
    1012. 

  1012.           <li><span class="check">✓</span> 平台日志、模型消耗、运行观测和知识库运行副本</li>
    1013. 

  1013.         </ul>
    1014. 

  1014.       </div>
    1015. 

  1015.     </div>
    1016. 

  1016.     <div class="sect">常见问题答疑</div>
    1017. 

  1017.     <div class="faq-grid">
    1018. 

  1018.       <div class="faq-item"><div class="q">Q: FastGPT 与医梦 MCP Gateway 如何协作？</div><div class="a">FastGPT 通过标准 Tool API 发起 AI 子流程所需调用；医梦 MCP Gateway 负责医院系统适配、权限校验、脱敏、幂等、审计和医疗工具语义。</div></div>
    1019. 

  1019.       <div class="faq-item"><div class="q">Q: 医梦为什么要掌握知识库和患者端输出？</div><div class="a">医梦维护医学知识源资产、审核流程、患者端表达、医生端模板和反馈迭代；FastGPT 承载运行副本、向量化、检索和 RAG 执行。</div></div>
    1020. 

  1020.     </div>
    1021. 

  1021.     <div class="bottom-line" style="margin-top:14px">
    1022. 

  1022.       <strong>深信服守住平台能力，医梦守住医疗闭环，双方才能形成可复制的医疗AI联合解决方案</strong>
    1023. 

  1023.       <span>联合方案的核心是 AI 能力底座 + 医疗控制层：一方提供通用 AI 运行能力，一方提供医疗行业落地能力。</span>
    1024. 

  1024.     </div>`;
    1025. 

  1025. }
    1026. 

  1026. 

  1027. // ═══════════════════════════════════════════
    1028. 

  1028. // TAB SWITCHING
    1029. 

  1029. // ═══════════════════════════════════════════
    1030. 

  1030. let current = 0;
    1031. 

  1031. function showScene(index) {
    1032. 

  1032.   current = index;
    1033. 

  1033.   document.querySelectorAll('.tab').forEach((t,i) => t.classList.toggle('active', i===index));
    1034. 

  1034.   document.querySelectorAll('.scene').forEach((s,i) => s.classList.toggle('active', i===index));
    1035. 

  1035. }
    1036. 

  1036. document.addEventListener('keydown', e => {
    1037. 

  1037.   const total = TAB_LABELS.length;
    1038. 

  1038.   if (e.key === 'ArrowRight') showScene((current+1) % total);
    1039. 

  1039.   if (e.key === 'ArrowLeft') showScene((current-1+total) % total);
    1040. 

  1040. });
    1041. 

  1041. 

  1042. // ═══════════════════════════════════════════
    1043. 

  1043. // INIT
    1044. 

  1044. // ═══════════════════════════════════════════
    1045. 

  1045. renderTabBar();
    1046. 

  1046. renderScenes();
    1047. 

  1047. </script>
    1048. 

  1048. </body>
    1049. 

  1049. </html>
    1050.