codebee 0.1.15 → 0.1.17

package/app/ui/index.html

@@ -35,6 +35,7 @@
 <!-- ================= 图标精灵：统一线性图标（stroke=currentColor，随主题与 hover 自动变色） ================= -->
 <svg id="icon-sprite" aria-hidden="true" focusable="false">
   <symbol id="i-search" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.8-4.8"/></symbol>
+  <symbol id="i-help" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><path d="M12 17h.01"/></symbol>
   <symbol id="i-chevrons-d" viewBox="0 0 24 24"><path d="m6 6 6 6 6-6"/><path d="m6 13 6 6 6-6"/></symbol>
   <symbol id="i-gear" viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></symbol>
   <symbol id="i-tasks" viewBox="0 0 24 24"><path d="M3 6h11"/><path d="M3 12h11"/><path d="M3 18h7"/><path d="m16.5 16.5 2 2 4-4"/></symbol>
@@ -189,7 +190,7 @@
       <div data-i18n="外观" class="set-group">外观</div>
       <button class="set-item" data-sub="appearance" data-i18n="皮肤"><svg class="ico" aria-hidden="true"><use href="#i-palette"></use></svg>皮肤</button>
       <div data-i18n="软件" class="set-group">软件</div>
-      <button id="btn-guide" class="set-item" data-sub="__guide" data-i18n="使用引导"><svg class="ico" aria-hidden="true"><use href="#i-rocket"></use></svg>使用引导</button>
+      <button id="btn-guide" class="set-item" data-sub="__guide" data-i18n="帮助中心"><svg class="ico" aria-hidden="true"><use href="#i-rocket"></use></svg>帮助中心</button>
       <button id="btn-about" class="set-item" data-sub="about" data-i18n="关于与更新"><svg class="ico" aria-hidden="true"><use href="#i-gauge"></use></svg>关于与更新</button>
       <div data-i18n="远程" class="set-group">远程</div>
       <button id="btn-phone" class="set-item" data-sub="__phone" data-i18n="手机连接"><svg class="ico" aria-hidden="true"><use href="#i-phone"></use></svg>手机连接</button>
@@ -456,7 +457,7 @@
           </div>
           <div id="rd-pane-hive" class="rd-pane" role="tabpanel" aria-labelledby="rd-tab-hive" data-pane="hive">
             <div id="rd-hive" class="rd-hive hidden">
-              <div class="sec-title"><svg class="ico" aria-hidden="true"><use href="#i-bee"></use></svg><span data-i18n="蜂巢工作台">蜂巢工作台</span><span id="rd-hive-sub" class="tag"></span></div>
+              <div class="sec-title"><svg class="ico" aria-hidden="true"><use href="#i-bee"></use></svg><span data-i18n="蜂巢工作台">蜂巢工作台</span><span id="rd-hive-sub" class="tag"></span><button class="hhelp" data-help-topic="serial" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button></div>
               <div id="rd-hive-cells" class="hive-cells"></div>
             </div>
             <!-- 运行中指挥信箱：renderDirector 只认活跃 run，渲染时摘掉 hidden；
@@ -504,6 +505,7 @@
       <div class="panel wide">
         <div class="panel-head">
           <h2 data-i18n="自动化">自动化</h2>
+          <button class="hhelp" data-help-topic="auto" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button>
           <div class="actions">
             <button id="btn-auto-refresh" class="ghost small" title="重新拉取任务列表" data-i18n-title="重新拉取任务列表"><svg class="ico" aria-hidden="true"><use href="#i-refresh"></use></svg><span data-i18n="刷新">刷新</span></button>
             <button id="btn-auto-new" class="primary small" title="创建一个按计划自动运行的任务" data-i18n-title="创建一个按计划自动运行的任务"><span data-i18n="新建定时任务">新建定时任务</span></button>
@@ -526,43 +528,33 @@
       <div class="panel wide">
         <div class="panel-head">
           <h2 data-i18n="禅道 Bug 自动修复">禅道 Bug 自动修复</h2>
+          <button class="hhelp" data-help-topic="auto" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button>
           <div class="actions">
             <button id="btn-zentao-test" class="ghost small" title="用当前表单里的连接信息试连禅道" data-i18n-title="用当前表单里的连接信息试连禅道"><span data-i18n="测试连接">测试连接</span></button>
             <button id="btn-zentao-scan" class="primary small" title="立刻扫一遍激活 Bug 并对账回写" data-i18n-title="立刻扫一遍激活 Bug 并对账回写"><span data-i18n="立即扫描">立即扫描</span></button>
           </div>
         </div>
