@spzxg/cli-ui 0.4.0 → 0.6.1

package/src/board/workspace.ts

@@ -0,0 +1,129 @@
+/**
+ * 给业务方的工作区接口：不显示看板也能拿到任务产出的文件。
+ *
+ *   const ws = store.workspace("job_xxx");        // 不传 = 当前选中的对话；Web Component：el.workspace()
+ *   await ws.listAll();                            // 工作区里所有文件（递归）
+ *   await ws.readText("reports/报告.md");          // 读成文字
+ *   await ws.readFile("reports/图.png");           // 读成 Blob（可以自己上传）
+ *   await ws.zip("reports");                       // 打成 ZIP 的 Blob
+ *   await ws.download("reports/报告.md");          // 下载到用户本地；ws.downloadFolder("reports") 打包下载
+ *   ws.openFile();                                 // 看板上正在看的文件（没有看板 / 没打开文件时为 null）
+ *
+ * 数据都经中枢读执行节点（和看板一样），弱网时按网络错误（CenterError，code = "NETWORK"）失败，可以重试。
+ */
+import type { BoardBackend } from "../core/client.js";
+import type { BoardInfo, FileEntry } from "../core/types.js";
+import { directFileUrl, downloadFile, mimeOf } from "./fileOps.js";
+import { fmtSize } from "./fileKind.js";
+import { downloadFolder, listFolder, zipFolder, type FolderOptions, type FolderResult, type FolderZip } from "./folderDownload.js";
+
+/** readText 最多读这么大（更大的用 readFile）。 */
+export const WORKSPACE_TEXT_MAX = 20 * 1024 * 1024;
+/** readFile 最多读这么大进内存（更大的用 fileUrl / download，浏览器流式下载）。 */
+export const WORKSPACE_FILE_MAX = 500 * 1024 * 1024;
+/** listAll 最多列这么多个文件。 */
+export const WORKSPACE_LIST_MAX = 10_000;
+
+/** 看板现在的样子（看板组件报告给仓库；没有看板时没有）。 */
+export interface BoardView {
+  /** 当前页签：files / changes / browser、"file:<路径>"（打开的文件）或自己加的页签 id。 */
+  tab: string;
+  /** 文件列表所在目录（"" = 工作区根目录）。 */
+  dir: string;
+  /** 正在看的文件（当前页签是文件时），否则 null。 */
+  file: string | null;
+  /** 开着的文件页签。 */
+  files: string[];
+}
+
+export interface CliWorkspace {
+  /** 这个工作区属于哪个对话（对话键）。 */
+  readonly jobId: string;
+  /** 看板概况：派发到节点没有、节点是否在线、有没有浏览器。 */
+  info(): Promise<BoardInfo>;
+  /** 列一个目录（不递归）。 */
+  list(dir?: string): Promise<FileEntry[]>;
+  /** 列 dir 下所有文件（递归，只含文件）。 */
+  listAll(dir?: string, opts?: { signal?: AbortSignal }): Promise<FileEntry[]>;
+  /** 读成文字（GBK 导出的文件会自动转码）。 */
+  readText(path: string): Promise<string>;
+  /** 读成 Blob。onProgress 报已收到的字节数；超过 maxBytes（缺省 500 MB）报错，改用 fileUrl / download。 */
+  readFile(path: string, opts?: { signal?: AbortSignal; onProgress?: (bytes: number) => void; maxBytes?: number }): Promise<Blob>;
+  /** 浏览器能直接打开 / 下载的地址（没有同源代理时是 30 分钟有效的短期链接）；接入方式不支持时为 null，改用 readFile。 */
+  fileUrl(path: string, opts?: { download?: boolean }): Promise<string | null>;
+  /** 下载一个文件到用户本地。 */
+  download(path: string): Promise<void>;
+  /** 把目录打包成 ZIP 下载到用户本地（"" = 整个工作区）。 */
+  downloadFolder(dir?: string, opts?: FolderOptions): Promise<FolderResult>;
+  /** 把目录打成 ZIP，返回 Blob，不下载。 */
+  zip(dir?: string, opts?: FolderOptions): Promise<FolderZip>;
+  /** 看板上正在看的文件；没有看板或没打开文件时为 null。 */
+  openFile(): string | null;
+  /** 看板上开着的所有文件页签。 */
+  openFiles(): string[];
+  /** 在看板里打开这个文件（没有看板接时返回 false）。 */
+  open(path: string): boolean;
+}
+
+export function createWorkspace(deps: {
+  backend: BoardBackend | undefined;
+  key: string;
+  view: () => BoardView | undefined;
+  open: (path: string) => boolean;
+}): CliWorkspace {
+  const { key } = deps;
+  const backend = () => {
+    if (!deps.backend) throw new Error("当前后端不支持读取工作区文件（需要任务中心的看板接口）");
+    return deps.backend;
+  };
+  const clean = (path: string) => path.replace(/^\.\//, "").replace(/\/+$/, "");
+  return {
+    jobId: key,
+    info: () => backend().info(key),
+    async list(dir = "") {
+      const res = await backend().stat(key, clean(dir) || ".");
+      if (res.type !== "dir") throw new Error(`「${dir}」不是目录`);
+      return res.entries;
+    },
+    async listAll(dir = "", opts = {}) {
+      const files = await listFolder(backend(), key, clean(dir), { signal: opts.signal, maxFiles: WORKSPACE_LIST_MAX, maxBytes: Infinity });
+      return files.map((f) => ({ name: f.path.split("/").pop() || f.path, path: f.path, type: "file" as const, size: f.size, mtime: f.mtime }));
+    },
+    async readText(path) {
+      const r = await backend().readText(key, clean(path), WORKSPACE_TEXT_MAX);
+      if (r.truncated) throw new Error(`文件较大（超过 ${WORKSPACE_TEXT_MAX / 1024 / 1024} MB），请用 readFile 读成 Blob`);
+      return r.text;
+    },
+    async readFile(path, opts = {}) {
+      const p = clean(path);
+      // 太大的读到一半就停：整个读进内存会把页面撑爆。
+      const ctl = new AbortController();
+      const stop = () => ctl.abort();
+      opts.signal?.addEventListener("abort", stop, { once: true });
+      let tooBig = false;
+      const max = opts.maxBytes ?? WORKSPACE_FILE_MAX;
+      try {
+        const buffer = await backend().readBuffer(key, p, {
+          signal: ctl.signal,
+          onBytes: (n) => { if (n > max) { tooBig = true; ctl.abort(); } else opts.onProgress?.(n); },
+        });
+        return new Blob([buffer], { type: mimeOf(p) });
+      } catch (error) {
+        if (tooBig) throw new Error(`文件超过 ${fmtSize(max)}，请用 fileUrl / download（浏览器流式下载，不占内存）`);
+        throw error;
+      } finally {
+        opts.signal?.removeEventListener("abort", stop);
+      }
+    },
+    async fileUrl(path, opts = {}) {
+      const url = await directFileUrl(backend(), key, clean(path), opts.download);
+      return url && typeof location !== "undefined" ? new URL(url, location.href).href : url;
+    },
+    download: (path) => downloadFile(backend(), key, clean(path)),
+    downloadFolder: (dir = "", opts) => downloadFolder(backend(), key, clean(dir), opts),
+    zip: (dir = "", opts) => zipFolder(backend(), key, clean(dir), opts),
+    openFile: () => deps.view()?.file ?? null,
+    openFiles: () => [...(deps.view()?.files ?? [])],
+    open: (path) => deps.open(clean(path)),
+  };
+}

package/src/board/zip.ts

@@ -0,0 +1,85 @@
+// 在浏览器里把几个文件打成 ZIP（只存储、不压缩）：工作区「下载整个文件夹」用。
+// 中枢 / 节点没有打包接口，文件逐个经中枢读回来，在这里拼成一个 ZIP 交给浏览器下载。
+// 不压缩：报告、图片、表格多半已经压缩过，存储模式快、内存只多一份目录表；文件名按 UTF-8 标记（中文名不乱码）。
+// 不支持 ZIP64：调用方限制了总大小（远小于 4 GB）和文件数。
+
+export type ZipEntry = { path: string; data: Uint8Array<ArrayBuffer>; mtime?: number };
+
+const CRC_TABLE = (() => {
+  const t = new Uint32Array(256);
+  for (let n = 0; n < 256; n++) {
+    let c = n;
+    for (let k = 0; k < 8; k++) c = c & 1 ? 0xedb88320 ^ (c >>> 1) : c >>> 1;
+    t[n] = c >>> 0;
+  }
+  return t;
+})();
+
+export function crc32(data: Uint8Array): number {
+  let c = 0xffffffff;
+  for (let i = 0; i < data.length; i++) c = CRC_TABLE[(c ^ data[i]) & 0xff] ^ (c >>> 8);
+  return (c ^ 0xffffffff) >>> 0;
+}
+
+/** DOS 时间 / 日期（ZIP 头里用）。 */
+function dosTime(ms: number | undefined): { time: number; date: number } {
+  const d = new Date(ms && ms > 0 ? ms : Date.now());
+  const year = Math.max(1980, d.getFullYear());
+  return {
+    time: (d.getHours() << 11) | (d.getMinutes() << 5) | Math.floor(d.getSeconds() / 2),
+    date: ((year - 1980) << 9) | ((d.getMonth() + 1) << 5) | d.getDate(),
+  };
+}
+
+export function buildZip(entries: ZipEntry[]): Blob {
+  const enc = new TextEncoder();
+  const parts: BlobPart[] = [];
+  const central: Uint8Array<ArrayBuffer>[] = [];
+  let offset = 0;
+  for (const e of entries) {
+    const name = enc.encode(e.path.replace(/^\/+/, ""));
+    const crc = crc32(e.data);
+    const { time, date } = dosTime(e.mtime);
+    const local = new Uint8Array(30 + name.length);
+    const lv = new DataView(local.buffer);
+    lv.setUint32(0, 0x04034b50, true);
+    lv.setUint16(4, 20, true);
+    lv.setUint16(6, 0x0800, true); // 文件名是 UTF-8
+    lv.setUint16(8, 0, true); // 存储
+    lv.setUint16(10, time, true);
+    lv.setUint16(12, date, true);
+    lv.setUint32(14, crc, true);
+    lv.setUint32(18, e.data.length, true);
+    lv.setUint32(22, e.data.length, true);
+    lv.setUint16(26, name.length, true);
+    local.set(name, 30);
+    parts.push(local, e.data);
+
+    const head = new Uint8Array(46 + name.length);
+    const cv = new DataView(head.buffer);
+    cv.setUint32(0, 0x02014b50, true);
+    cv.setUint16(4, 20, true);
+    cv.setUint16(6, 20, true);
+    cv.setUint16(8, 0x0800, true);
+    cv.setUint16(10, 0, true);
+    cv.setUint16(12, time, true);
+    cv.setUint16(14, date, true);
+    cv.setUint32(16, crc, true);
+    cv.setUint32(20, e.data.length, true);
+    cv.setUint32(24, e.data.length, true);
+    cv.setUint16(28, name.length, true);
+    cv.setUint32(42, offset, true);
+    head.set(name, 46);
+    central.push(head);
+    offset += local.length + e.data.length;
+  }
+  const centralSize = central.reduce((n, c) => n + c.length, 0);
+  const end = new Uint8Array(22);
+  const ev = new DataView(end.buffer);
+  ev.setUint32(0, 0x06054b50, true);
+  ev.setUint16(8, entries.length, true);
+  ev.setUint16(10, entries.length, true);
+  ev.setUint32(12, centralSize, true);
+  ev.setUint32(16, offset, true);
+  return new Blob([...parts, ...central, end], { type: "application/zip" });
+}

package/src/chat/CliChat.tsx

@@ -2,8 +2,10 @@
 // 数据来自 center 的对话任务（mode=conversation）：实时流里的节点转录按 Operator 的规则渲染，
 // 每条消息是中枢的一轮，排队 / 执行 / 结束都跟 center 保持一致。
 import { useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, type CSSProperties } from "react";
+import { CliErrorBoundary } from "../ui/ErrorBoundary.js";
 import type { CliEvent, CliStore, CliStoreOptions } from "../core/store.js";
 import { useCliState, useCliStore, useCliStoreContext, useComponentEvents, withOwnProvider, type ResultHandlers } from "../core/provider.js";
+import { boardContextBlock, serializeBlock, viewingBlock } from "../core/blocks.js";
 import { convKey, emptyConv, isChatTask, isNewInJob, isRunning, parseConvKey, runningTurn, TERMINAL_JOB, viewMessages } from "../core/conversation.js";
 import type { AskAnswers, AskQuestion, Msg } from "../core/types.js";
 import { Icon } from "../ui/icons.js";
@@ -12,7 +14,7 @@ import { AgentBadge, Avatar, Skel, StatusDot, type DotCls } from "../ui/shared.j
 import { HANDOFF_NOTICE_PREFIX, MessageView, SessionBreak, type MessageHandlers } from "../ui/Transcript.js";
 import { RENDER_MAX, RENDER_STEP, RENDER_WINDOW, buildTranscriptItems, hasOpenAsk, toolDataOf } from "../ui/transcriptModel.js";
 import { Composer, type ComposerOptions } from "./Composer.js";
-import { fillTemplate, resolveChatConfig, type CliChatConfig } from "../core/config.js";
+import { fillTemplate, refShown, resolveChatConfig, type CliChatConfig } from "../core/config.js";
 import { exportMarkdown } from "./export.js";
 import { FileLinkContext, FileOpenContext } from "../ui/fileLinks.js";
 import { FileViewer } from "../board/FileViewer.js";
@@ -66,7 +68,7 @@ export interface CliChatProps extends CliStoreOptions, ResultHandlers {
 
 export function CliChat(props: CliChatProps) {
   const ctx = useCliStoreContext();
-  return withOwnProvider(props, <ChatInner {...props} inProvider={!!ctx} />, !!ctx);
+  return <CliErrorBoundary component="cli-chat" theme={props.theme}>{withOwnProvider(props, <ChatInner {...props} inProvider={!!ctx} />, !!ctx)}</CliErrorBoundary>;
 }
 
 // 不能再发消息的结束原因（调用方关闭 / 取消）。其余原因（过期、换线、节点丢失）再发会自动开新对话。
@@ -76,6 +78,9 @@ const REASON_TEXT: Record<string, string> = {
   node_reassigned: "执行机器换到了别的产品线", node_lost: "执行节点长时间连不上",
 };
 
+/** 子任务结束了的状态：可以接着它聊。 */
+const SETTLED_TASK = new Set(["succeeded", "failed", "cancelled"]);
+
 // 一次性任务（含续派）的子任务状态（center TaskStatus）。
 const BATCH_STATUS: Record<string, { dotCls: DotCls; statusText: string }> = {
   succeeded: { dotCls: "g", statusText: "子任务已完成" }, failed: { dotCls: "x", statusText: "子任务失败" }, cancelled: { dotCls: "x", statusText: "子任务已取消" },
@@ -173,7 +178,13 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
   // 例外是对话式子任务（续派时 mode=conversation）：当对话用，随时能接着发（= 续派一条接着它），不显示子任务状态。
   const batch = !!conv?.batch || (!!job && job.mode !== "conversation");
   const chat = !!taskId && isChatTask(conv);
-  const readOnly = !!readOnlyProp || !cfg.composer.show || (batch && !chat);
+  // 普通子任务结束后（完成 / 失败 / 取消）也能接着聊：发出去 = 续派一条接着它的对话式子任务（同一个 Agent 会话、同一个工作区）。
+  // 还在跑的时候输入框照样显示、但不能发，提示结束后再接着聊（需要登录、验证码时在看板的浏览器里接管）。
+  const batchTaskStatus = batch ? conv?.batchTask?.status ?? job?.tasks?.find((t) => t.id === (taskId ?? conv?.task?.id))?.status ?? null : null;
+  const batchSettled = batch && !chat && !!batchTaskStatus && SETTLED_TASK.has(batchTaskStatus) && !!store.client.continueTask;
+  const readOnly = !!readOnlyProp || !cfg.composer.show || (batch && !chat && !batchSettled);
+  // 一次性任务的子任务没结束、不能发时，输入框也露出来（禁用 + 说明），别让人以为没有输入框。
+  const showComposer = !readOnly || (batch && !readOnlyProp && cfg.composer.show);
   // 这个对话对应的子任务：指定了就是它，否则对话任务的第一个（「新开」时借用第一个的智能体显示）；
   // 一次性任务没指定时是实时流挑的那个（最近一个派发过的）。
   const shownTaskId = taskId ?? (batch ? conv?.task?.id : undefined);
@@ -183,9 +194,10 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
   const agentText = labelOf(agent);
   const jobStatus = conv?.job?.status ?? job?.status ?? null;
   // 对话式子任务没有「结束」：大任务结束了，再发一条会重新打开它。
-  const jobEnded = !chat && !!jobStatus && TERMINAL_JOB.has(jobStatus);
+  // 普通子任务结束后能接着聊的（batchSettled）同理：大任务结束不挡输入框。
+  const jobEnded = !chat && !batchSettled && !!jobStatus && TERMINAL_JOB.has(jobStatus);
   // 只关掉了这一个对话（对话任务还开着）：按「这个对话已结束」显示，不能再发消息。
-  const convClosed = !jobEnded && !!(conv?.task?.closed ?? info?.closed);
+  const convClosed = !jobEnded && !batchSettled && !!(conv?.task?.closed ?? info?.closed);
   const status = convClosed ? "succeeded" : jobStatus;
   const closedReason = convClosed ? "conversation_closed" : conv?.job?.closed_reason ?? job?.conversation?.closed_reason ?? null;
   const ended = jobEnded || convClosed;
@@ -239,16 +251,44 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
       throw error;
     }
   }, []);
