lhl
a16996b377
背景：上一轮 chat.html 拆分 CSS 到 chat.css 时（commit 561f7ee），
误把行 509-1180 的整段内联 <script>（约 670 行 UI 业务逻辑）当 CSS 一起删了。
同时 rm 掉了 chat.js。导致 chat.html 引用 chat.js 404，所有 UI 交互失效：
- 侧边栏折叠按钮：click 监听丢失
- 项目下拉 / 抽屉打开：openProjectDrawer 调用丢失
- 上传 / 发送 / 输入框：所有 addEventListener 丢失
- RAG 开关 / 影响调查按钮：监听丢失
本 commit 恢复所有 UI 业务逻辑（从 git 历史 520c9e2 拿原 chat.html 内容）：
变更：
- 新增 src/genesis/server/static/chat.js（670 行，含 28 个函数 / 1 个 IIFE）
- addMsg / esc / showTyping / api
- refreshSessions / deleteSession / loadProjects
- applyProjectContext / renderProjectSwitcher / toggleProjectSwitcher
- openProjectDrawer / closeProjectDrawer / loadDrawerForm
- drawerSnapshotNow / isDrawerDirty / guardDrawerDirty
- clearPfInvalid / flagPfInvalidByMessage / renderDrawerList
- saveDrawerProject / deleteDrawerProject / toggleSidebar
- updateUploadBar / renderEmptyOrWelcome
- newSession / loadSession / send
- readRagFlag / writeRagFlag / refreshRagStats / updateImpactButton
- pickExt / projectHasPrefixedType
- 启动 IIFE：恢复侧边栏折叠态 + 加载项目 + 恢复上次会话
- chat.html +1 行：<script src="/static/chat.js" defer></script>
- defer 保证 DOM 解析完成后执行
- 放在 chat_ws.js 之后（依赖 GenesisState / GenesisWS 全局）
零行为变更：JS 内容逐行恢复，仅拆出到独立文件。
chat.js 不动 chat_state.js / chat_ws.js（保持职责单一）。
验证（serve --fake @ http://127.0.0.1:8000）：
- GET /static/chat.js -> 200 text/javascript; charset=utf-8 (33286 bytes)
- GET /static/chat.css -> 200 text/css; charset=utf-8 (20803 bytes)
- GET /static/chat_state.js -> 200 text/javascript; charset=utf-8
- GET /static/chat_ws.js -> 200 text/javascript; charset=utf-8
- GET / HTML 含 chat.js defer 引用 -> True
127 lines
4.9 KiB
HTML
127 lines
4.9 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Genesis — 概要设计书自动生成（对话）</title>
|
||
<link rel="stylesheet" href="/static/chat.css">
|
||
</head>
|
||
<body>
|
||
<div id="sidebar">
|
||
<button id="sidebar-toggle" title="折叠/展开侧边栏">«</button>
|
||
<div class="brand">
|
||
<div class="brand-logo">G</div>
|
||
<div class="brand-name">Genesis<span class="brand-sub">概要设计书做成Agent</span></div>
|
||
</div>
|
||
<button id="new-chat" title="新建会话"><span class="ic-plus">+</span><span class="nc-text">新会话</span></button>
|
||
<h2>会话历史</h2>
|
||
<div id="session-list"></div>
|
||
</div>
|
||
|
||
<div id="main">
|
||
<header>
|
||
<h1>Genesis 概要设计书生成</h1>
|
||
|
||
<div class="proj-switcher" id="proj-switcher">
|
||
<button class="ps-current" id="ps-current" type="button" title="切换项目">
|
||
<span class="ps-label">项目</span>
|
||
<span class="ps-name" id="ps-name">未选择</span>
|
||
<span class="ps-caret">▾</span>
|
||
</button>
|
||
<div class="ps-menu" id="ps-menu" role="menu"></div>
|
||
</div>
|
||
<div id="rag-bar" hidden>
|
||
<label class="rag-switch">
|
||
<input type="checkbox" id="rag-enabled">
|
||
<span>启用 RAG 影响调查</span>
|
||
</label>
|
||
<span class="rag-stats" id="rag-stats">RAG 0 片段</span>
|
||
<button id="impact-btn" type="button" disabled>开始影响调查</button>
|
||
</div>
|
||
<span id="sid-badge">未创建会话</span>
|
||
</header>
|
||
|
||
<div id="chat"></div>
|
||
|
||
<div id="upload-bar">
|
||
<div id="upload-bar-inner">
|
||
<span id="proj-hint"></span>
|
||
<label for="file-type" class="vh">上传类型</label>
|
||
<span>📎 上传资料：</span>
|
||
<select id="file-type" aria-label="上传类型">
|
||
<option value="requirements">要件定义 xlsx（必需）</option>
|
||
<option value="template">概要设计模板 docx（必需）</option>
|
||
<option value="write_instruction">做成说明书 docx</option>
|
||
<option value="rules">记入/图表规则 docx/xlsx</option>
|
||
<option value="existing_system">既有系统 zip（追加改修）</option>
|
||
</select>
|
||
<label class="file-pick" for="file-input">选择文件</label>
|
||
<input type="file" id="file-input" style="display:none">
|
||
<button id="upload-btn">上传</button>
|
||
<span id="upload-status"></span>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="composer">
|
||
<div id="composer-inner">
|
||
<input id="input" placeholder="输入指令，如：上传了文件，生成概要设计书 / 现在什么状态？" autocomplete="off" maxlength="2000">
|
||
<button id="send">发送</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="proj-drawer" role="dialog" aria-label="项目配置">
|
||
<div class="drawer-head">
|
||
<h2>项目配置</h2>
|
||
<button class="drawer-close" id="drawer-close" title="关闭">×</button>
|
||
</div>
|
||
<div class="drawer-body">
|
||
<div class="drawer-list" id="drawer-list"></div>
|
||
<div class="drawer-form" id="drawer-form">
|
||
<div class="drawer-hint">选择左侧项目以查看与编辑，或点 <strong>+ 新建项目</strong> 创建一个。</div>
|
||
<div class="field">
|
||
<label>项目名（英文/唯一）</label>
|
||
<input id="pf-name" placeholder="stock">
|
||
</div>
|
||
<div class="field">
|
||
<label>显示名（可选）</label>
|
||
<input id="pf-display" placeholder="股票系统">
|
||
</div>
|
||
<details class="advanced">
|
||
<summary>高级（可选，服务器端预置路径）</summary>
|
||
<p class="drawer-hint">这些是<strong>服务器端</strong>预置路径，普通用户无需填写，留空则在每个会话中上传对应文件。仅在管理员/CLI 集成时使用。</p>
|
||
<div class="field">
|
||
<label>模板 docx 路径</label>
|
||
<input id="pf-template" placeholder="/abs/path/template.docx">
|
||
</div>
|
||
<div class="field">
|
||
<label>做成说明书 docx 路径</label>
|
||
<input id="pf-write" placeholder="/abs/path/write_instruction.docx">
|
||
</div>
|
||
<div class="field">
|
||
<label>规则 docx 目录（逗号分隔）</label>
|
||
<input id="pf-rules" placeholder="/abs/path/rules, /abs/path/diagrams">
|
||
</div>
|
||
<div class="field">
|
||
<label>既有系统代码库目录</label>
|
||
<input id="pf-code" placeholder="/abs/path/existing-system">
|
||
</div>
|
||
<div class="field">
|
||
<label>既有设计文档目录</label>
|
||
<input id="pf-design" placeholder="/abs/path/design-docs">
|
||
</div>
|
||
</details>
|
||
<div class="drawer-actions">
|
||
<button class="btn-save" id="pf-save">保存项目</button>
|
||
<button class="btn-delete" id="pf-delete" hidden>删除</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="/static/chat_state.js"></script>
|
||
<script src="/static/chat_ws.js"></script>
|
||
<script src="/static/chat.js" defer></script>
|
||
</body>
|
||
</html>
|