-        <p data-i18n="定时扫描禅道的激活 Bug，自动创建代码修复任务（实现→验证→评审→修复）；跑完自动合并代码、resolve Bug 并把报告评论回禅道，群机器人同步通知。" class="hint">定时扫描禅道的激活 Bug，自动创建代码修复任务（实现→验证→评审→修复）；跑完自动合并代码、resolve Bug 并把报告评论回禅道，群机器人同步通知。</p>
+        <p data-i18n="定时扫描禅道多个产品的激活 Bug：先按模块路由/AI 排查定责（前端/后端/双端/非我方），我方端自动创建代码修复任务（实现→验证→评审→修复），修完自动合并并 resolve 或转派对应负责人；测试指错人也按排查结论改派。" class="hint">定时扫描禅道多个产品的激活 Bug：先按模块路由/AI 排查定责（前端/后端/双端/非我方），我方端自动创建代码修复任务（实现→验证→评审→修复），修完自动合并并 resolve 或转派对应负责人；测试指错人也按排查结论改派。</p>
         <div id="zentao-status" class="hint zt-status"></div>
         <h3 data-i18n="禅道连接" class="sec-title">禅道连接</h3>
         <div class="zt-grid">
-          <label data-i18n="禅道地址">禅道地址</label><input id="zt-base-url" type="text" placeholder="https://zentao.example.com（子目录部署带子目录）">
-          <label data-i18n="账号">账号</label><input id="zt-account" type="text" placeholder="建议建专用账号（如 codebee）收 Bug">
+          <label data-i18n="禅道地址">禅道地址</label><input id="zt-base-url" type="text" placeholder="https://zentao.example.com（子目录部署带子目录）" data-i18n-ph="https://zentao.example.com（子目录部署带子目录）">
+          <label data-i18n="账号">账号</label><input id="zt-account" type="text" placeholder="建议建专用账号（如 codebee）收 Bug" data-i18n-ph="建议建专用账号（如 codebee）收 Bug">
           <label data-i18n="密码">密码</label><input id="zt-password" type="password" placeholder="" autocomplete="new-password">
-          <label data-i18n="产品 ID">产品 ID</label><input id="zt-products" type="text" placeholder="逗号分隔，如 1,2（禅道产品页 URL 里的 product= 数字）">
-          <label data-i18n="只认领指派给">只认领指派给</label><input id="zt-assigned" type="text" placeholder="禅道账号名，空 = 不按指派过滤">
-          <label data-i18n="严重度上限">严重度上限</label>
-          <select id="zt-sev">
-            <option value="0" data-i18n="不限">不限</option>
-            <option value="1">1（最严重）</option>
-            <option value="2">2</option>
-            <option value="3">3</option>
-            <option value="4">4（最轻）</option>
-          </select>
-        </div>
-        <h3 data-i18n="修复任务" class="sec-title">修复任务</h3>
-        <div class="zt-grid">
-          <label data-i18n="工作目录">工作目录</label><input id="zt-workdir" type="text" placeholder="空 = 跟随默认保存路径">
-          <label data-i18n="基线分支">基线分支</label><input id="zt-gitrev" type="text" placeholder="如 main：每个修复检出任务分支，跑完可自动合并；空 = 直接改工作目录">
-          <label data-i18n="验证命令">验证命令</label><input id="zt-verify" type="text" placeholder="如 npm test：实现完成后先跑它把关；空 = 靠评审把关">
         </div>
         <h3 data-i18n="自动化" class="sec-title">自动化</h3>
         <div class="zt-grid zt-grid-toggles">
