Files
iAOP/web/chat/assistant.html
T
bot_dev1 65d3b0952f fix: 消除跨模块跳转的整页白闪(issue #131)
五个带 Sider 的模块页 head 内联首屏底色(左 208px #001529 深 +
内容区 #f0f2f5),外部 CSS 加载前的解析期画布即为最终布局底色,
深色 Sider 区域不再白闪(FOUC);窄屏媒体查询下保持纯灰底
2026-08-05 17:43:36 +08:00

76 lines
3.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 首屏防闪(issue #131):跨页跳转时外部 CSS 未到的瞬间,
先用与最终布局一致的底色铺满画布(左 Sider 深色 + 内容区灰),
消除深色 Sider 区域的白闪(FOUC)。 -->
<style>html{background:#f0f2f5}@media (min-width:721px){html{background:linear-gradient(90deg,#001529 208px,#f0f2f5 208px)}}</style>
<title>iAOP 对话助手(增强版)</title>
<link rel="stylesheet" href="assistant.css">
<link rel="stylesheet" href="../shared/pro.css">
</head>
<body data-pro-title="对话助手">
<!-- iAOP 对话助手增强版(issue #133 / PRD 5.4「④ LLM 网关 + RAG」)
在 chat_widget.html(#77 雏形)之上完善:消息流 + RAG 引用溯源 +
路由分级提示(本地/云端)+ DLP 拦截反馈,直连已部署推理服务。
既有 chat_widget.html 保留不动(仍由 chat_api.py 托管联调)。 -->
<div id="app">
<header id="topbar">
<h1>iAOP 对话助手 <span class="sub">NL 查询 / 报警解释 / 交接班报告 · PRD 5.4</span></h1>
<div id="service-status">
<span id="infer-dot" class="dot">●</span>
<span id="infer-text" class="hint">推理服务检测中…</span>
</div>
</header>
<div id="messages"></div>
<!-- 报警解释场景的结构化输入(PRD 场景A:告警 → 原因+处置建议) -->
<div id="alarm-inputs" class="scenario-inputs" hidden>
<select id="alarm-severity">
<option value="P0">P0(红色告警)</option>
<option value="P1">P1(加强监控)</option>
<option value="P2">P2(提示)</option>
</select>
<input id="alarm-point" placeholder="告警点位,如 CLF-01.TEMP">
</div>
<!-- 交接班报告场景输入(PRD 场景C:按模板章节生成,≤ 2 分钟) -->
<div id="handover-inputs" class="scenario-inputs" hidden>
<input id="handover-shift" placeholder="班次,如 早班 08:00-16:00">
<span class="hint">章节模板:生产概况/异常事项/安全注意事项/能耗/待办(handover_brief.ti.yaml)</span>
</div>
<!-- DLP 拦截反馈条(PRD 5.4:拦截可感知) -->
<div id="dlp-banner" hidden>
<strong>DLP 拦截:</strong><span id="dlp-detail"></span>
<button id="btn-local-fallback">转本地模型处理</button>
<button id="btn-dlp-dismiss">取消发送</button>
</div>
<div id="panel">
<select id="scenario">
<option value="nl_query">自然语言查询</option>
<option value="alarm_explain">报警解释</option>
<option value="shift_handover">交接班报告</option>
</select>
<input id="question" placeholder="请输入问题,如:氯气流量最近1小时趋势">
<button id="send">发送</button>
</div>
<div class="hint" id="footer-hint">
路由分级:敏感/核心 → 本地(数据不出厂);脱敏/通用 → 云端;DLP 命中 → 拦截。
回答附 RAG 引用溯源(知识库命中时)。
</div>
</div>
<script src="../auth/user_store.js"></script>
<script src="../shared/session.js"></script>
<script>
// 登录守卫(PRD 8.2):未登录跳登录页,登录后回跳本页(后端优先/本地降级)
IAOP_SESSION.requireLoginElseRedirect("../auth/login.html");
</script>
<script src="../shared/pro-header.js"></script>
<script src="assistant.js"></script>
</body>
</html>