@spzxg/cli-ui 0.1.0 → 0.3.0

package/src/core/client.ts

@@ -1,6 +1,8 @@
 import { createSseParser } from "./sse.js";
+import { NEW_TASK, parseConvKey } from "./conversation.js";
 import type {
-  CenterJob, CenterTask, CenterTurn, NewConversationOptions, SendResult, StreamEnd, StreamItem, StreamSnapshot,
+  BoardInfo, BrowserMessage, BrowserStatus, CenterJob, CenterTask, CenterTurn, DiffResult, DirListing, FileInfo,
+  NewConversationOptions, SendResult, StreamEnd, StreamItem, StreamSnapshot,
 } from "./types.js";
 
 /**
@@ -26,6 +28,11 @@ export interface CenterClientOptions {
   /** 额外请求头（每次请求时取，可放会话令牌等）。 */
   headers?: () => Record<string, string>;
   fetch?: typeof fetch;
+  /**
+   * 看板里的文件能不能直接用地址打开（<img src>、<iframe src>、下载链接）。缺省：没给 token / headers / line 时可以
+   * （同源代理注入令牌）；否则浏览器直接请求带不上请求头，看板改为先 fetch 再用 blob 地址显示。
+   */
+  directFileLinks?: boolean;
 }
 
 /** 实时流超过这么久没有任何数据（center 每 20 秒一次心跳）就当连接已断。 */
@@ -44,10 +51,18 @@ const ERROR_TEXT: Record<string, string> = {
   conversation_queue_full: "排队的消息太多了，请等前面的回复后再发",
   business_id_conflict: "消息编号冲突，请重新发送",
   not_a_conversation: "这个任务不是对话任务",
+  conversation_not_found: "这个对话不在对应的对话任务里",
+  too_many_conversations: "这个对话任务里开的对话太多了，请新建对话任务",
   not_found: "对话不存在，或不属于当前产品线",
   unauthorized: "没有权限访问任务中心（产品线令牌缺失或失效）",
   conversation_requires_one_task: "对话任务只能有一条首轮消息",
   conversation_prompt_required: "第一条消息不能为空",
+  not_dispatched: "任务还没派发到执行节点",
+  node_unreachable: "执行节点暂时连不上，稍后会自动重试",
+  node_outdated: "执行节点的 Operator 版本较旧，不支持这个功能，请升级节点",
+  too_many_viewers: "同时观看这个浏览器的人太多，请稍后再试",
+  viewer_not_found: "画面连接已断开，正在重连",
+  viewer_not_ready: "画面连接还没就绪，正在重连",
 };
 
 /**
@@ -59,13 +74,20 @@ const ERROR_TEXT: Record<string, string> = {
 export interface ConversationBackend {
   baseUrl: string;
   getJob(jobId: string): Promise<CenterJob>;
-  listTurns(jobId: string, query?: { afterSeq?: number; limit?: number }): Promise<{ job_id: string; turns: CenterTurn[] }>;
+  /** taskId：只要对话任务里这一个对话的轮次。 */
+  listTurns(jobId: string, query?: { afterSeq?: number; limit?: number; taskId?: string }): Promise<{ job_id: string; turns: CenterTurn[] }>;
   listTasks(): Promise<{ tasks: CenterTask[] }>;
-  createConversation(firstMessage: string, opts?: NewConversationOptions & { businessId?: string }): Promise<{ id: string; job_id: string; status: string; turn: CenterTurn }>;
-  sendMessage(jobId: string, text: string, opts?: { businessId?: string; timeoutSeconds?: number }): Promise<SendResult>;
+  createConversation(firstMessage: string, opts?: NewConversationOptions & { businessId?: string }): Promise<{ id: string; job_id: string; status: string; task_ids?: string[]; turn: CenterTurn }>;
+  /** taskId：发给对话任务里的哪个对话，不给 = 第一个。 */
+  sendMessage(jobId: string, text: string, opts?: { businessId?: string; timeoutSeconds?: number; taskId?: string }): Promise<SendResult>;
+  /** 在对话任务里新开一个对话（同一节点、同一工作区），text 是它的第一条消息。 */
+  openConversation?(jobId: string, text: string, opts?: { title?: string; agent?: string; browser?: boolean; businessId?: string; timeoutSeconds?: number }): Promise<SendResult>;
   cancelTurn(jobId: string, turnId: string): Promise<CenterTurn>;
   closeConversation(jobId: string): Promise<{ id: string; status: string }>;
-  stream(jobId: string, handlers: StreamHandlers, intervalMs?: number): () => void;
+  /** 只关掉对话任务里的一个对话（别的对话和对话任务照常）。 */
+  closeConversationTask?(jobId: string, taskId: string): Promise<{ job_id: string; task_id: string; status: string; closed: boolean }>;
+  /** taskId：看对话任务里的哪个对话，不给 = 第一个。 */
+  stream(jobId: string, handlers: StreamHandlers, intervalMs?: number, taskId?: string | null): () => void;
   /**
    * 把回答直接交给正停在提问上的回合（Operator 的 POST /api/tasks/:id/answer）。
    * resolved=false 表示没有在等的回合，调用方改用「下一条消息」发回答。center 不提供：它在 Agent 提问时已经结束那一轮。
@@ -75,6 +97,33 @@ export interface ConversationBackend {
   submitInput?(jobId: string, inputId: string, values: string[]): Promise<string | null>;
   /** 浏览器交接后交还给 AI（Operator 的 POST /api/tasks/:id/browser），返回错误文案或 null。center 不提供。 */
   handback?(jobId: string): Promise<string | null>;