-          <label class="toggle" title="修复任务评审通过后，自动到禅道 resolve（fixed）并回评论"><input id="zt-autoresolve" type="checkbox"><span data-i18n="自动 resolve Bug">自动 resolve Bug</span></label>
-          <label class="toggle" title="把任务分支自动合并回基线分支（需配置基线分支；合并失败不 resolve，留人工）"><input id="zt-automerge" type="checkbox"><span data-i18n="自动合并代码">自动合并代码</span></label>
-          <label class="toggle" title="按下面的间隔定时扫描；关掉后仍可手动「立即扫描」"><input id="zt-poll" type="checkbox"><span data-i18n="定时扫描">定时扫描</span></label>
+          <label class="toggle" title="模块路由没命中时，用 AI 读 Bug 描述判端（前端/后端/双端/非我方）；关掉则未命中模块的 Bug 留人工" data-i18n-title="模块路由没命中时，用 AI 读 Bug 描述判端（前端/后端/双端/非我方）；关掉则未命中模块的 Bug 留人工"><input id="zt-triageai" type="checkbox"><span data-i18n="AI 排查兜底">AI 排查兜底</span></label>
+          <label class="toggle" title="修复任务评审通过后，自动到禅道 resolve（fixed）并回评论" data-i18n-title="修复任务评审通过后，自动到禅道 resolve（fixed）并回评论"><input id="zt-autoresolve" type="checkbox"><span data-i18n="自动 resolve Bug">自动 resolve Bug</span></label>
+          <label class="toggle" title="把任务分支自动合并回基线分支（需配置基线分支；合并失败不 resolve 不转派，留人工）" data-i18n-title="把任务分支自动合并回基线分支（需配置基线分支；合并失败不 resolve 不转派，留人工）"><input id="zt-automerge" type="checkbox"><span data-i18n="自动合并代码">自动合并代码</span></label>
+          <label class="toggle" title="按下面的间隔定时扫描；关掉后仍可手动「立即扫描」" data-i18n-title="按下面的间隔定时扫描；关掉后仍可手动「立即扫描」"><input id="zt-poll" type="checkbox"><span data-i18n="定时扫描">定时扫描</span></label>
           <label data-i18n="扫描间隔（小时）">扫描间隔（小时）</label><input id="zt-interval" type="number" min="1" max="168" step="1">
         </div>
         <div class="ops"><button id="btn-zentao-save" class="primary small"><span data-i18n="保存配置">保存配置</span></button></div>
+        <h3 data-i18n="产品档案" class="sec-title">产品档案</h3>
+        <p data-i18n="每个产品一份档案：我方端（自动修）、两端仓库与负责人、模块路由（模块 → 端/人，排查优先级最高）。" class="hint">每个产品一份档案：我方端（自动修）、两端仓库与负责人、模块路由（模块 → 端/人，排查优先级最高）。</p>
+        <div id="zt-profiles" class="cards"></div>
+        <div class="ops"><button id="btn-zentao-addprofile" class="ghost small"><span data-i18n="＋ 添加产品">＋ 添加产品</span></button></div>
         <h3 data-i18n="修复记录" class="sec-title">修复记录</h3>
         <div id="zentao-claims"></div>
       </div>
@@ -573,6 +565,7 @@
       <div class="panel wide">
         <div class="panel-head">
           <h2 data-i18n="使用统计">使用统计<span class="badge2" data-i18n="应用用量">应用用量</span></h2>
+          <button class="hhelp" data-help-topic="auto" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button>
           <div class="actions" id="usage-ranges">
             <div class="seg" role="group" aria-label="时间范围" data-i18n-aria="时间范围">
               <button data-i18n="今天" class="seg-btn active" data-days="1">今天</button>
@@ -613,6 +606,7 @@
       <div class="panel wide">
         <div class="panel-head">
           <h2 data-i18n="智能体目录">智能体目录</h2>
+          <button class="hhelp" data-help-topic="models" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button>
           <div class="actions">
             <button data-i18n="一键绑定推荐模型" id="btn-catalog-autobind" class="ghost">一键绑定推荐模型</button>
             <button data-i18n="重新加载 catalog" id="btn-reload-catalog" class="ghost">重新加载 catalog</button>
@@ -634,6 +628,7 @@
           <aside class="prov-side">
             <div class="prov-side-head">
               <span data-i18n="供应商">供应商</span>
+              <button class="hhelp" data-help-topic="models" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button>
               <span class="prov-side-ops">
                 <button id="btn-refresh-models" class="icon-btn" title="全部重新拉取模型列表" aria-label="全部重新拉取模型列表" data-i18n-aria="全部重新拉取模型列表" data-i18n-title="全部重新拉取模型列表"><svg class="ico" aria-hidden="true"><use href="#i-refresh"></use></svg></button>
                 <button data-i18n="导入" id="btn-import" class="ghost small" title="从本机各 AI 工具导入供应商" data-i18n-title="从本机各 AI 工具导入供应商">导入</button>
@@ -652,6 +647,7 @@
       <div id="sub-bindings" class="subpage hidden">
         <div class="panel wide">
           <div class="panel-head"><h2 data-i18n="CLI 绑定">CLI 绑定</h2>
