feat(console): CHV production-grade frontend — worker availability, attachment guard, queue hint, build:console fix, vitest

cloud/console-react/src/sections/DispatchSection.tsx

@@ -2,6 +2,7 @@ import { useRef, useState } from "react";
 import { useConsole } from "../context";
 import { Card, Bar } from "../components/ui";
 import { gatherAttachments } from "../api/client";
+import { chvAvailability } from "../api/chv";
 import { EFFORTS } from "../api/types";
 
 export default function DispatchSection() {
@@ -22,7 +23,15 @@ export default function DispatchSection() {
   const filesRef = useRef<HTMLInputElement>(null);
   const dirRef = useRef<HTMLInputElement>(null);
   const imgRef = useRef<HTMLInputElement>(null);
+  const [hasAttachments, setHasAttachments] = useState(false);
   const [msg, setMsg] = useState("");
+  const chvAvail = chvAvailability(ctx.workers, ctx.workersSummary, ctx.workersError);
+  const isChv = executor === "cloud-hypervisor";
+  function refreshAttachments() {
+    setHasAttachments(
+      !!(filesRef.current?.files?.length || dirRef.current?.files?.length || imgRef.current?.files?.length),
+    );
+  }
 
   async function submit() {
     setMsg("");
@@ -60,6 +69,7 @@ export default function DispatchSection() {
       if (goalMode || goalInvincible || planMode) { setMsg("协调员任务不能与 goal/计划模式同用：协调员任务本身不跑模型回合，请取消 goal/计划勾选，或清空协调员 JSON"); return; }
     }
     const atts = gatherAttachments(filesRef.current?.files || null, dirRef.current?.files || null, imgRef.current?.files || null);
+    if (isChv && atts.length) { setMsg("cloud-hypervisor 任务不支持附件：请先清空附件再提交（后端对带附件的 CHV 任务会 400）"); return; }
     try {
       const result = await ctx.dispatch(body, atts);
       setMsg(result);
@@ -67,6 +77,7 @@ export default function DispatchSection() {
       if (filesRef.current) filesRef.current.value = "";
       if (dirRef.current) dirRef.current.value = "";
       if (imgRef.current) imgRef.current.value = "";
+      setHasAttachments(false);
     } catch (e: any) { setMsg("提交失败：" + (e?.message || String(e))); }
   }
 
@@ -84,7 +95,19 @@ export default function DispatchSection() {
         <label><input type="checkbox" checked={goalInvincible} onChange={(e) => setGoalInvincible(e.target.checked)} /> goal 模式无敌版</label>
         <label><input type="checkbox" checked={planMode} onChange={(e) => setPlanMode(e.target.checked)} /> 计划模式（只读）</label>
       </Bar>
-      {executor === "cloud-hypervisor" ? <div className="muted">实验执行器，默认关闭：需后端已开启 CHV worker 且宿主有 KVM，否则任务无人认领、一直排队；带附件时建任务即被后端拒绝（错误文案原样显示在下方）。前端只传 executor 值，不绕过后端白名单；默认仍是 docker。</div> : null}
+      {isChv ? <div className="muted">实验执行器，默认关闭：需后端已开启 CHV worker 且宿主有 KVM，否则任务无人认领、一直排队；带附件时建任务即被后端拒绝（错误文案原样显示在下方）。前端只传 executor 值，不绕过后端白名单；默认仍是 docker。</div> : null}
+      {isChv ? (
+        <div className="muted">
+          {chvAvail.state === "known"
+            ? <>CHV worker 在线 {chvAvail.online} / 共 {chvAvail.total}（来自 /workers）{chvAvail.online === 0 ? <b>：当前无 CHV worker 在线，任务将一直排队，请先确认宿主 worker 已起；本提示不拦提交，worker 随后上线可认领，后端是最终权威。</b> : null}</>
+            : chvAvail.reason === "aggregate-only"
+              ? "CHV worker 在线数未知：完整 worker 清单仅全局管理员可见，非管理员只能看到聚合数，无法按执行器分项。"
+              : chvAvail.reason === "load-failed"
+                ? "CHV worker 在线数未知：/workers 加载失败，请到 Workers 区刷新后重试。"
+                : "CHV worker 在线数未知：/workers 尚未加载，请到 Workers 区刷新。"}
+          {" "}<button type="button" onClick={ctx.refreshWorkers}>刷新 CHV 可用性</button>
+        </div>
+      ) : null}
       <textarea className="prompt stacked" placeholder="任务 prompt（必填）" value={prompt} onChange={(e) => setPrompt(e.target.value)} />
       <textarea className="coord stacked" placeholder="协调员子任务 JSON（可选），留空为普通任务" value={coordParts} onChange={(e) => setCoordParts(e.target.value)} />
       <div className="muted">协调员格式：[{"{"}"name":"后端","prompt":"做后端"{"}"},{"{"}"name":"前端","prompt":"做前端"{"}"}]；提交后 worker 并行建子任务、等齐、合流汇总。不能与 goal/计划模式同用。协调员与 goal/计划互斥：勾了 goal 或计划模式时不要填协调员 JSON，提交前会校验并拦截。子任务费用记父任务创建人账；父任务创建时按分工数预留配额，余额不足时整个父任务被挡下。</div>
@@ -118,10 +141,11 @@ export default function DispatchSection() {
       {goalInvincible ? <div className="muted">goal 模式无敌版：goal 模式 + 任务不限时（去掉 worker/docker 总超时；单轮 600 秒护栏还在，不限的是任务总时长与总轮次）。服务端默认的自动续跑与断点镜像同时生效。</div> : null}
       <Bar>
         <span className="muted">附件（放进任务工作区，图片与普通文件不区分）：</span>
-        <input ref={filesRef} type="file" multiple title="文件" />
-        <input ref={dirRef} type="file" multiple title="文件夹" {...({ webkitdirectory: "" } as any)} />
-        <input ref={imgRef} type="file" accept="image/*" multiple title="图片" />
+        <input ref={filesRef} type="file" multiple title="文件" disabled={isChv} onChange={refreshAttachments} />
+        <input ref={dirRef} type="file" multiple title="文件夹" disabled={isChv} onChange={refreshAttachments} {...({ webkitdirectory: "" } as any)} />
+        <input ref={imgRef} type="file" accept="image/*" multiple title="图片" disabled={isChv} onChange={refreshAttachments} />
       </Bar>
+      {isChv ? <div className="muted">cloud-hypervisor 任务不支持附件：附件输入已禁用（后端对带附件的 CHV 任务会 400，错误文案原样显示在下方；切换回其他执行器可恢复附件输入）。{hasAttachments ? <>当前仍有已选附件，请先清空再提交。 <button type="button" onClick={() => { if (filesRef.current) filesRef.current.value = ""; if (dirRef.current) dirRef.current.value = ""; if (imgRef.current) imgRef.current.value = ""; setHasAttachments(false); }}>清空附件</button></> : ""}</div> : null}
       <Bar>
         <button className="seal" onClick={submit}>提交任务</button>
         <span className="muted">{msg || ctx.dispatchMsg}</span>

cloud/console-react/src/sections/EnvSection.tsx

@@ -2,12 +2,14 @@ import { useState } from "react";
 import { useConsole } from "../context";
 import { Card, Bar, DataListRaw } from "../components/ui";
 import { shortId } from "../api/client";
+import { chvAvailability } from "../api/chv";
 
 export default function EnvSection() {
   const ctx = useConsole();
   const [name, setName] = useState("");
   const [branch, setBranch] = useState("");
   const [executor, setExecutor] = useState("");
+  const chvAvail = chvAvailability(ctx.workers, ctx.workersSummary, ctx.workersError);
   return (
     <Card id="nav-env" title={<>环境 <span className="muted">（选、建、管：当前项目的基准检出）</span></>}>
       <Bar>
@@ -35,7 +37,7 @@ export default function EnvSection() {
         </select>
         <button onClick={async () => { await ctx.createEnv(name, branch, executor); setName(""); setBranch(""); }}>新建环境</button>
       </Bar>
-      {executor === "cloud-hypervisor" ? <div className="muted">实验执行器，默认关闭：环境创建白名单同样允许 cloud-hypervisor（后端环境接口 allowlist：local / docker / cloud-hypervisor，不含 cloud）；仍需后端有 KVM 宿主上的 CHV worker 才会认领，否则任务排队。前端只传值，不绕过后端白名单。</div> : null}
+      {executor === "cloud-hypervisor" ? <div className="muted">实验执行器，默认关闭：环境创建白名单同样允许 cloud-hypervisor（后端环境接口 allowlist：local / docker / cloud-hypervisor，不含 cloud）；仍需后端有 KVM 宿主上的 CHV worker 才会认领，否则任务排队。前端只传值，不绕过后端白名单。{chvAvail.state === "known" ? <> CHV worker 在线 {chvAvail.online} / 共 {chvAvail.total}（来自 /workers）{chvAvail.online === 0 ? "：当前无 CHV worker 在线，任务将一直排队。" : ""}</> : " CHV worker 在线数未知：完整 worker 清单仅全局管理员可见。"}</div> : null}
       <span className="muted">{ctx.envMsg}</span>
     </Card>
   );

cloud/console-react/src/sections/TaskDetailPanel.tsx

@@ -4,6 +4,7 @@ import { Card } from "../components/ui";
 import { shortId, fmt } from "../api/client";
 import { STATUS_EXPLAIN } from "../api/types";
 import { firstChar, durationOf, tokenOf, fmtCostUsd } from "../api/taskMeta";
+import { chvAvailability, chvQueueHint } from "../api/chv";
 import DetailActions from "./detail/DetailActions";
 import BrowserPanel from "./detail/BrowserPanel";
 import ReviewPanel from "./detail/ReviewPanel";
@@ -57,6 +58,8 @@ export default function TaskDetailPanel() {
   if (!t) return <Card id="nav-detail" title="任务详情"><div className="muted">点任务行查看详情</div></Card>;
   const [dur, durTitle] = durationOf(t);
   const [tok, tokTitle] = tokenOf(t);
+  const chvAvail = chvAvailability(ctx.workers, ctx.workersSummary, ctx.workersError);
+  const queueHint = chvQueueHint(t.executor, t.status, chvAvail);
   const fc = firstChar(t);
   const cost = ctx.costSummary;
   const modeText = t.plan ? "计划模式（只读）"
@@ -111,6 +114,7 @@ export default function TaskDetailPanel() {
         const idle = last ? now - last : null;
         return (<Card title="LLM 进度">
           <div>状态 {t.status === "running" ? "进行中" : "排队中"} · 已用 {dur}{idle !== null ? " · 上次活动 " + fmtAge(idle) : ""}</div>
+          {queueHint ? <div className="muted">{queueHint}</div> : null}
           {idle !== null && idle > 180
             ? <div className="muted">超过 3 分钟无活动：可能在等上游模型响应（上游 503 时 worker 会重试后失败，失败后这里会显示失败原因；无活动不等于已断连，服务端没有“LLM 已连接”字段，不作此断言）</div>
             : <div className="muted">首轮无输出时属正常：模型第一轮回复到达前 trace 里没有消息；回复到达后会在会话区出现，成本里的 LLM 请求数随之增加</div>}

cloud/console-react/src/sections/TaskListSection.tsx

@@ -1,6 +1,7 @@
 import { useConsole } from "../context";
 import { shortId } from "../api/client";
 import { firstChar, durationOf, tokenOf } from "../api/taskMeta";
+import { chvAvailability, chvQueueHint } from "../api/chv";
 
 // 任务列表行 meta：首字 / 总耗时 / token，计算见 api/taskMeta.ts，
 // 与任务详情共用同一口径。
@@ -14,6 +15,7 @@ import { firstChar, durationOf, tokenOf } from "../api/taskMeta";
 // blue-grey background (#ddf4ff), not a bubble.
 export default function TaskListSection({ onNew }: { onNew: () => void }) {
   const ctx = useConsole();
+  const chvAvail = chvAvailability(ctx.workers, ctx.workersSummary, ctx.workersError);
   return (
     <div>
       <div className="search-box">
@@ -75,6 +77,9 @@ export default function TaskListSection({ onNew }: { onNew: () => void }) {
                   {(t.status === "failed" || t.status === "interrupted" || t.status === "merge-failed") && t.error_text ? (
                     <div className="issue-meta" title={t.error_text}>{/503|Service Unavailable/.test(t.error_text) ? "上游 503：模型服务暂时不可用" : t.error_text.replace(/\s+/g, " ").slice(0, 60)}</div>
                   ) : null}
+                  {chvQueueHint(t.executor, t.status, chvAvail) ? (
+                    <div className="issue-meta" title={chvQueueHint(t.executor, t.status, chvAvail)}>{chvQueueHint(t.executor, t.status, chvAvail)}</div>
+                  ) : null}
                 </span>
               </li>
               );

cloud/console-react/src/sections/WorkersSection.tsx

@@ -1,12 +1,19 @@
 import { useConsole } from "../context";
 import { Card, Bar, DataListRaw } from "../components/ui";
 import { workerAgeText, shortId } from "../api/client";
+import { chvAvailability } from "../api/chv";
 
 export default function WorkersSection() {
   const ctx = useConsole();
+  const chvAvail = chvAvailability(ctx.workers, ctx.workersSummary, ctx.workersError);
   return (
     <Card id="nav-workers" title="Workers">
       <Bar><button onClick={ctx.refreshWorkers}>刷新</button></Bar>
+      <div className="muted">
+        {chvAvail.state === "known"
+          ? <>cloud-hypervisor worker 在线 {chvAvail.online} / 共 {chvAvail.total}（实验，默认关闭）{chvAvail.online === 0 ? "：当前无 CHV worker 在线，CHV 任务将一直排队。" : ""}</>
+          : "cloud-hypervisor worker 在线数未知：完整 worker 清单仅全局管理员可见，非管理员只能看到聚合数，无法按执行器分项。"}
+      </div>
       {ctx.workersError ? <div className="muted">{ctx.workersError}</div>
         : ctx.workers === null ? <div className="muted">{ctx.workersSummary || "未加载"}</div>
         : ctx.workers.length === 0 ? <div className="muted">无 worker 注册</div>