bot_dev1
8b68d015c2
组件审查结论：全站组件为自绘 HTML+CSS 仿 AntD（纯静态无组件库）， pro.css 已统一设计 token，但各页 CSS/JS 残留一批旧配色硬编码， pro.css 覆盖不到，本次全部清理： - 旧 iOS 红 #ff3b30 → --ant-error #ff4d4f（告警 P0/严重度/DLP 条/ 工艺 alarm 态/diff 删除行） - 旧橙 #f5a623 → --ant-warning #faad14（P1 告警/warning 态/暂存徽章） - 旧 iOS 绿 #2ecc71 → --ant-success #52c41a（running 态/prod 徽章/ 索引完成/路由本地标签/权限矩阵） - 杂色蓝统一 → --ant-primary #1677ff：发送键 #0ea5e9、P2 告警 #3aa0ff、编排画布残留青 rgba(24,211,200)、旧气泡 #1d4ed8 - 主色按钮上的深色文字 #04202a → #fff（对比度修正） - 灰 #64748b → --ant-text-tertiary rgba(0,0,0,0.45) - 各页 CSS :root 深色默认变量值（#0b1220/#13203a/#18d3c8 等死值） 对齐为 AntD 亮色默认值，修正"深色主题"过时注释 - 删除已无任何引用的旧深色登录页样式 auth/auth.css 顺带修复实测发现的 bug：SPA 外壳内直达 admin/studio 子页时页签 不切换——studio.js/admin.js 的 Tab 事件在异步 boot(user) 中绑定， bindPageTabs 的 window load 初始激活可能早于绑定完成，改为带重试 的激活（直到 Tab 点亮，最多 10s）。实测 #/admin/#alerts 直达后 page-alerts 正确激活。
79 lines
3.1 KiB
HTML
79 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>iAOP 对话助手</title>
|
|
<style>
|
|
/* iAOP 对话组件（issue #77）：深色主题，对齐驾驶舱 */
|
|
body { margin:0; font-family: "Microsoft YaHei", sans-serif; background:#0f172a; color:#e2e8f0; }
|
|
#app { max-width: 720px; margin: 0 auto; padding: 16px; }
|
|
h1 { font-size: 18px; color:#38bdf8; }
|
|
#messages { height: 420px; overflow-y:auto; border:1px solid #1e293b; border-radius:8px;
|
|
padding:12px; background:#111c33; }
|
|
.msg { margin: 8px 0; }
|
|
.msg .who { font-size:12px; color:#94a3b8; }
|
|
.msg .text { display:inline-block; max-width:85%; padding:8px 12px; border-radius:8px; white-space:pre-wrap; }
|
|
.user .text { background:#1677ff; }
|
|
.bot .text { background:#1e293b; }
|
|
.meta { font-size:11px; color:rgba(0,0,0,0.45); margin-top:2px; }
|
|
#panel { margin-top:10px; display:flex; gap:8px; }
|
|
select, input { padding:8px; border-radius:6px; border:1px solid #d9d9d9; background:#ffffff; color:#e2e8f0; }
|
|
input { flex:1; }
|
|
button { padding:8px 16px; border:none; border-radius:6px; background:#1677ff; color:#fff; cursor:pointer; }
|
|
button:disabled { opacity:.5; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<h1>iAOP 对话助手（Template-Ti 一期）</h1>
|
|
<div id="messages"></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" onclick="send()">发送</button>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
const el = id => document.getElementById(id);
|
|
function addMsg(who, text, meta) {
|
|
const box = el('messages');
|
|
const div = document.createElement('div');
|
|
div.className = 'msg ' + who;
|
|
div.innerHTML = '<div class="who">' + (who === 'user' ? '我' : 'iAOP') + '</div>' +
|
|
'<div class="text"></div>' + (meta ? '<div class="meta">' + meta + '</div>' : '');
|
|
div.querySelector('.text').textContent = text;
|
|
box.appendChild(div);
|
|
box.scrollTop = box.scrollHeight;
|
|
}
|
|
async function send() {
|
|
const question = el('question').value.trim();
|
|
if (!question) return;
|
|
const scenario = el('scenario').value;
|
|
addMsg('user', question);
|
|
el('question').value = ''; el('send').disabled = true;
|
|
try {
|
|
const resp = await fetch('/api/chat', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ question, scenario })
|
|
});
|
|
const data = await resp.json();
|
|
if (data.error) addMsg('bot', '错误：' + data.error);
|
|
else addMsg('bot', data.answer,
|
|
'路由: ' + data.route + ' | 场景: ' + data.scenario +
|
|
(data.needs_human ? ' | ⚠ 转人工确认' : ''));
|
|
} catch (e) {
|
|
addMsg('bot', '请求失败：' + e);
|
|
} finally {
|
|
el('send').disabled = false;
|
|
}
|
|
}
|
|
el('question').addEventListener('keydown', e => { if (e.key === 'Enter') send(); });
|
|
</script>
|
|
</body>
|
|
</html>
|