+            <button class="hhelp" data-help-topic="models" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button>
             <button id="btn-autobind" class="ghost small" onclick="autoBindAll()" data-i18n="一键推荐绑定">一键推荐绑定</button>
             <button id="btn-saveall-bind" class="ghost small hidden" onclick="saveAllBindings()" data-i18n="全部保存">全部保存</button>
           </div>
@@ -663,7 +659,8 @@
       <!-- 经验库 -->
       <div id="sub-skills" class="subpage hidden">
         <div class="panel wide">
-          <div class="panel-head"><h2 data-i18n="经验库">经验库</h2></div>
+          <div class="panel-head"><h2 data-i18n="经验库">经验库</h2>
+            <button class="hhelp" data-help-topic="features" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button></div>
           <p class="hint"><span data-i18n="系统自己的经验沉淀：">系统自己的经验沉淀：</span><b data-i18n="内置规范包">内置规范包</b><span data-i18n="（如七猫签约标准，自动注入小说类任务的规划与评审提示词） 与">（如七猫签约标准，自动注入小说类任务的规划与评审提示词）
             与</span><b data-i18n="运行中自动学到的教训">运行中自动学到的教训</b><span data-i18n="（每次任务结束由编排者复盘本次评审暴露的问题，去重沉淀，下次同类任务自动带上）——越跑越好，无需人工维护。">（每次任务结束由编排者复盘本次评审暴露的问题，去重沉淀，下次同类任务自动带上）——越跑越好，无需人工维护。</span></p>
           <h3 data-i18n="内置规范包" class="sec-title">内置规范包</h3>
@@ -679,6 +676,7 @@
       <div class="panel wide">
         <div class="panel-head">
           <h2 data-i18n="插件市场">插件市场</h2>
+          <button class="hhelp" data-help-topic="auto" title="这是什么？点开看帮助" data-i18n-title="这是什么？点开看帮助" aria-label="帮助" data-i18n-aria="帮助"><svg class="ico" aria-hidden="true"><use href="#i-help"></use></svg></button>
           <span id="mk-count" class="pm-count"></span>
         </div>
         <p data-i18n="用经验包为 CodeBee 扩展写作与工程守则，一键装进经验库。安装即生效，无需手动调用：运行任务时，经验库按插件标注的「适用」自动把内容注入该类任务的提示词；可随时到「经验库」页启用、停用或卸载。" class="hint">用经验包为 CodeBee 扩展写作与工程守则，一键装进经验库。安装即生效，无需手动调用：运行任务时，经验库按插件标注的「适用」自动把内容注入该类任务的提示词；可随时到「经验库」页启用、停用或卸载。</p>
@@ -751,7 +749,7 @@
           <div class="panel-head"><h2 data-i18n="关于与更新">关于与更新</h2></div>
           <div id="su-info" class="empty" data-i18n="加载中…">加载中…</div>
           <div class="input-row" style="margin-top:10px">
-            <button id="btn-welcome-replay" class="ghost small" onclick="welcomeOpen()"><svg class="ico" aria-hidden="true"><use href="#i-bee"></use></svg><span data-i18n="使用引导">使用引导</span></button>
+            <button id="btn-welcome-replay" class="ghost small" onclick="welcomeOpen()"><svg class="ico" aria-hidden="true"><use href="#i-bee"></use></svg><span data-i18n="帮助中心">帮助中心</span></button>
             <button id="su-check" class="ghost small" onclick="suCheck()"><svg class="ico" aria-hidden="true"><use href="#i-refresh"></use></svg><span data-i18n="检查更新">检查更新</span></button>
             <button id="su-apply" class="ghost small hidden" onclick="suApply()"><span data-i18n="升级到新版">升级到新版</span></button>
             <button id="su-restart" class="ghost small hidden" onclick="suRestart()"><span data-i18n="重启服务生效">重启服务生效</span></button>
@@ -972,42 +970,26 @@
   </div>
 </div>
 
-<!-- 首次启动欢迎引导：产品能做什么 + 装完三步开工；「设置 → 关于与更新」可重开。
-     localStorage orch.welcomed 记账，只自动弹一次；令牌门在场时让位（见 maybeWelcome）。 -->
+<!-- 帮助中心（首启欢迎引导升级版）：左目录右内容；首启自动弹落在「快速上手」章。
+     localStorage orch.welcomed 记账，只自动弹一次；令牌门在场时让位（见 maybeWelcome）。
+     章节清单在 app.js HELP_CHAPTERS——加新章只需追加一条 + helpChapterBody 加分支。 -->
 <div id="welcome" class="welcome-wrap hidden">
   <div class="welcome-mask" onclick="welcomeClose()"></div>
   <div class="welcome-card" role="dialog" aria-modal="true" aria-labelledby="welcome-title">
     <button class="welcome-x icon-btn" title="关闭" aria-label="关闭" data-i18n-title="关闭" data-i18n-aria="关闭" onclick="welcomeClose()">✕</button>