-  const latest = useRef({ key, messages, conv });
-  latest.current = { key, messages, conv };
+  // 操作这次运行（回答提问、填浏览器输入卡片、交还浏览器）落在哪个子任务上：一次性任务没指定子任务时是正在看的那个
+  // （几个子任务同时跑时，卡片属于它，不是中枢缺省的那个）。和能不能发消息无关。
+  const runKey = batch && !taskId && conv?.task?.id && jobId ? convKey(jobId, conv.task.id) : key;
+  const latest = useRef({ key, messages, conv, runKey });
+  latest.current = { key, messages, conv, runKey };
   // 本组件的新建参数随每次发送带上：放进共享 Provider 时也用自己的，不依赖仓库是谁建的。
   const sendOpts = useRef({ newConversation, createConversation, businessIdFor, select: !controlled });
   sendOpts.current = { newConversation, createConversation, businessIdFor, select: !controlled };
   const send = useCallback(async (text: string) => {
-    const id = latest.current.key;
-    const target = await store.send(id ?? null, text, sendOpts.current);
+    // 一次性任务：发给正在看的那个子任务（接着它聊）。
+    const id = latest.current.conv?.batch ? latest.current.runKey : latest.current.key;
+    // 看板里引用到这个对话的东西：合成一个「看板上下文」块跟着这条消息发出去；发失败就放回去。
+    // 看板上正在看的文件缺省也带上一次（已经明确引用了的不重复），单独一块「看板正在看」：转录里按 config.refs.viewing 显示或不显示。
+    const refKey = latest.current.key;
+    const refs = refKey ? store.takeRefs(refKey) : [];
+    const viewing = refKey ? store.takeViewing(refKey) : null;
+    const blocks = [
+      ...(viewing && !refs.some((r) => r.id === viewing.id) ? [viewingBlock(viewing.text)] : []),
+      ...(refs.length ? [boardContextBlock(refs.map((r) => r.text))] : []),
+    ];
+    const full = blocks.length ? [text, ...blocks.map(serializeBlock)].join("\n\n") : text;
+    let target: string;
+    try {
+      target = await store.send(id ?? null, full, sendOpts.current);
+    } catch (error) {
+      if (refKey) { store.restoreRefs(refKey, refs); store.restoreViewing(refKey, viewing); }
+      throw error;
+    }
     if (target !== id) go(target);
   }, [store, go]);
