@jacksontian/kite-server 0.4.1 → 0.5.0

package/web/app.js

@@ -0,0 +1,1107 @@
+'use strict';
+const $ = (id) => document.getElementById(id);
+// 触屏设备（手机/平板）：终端输入走隐藏代理 + 按键工具条；PC 有物理键盘，xterm 直接承接
+const isTouch = matchMedia('(pointer: coarse)').matches;
+// 非 localhost 的明文 HTTP 环境：常驻风险提示（localhost 本地联调不打扰）
+if (location.protocol === 'http:' && !['localhost', '127.0.0.1'].includes(location.hostname)) {
+  $('http-warn').classList.remove('hidden');
+}
+const secretInput = $('secret');
+secretInput.value = localStorage.getItem('rw_secret') || '';
+
+function toast(msg) {
+  const el = $('toast');
+  el.textContent = msg; el.style.opacity = '1';
+  setTimeout(() => { el.style.opacity = '0'; }, 2200);
+}
+
+// ---------- 主题：light/dark 切换，偏好存 localStorage，首访跟随系统外观 ----------
+// xterm 是 canvas 绘制读不到 CSS 变量，终端配色在这里维护并同步给各实例；
+// 浅色下重排 16 色调色板（默认 ANSI 的黄/亮黄在白底上不可见）
+// 终端色对齐 mwt 色板：深底 #0a0c12 / 浅底 #ffffff，前景即 --text-primary
+const TERM_THEME = {
+  // 不显式给 selectionBackground 时，xterm 默认用 rgba(255,255,255,.3)，
+  // 浅色下与白底混完还是白的——选中文字完全看不见，故两个主题都显式指定
+  dark: { background: '#0a0c12', foreground: '#d4d8e8', cursor: '#d4d8e8', selectionBackground: 'rgba(108,140,255,.45)' },
+  light: {
+    background: '#ffffff', foreground: '#1a1d2e', cursor: '#1a1d2e',
+    selectionBackground: 'rgba(74,108,247,.3)',
+    black: '#1a1d2e', red: '#d43d4e', green: '#1f9d7a', yellow: '#ca8a04',
+    blue: '#4a6cf7', magenta: '#8c5cf6', cyan: '#0891b2', white: '#f3f4f6',
+    brightBlack: '#6b7280', brightRed: '#ef4444', brightGreen: '#22c55e',
+    brightYellow: '#eab308', brightBlue: '#6c8cff', brightMagenta: '#a855f7',
+    brightCyan: '#22d3ee', brightWhite: '#ffffff',
+  },
+};
+function currentTheme() {
+  return document.documentElement.dataset.theme === 'light' ? 'light' : 'dark';
+}
+function applyTheme(theme) {
+  document.documentElement.dataset.theme = theme;
+  localStorage.setItem('rw_theme', theme);
+  $('hdr-theme').title = theme === 'light' ? '切换到深色主题' : '切换到浅色主题';
+  $('ic-theme').setAttribute('href', theme === 'light' ? '#i-moon' : '#i-sun');
+  document.querySelector('meta[name="theme-color"]').content = theme === 'light' ? '#ffffff' : '#121520';
+  for (const ent of termEntries.values()) ent.xt.options.theme = { ...TERM_THEME[theme] };
+}
+$('hdr-theme').addEventListener('click', () => applyTheme(currentTheme() === 'light' ? 'dark' : 'light'));
+
+// ---------- 纯 JS SHA-256 / HMAC-SHA256 ----------
+// 非 HTTPS 环境（http://VPS-IP）下浏览器的 crypto.subtle 不可用，故内联实现。
+// 密钥只参与本地 HMAC 运算，从不随请求发送。
+const SHA256_K = new Uint32Array([
+  0x428a2f98, 0x71374491, 0xb5c0fbcf, 0xe9b5dba5, 0x3956c25b, 0x59f111f1, 0x923f82a4, 0xab1c5ed5,
+  0xd807aa98, 0x12835b01, 0x243185be, 0x550c7dc3, 0x72be5d74, 0x80deb1fe, 0x9bdc06a7, 0xc19bf174,
+  0xe49b69c1, 0xefbe4786, 0x0fc19dc6, 0x240ca1cc, 0x2de92c6f, 0x4a7484aa, 0x5cb0a9dc, 0x76f988da,
+  0x983e5152, 0xa831c66d, 0xb00327c8, 0xbf597fc7, 0xc6e00bf3, 0xd5a79147, 0x06ca6351, 0x14292967,
+  0x27b70a85, 0x2e1b2138, 0x4d2c6dfc, 0x53380d13, 0x650a7354, 0x766a0abb, 0x81c2c92e, 0x92722c85,
+  0xa2bfe8a1, 0xa81a664b, 0xc24b8b70, 0xc76c51a3, 0xd192e819, 0xd6990624, 0xf40e3585, 0x106aa070,
+  0x19a4c116, 0x1e376c08, 0x2748774c, 0x34b0bcb5, 0x391c0cb3, 0x4ed8aa4a, 0x5b9cca4f, 0x682e6ff3,
+  0x748f82ee, 0x78a5636f, 0x84c87814, 0x8cc70208, 0x90befffa, 0xa4506ceb, 0xbef9a3f7, 0xc67178f2,
+]);
+const rotr = (x, n) => (x >>> n) | (x << (32 - n));
+
+function sha256Bytes(data) {
+  const H = new Uint32Array([
+    0x6a09e667, 0xbb67ae85, 0x3c6ef372, 0xa54ff53a,
+    0x510e527f, 0x9b05688c, 0x1f83d9ab, 0x5be0cd19,
+  ]);
+  const len = data.length;
+  const paddedLen = (((len + 8) >> 6) + 1) << 6;
+  const padded = new Uint8Array(paddedLen);
+  padded.set(data);
+  padded[len] = 0x80;
+  const dv = new DataView(padded.buffer);
+  dv.setUint32(paddedLen - 8, Math.floor(len / 0x20000000)); // 比特长度高 32 位
+  dv.setUint32(paddedLen - 4, (len << 3) >>> 0);             // 比特长度低 32 位
+  const w = new Uint32Array(64);
+  for (let off = 0; off < paddedLen; off += 64) {
+    for (let i = 0; i < 16; i++) w[i] = dv.getUint32(off + i * 4);
+    for (let i = 16; i < 64; i++) {
+      const s0 = rotr(w[i - 15], 7) ^ rotr(w[i - 15], 18) ^ (w[i - 15] >>> 3);
+      const s1 = rotr(w[i - 2], 17) ^ rotr(w[i - 2], 19) ^ (w[i - 2] >>> 10);
+      w[i] = (w[i - 16] + s0 + w[i - 7] + s1) >>> 0;
+    }
+    let a = H[0], b = H[1], c = H[2], d = H[3], e = H[4], f = H[5], g = H[6], h = H[7];
+    for (let i = 0; i < 64; i++) {
+      const t1 = (h + (rotr(e, 6) ^ rotr(e, 11) ^ rotr(e, 25)) + ((e & f) ^ (~e & g)) + SHA256_K[i] + w[i]) >>> 0;
+      const t2 = ((rotr(a, 2) ^ rotr(a, 13) ^ rotr(a, 22)) + ((a & b) ^ (a & c) ^ (b & c))) >>> 0;
+      h = g; g = f; f = e; e = (d + t1) >>> 0; d = c; c = b; b = a; a = (t1 + t2) >>> 0;
+    }
+    H[0] = (H[0] + a) >>> 0; H[1] = (H[1] + b) >>> 0; H[2] = (H[2] + c) >>> 0; H[3] = (H[3] + d) >>> 0;
+    H[4] = (H[4] + e) >>> 0; H[5] = (H[5] + f) >>> 0; H[6] = (H[6] + g) >>> 0; H[7] = (H[7] + h) >>> 0;
+  }
+  const out = new Uint8Array(32);
+  const odv = new DataView(out.buffer);
+  for (let i = 0; i < 8; i++) odv.setUint32(i * 4, H[i]);
+  return out;
+}
+
+const bytesToHex = (bytes) => Array.from(bytes, (b) => b.toString(16).padStart(2, '0')).join('');
+const utf8 = (s) => new TextEncoder().encode(s);
+const sha256Hex = (s) => bytesToHex(sha256Bytes(utf8(s)));
+
+function hmacSha256Hex(keyStr, msgStr) {
+  let key = utf8(keyStr);
+  if (key.length > 64) key = sha256Bytes(key);
+  const msg = utf8(msgStr);
+  const inner = new Uint8Array(64 + msg.length);
+  const outer = new Uint8Array(64 + 32);
+  for (let i = 0; i < 64; i++) {
+    const k = i < key.length ? key[i] : 0;
+    inner[i] = k ^ 0x36;
+    outer[i] = k ^ 0x5c;
+  }
+  inner.set(msg, 64);
+  outer.set(sha256Bytes(inner), 64);
+  return bytesToHex(sha256Bytes(outer));
+}
+
+// ---------- 请求签名（与 server/worker 的签名串格式严格一致）----------
+function makeNonce() {
+  const bytes = new Uint8Array(16);
+  if (window.crypto && crypto.getRandomValues) crypto.getRandomValues(bytes);
+  else for (let i = 0; i < 16; i++) bytes[i] = Math.floor(Math.random() * 256);
+  return bytesToHex(bytes);
+}
+
+function signHeaders(method, path, bodyStr) {
+  const ts = Math.floor(Date.now() / 1000);
+  const nonce = makeNonce();
+  const sig = hmacSha256Hex(secretInput.value.trim(), [method, path, ts, nonce, sha256Hex(bodyStr)].join('\n'));
+  return { 'X-RW-Ts': String(ts), 'X-RW-Nonce': nonce, 'X-RW-Sig': sig };
+}
+
+// 未配置密钥时禁止发起任何需要签名的请求：空密钥签名必 401，
+// 还会白刷服务端验签失败限流计数，统一在本地拦截
+function hasSecret() {
+  return secretInput.value.trim() !== '';
+}
+function requireSecret() {
+  if (!hasSecret()) throw new Error('请先配置 API Secret');
+}
+
+async function api(path, body) {
+  requireSecret();
+  const method = body === undefined ? 'GET' : 'POST';
+  const bodyStr = body === undefined ? '' : JSON.stringify(body);
+  const res = await fetch(path, {
+    method,
+    headers: {
+      'Content-Type': 'application/json',
+      ...signHeaders(method, path, bodyStr),
+    },
+    body: body === undefined ? undefined : bodyStr,
+  });
+  const data = await res.json().catch(() => ({}));
+  if (res.status === 401) throw new Error('签名验证失败（检查密钥与本机时钟）');
+  if (!res.ok) throw new Error(data.error || `HTTP ${res.status}`);
+  return data;
+}
+
+// ---------- 本地状态 ----------
+const sessionCache = new Map();   // id -> 会话摘要
+const tabEls = new Map();         // id -> 会话 tab 元素（tab 条即会话列表，窗格按需懒建）
+const hiddenSessions = new Set(); // 本次浏览中 ✕ 关掉的会话（记录已被服务端删除；本地隐藏防删除生效前的广播/轮询回流）
+let wsReady = false;
+let wsAuthRejected = false;    // 验签被拒后停止重连，直到密钥变更
+// 刷新/换端恢复：会话「已打开」是服务端状态（session.openedAt），快照到达后
+// 按它自动重开窗格——任意浏览器/客户端打开都能看到同一现场
+let gotSnapshot = false;        // 首份会话快照（WS hello 或 REST 轮询）是否已到达
+
+secretInput.addEventListener('change', () => {
+  localStorage.setItem('rw_secret', secretInput.value.trim());
+  wsAuthRejected = false;      // 密钥换了，允许重新尝试实时连接
+  renderSecretState();
+  if (hasSecret()) {
+    if (!wsReady) connectWS();
+    refresh();                 // 之前无密钥没拉过数据，配好后补一次
+  }
+});
+
+// ---------- 设置下拉面板（topbar「设置」入口）：密钥 ----------
+function renderSecretState() {
+  $('secret-state').classList.toggle('hidden', !hasSecret());
+}
+function openSettings() {
+  renderSecretState();
+  setSecretVisible(false);       // 每次打开恢复掩码，避免直接露出明文
+  $('settings-pop').classList.remove('hidden');
+}
+function closeSettings() { $('settings-pop').classList.add('hidden'); }
+$('hdr-settings').addEventListener('click', (ev) => {
+  ev.stopPropagation();          // 防止全局「点面板外收起」监听把刚打开的面板立刻收掉
+  if ($('settings-pop').classList.contains('hidden')) openSettings(); else closeSettings();
+});
+// 点面板外收起
+document.addEventListener('click', (ev) => {
+  const pop = $('settings-pop');
+  if (!pop.classList.contains('hidden') && !pop.contains(ev.target)) closeSettings();
+});
+
+// 明文/掩码切换，仅改变本地展示方式，不影响签名
+function setSecretVisible(visible) {
+  secretInput.type = visible ? 'text' : 'password';
+  const btn = $('btn-eye');
+  btn.querySelector('span').textContent = visible ? '隐藏' : '显示';
+  $('ic-eye').setAttribute('href', visible ? '#i-eye-off' : '#i-eye');
+  btn.classList.toggle('on', visible);
+}
+$('btn-eye').addEventListener('click', () => setSecretVisible(secretInput.type === 'password'));
+
+// ---------- WebSocket 实时通道（断线自动回退轮询）----------
+let curWs = null; // 当前实时连接，pty 终端输入经它上行
+
+function sendWs(msg) {
+  if (curWs && curWs.readyState === WebSocket.OPEN) curWs.send(JSON.stringify(msg));
+  else toast('实时通道未连接，输入无法送达');
+}
+
+function setConnMode(realtime) {
+  const el = $('conn-mode');
+  el.textContent = realtime ? '实时' : '轮询';
+  el.className = realtime ? 'realtime' : 'polling';
+}
+
+function connectWS() {
+  if (wsAuthRejected || !hasSecret()) return; // 无密钥时握手必被 4003 拒绝，不发起
+  const proto = location.protocol === 'https:' ? 'wss' : 'ws';
+  const sock = new WebSocket(`${proto}://${location.host}/ws`);
+  curWs = sock;
+
+  sock.addEventListener('open', () => {
+    // 签名鉴权：sig = HMAC(密钥, "WS\nTS\nNONCE")，密钥本身不进网络
+    const ts = Math.floor(Date.now() / 1000);
+    const nonce = makeNonce();
+    const sig = hmacSha256Hex(secretInput.value.trim(), ['WS', ts, nonce].join('\n'));
+    sock.send(JSON.stringify({ type: 'auth', ts, nonce, sig }));
+  });
+  sock.addEventListener('message', (ev) => {
+    let msg;
+    try { msg = JSON.parse(ev.data); } catch { return; }
+    switch (msg.type) {
+      case 'hello':
+        wsReady = true;
+        setConnMode(true);
+        sessionCache.clear();
+        for (const t of msg.sessions) sessionCache.set(t.id, t);
+        gotSnapshot = true;
+        syncTabs();
+        renderWorkers(msg.workers);
+        // 重连后给打开着的终端补回看缓冲与会话存活状态
+        for (const id of termEntries.keys()) {
+          syncPaneSession(id);
+          const ent = termEntries.get(id);
+          ent.pendingAttach = true;
+          sock.send(JSON.stringify({ type: 'pty.attach', sessionId: id }));
+        }
+        break;
+      case 'session.created':
+      case 'session.updated':
+        sessionCache.set(msg.session.id, msg.session);
+        syncTabs();
+        syncPaneSession(msg.session.id); // 已开窗的同步状态（如 pending→running 后隐藏取消钮）
+        break;
+      case 'session.closed':
+        // 关窗即关会话：记录已被服务端删除（可能来自其他控制台），本地同步清掉
+        sessionCache.delete(msg.id);
+        hiddenSessions.delete(msg.id);
+        syncTabs(); // 不存在的会话在此统一移除 tab 与已开窗格
+        break;
+      case 'workers':
+        renderWorkers(msg.workers);
+        break;
+      // --- pty 交互终端流 ---
+      case 'pty.data': {
+        // 非当前会话有新输出：tab 亮活动圆点（窗格没打开也亮，输出由服务端缓冲，开窗时回补）
+        if (msg.id !== activeTermId) {
+          const tab = tabEls.get(msg.id);
+          if (tab) tab.classList.add('dirty');
+          const me = termEntries.get(msg.id);
+          if (me && me.minimized && me.minIcon) me.minIcon.classList.add('dirty'); // 最小化停靠图标同样亮活动点
+        }
+        const ent = termEntries.get(msg.id);
+        if (ent) {
+          ent.xt.write(msg.data);
+          ent.live = true;
+          termStatus(ent);
+        }
+        break;
+      }
+      case 'pty.started': {
+        const ent = termEntries.get(msg.id);
+        if (ent && !ent.live) {
+          ent.live = true;
+          ent.xt.write('\r\n\x1b[32m[终端会话已就绪]\x1b[0m\r\n');
+          termStatus(ent);
+        }
+        break;
+      }
+      case 'pty.exited': {
+        const ent = termEntries.get(msg.id);
+        if (ent) {
+          ent.live = false;
+          ent.xt.write(`\r\n\x1b[31m[会话结束：${msg.reason || ''}]\x1b[0m\r\n`);
+          termStatus(ent);
+        }
+        break;
+      }
+      case 'pty.attach': {
+        const ent = termEntries.get(msg.id);
+        if (ent && ent.pendingAttach) {
+          ent.pendingAttach = false;
+          if (msg.tail) ent.xt.write(msg.tail); // 回看缓冲：切后台回来不白屏
+          ent.live = msg.live;
+          ent.liveHint = msg.live ? '' : (ATTACH_HINTS[msg.reason] || ATTACH_HINTS.unknown);
+          if (!msg.live) ent.xt.write(`\r\n\x1b[33m[会话未就绪：${ent.liveHint}]\x1b[0m\r\n`);
+          termStatus(ent);
+        }
+        break;
+      }
+    }
+  });
+  sock.addEventListener('close', (ev) => {
+    wsReady = false;
+    setConnMode(false);
+    for (const ent of termEntries.values()) termStatus(ent); // 各打开终端的状态条都显示重连中
+    if (ev.code === 4003) {
+      // 验签被拒：无意义重试只会刷服务端日志，等用户改密钥
+      wsAuthRejected = true;
+      openSettings();          // 打开设置面板，方便直接修改密钥
+      toast('密钥无效或时钟偏差过大，实时连接已停止');
+      return;
+    }
+    setTimeout(connectWS, 3000); // 锁屏/切网导致的断线，3 秒后重连
+  });
+  sock.addEventListener('error', () => sock.close());
+}
+
+// ---------- 渲染（增量 diff：节点按 id 复用，只更新变化的部分） ----------
+const STATUS_TEXT = { pending: '等待中', running: '执行中', done: '完成', failed: '失败', canceled: '已取消' };
+function fmtTime(ts) {
+  if (!ts) return '-';
+  const d = new Date(ts);
+  return `${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')} ` +
+         `${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}`;
+}
+
+let workerList = []; // 心跳下发的 Worker 快照；目标 Worker 与项目目录下拉都基于它
+
+/** 相对时间：离线 Worker 的最近心跳展示成「X 分钟前」，超过一天回退具体时间 */
+function relTime(ts) {
+  if (!ts) return '从未';
+  const diff = Date.now() - ts;
+  if (diff < 60_000) return '1 分钟内';
+  if (diff < 3600_000) return `${Math.floor(diff / 60_000)} 分钟前`;
+  if (diff < 86400_000) return `${Math.floor(diff / 3600_000)} 小时前`;
+  return fmtTime(ts);
+}
+
+function renderWorkers(workers) {
+  workerList = workers;
+  const ws = $('worker-status');
+  const online = workers.filter((w) => w.online).length;
+  let text;
+  if (!workers.length) {
+    text = '无 Worker';
+  } else if (online) {
+    text = `${online}/${workers.length} 在线`;
+  } else {
+    // 全离线时给出最近一次心跳时间，便于判断是「刚掉线」还是「长期没上线」
+    const lastSeen = Math.max(...workers.map((w) => w.lastSeenAt || 0));
+    text = `全离线（心跳 ${relTime(lastSeen)}）`;
+  }
+  if (ws.textContent !== text) ws.textContent = text; // 没变就不写，避免无谓重绘
+  ws.className = online ? 'online' : 'offline';
+  // 当前过滤的 Worker 已注销（如配置移除）：清掉选中态（打开的终端不打扰，继续挂着）
+  if (currentWorkerId && !workers.some((w) => w.workerId === currentWorkerId)) {
+    currentWorkerId = null;
+    $('hdr-project').disabled = true; // 无 Worker：目录下拉回禁用态
+    syncTabs();
+  }
+  renderWorkerSelect();
+  // 首份快照到达后按地址栏 hash 恢复（刷新后还原所选 Worker）
+  if (!routeInited) { routeInited = true; applyRoute(); }
+}
+// 「X 分钟前」随时间变化：存在离线 Worker 时定期用最近快照重渲染，
+// 保持离线时长读数新鲜（全在线时不动，避免打扰交互）
+setInterval(() => {
+  if (workerList.length && !workerList.some((w) => w.online)) renderWorkers(workerList);
+}, 30_000);
+
+// ---------- 单页工作台：会话即终端窗口，顶部 tab 条就是会话列表 ----------
+let currentWorkerId = null;      // tab 条的 Worker 过滤（null = 全部）
+let routeInited = false;         // 首份 Worker 快照到达前 hash 恢复无法执行（下拉还没建好）
+
+function updateTermEmpty() {
+  // 可见窗格（未最小化）为零即空态：全部最小化时也显示提示（停靠图标在底部最小化栏）
+  const visible = [...termEntries.values()].filter((e) => !e.minimized).length;
+  $('term-empty').classList.toggle('hidden', visible > 0);
+}
+
+// tab 条即会话列表：一会话一 tab（窗格点开才建），按时间倒序；会话消失/被 ✕ 关掉则移除
+function syncTabs() {
+  const sessions = [...sessionCache.values()]
+    .filter((t) => !hiddenSessions.has(t.id))
+    .filter((t) => !currentWorkerId || t.workerId === currentWorkerId || t.targetWorker === currentWorkerId)
+    .sort((a, b) => b.createdAt - a.createdAt).slice(0, 50);
+  // 清理已不存在的会话：tab 移除，开着的窗格一并释放
+  const ids = new Set(sessions.map((t) => t.id));
+  for (const [id, tab] of tabEls) {
+    if (!ids.has(id)) { tab.remove(); tabEls.delete(id); hiddenSessions.delete(id); disposePane(id); }
+  }
+  // 增量更新/插入，并保证顺序（新会话插到正确位置，而不是闪到末尾）
+  const strip = $('tab-list');
+  let prev = null;
+  for (const t of sessions) {
+    let tab = tabEls.get(t.id);
+    if (!tab) { tab = createTabEl(t); tabEls.set(t.id, tab); }
+    patchTab(t, tab);
+    const expected = prev ? prev.nextSibling : strip.firstChild;
+    if (tab !== expected) strip.insertBefore(tab, expected);
+    prev = tab;
+  }
+  syncTabsBar();
+  restoreOpenPanes();
+}
+
+// tab 条显隐：仅「标签页」布局且有 tab 时显示（平铺布局所有终端同屏可见，无窗格需要 tab 承接）
+function syncTabsBar() {
+  $('tabs').classList.toggle('hidden', termLayout !== 'tabs' || tabEls.size === 0);
+}
+
+// 开窗标记落服务端（会话记录 openedAt）：刷新/换浏览器/换客户端都按它恢复现场；
+// 失败不打扰（快照里已有标记时恢复不受影响）
+function markSessionOpened(id) {
+  api(`/api/sessions/${id}/open`, {}).catch(() => {});
+}
+let panesRestored = false;
+function restoreOpenPanes() {
+  if (panesRestored || !gotSnapshot) return;
+  panesRestored = true;
+  let n = 0;
+  for (const t of sessionCache.values()) { // 恢复上限 8 窗，防一次性建过多 xterm 实例
+    if (n >= 8) break;
+    if (t.openedAt && !termEntries.has(t.id)) { openTerm(t); n++; }
+  }
+}
+
+// ✕ 关窗即关会话：释放本地终端并从 tab 条移除，服务端删除会话记录（刷新不再回来）；
+// 活跃 PTY 会先被通知杀掉，迟到的上报由服务端 404 / Worker 侧容忍兜底
+async function closeTerm(id) {
+  hiddenSessions.add(id);
+  disposePane(id);
+  const tab = tabEls.get(id);
+  if (tab) { tab.remove(); tabEls.delete(id); }
+  syncTabsBar();
+  if (!sessionCache.has(id)) return;
+  try {
+    await api(`/api/sessions/${id}/kill`, {});
+    sessionCache.delete(id); // 记录已在服务端删除，本地同步清掉防轮询回流
+    if (!wsReady) await refresh();
+  } catch (err) {
+    toast(`关闭会话失败：${err.message}`);
+  }
+}
+
+// 选中 Worker：只影响 tab 条过滤与目录下拉（Worker 面板已并入 topbar 下拉）
+$('hdr-worker').addEventListener('change', () => {
+  currentWorkerId = $('hdr-worker').value || null;
+  renderProjectOptions();
+  syncTabs();
+  history.replaceState(null, '', buildHash()); // 所选 Worker 入 URL：刷新后恢复
+});
+
+// ---------- 页头 Worker 下拉：随心跳快照重建，「全部」清空过滤，各 Worker 带在线标记 ----------
+// sig 去重，快照没变不重建（避免打断正在拉开的下拉）
+let selectSig = '';
+function renderWorkerSelect() {
+  const sig = JSON.stringify(workerList.map((w) => [w.workerId, w.hostname, w.online]));
+  if (sig !== selectSig) {
+    selectSig = sig;
+    const sel = $('hdr-worker');
+    sel.textContent = '';
+    const all = document.createElement('option');
+    all.value = '';
+    all.textContent = workerList.length ? `全部 Worker（${workerList.length}）` : '无 Worker';
+    sel.appendChild(all);
+    for (const w of workerList) {
+      const opt = document.createElement('option');
+      opt.value = w.workerId;
+      const name = w.hostname && w.hostname !== w.workerId ? `${w.workerId}（${w.hostname}）` : w.workerId;
+      opt.textContent = `${w.online ? '●' : '○'} ${name}`; // ● 在线 / ○ 离线
+      sel.appendChild(opt);
+    }
+  }
+  $('hdr-worker').value = currentWorkerId && workerList.some((w) => w.workerId === currentWorkerId)
+    ? currentWorkerId : '';
+}
+
+// ---------- hash 路由：单工作台无视图切换，只记所选 Worker ----------
+// 兼容旧链接：#/、#/term、#/sessions… 即工作台；#/w/<workerId> 恢复 Worker 过滤
+function route() {
+  const parts = location.hash.slice(1).split('/').filter(Boolean);
+  if (parts[0] === 'w') return { worker: decodeURIComponent(parts[1] || '') };
+  return {};
+}
+function buildHash() {
+  return currentWorkerId ? `#/w/${encodeURIComponent(currentWorkerId)}` : '#/';
+}
+function applyRoute() {
+  const r = route();
+  if (r.worker && r.worker !== currentWorkerId
+    && workerList.some((w) => w.workerId === r.worker)) {
+    currentWorkerId = r.worker;
+    $('hdr-worker').value = r.worker;
+    renderProjectOptions();
+    syncTabs();
+  }
+}
+window.addEventListener('hashchange', applyRoute);
+
+// 项目目录下拉：只列所选 Worker 上报的项目目录（显式指派，不做跨机并集）；
+// 末尾常驻「＋ 新建目录…」，输入的新目录在会话执行时由 Worker 自动创建（pty 执行前会 mkdir）
+const NEW_PROJECT = '__new__';
+
+function renderProjectOptions() {
+  const selected = workerList.find((w) => w.workerId === currentWorkerId);
+  const projects = [...new Set(selected ? (selected.projects || []) : [])].sort();
+  const sel = $('hdr-project');
+  sel.disabled = !currentWorkerId; // 目录跟着 Worker 走，未选时禁用
+  if (!projects.length) return; // Worker 尚未上报，保留默认 default 选项
+  const prev = sel.value !== NEW_PROJECT ? sel.value : 'default';
+  sel.textContent = '';
+  for (const p of projects) {
+    const opt = document.createElement('option');
+    opt.value = p;
+    opt.textContent = p;
+    sel.appendChild(opt);
+  }
+  const newOpt = document.createElement('option');
+  newOpt.value = NEW_PROJECT;
+  newOpt.textContent = '＋ 新建目录…';
+  sel.appendChild(newOpt);
+  sel.value = [...sel.options].some((o) => o.value === prev) ? prev : projects[0];
+}
+
+// 选「＋ 新建目录…」：弹输入框收目录名，合法则加入下拉并选中；
+// 取消或非法则退回原选项，NEW_PROJECT 值不会进入提交 payload
+$('hdr-project').addEventListener('change', (ev) => {
+  const sel = ev.target;
+  if (sel.value !== NEW_PROJECT) return;
+  const fallback = [...sel.options].find((o) => o.value !== NEW_PROJECT)?.value || '';
+  const name = (window.prompt('新项目目录名（会话执行时在 Worker workspace 下自动创建）') || '').trim();
+  if (!name || !/^[\w.-]+$/.test(name) || name.includes('..')) {
+    if (name) toast('目录名只能含字母/数字/._-，且不含 ..');
+    sel.value = fallback;
+    return;
+  }
+  if (![...sel.options].some((o) => o.value === name)) {
+    const opt = document.createElement('option');
+    opt.value = name;
+    opt.textContent = name;
+    sel.insertBefore(opt, sel.querySelector(`option[value="${NEW_PROJECT}"]`));
+  }
+  sel.value = name;
+});
+
+// ---------- 新建会话：无弹框，直接为当前 Worker + 所选目录提交 pty 会话，并立即开出终端窗 ----------
+$('hdr-new-session').addEventListener('click', async () => {
+  const targetWorker = currentWorkerId;
+  if (!targetWorker) return toast('请先在页头下拉选择 Worker');
+  const project = $('hdr-project').value;
+  if (!project || project === NEW_PROJECT) return toast('请先选择项目目录');
+  if (!/^[\w.-]+$/.test(project)) return toast('项目目录名只能含字母/数字/._-');
+  const btn = $('hdr-new-session');
+  try {
+    btn.disabled = true;
+    const session = await api('/api/sessions', { type: 'pty', title: `交互终端（${project}）`, payload: { project }, targetWorker });
+    sessionCache.set(session.id, session);
+    syncTabs();
+    openTerm(session); // 会话即终端窗口：直开，待领取/启动中在终端内提示，就绪后自动接通
+    if (!wsReady) await refresh();
+  } catch (err) {
+    toast(err.message);
+  } finally {
+    btn.disabled = false;
+  }
+});
+
+// 会话 tab：点击开窗（终端窗格懒建），✕ 关窗即关会话
+function createTabEl(t) {
+  const tab = document.createElement('div');
+  tab.className = 'term-tab';
+  tab.innerHTML = '<span class="tt-dot"></span><span class="tt-title"></span>' +
+    '<button class="tt-close" type="button" title="关闭终端并结束该会话">✕</button>';
+  tab.addEventListener('click', () => {
+    const s = sessionCache.get(t.id);
+    if (s) openTerm(s);
+  });
+  tab.querySelector('.tt-close').addEventListener('click', (ev) => {
+    ev.stopPropagation(); // 关窗不触发 tab 的开窗逻辑
+    closeTerm(t.id);
+  });
+  return tab;
+}
+
+function patchTab(t, tab) {
+  const title = tab.querySelector('.tt-title');
+  const label = termLabel(t);
+  if (title.textContent !== label) title.textContent = label;
+  const ended = ['done', 'failed', 'canceled'].includes(t.status);
+  tab.classList.toggle('pending', t.status === 'pending');
+  tab.classList.toggle('ended', ended);
+  tab.title = `${label} · ${STATUS_TEXT[t.status] || t.status} · ${fmtTime(t.createdAt)}`;
+  const active = activeTermId === t.id;
+  tab.classList.toggle('active', active);
+  if (active) tab.classList.remove('dirty'); // 切到当前窗即视为已读
+}
+
+// ---------- 交互终端（pty 会话：xterm.js 渲染，IO 走 /ws 中继到 Worker 的 PTY）----------
+// 多窗口管理借鉴 mwt LayoutManager：并排/横排/网格/标签页四种布局，窗格可最大化/最小化，
+// 底部状态栏汇总，Alt 快捷键切换；tab 活动圆点标记非当前终端的新输出；偏好存 localStorage。
+// 触屏无物理键盘：隐藏 textarea 承接击键，工具条补 Tab/方向键/Ctrl 组合键
+const termEntries = new Map(); // sessionId -> { xt, fit, pane, tab, statusEl, cancelBtn, live, pendingAttach, liveHint, attached, minimized, label, maxBtn, minIcon }
+let activeTermId = null;
+const TERM_LAYOUTS = ['columns', 'rows', 'grid', 'tabs'];
+// 旧版偏好 'single'（单屏）与「标签页」同义，不在新枚举中自然落到默认 'tabs'
+const savedLayout = localStorage.getItem('rw_termLayout');
+let termLayout = TERM_LAYOUTS.includes(savedLayout) ? savedLayout : 'tabs';
+let termMaxId = null; // 当前最大化的终端（独占 #term-body），null 表示无
+// 会话未就绪时的原因文案（与服务端 pty.attach 应答的 reason 对应）
+const ATTACH_HINTS = {
+  not_claimed: '会话尚未被领取，等待 Worker 上线领取…',
+  worker_offline: 'Worker 离线（通道断开），重连后可自动恢复…',
+  starting: '会话已被领取，会话启动中，请稍候…',
+  ended: '会话已结束或已被回收',
+  unknown: '会话尚未被领取或 Worker 离线，请稍候…',
+};
+const KEY_SEQ = { BS: '\x7f', Tab: '\t', Esc: '\x1b', Up: '\x1b[A', Down: '\x1b[B', CtrlC: '\x03', CtrlD: '\x04' };
+
+// 终端窗口的显示名：自定义标题照用；默认标题（空或「交互终端…」）
+// 退化为「项目目录 · #会话短号」，同项目开多个终端也不会重名
+function termLabel(t) {
+  if (t.title && !/^交互终端/.test(t.title)) return t.title;
+  const short = String(t.id).slice(-4);
+  const proj = t.project || (t.payload && t.payload.project);
+  return proj ? `${proj} · #${short}` : `终端 · #${short}`;
+}
+
+// 状态条挂在各终端自己的 pane 头部（并排时各有各的状态）
+function termStatusText(ent) {
+  if (!wsReady) return '实时通道断开，重连中…';
+  if (ent.live) return '已连接';
+  return `会话未就绪（${ent.liveHint || ATTACH_HINTS.unknown}）`;
+}
+function termStatus(ent) {
+  if (ent && ent.statusEl) ent.statusEl.textContent = termStatusText(ent);
+  updateTermFoot();
+}
+
+// 会话状态同步进已打开的窗格：只有 pending（未领取）才可取消
+function syncPaneSession(id) {
+  const ent = termEntries.get(id);
+  const t = sessionCache.get(id);
+  if (!ent || !t) return;
+  ent.cancelBtn.classList.toggle('hidden', t.status !== 'pending');
+  termStatus(ent);
+}
+
+// 底部状态栏：活动终端/连接状态 · 窗口尺寸 · 终端计数（最大化/最小化信息内嵌）
+function updateTermFoot() {
+  const ent = termEntries.get(activeTermId);
+  const maxTag = termMaxId && termMaxId === activeTermId ? ' · 最大化' : '';
+  $('tf-active').textContent = ent ? `${ent.label} · ${termStatusText(ent)}${maxTag}` : '无活动终端';
+  $('tf-size').textContent = ent ? `${ent.xt.cols}×${ent.xt.rows}` : '';
+  const total = termEntries.size;
+  const mins = [...termEntries.values()].filter((e) => e.minimized).length;
+  $('tf-count').textContent = total ? `${total} 个终端${mins ? ` · ${mins} 已最小化` : ''}` : '';
+  // 触屏没有快捷键提示行，状态同步进工具条右侧
+  if (isTouch) $('term-bar-status').textContent = ent ? termStatusText(ent) : '';
+}
+
+function ensureTerm(t) {
+  let ent = termEntries.get(t.id);
+  if (ent) return ent;
+  if (!window.Terminal || !window.FitAddon) {
+    toast('xterm.js 加载失败（vendor/ 资源缺失，请刷新重试）');
+    return null;
+  }
+  const xt = new window.Terminal({
+    fontSize: isTouch ? 13 : 14, scrollback: isTouch ? 3000 : 5000, cursorBlink: true,
+    theme: { ...TERM_THEME[currentTheme()] },
+  });
+  const fit = new window.FitAddon.FitAddon();
+  xt.loadAddon(fit);
+  // 每个终端独占一个 pane（标题栏 + 渲染区）：挂在同一容器里会让多实例叠在一起串台
+  const pane = document.createElement('div');
+  pane.className = 'term-pane';
+  pane.innerHTML = `
+    <div class="tp-head">
+      <span class="tp-title"></span>
+      <span class="tp-status"></span>
+      <button class="tp-cancel hidden" type="button" title="取消该会话（仅限未领取）">取消</button>
+      <button class="tp-min" type="button" title="最小化（Alt+-）">—</button>
+      <button class="tp-max" type="button" title="最大化/还原（Alt+M）">⤢</button>
+      <button class="tp-close" type="button" title="关闭终端并结束该会话">✕</button>
+    </div>
+    <div class="tp-term"></div>`;
+  pane.querySelector('.tp-title').textContent = termLabel(t); // textContent 天然防注入
+  pane.querySelector('.tp-cancel').addEventListener('click', async (ev) => {
+    ev.stopPropagation();
+    const btn = ev.currentTarget;
+    try {
+      btn.disabled = true;
+      await api(`/api/sessions/${t.id}/cancel`, {});
+      if (!wsReady) await refresh();
+    } catch (e) { toast(e.message); } finally { btn.disabled = false; }
+  });
+  pane.querySelector('.tp-min').addEventListener('click', (ev) => {
+    ev.stopPropagation();
+    minimizeTerm(t.id);
+  });
+  pane.querySelector('.tp-max').addEventListener('click', (ev) => {
+    ev.stopPropagation();
+    toggleTermMax(t.id);
+  });
+  pane.querySelector('.tp-close').addEventListener('click', (ev) => {
+    ev.stopPropagation();
+    closeTerm(t.id); // 关窗即关会话：释放本地窗格，服务端会话同步落终态
+  });
+  pane.addEventListener('mousedown', () => { // 并排时点非当前 pane 即切焦点过去
+    if (activeTermId !== t.id) activateTerm(t.id);
+  });
+  $('term-body').appendChild(pane);
+  xt.open(pane.querySelector('.tp-term'));
+  // tab 条上的会话 tab 一般已由 syncTabs 建好；兜底缺失场景（如未过滤到的会话直开）
+  if (!tabEls.has(t.id)) syncTabs();
+  const tab = tabEls.get(t.id);
+  ent = {
+    xt, fit, pane, tab, statusEl: pane.querySelector('.tp-status'),
+    cancelBtn: pane.querySelector('.tp-cancel'),
+    live: false, pendingAttach: false, liveHint: '', attached: false,
+    minimized: false, label: termLabel(t), maxBtn: pane.querySelector('.tp-max'), minIcon: null,
+  };
+  termEntries.set(t.id, ent);
+  if (!t.openedAt) markSessionOpened(t.id); // 开窗标记落服务端（已带标记的恢复开窗不重复上报）
+  syncPaneSession(t.id); // 初始按会话状态决定取消钮可见性
+  updateTermEmpty();
+  xt.onData((data) => sendWs({ type: 'session.input', sessionId: t.id, data }));
+  return ent;
+}
+
+// 切换当前终端：点亮对应 tab 与 pane，熄灭活动圆点，聚焦承接输入
+function activateTerm(id) {
+  const ent = termEntries.get(id);
+  if (!ent) return;
+  if (ent.minimized) restoreTerm(id); // 兜底：激活最小化窗格前先还原
+  activeTermId = id;
+  for (const [tid, e] of termEntries) {
+    const on = tid === id;
+    e.tab.classList.toggle('active', on);
+    if (on) e.tab.classList.remove('dirty'); // 切到当前窗即视为已读
+    // 标签页模式 pane 叠层只显示当前；平铺模式 CSS 让全部可见，active 只高亮边框
+    e.pane.classList.toggle('active', on);
+  }
+  fitTerm(id, ent); // pane 可见后再 fit（隐藏状态下拿不到尺寸）
+  termStatus(ent);
+  ent.tab.scrollIntoView({ block: 'nearest', inline: 'nearest' }); // tab 条横滚时保证当前窗可见
+  focusTerm();
+}
+
+// 聚焦输入承接方：PC 聚焦 xterm 本体；触屏聚焦隐藏代理（键盘弹起由它触发）
+function focusTerm() {
+  if (!isTouch) {
+    const ent = termEntries.get(activeTermId);
+    if (ent) ent.xt.focus();
+    return;
+  }
+  if (!$('term-input').value) resetTermInput();
+  $('term-input').focus({ preventScroll: true });
+}
+
+// 按容器尺寸重算 cols/rows，并通知 Worker 端 PTY 同步窗口大小
+function fitTerm(id, ent) {
+  try { ent.fit.fit(); } catch { return; }
+  if (id === activeTermId) $('tf-size').textContent = `${ent.xt.cols}×${ent.xt.rows}`;
+  if (wsReady) sendWs({ type: 'session.resize', sessionId: id, cols: ent.xt.cols, rows: ent.xt.rows });
+}
+
+// fit 所有当前可见终端：平铺布局全部（最小化的跳过）；标签页模式仅 active；最大化时只 fit 最大化窗格
+function fitVisibleTerms() {
+  for (const [id, ent] of termEntries) {
+    if (ent.minimized) continue;
+    if (termMaxId) {
+      if (id === termMaxId) fitTerm(id, ent);
+    } else if (termLayout !== 'tabs' || id === activeTermId) {
+      fitTerm(id, ent);
+    }
+  }
+}
+
+// 应用布局模式：标签页（叠层）/ 行 / 列 / 网格，按未最小化终端数重算行列，再重 fit；
+// 会话 tab 只在「标签页」布局显示（平铺时所有终端同屏可见，tab 冗余）。
+// 最小化只存在于平铺布局（停靠图标在底部最小化栏承接）；切去「标签页」前先还原
+// 所有最小化窗格（该布局下窗格头按钮隐藏，无处再最小化，与 mwt 一致）
+function applyTermLayout() {
+  const body = $('term-body');
+  const tiled = termLayout !== 'tabs';
+  if (!tiled) {
+    for (const [, e] of termEntries) {
+      if (!e.minimized) continue;
+      e.minimized = false;
+      e.pane.classList.remove('minimized');
+      removeMinIcon(e);
+    }
+  }
+  body.classList.toggle('tiled', tiled);
+  body.dataset.layout = termLayout;
+  syncTabsBar(); // 标签页布局才有 tab 条；平铺时整条收起（选择器已在 topbar）
+  document.querySelectorAll('#term-layout-btns button').forEach((b) => {
+    b.classList.toggle('active', b.dataset.layout === termLayout);
+  });
+  const n = [...termEntries.values()].filter((e) => !e.minimized).length;
+  if (termLayout === 'grid') {
+    body.style.setProperty('--cols', String(n <= 1 ? 1 : (n <= 4 ? 2 : 3)));
+  } else if (termLayout === 'columns') {
+    body.style.setProperty('--n', String(Math.max(1, n)));
+  }
+  $('tf-hints').textContent = tiled
+    ? 'Alt+1~9 切窗 · Alt+←/→ 相邻 · Alt+M 最大化 · Alt+- 最小化 · Alt+0 还原 · Alt+S/R/C/G 布局 · Alt+F 全屏'
+    : 'Alt+1~9 切窗 · Alt+←/→ 相邻 · Alt+M 最大化 · Alt+S/R/C/G 布局 · Alt+F 全屏';
+  updateTermEmpty();
+  updateTermFoot();
+  setTimeout(fitVisibleTerms, 60); // 等布局切换稳定再重 fit
+}
+
+// 最大化：单个窗格独占 #term-body（再点/再按 Alt+M 还原）
+function toggleTermMax(id) {
+  const ent = termEntries.get(id);
+  if (!ent) return;
+  if (ent.minimized) restoreTerm(id);
+  termMaxId = termMaxId === id ? null : id;
+  activateTerm(id);
+  syncTermMax();
+}
+function syncTermMax() {
+  const body = $('term-body');
+  body.classList.toggle('maxed', !!termMaxId);
+  for (const [tid, e] of termEntries) {
+    const on = tid === termMaxId;
+    e.pane.classList.toggle('maxed', on);
+    e.maxBtn.textContent = on ? '⤡' : '⤢';
+    e.maxBtn.title = on ? '还原（Alt+M）' : '最大化（Alt+M）';
+  }
+  updateTermFoot();
+  setTimeout(fitVisibleTerms, 60);
+}
+
+// 最小化停靠图标（底部状态栏的最小化栏）：标题 + 活动圆点，点图标还原该窗格；
+// 图标插在「全部还原」钮之前，无图标时整栏收起（与 mwt minimized-bar 一致）
+function addMinIcon(id) {
+  const ent = termEntries.get(id);
+  if (!ent || ent.minIcon) return;
+  const icon = document.createElement('button');
+  icon.type = 'button';
+  icon.className = 'min-icon';
+  icon.title = '还原该终端';
+  icon.innerHTML = '<span class="mi-title"></span><span class="mi-dot"></span>';
+  icon.querySelector('.mi-title').textContent = ent.label; // textContent 天然防注入
+  icon.addEventListener('click', () => activateTerm(id));
+  const bar = $('minimized-bar');
+  bar.insertBefore(icon, $('min-restore-all'));
+  bar.classList.remove('hidden');
+  ent.minIcon = icon;
+}
+function removeMinIcon(ent) {
+  if (!ent || !ent.minIcon) return;
+  ent.minIcon.remove();
+  ent.minIcon = null;
+  const bar = $('minimized-bar');
+  if (!bar.querySelector('.min-icon')) bar.classList.add('hidden');
+}
+
+// 最小化：窗格从平铺布局里收起，停靠为底部最小化栏的图标（点图标或 Alt+0 还原）；
+// 仅平铺布局可用——「标签页」布局窗格头按钮本就隐藏（由 tab 条承接），与 mwt 一致
+function minimizeTerm(id) {
+  if (termLayout === 'tabs') return;
+  const ent = termEntries.get(id);
+  if (!ent || ent.minimized) return;
+  if (termMaxId === id) { termMaxId = null; syncTermMax(); }
+  ent.minimized = true;
+  ent.pane.classList.remove('active');
+  ent.pane.classList.add('minimized');
+  addMinIcon(id);
+  if (activeTermId === id) {
+    activeTermId = null;
+    const next = [...termEntries.entries()].find(([tid, e]) => tid !== id && !e.minimized);
+    if (next) activateTerm(next[0]);
+  }
+  applyTermLayout(); // 可见窗格数有变：重算行列、空态与状态栏
+}
+function restoreTerm(id) {
+  const ent = termEntries.get(id);
+  if (!ent || !ent.minimized) return;
+  ent.minimized = false;
+  ent.pane.classList.remove('minimized');
+  removeMinIcon(ent);
+  applyTermLayout();
+}
+function restoreAllTerms() {
+  let changed = false;
+  for (const [, e] of termEntries) {
+    if (!e.minimized) continue;
+    e.minimized = false;
+    e.pane.classList.remove('minimized');
+    removeMinIcon(e);
+    changed = true;
+  }
+  if (changed) applyTermLayout();
+}
+
+// 相邻切换（Alt+←/→）：在未最小化终端里按打开顺序环绕
+function stepTerm(dir) {
+  const ids = [...termEntries.entries()].filter(([, e]) => !e.minimized).map(([id]) => id);
+  if (!ids.length) return;
+  const i = ids.indexOf(activeTermId);
+  activateTerm(ids[(i + dir + ids.length) % ids.length]);
+}
+
+// 布局切换：按钮与快捷键共用，偏好持久化；切换即清除最大化（mwt：布局优先于最大化）
+function setTermLayout(layout) {
+  if (!TERM_LAYOUTS.includes(layout)) return;
+  if (termMaxId) { termMaxId = null; syncTermMax(); }
+  termLayout = layout;
+  localStorage.setItem('rw_termLayout', layout);
+  applyTermLayout();
+}
+
+function openTerm(t) {
+  const ent = ensureTerm(t);
+  if (!ent) return;
+  // 打开另一扇窗先退出最大化（mwt：新窗口会先还原最大化），否则新窗格被挡在最大化窗后不可见
+  if (termMaxId && termMaxId !== t.id) { termMaxId = null; syncTermMax(); }
+  applyTermLayout(); // 终端数可能有变：重算布局类与行列
+  activateTerm(t.id);
+  // 重复打开不重复 attach：回看缓冲只回补一次，避免终端内容翻倍；
+  // 通道未就绪时不发（免误报「未连接」），hello 重连后会给所有已开窗格补 attach
+  if (!ent.attached) {
+    ent.attached = true;
+    ent.pendingAttach = true;
+    if (wsReady) sendWs({ type: 'pty.attach', sessionId: t.id }); // 取回看缓冲 + 会话存活状态
+  }
+  termStatus(ent);
+}
+
+// 释放终端窗格（不动 tab）：✕ 关窗与服务端清理会话时调用
+function disposePane(id) {
+  const ent = termEntries.get(id);
+  if (!ent) return;
+  removeMinIcon(ent); // 最小化中被关闭：同步撤掉停靠图标
+  termEntries.delete(id);
+  if (termMaxId === id) { termMaxId = null; $('term-body').classList.remove('maxed'); }
+  try { ent.xt.dispose(); } catch { /* 已释放 */ }
+  ent.pane.remove();
+  if (activeTermId === id) {
+    activeTermId = null;
+    const next = termEntries.keys().next().value;
+    if (next) activateTerm(next);
+  }
+  applyTermLayout(); // 终端数有变：重算并排列数
+  updateTermEmpty();
+}
+
+$('term-body').addEventListener('click', focusTerm);
+// 布局切换：并排 / 横排 / 网格 / 标签页，偏好持久化
+document.querySelectorAll('#term-layout-btns button').forEach((btn) => {
+  btn.addEventListener('click', () => setTermLayout(btn.dataset.layout));
+});
+$('min-restore-all').addEventListener('click', restoreAllTerms);
+$('empty-new-session').addEventListener('click', () => $('hdr-new-session').click());
+
+// ---------- 触屏键盘代理：隐藏 textarea 承接击键；换行统一归一成 \r 交给 PTY ----------
+// 常驻一个哨兵字符：手机键盘在空 textarea 上按退格不产生任何事件，
+// 哨兵被删掉即代表一次 Backspace（发 \x7f），随后立即补回
+const TERM_SENTINEL = '\u00a0';
+
+function resetTermInput() {
+  const el = $('term-input');
+  el.value = TERM_SENTINEL;
+  try { el.setSelectionRange(1, 1); } catch { /* 个别浏览器不支持，忽略 */ }
+}
+
+$('term-input').addEventListener('input', (ev) => {
+  const el = ev.target;
+  let val = el.value;
+  if (!val) {
+    // 哨兵被删 = 用户按了退格
+    if (activeTermId) sendWs({ type: 'session.input', sessionId: activeTermId, data: '\x7f' });
+    resetTermInput();
+    return;
+  }
+  if (val.startsWith(TERM_SENTINEL)) val = val.slice(TERM_SENTINEL.length);
+  resetTermInput();
+  if (activeTermId && val) {
+    sendWs({ type: 'session.input', sessionId: activeTermId, data: val.replace(/\n/g, '\r') });
+  }
+});
+$('term-input').addEventListener('keydown', (ev) => {
+  if (ev.key === 'Enter') {
+    ev.preventDefault(); // 拦住换行，直接发回车，避免 input 事件补发 \n
+    if (activeTermId) sendWs({ type: 'session.input', sessionId: activeTermId, data: '\r' });
+  }
+});
+document.querySelectorAll('#term-bar button').forEach((btn) => {
+  btn.addEventListener('click', () => {
+    if (!activeTermId) return;
+    sendWs({ type: 'session.input', sessionId: activeTermId, data: KEY_SEQ[btn.dataset.key] });
+    focusTerm();
+  });
+});
+
+// ---------- 快捷键（Alt/⌥ 组合，PC 物理键盘）：捕获阶段拦截并 preventDefault/stopPropagation，
+// 避免 xterm 把这些按键转发进 pty；用 ev.code 匹配（mac 下 Alt+字母的 ev.key 会变特殊字符） ----------
+document.addEventListener('keydown', (ev) => {
+  if (!termEntries.size) return;
+  // 焦点在页头表单（密钥输入/下拉）时不抢键；终端与触屏键盘代理（textarea）照常响应
+  const tag = ev.target && ev.target.tagName;
+  if (tag === 'INPUT' || tag === 'SELECT') return;
+  if (!ev.altKey || ev.ctrlKey || ev.metaKey || ev.shiftKey) return;
+  const LAYOUT_KEYS = { KeyS: 'tabs', KeyR: 'rows', KeyC: 'columns', KeyG: 'grid' };
+  let handled = true;
+  if (/^Digit[1-9]$/.test(ev.code)) { // Alt+1~9：切到第 N 个终端（按打开顺序）
+    const ids = [...termEntries.keys()];
+    const id = ids[Number(ev.code.slice(5)) - 1];
+    if (id) activateTerm(id); else handled = false;
+  } else if (ev.code === 'ArrowRight' || ev.code === 'ArrowLeft') {
+    stepTerm(ev.code === 'ArrowRight' ? 1 : -1);
+  } else if (ev.code === 'KeyM') {
+    if (activeTermId) toggleTermMax(activeTermId); else handled = false;
+  } else if (ev.code === 'Minus') {
+    if (activeTermId) minimizeTerm(activeTermId); else handled = false;
+  } else if (ev.code === 'Digit0') {
+    restoreAllTerms();
+  } else if (ev.code === 'KeyF') {
+    toggleFs(document.documentElement);
+  } else if (LAYOUT_KEYS[ev.code]) {
+    setTermLayout(LAYOUT_KEYS[ev.code]);
+  } else {
+    handled = false;
+  }
+  if (handled) { ev.preventDefault(); ev.stopPropagation(); }
+}, true);
+
+// ---------- 全屏（Fullscreen API：整页全屏，入口只有页头按钮与 Alt+F）----------
+function fsElement() { return document.fullscreenElement || document.webkitFullscreenElement; }
+function exitFs() {
+  if (!fsElement()) return;
+  (document.exitFullscreen || document.webkitExitFullscreen).call(document);
+}
+function toggleFs(el) {
+  if (fsElement()) { exitFs(); return; }
+  try {
+    const p = el.requestFullscreen ? el.requestFullscreen()
+      : (el.webkitRequestFullscreen ? el.webkitRequestFullscreen() : null);
+    if (p && p.catch) p.catch(() => toast('进入全屏失败（浏览器限制，请重试）'));
+    else if (!p) toast('当前浏览器不支持全屏');
+  } catch { toast('当前浏览器不支持全屏'); }
+}
+function syncFsButtons() {
+  const on = !!fsElement();
+  $('hdr-fullscreen').querySelector('span').textContent = on ? '退出全屏' : '全屏';
+  $('ic-fs').setAttribute('href', on ? '#i-shrink' : '#i-expand');
+}
+document.addEventListener('fullscreenchange', () => {
+  syncFsButtons();
+  setTimeout(fitVisibleTerms, 120); // 全屏进出后视口尺寸变了，终端重 fit
+});
+document.addEventListener('webkitfullscreenchange', syncFsButtons);
+$('hdr-fullscreen').addEventListener('click', () => toggleFs(document.documentElement));
+// 屏幕旋转/键盘弹起都会改变可用高度，延迟一点等布局稳定再 fit（有终端时）
+window.addEventListener('resize', () => { if (termEntries.size) setTimeout(fitVisibleTerms, 120); });
+
+// ---------- 轮询回退（仅 WS 不可用时生效）----------
+async function refresh() {
+  try {
+    const [{ sessions }, { workers }] = await Promise.all([
+      api('/api/sessions?limit=50'),
+      api('/api/worker/status'),
+    ]);
+    sessionCache.clear();
+    for (const t of sessions) sessionCache.set(t.id, t);
+    gotSnapshot = true;
+    syncTabs();
+    renderWorkers(workers);
+  } catch (err) {
+    toast(err.message);
+  }
+}
+setInterval(() => { if (!wsReady && !wsAuthRejected && hasSecret()) refresh(); }, 4000);
+
+applyTheme(currentTheme()); // 主题初始化：同步按钮文案与 theme-color（head 已设好 data-theme）
+updateTermEmpty();          // 首屏空态提示（无打开的终端时）
+applyTermLayout();          // 持久化的布局偏好首屏生效（平铺布局藏 tab 条、同步快捷键提示）
+connectWS();
+// 首次加载兜底：WS 握手前的空档先用 REST 铺一次数据（无密钥时不发请求）
+if (hasSecret()) refresh();
+else setConnMode(false);       // 无密钥不发起任何连接，状态条直接落到轮询态