-    <div class="welcome-left">
-      <span class="welcome-badge" data-i18n="首次启动">首次启动</span>
+    <div class="help-rail">
+      <span class="welcome-badge" id="welcome-badge">首次启动</span>
       <div class="welcome-brand">
         <svg class="ico welcome-bee" aria-hidden="true"><use href="#i-bee"></use></svg>
         <span class="brand-name">CodeBee</span>
       </div>
+      <nav class="help-toc" id="help-toc" aria-label="帮助目录" data-i18n-aria="帮助目录"></nav>
+      <p class="welcome-foot" data-i18n="可随时按 F1，或在「设置 → 关于与更新」重新打开本帮助中心。">可随时按 F1，或在「设置 → 关于与更新」重新打开本帮助中心。</p>
+    </div>
+    <div class="help-main">
       <h1 id="welcome-title" data-i18n="欢迎使用 CodeBee">欢迎使用 CodeBee</h1>
       <p class="welcome-sub" data-i18n="一群 AI 智能体自动分工：规划、实现、评审、打磨，直到交付成果。">一群 AI 智能体自动分工：规划、实现、评审、打磨，直到交付成果。</p>
-      <div class="welcome-steps">
-        <div class="wstep"><b>1</b><span data-i18n="添加模型供应商：设置 → 模型接入，填入 API Key">添加模型供应商：设置 → 模型接入，填入 API Key</span></div>
-        <div class="wstep"><b>2</b><span data-i18n="绑定 CLI 智能体：点「一键推荐绑定」自动配好">绑定 CLI 智能体：点「一键推荐绑定」自动配好</span></div>
-        <div class="wstep"><b>3</b><span data-i18n="新建任务：选工作目录、写目标，蜂群开工">新建任务：选工作目录、写目标，蜂群开工</span></div>
-      </div>
-      <div class="welcome-acts">
-        <button class="wl-btn primary" onclick="welcomeGo('models')"><span data-i18n="开始配置模型">开始配置模型</span><svg class="ico" aria-hidden="true"><use href="#i-chevron-r"></use></svg></button>
-        <button class="wl-btn" onclick="welcomeGo('bindings')"><span data-i18n="绑定 CLI 智能体">绑定 CLI 智能体</span><svg class="ico" aria-hidden="true"><use href="#i-chevron-r"></use></svg></button>
-        <button class="wl-btn ghost" onclick="welcomeClose()"><span data-i18n="先跳过，直接体验">先跳过，直接体验</span></button>
-      </div>
-      <p class="welcome-foot" data-i18n="可随时在「设置 → 关于与更新」重新打开本引导。">可随时在「设置 → 关于与更新」重新打开本引导。</p>
-    </div>
-    <div class="welcome-right">
-      <h2 data-i18n="把任务交给蜂群">把任务交给蜂群</h2>
-      <p class="wr-sub" data-i18n="多智能体分工协作，成果自动落盘。">多智能体分工协作，成果自动落盘。</p>
-      <ul class="wr-feats">
-        <li><svg class="ico" aria-hidden="true"><use href="#i-workflow"></use></svg><div><b data-i18n="多智能体编排">多智能体编排</b><span data-i18n="规划 · 实现 · 评审 · 打磨，接棒交付">规划 · 实现 · 评审 · 打磨，接棒交付</span></div></li>
-        <li><svg class="ico" aria-hidden="true"><use href="#i-book-open"></use></svg><div><b data-i18n="连载写作">连载写作</b><span data-i18n="断点续跑 · 经验沉淀 · 作品资料">断点续跑 · 经验沉淀 · 作品资料</span></div></li>
-        <li><svg class="ico" aria-hidden="true"><use href="#i-blocks"></use></svg><div><b data-i18n="插件市场">插件市场</b><span data-i18n="600+ 技能，一键安装">600+ 技能，一键安装</span></div></li>
-        <li><svg class="ico" aria-hidden="true"><use href="#i-git-branch"></use></svg><div><b data-i18n="版本工作台">版本工作台</b><span data-i18n="任务分支隔离，改动可审可合">任务分支隔离，改动可审可合</span></div></li>
-        <li><svg class="ico" aria-hidden="true"><use href="#i-calendar-days"></use></svg><div><b data-i18n="自动化">自动化</b><span data-i18n="定时任务，无人值守">定时任务，无人值守</span></div></li>
-      </ul>
+      <div class="help-body" id="help-body"></div>
     </div>
   </div>
 </div>