+  /** 右侧看板用到的能力（cli-board）。后端没有时看板显示「不支持」。 */
+  board?: BoardBackend;
+}
+
+/**
+ * 右侧看板（cli-board）：工作区文件、改动、任务浏览器。全部经 center 转发，浏览器不直连节点。
+ * 方法里的 jobId 也可以是对话键（"job_x#task_y"）：看对话任务里那个对话的文件、改动和浏览器。
+ */
+export interface BoardBackend {
+  /** fileUrl 给出的地址浏览器能直接打开（不需要额外请求头）。false 时看板先 fetch 再显示。 */
+  directLinks: boolean;
+  info(jobId: string): Promise<BoardInfo>;
+  /** 目录（缺省根目录）或文件的信息。 */
+  stat(jobId: string, path?: string): Promise<DirListing | FileInfo>;
+  /** 文件地址（给 <img> / <iframe> / 下载链接用）。相对路径用路径式地址，HTML 里的相对资源能跟着解析。 */
+  fileUrl(jobId: string, path: string, opts?: { download?: boolean }): string;
+  /** 读文本（最多 maxBytes，超过的截断）。 */
+  readText(jobId: string, path: string, maxBytes?: number): Promise<{ text: string; truncated: boolean; size: number; contentType: string }>;
+  readBuffer(jobId: string, path: string): Promise<ArrayBuffer>;
+  diff(jobId: string): Promise<DiffResult>;
+  browserStatus(jobId: string): Promise<BrowserStatus>;
+  browserAction(jobId: string, action: "open" | "close" | "takeover" | "handback"): Promise<BrowserStatus>;
+  /** 浏览器状态实时流；返回停止函数。onClose 在断开时调用（error 为 null 表示正常结束）。 */
+  browserEvents(jobId: string, handlers: { onStatus: (status: BrowserStatus) => void; onClose?: (error: CenterError | null) => void }): () => void;
+  /** 浏览器实时画面；onViewer 给出发输入要用的 viewer id。 */
+  browserFrames(jobId: string, handlers: { onViewer: (viewer: string) => void; onMessage: (message: BrowserMessage) => void; onEnd?: (end: { reason: string; detail?: string }) => void; onClose?: (error: CenterError | null) => void }): () => void;
+  browserInput(jobId: string, viewer: string, events: Array<Record<string, unknown>>): Promise<void>;
 }
 
 export function createCenterClient(options: CenterClientOptions = {}): ConversationBackend {
@@ -113,10 +162,11 @@ export function createCenterClient(options: CenterClientOptions = {}): Conversat
   return {
     baseUrl: base,
     getJob: (jobId: string) => request<CenterJob>(`/api/jobs/${id(jobId)}`),
-    listTurns: (jobId: string, query: { afterSeq?: number; limit?: number } = {}) => {
+    listTurns: (jobId: string, query: { afterSeq?: number; limit?: number; taskId?: string } = {}) => {
       const params = new URLSearchParams();
       if (query.afterSeq !== undefined) params.set("after_seq", String(query.afterSeq));
       if (query.limit !== undefined) params.set("limit", String(query.limit));
+      if (query.taskId) params.set("task", query.taskId);
       const qs = params.toString();
       return request<{ job_id: string; turns: CenterTurn[] }>(`/api/jobs/${id(jobId)}/turns${qs ? `?${qs}` : ""}`);
     },
@@ -124,7 +174,7 @@ export function createCenterClient(options: CenterClientOptions = {}): Conversat
     listTasks: () => request<{ tasks: CenterTask[] }>("/api/tasks"),
     createConversation: (firstMessage: string, opts: NewConversationOptions & { businessId?: string } = {}) => {
       const title = (opts.title || firstLine(firstMessage)).slice(0, 120);
-      return post<{ id: string; job_id: string; status: string; turn: CenterTurn }>("/api/jobs", {
+      return post<{ id: string; job_id: string; status: string; task_ids?: string[]; turn: CenterTurn }>("/api/jobs", {
         title,
         mode: "conversation",
         ...(opts.workspace ? { workspace: opts.workspace } : {}),
@@ -140,20 +190,34 @@ export function createCenterClient(options: CenterClientOptions = {}): Conversat
       });
     },
     /** 带 business_id 时 center 按它去重，网络超时可以放心重发同一条。 */
-    sendMessage: (jobId: string, text: string, opts: { businessId?: string; timeoutSeconds?: number } = {}) =>
+    sendMessage: (jobId: string, text: string, opts: { businessId?: string; timeoutSeconds?: number; taskId?: string } = {}) =>
       post<SendResult>(`/api/jobs/${id(jobId)}/messages`, {
         text,
+        ...(opts.taskId ? { task_id: opts.taskId } : {}),
+        ...(opts.businessId ? { business_id: opts.businessId } : {}),
+        ...(opts.timeoutSeconds ? { timeout_seconds: opts.timeoutSeconds } : {}),
+      }),
+    /** 同一个 business_id 重发只开一个对话。 */
+    openConversation: (jobId: string, text: string, opts: { title?: string; agent?: string; browser?: boolean; businessId?: string; timeoutSeconds?: number } = {}) =>
+      post<SendResult>(`/api/jobs/${id(jobId)}/conversations`, {
+        text,
+        ...(opts.title ? { title: opts.title } : {}),
+        ...(opts.agent ? { agent: opts.agent } : {}),
+        ...(opts.browser !== undefined ? { browser: opts.browser } : {}),
         ...(opts.businessId ? { business_id: opts.businessId } : {}),
         ...(opts.timeoutSeconds ? { timeout_seconds: opts.timeoutSeconds } : {}),
       }),
     /** 取消一轮：排队中的直接撤回；正在执行的会中止节点上的回合。 */
     cancelTurn: (jobId: string, turnId: string) => post<CenterTurn>(`/api/jobs/${id(jobId)}/turns/${id(turnId)}/cancel`),
     closeConversation: (jobId: string) => post<{ id: string; status: string }>(`/api/jobs/${id(jobId)}/close`),
+    closeConversationTask: (jobId: string, taskId: string) =>
+      post<{ job_id: string; task_id: string; status: string; closed: boolean }>(`/api/jobs/${id(jobId)}/conversations/${id(taskId)}/close`),
     /**
      * 订阅对话的实时流（GET /api/jobs/:id/stream）。返回关闭函数。
      * 不自动重连：重连策略（退避、结束后不再连）由调用方决定。
      */
-    stream(jobId: string, handlers: StreamHandlers, intervalMs = 300): () => void {
+    board: createBoardClient(base, headers, doFetch, request, options.directFileLinks ?? (!options.token && !options.headers && !options.line)),
+    stream(jobId: string, handlers: StreamHandlers, intervalMs = 300, taskId?: string | null): () => void {
       const ctl = new AbortController();
       let stopped = false;
       // 心跳看门狗：center 每 20 秒发一次 `: ping`。代理 / 负载均衡在上游断掉时可能把连接挂着不关，
@@ -169,7 +233,7 @@ export function createCenterClient(options: CenterClientOptions = {}): Conversat
       }, 5_000);
       void (async () => {
         try {
-          const response = await doFetch(`${base}/api/jobs/${id(jobId)}/stream?interval_ms=${intervalMs}`, {
+          const response = await doFetch(`${base}/api/jobs/${id(jobId)}/stream?interval_ms=${intervalMs}${taskId ? `&task=${id(taskId)}` : ""}`, {
             headers: headers({ Accept: "text/event-stream" }),
             signal: ctl.signal,
           });
@@ -228,3 +292,150 @@ export function firstLine(text: string, max = 40) {
   const line = text.split("\n").map((value) => value.trim()).find(Boolean) ?? "新对话";
   return line.length > max ? `${line.slice(0, max)}…` : line;
 }
+
+/** 读一条 SSE（fetch 读流，能带鉴权头），按事件名回调。返回停止函数。 */
+function openSse(
+  doFetch: typeof fetch,
+  url: string,
+  headers: Record<string, string>,
+  onEvent: (event: string, data: unknown) => void,
+  onClose?: (error: CenterError | null) => void,
+): () => void {
+  const ctl = new AbortController();
+  // 静默看门狗：center 每 20 秒发一次心跳，超过 STREAM_SILENCE_MS 什么都没收到（网络静默断开、代理挂住）就当断线。
+  let silent = false;
+  let watchdog: ReturnType<typeof setTimeout> | undefined;
+  let reader: ReadableStreamDefaultReader<Uint8Array> | null = null;
+  const arm = () => {
+    if (watchdog) clearTimeout(watchdog);
+    // 同时取消读取：宿主自定义的 fetch 不一定理会 signal。
+    watchdog = setTimeout(() => { silent = true; ctl.abort(); void reader?.cancel().catch(() => undefined); }, STREAM_SILENCE_MS);
+  };
+  void (async () => {
+    try {
+      arm();
+      const response = await doFetch(url, { headers: { ...headers, Accept: "text/event-stream" }, signal: ctl.signal });
+      if (!response.ok || !response.body) {
+        const body = (await response.json().catch(() => null)) as { error?: string; detail?: string } | null;
+        throw new CenterError(body?.detail ?? ERROR_TEXT[body?.error ?? ""] ?? `连接失败（HTTP ${response.status}）`, body?.error ?? `HTTP_${response.status}`, response.status);
+      }
+      const parser = createSseParser(({ event, data }) => {
+        try { onEvent(event, JSON.parse(data)); } catch { /* 不是 JSON 的忽略 */ }
+      });
+      reader = response.body.getReader();
+      const decoder = new TextDecoder();
+      for (;;) {
+        const { done, value } = await reader.read();
+        if (done) break;
+        arm();
+        parser.push(decoder.decode(value, { stream: true }));
+      }
+      parser.end();
+      if (watchdog) clearTimeout(watchdog);
+      if (silent) { onClose?.(new CenterError("连接长时间没有数据，已断开重连", "NETWORK", 0)); return; }
+      if (!ctl.signal.aborted) onClose?.(null);
+    } catch (error) {
+      if (watchdog) clearTimeout(watchdog);
+      if (silent) { onClose?.(new CenterError("连接长时间没有数据，已断开重连", "NETWORK", 0)); return; }
+      if (ctl.signal.aborted) return;
+      onClose?.(error instanceof CenterError ? error : new CenterError(String(error), "NETWORK", 0));
+    }
+  })();
+  return () => { if (watchdog) clearTimeout(watchdog); ctl.abort(); void reader?.cancel().catch(() => undefined); };
+}
+
+/** 看板请求的对象：对话键 → 对话任务 + 子任务（「新开」的占位不算，看对话任务缺省的那个）。 */
+function boardTarget(key: string) {
+  const { jobId, taskId } = parseConvKey(key);
+  return { job: encodeURIComponent(jobId), task: taskId && taskId !== NEW_TASK ? encodeURIComponent(taskId) : null };
+}
+
+/**
+ * 相对路径 → 路径式地址（各段编码）；绝对路径 / ~ 开头 → ?path=。jobId 可以是对话键：
+ * 指定了子任务时路径式地址带上它（/tasks/<子任务>/files/raw/…），HTML 里的相对资源也落在同一个对话上。
+ */
+export function boardFileUrl(base: string, jobId: string, path: string, download = false) {
+  const { job: id, task } = boardTarget(jobId);
+  const clean = path.replace(/^\.\//, "");
+  const absolute = clean.startsWith("/") || clean.startsWith("~") || /^[a-z]:[\\/]/i.test(clean);
+  if (absolute) return `${base}/api/jobs/${id}/files/raw?path=${encodeURIComponent(clean)}${task ? `&task=${task}` : ""}${download ? "&download=1" : ""}`;
+  const segs = clean.split("/").filter(Boolean).map(encodeURIComponent).join("/");
+  return `${base}/api/jobs/${id}${task ? `/tasks/${task}` : ""}/files/raw/${segs}${download ? "?download=1" : ""}`;
+}
+
+/** 看板接口地址：/api/jobs/<job>/<rest>，指定了子任务时加 task 参数。 */
+function boardPath(key: string, rest: string, query = "") {
+  const { job, task } = boardTarget(key);
+  const params = [query, task ? `task=${task}` : ""].filter(Boolean).join("&");
+  return `/api/jobs/${job}/${rest}${params ? `?${params}` : ""}`;
+}
+
+function createBoardClient(
+  base: string,
+  headers: (extra?: Record<string, string>) => Record<string, string>,
+  doFetch: typeof fetch,
+  request: <T>(path: string, init?: RequestInit) => Promise<T>,
+  directLinks: boolean,
+): BoardBackend {
+  const fileFetch = async (jobId: string, path: string) => {
+    let response: Response;
+    try {
+      response = await doFetch(boardFileUrl(base, jobId, path), { headers: headers() });
+    } catch (error) {
+      throw new CenterError(`连不上任务中心：${error instanceof Error ? error.message : String(error)}`, "NETWORK", 0);
+    }
+    if (!response.ok) {
+      const body = (await response.json().catch(() => null)) as { error?: string; detail?: string } | null;
+      throw new CenterError(body?.detail ?? ERROR_TEXT[body?.error ?? ""] ?? body?.error ?? `读取失败（HTTP ${response.status}）`, body?.error ?? `HTTP_${response.status}`, response.status);
+    }
+    return response;
+  };
+  return {
+    directLinks,
+    info: (jobId) => request<BoardInfo>(boardPath(jobId, "board")),
+    stat: (jobId, path = ".") => request<DirListing | FileInfo>(boardPath(jobId, "files", `path=${encodeURIComponent(path)}`)),
+    fileUrl: (jobId, path, opts = {}) => boardFileUrl(base, jobId, path, opts.download),
+    async readText(jobId, path, maxBytes = 512 * 1024) {
+      const response = await fileFetch(jobId, path);
+      const contentType = response.headers.get("content-type") ?? "";
+      const size = Number(response.headers.get("content-length") ?? 0);
+      // 只读前 maxBytes：大文件不整个拉进浏览器。
+      const reader = response.body?.getReader();
+      if (!reader) return { text: await response.text(), truncated: false, size, contentType };
+      const chunks: Uint8Array[] = [];
+      let got = 0;
+      let truncated = false;
+      for (;;) {
+        const { done, value } = await reader.read();
+        if (done) break;
+        chunks.push(value);
+        got += value.length;
+        if (got >= maxBytes) { truncated = true; await reader.cancel().catch(() => undefined); break; }
+      }
+      const all = new Uint8Array(Math.min(got, maxBytes));
+      let offset = 0;
+      for (const chunk of chunks) {
+        const take = Math.min(chunk.length, all.length - offset);
+        all.set(chunk.subarray(0, take), offset);
+        offset += take;
+        if (offset >= all.length) break;
+      }
+      return { text: new TextDecoder().decode(all), truncated, size: size || got, contentType };
+    },
+    readBuffer: async (jobId, path) => (await fileFetch(jobId, path)).arrayBuffer(),
+    diff: (jobId) => request<DiffResult>(boardPath(jobId, "diff")),
+    browserStatus: (jobId) => request<BrowserStatus>(boardPath(jobId, "browser")),
+    browserAction: (jobId, action) => request<BrowserStatus>(boardPath(jobId, "browser"), { method: "POST", body: JSON.stringify({ action }) }),
+    browserEvents: (jobId, handlers) => openSse(doFetch, `${base}${boardPath(jobId, "browser/events")}`, headers(), (event, data) => {
+      if (event === "status") handlers.onStatus(data as BrowserStatus);
+    }, handlers.onClose),
+    browserFrames: (jobId, handlers) => openSse(doFetch, `${base}${boardPath(jobId, "browser/frames")}`, headers(), (event, data) => {
+      if (event === "viewer") handlers.onViewer((data as { viewer: string }).viewer);
+      else if (event === "message") handlers.onMessage(data as BrowserMessage);
+      else if (event === "end") handlers.onEnd?.(data as { reason: string; detail?: string });
+    }, handlers.onClose),
+    async browserInput(jobId, viewer, events) {
+      await request(boardPath(jobId, "browser/input"), { method: "POST", body: JSON.stringify({ viewer, events }) });
+    },
+  };
+}

package/src/core/config.ts

@@ -150,6 +150,8 @@ export interface CliMsgListConfig {
     activity?: boolean;
     /** 「N 轮对话」。 */
     turns?: boolean;
+    /** 「+」按钮：在这个任务（对话任务）里新开一个对话，共用同一个工作区。 */
+    newInJob?: boolean;
   };
   /** 分组标题；写 false 隐藏这一组。 */
   groups?: { needs?: string | false; active?: string | false; done?: string | false; cancelled?: string | false };
@@ -162,7 +164,7 @@ export interface ResolvedMsgListConfig {
   header: { show: boolean; title: boolean; newButton: boolean; newButtonText: string; refresh: boolean; context: boolean };
   search: boolean | "auto";
   searchPlaceholder: string;
-  card: { status: boolean; agent: boolean; description: boolean; activity: boolean; turns: boolean };
+  card: { status: boolean; agent: boolean; description: boolean; activity: boolean; turns: boolean; newInJob: boolean };
   groups: { needs: string | false; active: string | false; done: string | false; cancelled: string | false };
   emptyTitle: string;
   emptyDescription: string;
@@ -172,7 +174,7 @@ export const DEFAULT_MSGLIST_CONFIG: ResolvedMsgListConfig = {
   header: { show: true, title: true, newButton: true, newButtonText: "对话", refresh: true, context: true },
   search: "auto",
   searchPlaceholder: "搜索对话…",
-  card: { status: true, agent: true, description: true, activity: true, turns: true },
+  card: { status: true, agent: true, description: true, activity: true, turns: true, newInJob: true },
   groups: { needs: "需要你处理", active: "进行中", done: "已结束", cancelled: "已取消" },
   emptyTitle: "还没有对话",
   emptyDescription: "点「对话」开始一个新的对话。",

package/src/core/conversation.ts

@@ -6,13 +6,41 @@
  *   · 节点转录（transcript + node 事件）：Agent 实际的对话过程，规则与 Operator 的 useTaskStream 一致。
  * 界面以节点转录为主；转录还没有（没派发、节点连不上）时用轮次的 input / reply 兜底。
  */
-import type { AskAnswers, AskQuestion, CenterTurn, ConversationClosedCallback, ConversationTurnCallback, JobStatus, Message, Msg, NodeEvent, StreamItem, StreamSnapshot, ToolData, TurnUsage } from "./types.js";
+import type { AskAnswers, AskQuestion, CenterTurn, ConversationClosedCallback, ConversationTurnCallback, JobStatus, Message, Msg, NodeEvent, StreamItem, StreamSnapshot, StreamTask, ToolData, TurnUsage } from "./types.js";
 import { indexFromEnd, mergeSnapshot, toolDataOf } from "../ui/transcriptModel.js";
 import { formatAnswersText } from "../ui/format.js";
 
 export const TERMINAL_TURN = new Set(["succeeded", "failed", "cancelled", "merged"]);
 export const ACTIVE_TURN = new Set(["queued", "dispatching", "running"]);
 export const TERMINAL_JOB = new Set(["succeeded", "failed", "cancelled"]);
+
+// ── 对话键 ─────────────────────────────────────────────
+//
+// 一个对话任务（job）里可以有几个对话（几个子任务，各自一个 Agent 会话，共用节点和工作区）。
+// 组件里「一个对话」用对话键标识：
+//   · "job_x"            对话任务的第一个对话（只有一个对话时就是它，和以前一样）；
+//   · "job_x#task_y"     对话任务里的某个对话；
+//   · "job_x#new"        在这个对话任务里新开一个对话（还没发第一条消息）。
+
+/** 「在这个对话任务里新开一个对话」的子任务占位。 */
+export const NEW_TASK = "new";
+
+export function convKey(jobId: string, taskId?: string | null): string {
+  return taskId ? `${jobId}#${taskId}` : jobId;
+}
+
+export function parseConvKey(key: string): { jobId: string; taskId: string | null } {
+  const at = key.indexOf("#");
+  return at < 0 ? { jobId: key, taskId: null } : { jobId: key.slice(0, at), taskId: key.slice(at + 1) || null };
+}
+
+/** 对话键里的真实子任务（「新开」的占位不算）。 */
+export function taskOfKey(key: string): string | null {
+  const { taskId } = parseConvKey(key);
+  return taskId && taskId !== NEW_TASK ? taskId : null;
+}
+
+export const isNewInJob = (key: string | null | undefined) => !!key && parseConvKey(key).taskId === NEW_TASK;
 /** Operator 首轮固定的启动语句：正文其实在任务描述里（= 中枢第 1 轮的 input）。 */
 export const OPERATOR_INITIAL_PROMPT = "Start working on the task described in the task context.";
 
@@ -24,8 +52,14 @@ export interface ConvJob {
 }
 
 export interface ConvState {
+  /** 对话键（见 convKey）。 */
+  key: string;
   jobId: string;
+  /** 对话键里指定的子任务；只有 job_id 时为 null（看第一个对话）。 */
+  taskId: string | null;
   job: ConvJob | null;
+  /** 实时流看的这个对话（子任务）的状态；关闭了 closed=true。旧版 center 没有。 */
+  task: StreamTask | null;
   /** 中枢轮次，按 seq 升序。 */
   turns: CenterTurn[];
   /** 节点转录（Operator 消息）。 */
@@ -38,13 +72,14 @@ export interface ConvState {
   stream: "idle" | "connecting" | "live" | "reconnecting" | "ended" | "error";
   streamError: string | null;
   endReason: string | null;
+  /** 接续这个对话的新对话的键（对话任务结束后再发消息开出来的）。 */
   continuedBy: string | null;
   /** 本页提交过的提问回答（askId → 答案）。节点上那一轮已被中枢结束，不会回 ask_answered，只能本地记。 */
   localAnswers: Record<string, AskAnswers>;
 }
 
-export const emptyConv = (jobId: string): ConvState => ({
-  jobId, job: null, turns: [], msgs: [], hasTranscript: false, nodeRunning: false, resolvedModel: null,
+export const emptyConv = (key: string): ConvState => ({
+  key, ...parseConvKey(key), job: null, task: null, turns: [], msgs: [], hasTranscript: false, nodeRunning: false, resolvedModel: null,
   liveUsage: { fresh: 0, cacheRead: 0 }, stream: "idle", streamError: null, endReason: null, continuedBy: null, localAnswers: {},
 });
 
@@ -55,17 +90,30 @@ export function upsertTurns(turns: CenterTurn[], incoming: CenterTurn[]): Center
   return [...byId.values()].sort((a, b) => a.seq - b.seq);
 }
 
+/**
+ * 只补上还不认识的轮次（发消息 / 撤回的接口响应用）。接口响应是请求那一刻的快照，可能比实时流晚到：
+ * 实时流已经报了「执行中 / 已结束」，再拿响应里的「排队中」去盖，这一轮就会一直显示排队（之后也不会再有更新）。
+ * 已有的轮次只认实时流——状态可能合法地往回走（节点忙时中枢会把派发中的轮次放回队列），不能按状态大小判断新旧。
+ */
+export function addTurnsIfAbsent(turns: CenterTurn[], incoming: CenterTurn[]): CenterTurn[] {
+  const known = new Set(turns.map((turn) => turn.turn_id));
+  const fresh = incoming.filter((turn) => !known.has(turn.turn_id));
+  return fresh.length ? upsertTurns(turns, fresh) : turns;
+}
+
 export function applySnapshot(conv: ConvState, snapshot: StreamSnapshot): ConvState {
   const { job } = snapshot;
   return {
     ...conv,
     job: { status: job.status, closed_reason: job.closed_reason, node_id: job.node_id, title: job.title },
+    task: snapshot.task ?? conv.task,
     turns: upsertTurns([], snapshot.turns),
     resolvedModel: conv.resolvedModel ?? job.conversation?.last_turn?.resolved_model ?? null,
   };
 }
 
-const toMsg = (m: Message): Msg => ({ id: m.id, role: m.role, content: m.content, generation: m.generation, ts: m.created_at });
+// 缺字段时兜底：generation 缺省 1（按它分会话，缺了会把顺序排乱）；时间缺就不显示。
+const toMsg = (m: Message): Msg => ({ id: m.id, role: m.role, content: m.content, generation: typeof m.generation === "number" ? m.generation : 1, ...(typeof m.created_at === "number" ? { ts: m.created_at } : {}) });
 
 export function applyItems(conv: ConvState, items: StreamItem[]): ConvState {
   let next = conv;
@@ -77,9 +125,15 @@ export function applyItems(conv: ConvState, items: StreamItem[]): ConvState {
     } else if (item.type === "node") {
       next = applyNodeEvent(next, item.event);
     } else if (item.type === "turn") {
-      next = { ...next, turns: upsertTurns(next.turns, [item.turn]), resolvedModel: item.turn.resolved_model ?? next.resolvedModel };
+      const turns = upsertTurns(next.turns, [item.turn]);
+      // 中枢只在节点上的回合真的停下后才把执行过的一轮收尾，所以一轮结束、又没有别的轮次在排队或执行时，
+      // 节点一定没在跑了——不只靠节点的 turn_end 事件（重连的空档里可能错过，界面就会一直显示「运行中」）。
+      const settled = TERMINAL_TURN.has(item.turn.status) && !turns.some((turn) => ACTIVE_TURN.has(turn.status));
+      next = { ...next, turns, resolvedModel: item.turn.resolved_model ?? next.resolvedModel, ...(settled ? { nodeRunning: false } : {}) };
     } else if (item.type === "job") {
       next = { ...next, job: { ...next.job, status: item.job.status, closed_reason: item.job.closed_reason, node_id: item.job.node_id } };
+    } else if (item.type === "task") {
+      next = { ...next, task: item.task };
     }
   }
   return next;
@@ -167,6 +221,9 @@ export function applyNodeEvent(conv: ConvState, ev: NodeEvent): ConvState {
   }
 }
 
+/** 这个对话结束了：整个对话任务结束，或者只是这一个对话被关闭。 */
+export const convEnded = (conv: Pick<ConvState, "job" | "task">) => !!conv.task?.closed || (!!conv.job && TERMINAL_JOB.has(conv.job.status));
+
 /** 正在执行的那一轮（派发中或执行中）。 */
 export const runningTurn = (conv: ConvState) => conv.turns.find((turn) => turn.status === "running" || turn.status === "dispatching") ?? null;
 
@@ -183,13 +240,20 @@ export function viewMessages(conv: ConvState): Msg[] {
   // 有节点消息就以节点为准：通常先收到全量转录，但新对话可能先来增量事件（user / assistant / tool），也算。
   if (conv.msgs.length) {
     // 节点转录只有当前这个 Operator 会话：它的开场是固定的启动语句，正文其实是开出这个会话的那一轮——
-    // 第 1 轮，或者节点会话重建过（context_reset）时最近重建的那一轮。
-    const opener = [...conv.turns].reverse().find((turn) => turn.context_reset && turn.started_at) ?? conv.turns.find((turn) => turn.seq === 1);
+    // 这个对话的第一轮，或者节点会话重建过（context_reset）时最近重建的那一轮。
+    // 轮次号在整个对话任务里统一编号：对话任务里后开的对话，第一轮不是 1，取这个对话最早的那一轮。
+    const opener = [...conv.turns].reverse().find((turn) => turn.context_reset && turn.started_at) ?? conv.turns[0];
+    // 认开场语句：Operator 一个会话的第一条用户消息总是固定的启动语句（忽略请求正文），所以按位置认——
+    // 转录里的第一条用户消息、内容又不是开出会话那一轮的原文，就是它；措辞以后变了也认得出。
+    // 之后的消息里再出现这句固定语句（例如会话被重启），按原文匹配。
+    const openerText = opener ? opener.sent_input ?? opener.input : null;
     let replaced = false;
     for (const m of conv.msgs) {
-      if (!replaced && m.role === "user" && m.content.trim() === OPERATOR_INITIAL_PROMPT && opener) {
-        replaced = true;
-        out.push({ ...m, content: opener.sent_input ?? opener.input });
+      const firstUser = !replaced && m.role === "user";
+      if (firstUser) replaced = true;
+      if (openerText && m.role === "user" && m.content.trim() !== openerText.trim()
+        && ((firstUser && m.id === conv.msgs.find((x) => x.role === "user")?.id) || m.content.trim() === OPERATOR_INITIAL_PROMPT)) {
+        out.push({ ...m, content: openerText });
       } else out.push(m);
     }
   } else {
@@ -212,7 +276,9 @@ export function viewMessages(conv: ConvState): Msg[] {
     const ts = new Date(turn.ended_at ?? turn.created_at).getTime();
     const reason = turn.last_error ? `：${describeTurnError(turn.last_error)}` : "";
     if ((turn.status === "failed" || turn.status === "cancelled") && !turn.started_at) {
-      notices.push({ id: `turn-fail-${turn.turn_id}`, role: "system", content: `⚠ 第 ${turn.seq} 条消息${turn.status === "cancelled" ? "已撤回" : "没有执行"}${reason}`, generation, ts });
+      // 用户自己撤回的不用再写原因（「已撤回：已取消」是同一件事）；中枢取消的（例如对话结束时还在排队）写明原因。
+      const byCaller = turn.status === "cancelled" && /cancelled by caller/i.test(turn.last_error ?? "");
+      notices.push({ id: `turn-fail-${turn.turn_id}`, role: "system", content: `⚠ 第 ${turn.seq} 条消息${turn.status === "cancelled" ? "已撤回" : "没有执行"}${byCaller ? "" : reason}`, generation, ts });
     } else if (turn.status === "failed") {
       notices.push({ id: `turn-fail-${turn.turn_id}`, role: "system", content: `⚠ 这一轮没有完成${reason}`, generation, ts });
     }
@@ -362,8 +428,10 @@ export function closedCallback(conv: ConvState): ConversationClosedCallback {
     mode: "conversation",
     callback_seq: turns + 1,
     job_id: conv.jobId,
-    status: conv.job?.status ?? "succeeded",
-    closed_reason: conv.job?.closed_reason ?? null,
+    // 只关掉了这一个对话（对话任务还开着）：带上是哪个，原因写 conversation_closed。
+    ...(conv.task?.closed && !TERMINAL_JOB.has(conv.job?.status ?? "") ? { task_id: conv.task.id } : {}),
+    status: conv.task?.closed && !TERMINAL_JOB.has(conv.job?.status ?? "") ? "succeeded" : conv.job?.status ?? "succeeded",
+    closed_reason: conv.task?.closed && !TERMINAL_JOB.has(conv.job?.status ?? "") ? "conversation_closed" : conv.job?.closed_reason ?? null,
     turns,
     continued_by_job_id: conv.continuedBy,
     occurred_at: new Date().toISOString(),

package/src/core/provider.tsx

@@ -1,6 +1,6 @@
 import { createContext, useContext, useEffect, useMemo, useRef, useSyncExternalStore, type ReactNode } from "react";
 import { createCliStore, type CliEvent, type CliState, type CliStore, type CliStoreOptions } from "./store.js";
-import type { ConversationCallback } from "./types.js";
+import type { ConversationCallback, ConversationEndPayload, TurnEndPayload } from "./types.js";
 
 /**
  * 积木的拼接点。放在同一个 <CliCenterProvider> 里的组件共享一个仓库：
@@ -15,30 +15,43 @@ import type { ConversationCallback } from "./types.js";
  */
 const StoreContext = createContext<CliStore | null>(null);
 
-export interface CliCenterProviderProps extends CliStoreOptions {
+export interface CliCenterProviderProps extends CliStoreOptions, ResultHandlers {
   /** 外部建好的仓库（例如 Web Component 按 group 共享的）；给了就不再自己建。 */
   store?: CliStore;
   /** 监听仓库事件：选中、一轮结束、对话结束、job 变化、错误。 */
   onEvent?: (event: CliEvent) => void;
-  /**
-   * 前端回调：每轮结束 / 对话结束时调用，载荷与 center 投递给 callback.url 的请求体同名同义
-   * （conversation_turn / conversation_closed）。用来刷新业务界面；落库以后端回调为准。
-   */
-  onCallback?: (payload: ConversationCallback) => void;
   children: ReactNode;
 }
 
-export function CliCenterProvider({ store: external, onEvent, onCallback, children, ...options }: CliCenterProviderProps) {
+/**
+ * 结果通知：组件从实时流里看到一轮结束 / 对话结束时调用，全在浏览器里发生，**和 center 的 callback.url 无关**——
+ * 不配 callback 也照样会调。载荷字段与 center 回调体一致，方便业务后端和前端用同一套代码解析。
+ */
+export interface ResultHandlers {
+  /** 一轮结束（成功 / 失败 / 取消）。 */
+  onTurnEnd?: (payload: TurnEndPayload) => void;
+  /** 对话结束（关闭 / 取消 / 过期……）。 */
+  onConversationEnd?: (payload: ConversationEndPayload) => void;
+  /** @deprecated 旧名字，等同于同时监听 onTurnEnd 和 onConversationEnd（payload.type 区分）。 */
+  onCallback?: (payload: ConversationCallback) => void;
+}
+
+export function dispatchResult(event: CliEvent, handlers: ResultHandlers) {
+  if (event.type === "conversation_turn") { handlers.onTurnEnd?.(event.payload); handlers.onCallback?.(event.payload); }
+  else if (event.type === "conversation_closed") { handlers.onConversationEnd?.(event.payload); handlers.onCallback?.(event.payload); }
+}
+
+export function CliCenterProvider({ store: external, onEvent, onTurnEnd, onConversationEnd, onCallback, children, ...options }: CliCenterProviderProps) {
   // 连接参数只在建仓库时用一次：中途换 baseUrl / token 请换 key 重建。
   const optionsRef = useRef(options);
   const store = useMemo(() => external ?? createCliStore(optionsRef.current), [external]);
   const onEventRef = useRef(onEvent);
   onEventRef.current = onEvent;
-  const onCallbackRef = useRef(onCallback);
-  onCallbackRef.current = onCallback;
+  const resultRef = useRef<ResultHandlers>({});
+  resultRef.current = { onTurnEnd, onConversationEnd, onCallback };
   useEffect(() => store.on((event) => {
     onEventRef.current?.(event);
-    if (event.type === "conversation_turn" || event.type === "conversation_closed") onCallbackRef.current?.(event.payload);
+    dispatchResult(event, resultRef.current);
   }), [store]);
   return <StoreContext.Provider value={store}>{children}</StoreContext.Provider>;
 }
@@ -60,30 +73,31 @@ export function useCliState<T>(selector: (state: CliState) => T): T {
 }
 
 /** 组件外面没有 Provider 时，用组件自己的 props 包一层。 */
-export function withOwnProvider<P extends object>(props: P & CliStoreOptions & { onEvent?: (event: CliEvent) => void; onCallback?: (payload: ConversationCallback) => void; store?: CliStore }, inner: ReactNode, hasContext: boolean) {
+export function withOwnProvider<P extends object>(props: P & CliStoreOptions & ResultHandlers & { onEvent?: (event: CliEvent) => void; store?: CliStore }, inner: ReactNode, hasContext: boolean) {
   if (hasContext) return inner;
-  const { baseUrl, token, line, headers, fetch, client, namespace, newConversation, createConversation, businessIdFor, onEvent, onCallback, store } = props;
+  const { baseUrl, token, line, headers, fetch, client, namespace, newConversation, createConversation, businessIdFor, onEvent, onTurnEnd, onConversationEnd, onCallback, store } = props;
   // 连接参数变了（换了中枢地址、令牌、产品线、命名空间）就换一个新仓库重连，不沿用旧连接。
   const connection = [baseUrl ?? "", token ?? "", line ?? "", namespace ?? ""].join("\u0000");
   return (
-    <CliCenterProvider key={store ? "external" : connection} {...{ baseUrl, token, line, headers, fetch, client, namespace, newConversation, createConversation, businessIdFor, onEvent, onCallback, store }}>
+    <CliCenterProvider key={store ? "external" : connection} {...{ baseUrl, token, line, headers, fetch, client, namespace, newConversation, createConversation, businessIdFor, onEvent, onTurnEnd, onConversationEnd, onCallback, store }}>
       {inner}
     </CliCenterProvider>
   );
 }
 
 /**
- * 组件自己的 onEvent / onCallback：组件放在外层 Provider 里时由这里订阅（自己建 Provider 时交给那个 Provider，免得调两次）。
+ * 组件自己的 onEvent / onTurnEnd / onConversationEnd：组件放在外层 Provider 里时由这里订阅
+ * （自己建 Provider 时交给那个 Provider，免得调两次）。
  */
-export function useComponentEvents(onEvent: ((event: CliEvent) => void) | undefined, onCallback: ((payload: ConversationCallback) => void) | undefined, enabled: boolean) {
+export function useComponentEvents(onEvent: ((event: CliEvent) => void) | undefined, results: ResultHandlers, enabled: boolean) {
   const store = useContext(StoreContext);
-  const ref = useRef({ onEvent, onCallback });
-  ref.current = { onEvent, onCallback };
+  const ref = useRef({ onEvent, results });
+  ref.current = { onEvent, results };
   useEffect(() => {
     if (!enabled || !store) return;
     return store.on((event) => {
       ref.current.onEvent?.(event);
-      if (event.type === "conversation_turn" || event.type === "conversation_closed") ref.current.onCallback?.(event.payload);
+      dispatchResult(event, ref.current.results);
     });
   }, [store, enabled]);
 }