+  const refs = useCliState((s) => (key ? s.refs[key] : undefined));
+  const viewingState = useCliState((s) => (key ? s.viewing[key] : undefined));
+  const viewingRef = viewingState && !viewingState.off && !refs?.some((r) => r.id === viewingState.ref.id) ? viewingState.ref : null;
+  // 输入框上方显示哪些（config.refs）：不显示的照样随消息带上。正在看的缺省不显示。
+  const viewing = viewingRef && refShown(cfg, "viewing") ? viewingRef : null;
+  const shownRefs = refs?.filter((r) => refShown(cfg, r.kind));
+  // 业务方补充的背景（store.appendContext）：随下一条消息带上，输入框上方显示出来，让用户知道会带上什么。
+  const contextItems = useCliState((s) => s.context[key ?? ""]);
   // AI 把浏览器交给用户（实时新来的「🖐 …」行）：同一 Provider 里有看板在看这个对话，就把看板切到浏览器（收起的会请宿主展开）。
   // 打开对话时已有的交接行不算（先记下已有的再开始比较）；没有看板时不弹窗打扰，行里有「查看浏览器」按钮。
   const handoffSeen = useRef<{ key: string | null; ids: Set<string> | null }>({ key: null, ids: null });
@@ -275,9 +315,11 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
   }, [popup]);
   const handlers = useMemo<MessageHandlers>(() => ({
     // 与 Operator 的 answerQuestion 一致：先把卡片标成已答，再把回答发出去（center 已结束提问那一轮，回答就是下一条消息）。
-    onAnswer: readOnly ? undefined : async (askId: string, questions: AskQuestion[], answers: AskAnswers) => {
+    onAnswer: readOnlyProp || (readOnly && !(batch && store.client.answerAsk)) ? undefined : async (askId: string, questions: AskQuestion[], answers: AskAnswers) => {
       const id = latest.current.key;
       if (!id) return;
+      // 一次性任务：提问时回合开着等，答案直接交给节点；不能改发消息。
+      if (batch && !chat) { await report(store.answerAsk(latest.current.runKey ?? id, askId, questions, answers, { fallback: false }).then(() => undefined), "回答没有送到"); return; }
       const sent = askId
         ? store.answerAsk(id, askId, questions, answers, sendOpts.current).then((target) => { if (target !== id) go(target); })
         : send(formatAnswersText(questions, answers));
@@ -285,14 +327,14 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
     },
     onCancelQueued: readOnly || batch ? undefined : (m: Msg) => { const id = latest.current.key; if (id && m.turnId) void report(store.cancelTurn(id, m.turnId), "撤回失败").catch(() => undefined); },
     // 后端能直接处理的浏览器动作（Operator 后端）才给；center 不提供，卡片按 Operator「没有浏览器能力」时的样子显示。
-    onInput: readOnly || !store.client.submitInput ? undefined : async (inputId: string, values: string[]) => {
-      const id = latest.current.key;
+    onInput: readOnlyProp || !store.client.submitInput ? undefined : async (inputId: string, values: string[]) => {
+      const id = latest.current.runKey;
       if (!id) return "对话还没开始";
       try { return await store.client.submitInput!(id, inputId, values); } catch (error) { return error instanceof Error ? error.message : String(error); }
     },
     // 交还浏览器：后端自己的 handback（Operator 后端），没有就走看板接口（center 转发到节点）。
-    onHandback: readOnly || !(store.client.handback || store.client.board) ? undefined : async () => {
-      const id = latest.current.key;
+    onHandback: readOnlyProp || !(store.client.handback || store.client.board) ? undefined : async () => {
+      const id = latest.current.runKey;
       if (!id) return "对话还没开始";
       try {
         if (store.client.handback) return await store.client.handback(id);
@@ -311,7 +353,7 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
       const at = list.findIndex((m) => m.id === msgId);
       for (let j = (at === -1 ? list.length : at) - 1; j >= 0; j--) if (list[j].role === "user") { void report(send(list[j].content), "重试没有发出去").catch(() => undefined); return; }
     },
-  }), [readOnly, batch, send, store, go, report, fileOpen]);
+  }), [readOnly, readOnlyProp, batch, chat, send, store, go, report, fileOpen]);
   const stop = useCallback(async () => {
     const { key: id, conv: c } = latest.current;
     const turn = c ? runningTurn(c) : null;
@@ -338,7 +380,14 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
   const [atBottom, setAtBottom] = useState(true);
   const committed = useMemo(() => messages.filter((m) => m.role !== "queued"), [messages]);
   const queued = useMemo(() => messages.filter((m) => m.role === "queued"), [messages]);
-  const items = useMemo(() => buildTranscriptItems(committed), [committed]);
+  // 节点转录比手里更早、还没取的条数（实时流只给最新一段，往上翻时分页取，和 Operator 一样）。
+  const older = conv?.older ?? 0;
+  const [loadingOlder, setLoadingOlder] = useState(false);
+  const olderRef = useRef(older); olderRef.current = older;
+  const keyRef2 = useRef(key); keyRef2.current = key;
+  const items = useMemo(() => buildTranscriptItems(committed, older > 0), [committed, older]);
+  // 展开了的「续等」折叠行（按折叠行的 key）。
+  const [openFolds, setOpenFolds] = useState<Set<string>>(() => new Set());
   const [win, setWin] = useState<{ start: string | null; end: string | null }>({ start: null, end: null });
   const { startIdx, endIdx } = useMemo(() => {
     const find = (key: string | null) => (key ? items.findIndex((it) => it.key === key) : -1);
@@ -373,10 +422,17 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
   }, []);
   const revealEarlier = useCallback(() => {
     const { startIdx: s, endIdx: e } = rangeRef.current;
-    if (s <= 0) return;
+    if (s <= 0) {
+      // 手里的都显示了，节点上还有更早的：取一页接在前面，再往上展开（窗口按原来的那一行定位，不跳）。
+      const k = keyRef2.current;
+      if (!k || olderRef.current <= 0) return;
+      setLoadingOlder(true);
+      void store.loadOlder(k).then((ok) => { if (ok) requestAnimationFrame(() => revealRef.current.earlier()); }).finally(() => setLoadingOlder(false));
+      return;
+    }
     const ns = Math.max(0, s - RENDER_STEP);
     setRange(ns, Math.min(e, ns + RENDER_MAX - 1), measure());
-  }, [measure, setRange]);
+  }, [measure, setRange, store]);
   const revealLater = useCallback(() => {
     const its = itemsRef.current;
     const { startIdx: s, endIdx: e } = rangeRef.current;
@@ -404,7 +460,7 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
 
   const topSentinelRef = useRef<HTMLDivElement>(null);
   const bottomSentinelRef = useRef<HTMLDivElement>(null);
-  const hasAbove = hiddenAbove > 0;
+  const hasAbove = hiddenAbove > 0 || older > 0;
   const hasBelow = hiddenBelow > 0;
   useEffect(() => {
     const root = scrollRef.current;
@@ -477,13 +533,19 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
 
   const contextReset = !!lastTurn?.context_reset && conv?.turns.some((turn) => turn.context_reset);
   const h = cfg.header;
-  const view = useMemo(() => ({ timestamps: cfg.transcript.timestamps, initialBadge: cfg.transcript.initialBadge, userLabel: cfg.labels.user, agentName: cfg.labels.agent }), [cfg]);
+  const view = useMemo(() => ({ timestamps: cfg.transcript.timestamps, initialBadge: cfg.transcript.initialBadge, userLabel: cfg.labels.user, agentName: cfg.labels.agent, viewingBlock: refShown(cfg, "viewing") }), [cfg]);
   const composerOptions = useMemo<ComposerOptions>(() => ({
     placeholderRunning: cfg.composer.placeholderRunning, hints: cfg.composer.hints, charCount: cfg.composer.charCount,
     fileUpload: cfg.composer.fileUpload, fileButtonText: cfg.composer.fileButtonText, queue: cfg.composer.queue,
   }), [cfg]);
   const composerDisabled = !!readOnly || finalEnd || conv?.stream === "error";
-  const disabledHint = readOnly ? "只读" : finalEnd ? "对话已结束，不能再发消息" : conv?.streamError ?? undefined;
+  const disabledHint = readOnly
+    ? batch && !readOnlyProp && cfg.composer.show
+      ? (batchTaskStatus && SETTLED_TASK.has(batchTaskStatus) ? "只读（当前中枢不支持接着子任务聊）"
+        : batchTaskStatus === "blocked" || batchTaskStatus === "queued" ? "子任务还没开始，开始并结束后可以接着它聊"
+        : "子任务运行中，结束后可以接着它继续聊；需要登录等操作请在右侧浏览器里接管")
+      : "只读"
+    : finalEnd ? "对话已结束，不能再发消息" : conv?.streamError ?? undefined;
 
   const fileUrlRef = useRef(fileUrl);
   fileUrlRef.current = fileUrl;
@@ -592,7 +654,7 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
               )}
               {hasAbove && (
                 <div ref={topSentinelRef} className="load-older">
-                  <button className="btn btn-ghost btn-sm" onClick={revealEarlier}>加载更早的消息（还有 {hiddenAbove} 条）</button>
+                  <button className="btn btn-ghost btn-sm" onClick={revealEarlier} disabled={loadingOlder}>{loadingOlder ? "正在加载更早的消息…" : `加载更早的消息（还有 ${hiddenAbove + older} 条）`}</button>
                 </div>
               )}
               {shown.map((it) =>
@@ -600,6 +662,15 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
                   cfg.transcript.sessionLabel ? <div key={it.key} data-tkey={it.key} className="session-label"><span className="ln" />第 {it.n} 次会话{it.current ? " · 当前" : ""}<span className="ln" /></div> : null
                 ) : it.kind === "break" ? (
                   <div key={it.key} data-tkey={it.key}><SessionBreak summary={it.summary} /></div>
+                ) : it.kind === "fold" ? (
+                  <div key={it.key} data-tkey={it.key} data-msg="">
+                    <button className="cli-wait-fold" onClick={() => setOpenFolds((o) => { const n = new Set(o); if (n.has(it.key)) n.delete(it.key); else n.add(it.key); return n; })} aria-expanded={openFolds.has(it.key)}>
+                      <span className="cli-wait-ic">⏳</span>
+                      <span>等你在浏览器里操作 · AI 已续等 {it.waits} 次</span>
+                      <span className="cli-wait-more">{openFolds.has(it.key) ? "收起" : "展开"}</span>
+                    </button>
+                    {openFolds.has(it.key) && it.msgs.map((m) => <MessageView key={m.id} m={m} initial={false} hideWho running={running} agent={agent} agentLabel={agentText} handlers={handlers} view={view} />)}
+                  </div>
                 ) : (
                   <div key={it.key} data-tkey={it.key} data-msg="">
                     <MessageView m={it.m} initial={it.initial} hideWho={it.hideWho} running={running} agent={agent} agentLabel={agentText} handlers={handlers} view={view} />
@@ -628,7 +699,35 @@ function ChatInner({ jobId: jobIdProp, taskId: taskIdProp, title = "对话", col
             {!atBottom && <button className="msg-nav-btn" onClick={() => scrollToBottom()} title="跳到最新" aria-label="跳到最新">{Icon.toBottom()}</button>}
           </div>}
         </div>
-        {!readOnly && (
+        {showComposer && !!contextItems?.length && (
+          <div className="cli-refs cli-ctxs" aria-label="补充背景，下一条消息会带上">
+            <span className="cli-refs-t">{Icon.flag()} 补充背景</span>
+            {contextItems.map((c) => (
+              <span key={c.id} className="cli-ref ctx" title={`${c.text.slice(0, 500)}${c.text.length > 500 ? "…" : ""}\n（下一条消息会带上）`}>
+                <span className="cli-ref-l">{c.title || c.text.replace(/\s+/g, " ").slice(0, 20)}</span>
+              </span>
+            ))}
+          </div>
+        )}
+        {showComposer && (!!shownRefs?.length || !!viewing) && (
+          <div className="cli-refs" aria-label="引用自看板，下一条消息会带上">
+            <span className="cli-refs-t">{Icon.board()} 引用自看板</span>
+            {viewing && (
+              <span className="cli-ref auto" title={`${viewing.text}\n（看板上正在看，下一条消息缺省带上；点 × 这次不带）`}>
+                <span className="cli-ref-k">正在看</span>
+                <span className="cli-ref-l">{viewing.label}</span>
+                <button className="cli-ref-x" onClick={() => key && store.dismissViewing(key)} title="这次不带上" aria-label={`不带上 ${viewing.label}`}>{Icon.x()}</button>
+              </span>
+            )}
+            {(shownRefs ?? []).map((r) => (
+              <span key={r.id} className={`cli-ref ${r.kind === "selection" ? "sel" : ""}`} title={r.text}>
+                <span className="cli-ref-l">{r.label}</span>
+                <button className="cli-ref-x" onClick={() => key && store.removeRef(key, r.id)} title="不带上" aria-label={`不带上 ${r.label}`}>{Icon.x()}</button>
+              </span>
+            ))}
+          </div>
+        )}
+        {showComposer && (
           <Composer
             key={key ?? "new"}
             draft={key ?? `new:${instanceId}`}

package/src/chat/Composer.tsx

@@ -1,9 +1,9 @@
 // 输入框。结构与 Operator 的 Composer.tsx 一致（comp-box / comp-area / send-group / comp-foot），
-// 但只发文本：不收图片和其他附件。文件只收 TXT、Markdown、Word，在前端解析成纯文本，
+// 但只发文本：不收图片和其他附件。文件只收文档（Word、Excel、Markdown、TXT、HTML、CSV），在前端解析成纯文本，
 // 和长粘贴一样变成可折叠的文本块，发送时按统一格式拼进正文（见 core/blocks.ts）。
 import { useEffect, useRef, useState } from "react";
 import {
-  ACCEPT_ATTR, MAX_MESSAGE_CHARS, PASTE_NAME, charCount, composeMessage, isLongText, readFileText, type TextBlock,
+  ACCEPT_ATTR, ACCEPTED_LABEL, MAX_MESSAGE_CHARS, PASTE_NAME, charCount, composeMessage, isLongText, readFileText, type TextBlock,
 } from "../core/blocks.js";
 import { Icon } from "../ui/icons.js";
 import { TextBlockCard } from "../ui/TextBlock.js";
@@ -154,7 +154,7 @@ export function Composer({ draft, placeholder, disabled, disabledHint, running,
                 if (files.length) {
                   e.preventDefault();
                   if (!options.fileUpload) { setError("这里只能发送文字"); return; }
-                  if (files.some((f) => f.type.startsWith("image/"))) setError("不支持发送图片，只能发送文字，或上传 TXT / Markdown / Word 文件");
+                  if (files.some((f) => f.type.startsWith("image/"))) setError(`不支持发送图片，只能发送文字，或上传文档：${ACCEPTED_LABEL}`);
                   addFiles(files.filter((f) => !f.type.startsWith("image/")));
                   return;
                 }
@@ -184,7 +184,7 @@ export function Composer({ draft, placeholder, disabled, disabledHint, running,
             <span className="spacer" />
             {options.fileUpload && <input ref={fileRef} type="file" accept={ACCEPT_ATTR} multiple hidden onChange={(e) => { addFiles(Array.from(e.target.files ?? [])); e.target.value = ""; }} />}
             {options.fileUpload && !disabled && (
-              <button className="hint" style={{ cursor: "pointer" }} title="添加 TXT / Markdown / Word 文件（也可拖拽进来），内容会转成文字发送" onMouseDown={(e) => { e.preventDefault(); fileRef.current?.click(); }}>{Icon.clip()} {options.fileButtonText}</button>
+              <button className="hint" style={{ cursor: "pointer" }} title={`添加文档：${ACCEPTED_LABEL}（也可拖拽进来），内容会转成文字发送`} onMouseDown={(e) => { e.preventDefault(); fileRef.current?.click(); }}>{Icon.clip()} {options.fileButtonText}</button>
             )}
           </div>}
         </div>