package/app/ui/style.css

@@ -2739,6 +2739,17 @@ details.sf-dir > summary i, a.sf-file i { font-style: normal; color: var(--muted
   word-break: break-all; }
 .bm-src { margin: 0 18px; padding: 10px 0 2px; border-top: 1px solid var(--border);
   color: var(--muted); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+/* 封面卡内嵌缩略图：竖版小图靠左，模型·供应商·尺寸说明随右侧；
+ * 图片丢失（运行目录被清）时 noimg 类藏图显兜底文案 */
+.bm-cover-wrap { display: flex; align-items: flex-start; gap: 14px; padding: 14px 18px 16px; }
+.bm-cover-img { display: block; width: 136px; height: auto; border-radius: 10px;
+  border: 1px solid var(--border); cursor: zoom-in; }
+.bm-cover-meta { flex: 1; color: var(--muted); font-size: 12px; line-height: 1.6;
+  padding-top: 4px; min-width: 0; word-break: break-all; }
+.bm-cover-fallback { display: none; color: var(--muted); font-size: 12.5px; }
+.bm-cover-wrap.noimg .bm-cover-img { display: none; }
+.bm-cover-wrap.noimg .bm-cover-fallback { display: block; }
+.bm-cover-wrap.noimg .bm-cover-meta { display: none; }
 .rd-bookmeta .ico.spin { animation: ico-spin 1.2s linear infinite; }
 
 /* 文件内容弹窗·文本预览/编辑（目录文件弹窗专属）：
@@ -4977,27 +4988,72 @@ html::-webkit-scrollbar-thumb { border-radius: 999px; background: color-mix(in s
 html::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent) 48%, var(--border-strong)); }
 html::-webkit-scrollbar-track { background: transparent; }
 
-/* ---- 首次启动欢迎引导：左列上手三步 + 右列能力一览（渐变随皮肤 accent） ---- */
+/* ---- 帮助中心（首启欢迎引导升级版）：左目录右内容，随皮肤 accent ---- */
 .welcome-wrap { position: fixed; inset: 0; z-index: 195; display: flex; align-items: center; justify-content: center; padding: 24px; }
 .welcome-mask { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); }
 .welcome-card {
-  position: relative; display: flex; width: min(880px, 100%); max-height: calc(100vh - 48px);
+  position: relative; display: flex; width: min(920px, 100%); height: min(620px, calc(100vh - 48px));
   background: var(--bg); border: 1px solid var(--border-strong);
   border-radius: var(--r-lg); box-shadow: var(--shadow); overflow: hidden;
 }
 .welcome-x { position: absolute; top: 12px; right: 12px; z-index: 2; }
-.welcome-left {
-  flex: 1.15; min-width: 0; overflow: auto; padding: 30px 30px 20px;
-  display: flex; flex-direction: column; gap: 13px;
+.help-rail {
+  flex: none; width: 214px; padding: 24px 14px 16px;
+  display: flex; flex-direction: column; gap: 14px;
+  border-right: 1px solid var(--border); background: var(--panel);
 }
 .welcome-badge {
   align-self: flex-start; font-size: 11.5px; color: var(--muted);
   border: 1px solid var(--border-strong); border-radius: 999px; padding: 3px 11px;
 }
-.welcome-brand { display: flex; align-items: center; gap: 10px; font-size: 23px; font-weight: 800; letter-spacing: .3px; }
-.welcome-brand .welcome-bee { width: 28px; height: 28px; color: var(--accent); stroke-width: 1.5; }
-.welcome-left h1 { margin: 0; font-size: 25px; line-height: 1.25; }
+.welcome-brand { display: flex; align-items: center; gap: 9px; font-size: 20px; font-weight: 800; letter-spacing: .3px; }
+.welcome-brand .welcome-bee { width: 24px; height: 24px; color: var(--accent); stroke-width: 1.5; }
+.help-toc { display: flex; flex-direction: column; gap: 2px; overflow: auto; margin: 0 -4px; padding: 0 4px; }
+.hitem {
+  display: flex; align-items: center; gap: 9px; width: 100%;
+  padding: 8px 10px; font-family: inherit; font-size: 12.8px; text-align: left;
+  color: var(--text); background: transparent;
+  border: 1px solid transparent; border-radius: var(--r-md); cursor: pointer;
+  transition: background .12s, border-color .12s;
+}
+.hitem:hover { background: var(--panel2); }
+.hitem.active { background: var(--panel2); border-color: var(--border-strong); }
+.hitem.active span { color: var(--accent); font-weight: 650; }
+.hitem .ico { flex: none; width: 15px; height: 15px; color: var(--muted); }
+.hitem.active .ico { color: var(--accent); }
+.hitem span { flex: 1; min-width: 0; }
+.h-todo {
+  flex: none; font-style: normal; font-size: 10px; line-height: 15px; padding: 0 6px;
+  color: var(--muted); border: 1px solid var(--border-strong); border-radius: 999px; opacity: .85;
+}
+.help-main { flex: 1; min-width: 0; overflow: auto; padding: 26px 30px 22px; }
+.help-main h1 { margin: 0; font-size: 24px; line-height: 1.25; }
 .welcome-sub { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
+.help-body { margin-top: 13px; }
+.help-body > :first-child { margin-top: 0; }
+.help-h3 { margin: 16px 0 6px; font-size: 14.5px; }
+.help-p { margin: 0 0 6px; font-size: 12.8px; line-height: 1.75; }
+.help-note {
+  margin: 12px 0 0; padding: 9px 12px; font-size: 12px; line-height: 1.7; color: var(--muted);
+  background: var(--panel); border: 1px dashed var(--border-strong); border-radius: var(--r-md);
+}
+.help-list { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
+.help-list li { display: flex; gap: 10px; font-size: 12.8px; line-height: 1.65; }
+.help-list li b { flex: none; min-width: 58px; color: var(--accent); font-size: 12px; }
+.help-feats { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
+.help-feats li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; }
+.help-feats li .ico { flex: none; width: 17px; height: 17px; margin-top: 2px; color: var(--accent); }
+.help-feats b { display: block; font-size: 12.8px; }
+.help-feats li div span { display: block; font-size: 12px; color: var(--muted); }
+.help-todo {
+  margin-top: 6px; padding: 18px; color: var(--muted); font-size: 12.8px; line-height: 1.7;
+  border: 1px dashed var(--border-strong); border-radius: var(--r-md);
+}
+.help-todo b { display: block; margin-bottom: 4px; color: var(--text); }
+.help-todo p { margin: 0; }
+.help-qa { margin: 0 0 13px; }
+.help-qa b { display: block; margin-bottom: 3px; font-size: 12.8px; }
+.help-qa p { margin: 0; font-size: 12.5px; line-height: 1.75; }
 .welcome-steps { display: flex; flex-direction: column; gap: 9px; margin-top: 2px; }
 .wstep { display: flex; gap: 10px; align-items: flex-start; font-size: 12.8px; line-height: 1.55; }
 .wstep b {
@@ -5006,7 +5062,7 @@ html::-webkit-scrollbar-track { background: transparent; }
   font-size: 11.5px; color: var(--accent);
   background: var(--panel2); border: 1px solid var(--border-strong);
 }
-.welcome-acts { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
+.welcome-acts { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
 .wl-btn {
   display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%;
   padding: 11px 14px; font-family: inherit; font-size: 13.5px; font-weight: 600;
@@ -5020,23 +5076,16 @@ html::-webkit-scrollbar-track { background: transparent; }
 .wl-btn.ghost { justify-content: center; font-weight: 500; background: transparent; border-color: transparent; color: var(--muted); }
 .wl-btn.ghost:hover { color: var(--text); border-color: transparent; }
 .welcome-foot { margin: auto 0 0; padding-top: 12px; color: var(--muted); font-size: 11.5px; }
-.welcome-right {
-  flex: .85; min-width: 0; padding: 30px 28px;
-  display: flex; flex-direction: column; justify-content: center; gap: 7px;
-  background: linear-gradient(160deg, color-mix(in srgb, var(--accent) 88%, #000), var(--accent2));
-  color: #fff;
-}
-.welcome-right h2 { margin: 0; font-size: 20px; letter-spacing: .3px; }
-.wr-sub { margin: 0 0 12px; font-size: 12.5px; opacity: .85; }
-.wr-feats { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
-.wr-feats li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; }
-.wr-feats li .ico { flex: none; width: 17px; height: 17px; margin-top: 2px; opacity: .95; }
-.wr-feats b { display: block; font-size: 12.8px; }
-.wr-feats li div span { display: block; font-size: 12px; opacity: .82; }
 body.welcome-open { overflow: hidden; }
 @media (max-width: 720px) {
-  .welcome-right { display: none; }
-  .welcome-card { width: 100%; }
+  .welcome-card { flex-direction: column; height: calc(100vh - 32px); }
+  .help-rail { width: auto; padding: 16px 16px 10px; border-right: 0; border-bottom: 1px solid var(--border); gap: 10px; }
+  .welcome-brand { font-size: 19px; }
+  .help-toc { flex-direction: row; overflow-x: auto; }
+  .hitem { width: auto; white-space: nowrap; padding: 6px 10px; }
+  .h-todo { display: none; }
+  .welcome-foot { display: none; }
+  .help-main { padding: 18px 18px 16px; }
 }
 
 /* 类型菜单项的成本/次数预估行（借鉴 omnigent pre-run estimate）：小字弱化，
@@ -5140,3 +5189,46 @@ body.welcome-open { overflow: hidden; }
 .zt-tag-warn { color: var(--warn, #b45309); border-color: var(--warn, #b45309); }
 .zt-tag-err { color: var(--danger, #dc2626); border-color: var(--danger, #dc2626); }
 .zt-tag-fix { color: var(--accent); border-color: var(--accent); }
+
+/* ---------------- 禅道·产品档案卡（追加于文件尾防并行重排） ---------------- */
+.zt-prof .head .zt-num { width: 90px; }
+.zt-num { max-width: 120px; }
+.zt-ours { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 8px 0 4px; font-size: 12.5px; color: var(--muted); }
+.zt-ours .toggle { margin: 0; }
+.zt-mrs { margin-top: 10px; border-top: 1px dashed var(--border); padding-top: 8px; }
+.zt-mr-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); margin-bottom: 6px; }
+.zt-mr-head button { margin-left: auto; }
+.zt-mr-row { display: flex; align-items: center; gap: 6px; margin: 4px 0; }
+.zt-mr-row .zt-num { width: 110px; flex: none; }
+.zt-mr-row .zt-mr-side { width: 110px; flex: none; }
+.zt-mr-row .zt-mr-account { flex: 1; min-width: 140px; max-width: 300px; }
+
+/* ---------------- 禅道·窄屏（追加于文件尾防并行重排） ---------------- */
+/* ≤900px：档案卡网格塌单列（标签在上、输入全宽），与 .grid-2 的断点口径一致 */
+@media (max-width: 900px) {
+  .zt-grid { grid-template-columns: 1fr; gap: 4px; }
+  .zt-grid input[type="text"], .zt-grid input[type="password"],
+  .zt-grid input[type="number"], .zt-grid select { max-width: none; }
+}
+/* ≤640px：模块路由行换行——模块/端一行，转给谁独占一行，删除按钮随行 */
+@media (max-width: 640px) {
+  .zt-mr-row { flex-wrap: wrap; }
+  .zt-mr-row .zt-num { flex: 1 1 30%; min-width: 86px; }
+  .zt-mr-row .zt-mr-side { flex: 1 1 30%; min-width: 96px; }
+  .zt-mr-row .zt-mr-account { flex: 1 1 100%; max-width: none; order: 5; }
+}
+
+/* 需求拷问「已确认，开跑」条（借鉴 superpowers 分段签核）：全部问题选完出现 */
+.cl-confirm { margin-top: 10px; text-align: right; }
+
+/* 就地帮助问号（.hhelp）：复杂控件旁的小 ?，事件委托见 app.js——
+ * 点击直达帮助中心 data-help-topic 对应章；悬停变主题色 */
+.hhelp {
+  flex: none; display: inline-flex; align-items: center; justify-content: center;
+  width: 20px; height: 20px; padding: 0; border-radius: 50%;
+  background: transparent; border: 1px solid var(--border-strong); cursor: pointer;
+  color: var(--muted); vertical-align: middle; transition: color .12s, border-color .12s;
+}
+.hhelp:hover { color: var(--accent); border-color: var(--accent); }
+.hhelp .ico { width: 12px; height: 12px; }
+.empty a { color: var(--accent); }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codebee",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "description": "CodeBee · 多智能体编排台 — 统一编排本机 AI 编码 CLI（Codex / Claude Code / QwenCode / OpenCode / Aider…）：目标→拆解→路由→执行→验证→跨厂商评审→修复→报告。纯 Python 标准库实现，本地 Web UI。",
   "license": "MIT",
   "bin": {