@jesonliu/lark-claudecode-bridge 0.17.0 → 0.18.0

package/assets/web/js/pages/permissions.js

@@ -0,0 +1,109 @@
+// ============ 权限 ============
+import { S, $, esc, toast, saveDoc } from '../core.js';
+
+let permTab = 'allow'; // 页内子 tab 状态：免确认工具 / 危险命令黑名单（重渲染保持）
+function renderPermissions(el) {
+  const p = S.doc.permissions || (S.doc.permissions = {});
+  p.allow_tools = p.allow_tools || [];
+  p.dangerous_commands = p.dangerous_commands || [];
+  el.innerHTML = `
+  <div class="card">
+    <div class="subtabs">
+      <button data-t="allow" class="${permTab === 'allow' ? 'active' : ''}">免确认工具</button>
+      <button data-t="danger" class="${permTab === 'danger' ? 'active' : ''}">危险命令黑名单</button>
+    </div>
+    <div id="permPanel"></div>
+  </div>`;
+  el.querySelectorAll('.subtabs button').forEach((b) =>
+    b.onclick = () => { permTab = b.dataset.t; renderPermissions(el); });
+  const panel = $('#permPanel');
+  if (permTab === 'danger') renderDangerTab(panel, p, el);
+  else renderAllowTab(panel, p, el);
+}
+
+function renderAllowTab(panel, p, el) {
+  const defaults = S.status?.permissionDefaults?.allowTools || [];
+  const isDefault = defaults.length > 0 && JSON.stringify(p.allow_tools) === JSON.stringify(defaults);
+  panel.innerHTML = `
+    <div class="desc">名单内工具直接放行不弹确认卡（配置即整体替换内置默认）。Bash 仍受危险命令黑名单约束。</div>
+    <div class="row" style="max-width:480px;margin:8px 0 10px">
+      <input type="text" id="newTool" placeholder="工具名，如 Write">
+      <div class="btn-wrap"><button class="btn sm" id="addTool">添加</button></div>
+      <div class="btn-wrap"><button class="btn sm" id="resetTools" ${defaults.length ? '' : 'disabled title="status 不可用，无法取默认值"'}>恢复默认</button></div>
+    </div>
+    ${p.allow_tools.length === 0 ? '<div style="background:#fff3e0;color:var(--warn);border-radius:7px;padding:7px 12px;margin:8px 0">⚠️ 名单为空：所有工具（含 Write/Edit）都会弹确认卡</div>' : ''}
+    ${isDefault ? '<div class="hint" style="margin:8px 0"><span class="tag off">与内置默认一致</span></div>' : ''}
+    <table><tbody id="toolBody"></tbody></table>
+    <div class="footer-note">权限改动即时保存并热生效（已有会话的下一个工具调用即用新名单）。plan 模式下写操作仍会经此判定：白名单命中直通，未命中弹确认卡。</div>`;
+  $('#toolBody').innerHTML = p.allow_tools.map((t, i) =>
+    `<tr><td><code>${esc(t)}</code></td><td style="width:80px"><button class="btn sm danger" data-i="${i}">删除</button></td></tr>`).join('')
+    || '<tr><td colspan="2" class="hint">（空）</td></tr>';
+  // 即时保存：低风险高频操作，免去「改完再点保存」两步；失败回滚内存保持一致
+  $('#toolBody').querySelectorAll('button').forEach((b) =>
+    b.onclick = async () => {
+      const old = [...p.allow_tools];
+      p.allow_tools.splice(Number(b.dataset.i), 1);
+      if (!await saveDoc()) p.allow_tools = old;
+    });
+  $('#addTool').onclick = async () => {
+    const v = $('#newTool').value.trim();
+    if (!v || p.allow_tools.includes(v)) return;
+    p.allow_tools.push(v);
+    if (!await saveDoc()) p.allow_tools.splice(p.allow_tools.indexOf(v), 1);
+    else if ($('#newTool')) $('#newTool').value = '';
+  };
+  $('#resetTools').onclick = async () => {
+    if (!defaults.length) return;
+    if (!window.confirm('恢复为内置默认名单？当前自定义项将被覆盖（立即保存生效）。')) return;
+    const old = [...p.allow_tools];
+    p.allow_tools = [...defaults];
+    if (!await saveDoc()) p.allow_tools = old;
+  };
+}
+
+function renderDangerTab(panel, p, el) {
+  const defaults = S.status?.permissionDefaults?.dangerousCommands || [];
+  const isDefault = defaults.length > 0 && JSON.stringify(p.dangerous_commands) === JSON.stringify(defaults);
+  panel.innerHTML = `
+    <div class="desc">正则源串（不区分大小写），命中即弹确认卡。删除正则 = 放宽对应命令为直通，请谨慎。</div>
+    <div class="row" style="max-width:680px;margin:8px 0 10px">
+      <input type="text" id="newDc" placeholder="正则源串，如 \\bgit\\s+push\\b.*--force">
+      <div class="btn-wrap"><button class="btn sm" id="addDc">添加</button></div>
+      <div class="btn-wrap"><button class="btn sm" id="resetDc" ${defaults.length ? '' : 'disabled title="status 不可用，无法取默认值"'}>恢复默认</button></div>
+    </div>
+    ${p.dangerous_commands.length === 0 ? '<div style="background:#fee;color:var(--danger);border-radius:7px;padding:7px 12px;margin:8px 0">⚠️ 黑名单为空：所有 Bash 命令（含 rm -rf、sudo）将免确认直通，请确认有意为之</div>' : ''}
+    ${isDefault ? '<div class="hint" style="margin:8px 0"><span class="tag off">与内置默认一致</span></div>' : ''}
+    <table><tbody id="dcBody"></tbody></table>
+    <div class="footer-note">权限改动即时保存并热生效（已有会话的下一个工具调用即用新名单）。plan 模式下写操作仍会经此判定：白名单命中直通，未命中弹确认卡。</div>`;
+  $('#dcBody').innerHTML = p.dangerous_commands.map((s, i) =>
+    `<tr><td style="width:90%"><code>${esc(s)}</code></td><td><button class="btn sm danger" data-i="${i}">删除</button></td></tr>`).join('')
+    || '<tr><td colspan="2" class="hint">（空）</td></tr>';
+  $('#dcBody').querySelectorAll('button').forEach((b) =>
+    b.onclick = async () => {
+      const old = [...p.dangerous_commands];
+      p.dangerous_commands.splice(Number(b.dataset.i), 1);
+      if (!await saveDoc()) p.dangerous_commands = old;
+    });
+  $('#addDc').onclick = async () => {
+    const v = $('#newDc').value.trim();
+    if (!v) return;
+    try { new RegExp(v, 'i'); } catch (e) { return toast(`正则无效：${e.message}`, true); }
+    p.dangerous_commands.push(v);
+    if (!await saveDoc()) p.dangerous_commands.splice(p.dangerous_commands.indexOf(v), 1);
+    else if ($('#newDc')) $('#newDc').value = '';
+  };
+  $('#resetDc').onclick = async () => {
+    if (!defaults.length) return;
+    if (!window.confirm('恢复为内置默认黑名单？当前自定义项将被覆盖（立即保存生效）。')) return;
+    const old = [...p.dangerous_commands];
+    p.dangerous_commands = [...defaults];
+    if (!await saveDoc()) p.dangerous_commands = old;
+  };
+}
+
+export const page = {
+  id: 'permissions',
+  title: '权限',
+  icon: '<path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1 1 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"/>',
+  render: renderPermissions,
+};

package/assets/web/js/pages/plugins.js

@@ -0,0 +1,285 @@
+// ============ 插件 ============
+import { $, esc, toast, api } from '../core.js';
+
+// 点击 combobox 之外收起面板的监听只注册一次（模块级标志，等价原 document.body 标记法）
+let comboHideBound = false;
+
+async function renderPlugins(el) {
+  el.innerHTML = `
+  <div class="card">
+    <h3>Claude Code 插件</h3>
+    <div class="desc">两处目录的已启用插件都会自动加载（managed 托管目录优先）：本机 <code>~/.claude</code>（来源「本机」，与本机 claude CLI 共用）与 bridge 托管目录 <code id="pluginDir">…</code>。装好后下一条消息自动加载。飞书端同样可用 <code>/plugin install xxx@marketplace</code>（仅管理员）。</div>
+    <table><thead><tr><th>插件</th><th>市场</th><th>来源</th><th>版本</th><th style="width:90px">状态</th><th style="width:250px">操作</th></tr></thead>
+    <tbody id="plBody"><tr><td colspan="6" class="hint">加载中…</td></tr></tbody></table>
+  </div>
+  <div class="card">
+    <h3>安装 / 市场</h3>
+    <div class="desc">安装来源为已添加的市场：新插件先「添加市场」，再从下拉选择安装。</div>
+    <label>从市场安装插件</label>
+    <div class="row" style="max-width:760px">
+      <div class="combo">
+        <input type="text" id="plInstall" placeholder="（加载中…）" autocomplete="off">
+        <div class="combo-panel" id="plInstallPanel" hidden></div>
+      </div>
+      <select id="plDir" style="max-width:170px">
+        <option value="user" selected>装到本机 ~/.claude</option>
+        <option value="bridge">装到 bridge 托管目录</option>
+      </select>
+      <button class="btn primary" id="plDoInstall">安装</button>
+    </div>
+    <div class="hint" style="margin:6px 0">默认装本机 ~/.claude：本机 claude CLI 与桥接器两处共用一份，无须安装两次。装好后下一条消息自动加载。</div>
+    <label style="margin-top:14px">管理市场</label>
+    <div class="row" style="max-width:760px">
+      <input type="text" id="plMarket" placeholder="marketplace git 地址或本机路径">
+      <select id="plMarketDir" style="max-width:170px">
+        <option value="user" selected>本机 ~/.claude</option>
+        <option value="bridge">bridge 托管目录</option>
+      </select>
+      <button class="btn" id="plDoMarketAdd">添加市场</button>
+      <button class="btn" id="plDoMarketUpdate">全部更新</button>
+    </div>
+    <div class="hint" style="margin:6px 0">「全部更新」= 刷新市场索引 + 逐个更新该目录所有已装插件。</div>
+    <pre class="report" id="plReport" style="display:none;margin-top:12px"></pre>
+  </div>`;
+  const report = (title, text) => {
+    $('#plReport').style.display = '';
+    $('#plReport').textContent = `${title}\n${text}`;
+  };
+  let available = [];        // 当前目录可装清单（扁平化，combobox 数据源）
+  let selectedInstall = '';  // 已选中安装参数 name@marketplace（输入改动即失效）
+  let installed = [];        // 已装清单缓存（update-all 前端编排取该目录步骤用）
+  const busyText = {
+    install: '安装中…', uninstall: '卸载中…', update: '更新中…', 'update-all': '更新中…',
+    'marketplace-add': '添加中…', 'marketplace-remove': '移除中…', enable: '处理中…', disable: '处理中…',
+  };
+  const opNames = { install: '安装', uninstall: '卸载', update: '更新', 'update-all': '全部更新', 'marketplace-add': '添加市场', 'marketplace-remove': '移除市场', enable: '启用', disable: '停用' };
+  const load = async () => {
+    try {
+      const r = await api('GET', '/api/plugins');
+      installed = r.plugins || [];
+      $('#pluginDir').textContent = r.configDir;
+      const body = $('#plBody');
+      if (!installed.length) {
+        body.innerHTML = '<tr><td colspan="6" class="hint">尚未安装任何插件</td></tr>';
+        return;
+      }
+      body.innerHTML = installed.map((p) => `
+        <tr>
+          <td><b>${esc(p.name)}</b></td>
+          <td>${esc(p.marketplace || '-')}</td>
+          <td>${p.source === 'bridge' ? '<span class="tag warn">bridge 托管</span>' : '<span class="tag off">本机 ~/.claude</span>'}</td>
+          <td class="hint">${esc(p.version || '-')}${p.latestVersion ? ` <span class="tag warn">→ ${esc(p.latestVersion)}</span>` : ''}</td>
+          <td>${p.enabled ? '<span class="tag ok">已启用</span>' : '<span class="tag off">未启用</span>'}</td>
+          <td>
+            <button class="btn sm" data-op="update" data-arg="${esc(p.key)}" data-dir="${p.source}">更新</button>
+            <button class="btn sm" data-op="${p.enabled ? 'disable' : 'enable'}" data-arg="${esc(p.key)}" data-dir="${p.source}">${p.enabled ? '停用' : '启用'}</button>
+            <button class="btn sm danger" data-op="uninstall" data-arg="${esc(p.key)}" data-dir="${p.source}">卸载</button>
+          </td>
+        </tr>`).join('');
+      body.querySelectorAll('button[data-op]').forEach((b) => b.onclick = () => {
+        const { op, arg, dir } = b.dataset;
+        // 影响性操作先二次确认（启用/安装/市场管理为新增类，无需确认）
+        if (op === 'disable' && !window.confirm(`确定要停用插件「${arg}」吗？\n停用后下一条消息不再加载该插件，可随时再启用。`)) return;
+        if (op === 'update' && !window.confirm(`确定要更新插件「${arg}」吗？\n更新后下一条消息按新版本加载。`)) return;
+        if (op === 'uninstall' && !window.confirm(`确定要卸载插件「${arg}」吗？\n卸载后需重新安装才能恢复，进行中的会话不受影响。`)) return;
+        // 慢操作走进度弹框；亚秒级启停走轻量 act（弹框一闪而过反而干扰）
+        if (op === 'enable' || op === 'disable') act(op, arg, dir, b);
+        else runOpDialog(op, arg, dir, b);
+      });
+    } catch (e) {
+      installed = [];
+      $('#plBody').innerHTML = `<tr><td colspan="6" class="hint">加载失败：${esc(e.message)}</td></tr>`;
+    }
+  };
+  /** 轻量操作（enable/disable 亚秒级）：按钮瞬时 loading + toast，不弹框 */
+  const act = async (op, arg, dir, btn) => {
+    const pageBtns = el.querySelectorAll('button');
+    const old = btn ? btn.textContent : '';
+    pageBtns.forEach((b) => { b.disabled = true; });
+    if (btn) btn.textContent = busyText[op] || '处理中…';
+    try {
+      const r = await api('POST', '/api/plugins/action', { op, arg, ...(dir ? { dir } : {}) });
+      report(r.ok ? `✅ ${op} 完成` : `❌ ${op} 失败`, r.text);
+      await load();
+      toast(r.ok ? `${opNames[op] || op}完成，下一条消息生效` : `${opNames[op] || op}失败：${r.text.slice(0, 120)}`, !r.ok);
+    } catch (e) {
+      report(`❌ ${op} 失败`, e.message);
+      toast(e.message, true);
+    } finally {
+      pageBtns.forEach((b) => { b.disabled = false; });
+      if (btn) btn.textContent = old;
+    }
+  };
+  /**
+   * 慢操作进度弹框（install/update/uninstall/marketplace-add/update-all）：
+   * spinner + 进度条 + 逐步日志。update-all 走前端编排（marketplace-update + 逐插件
+   * update，每步一请求）→ 进度真实（i/N）；单操作是单请求无内部进度 → 时间缓动模拟
+   * （前 2s 直线推进，之后渐缓封顶 90%，完成跳 100%）。进行中不可关闭；完成后列表刷新。
+   */
+  const runOpDialog = async (op, arg, dir, btn) => {
+    const dirLabel = dir === 'bridge' ? 'bridge 托管目录' : '本机 ~/.claude';
+    const title = op === 'update-all'
+      ? `全部更新（${dirLabel}）`
+      : `${opNames[op] || op} ${arg}${dir ? `（${dirLabel}）` : ''}`;
+    // update-all 编排步骤：刷新市场索引 + 该目录逐个已装插件（失败不中断，与后端聚合语义一致）
+    const steps = op === 'update-all'
+      ? [{ op: 'marketplace-update', arg: '', label: '刷新市场索引' },
+        ...installed.filter((p) => p.source === dir).map((p) => ({ op: 'update', arg: p.key, label: `更新 ${p.key}` }))]
+      : [{ op, arg, label: `${opNames[op] || op} ${arg}` }];
+    // 弹框 DOM（遮罩不可点击关闭；关闭按钮完成前不存在）
+    const mask = document.createElement('div');
+    mask.className = 'modal-mask';
+    mask.innerHTML = `
+    <div class="modal" role="dialog" aria-modal="true" style="width:min(640px,94vw)">
+      <div style="display:flex;align-items:center;gap:10px">
+        <div class="br-spin" style="margin:0"></div>
+        <b id="podTitle">${esc(title)}</b>
+      </div>
+      <div class="prog"><div class="prog-bar" id="podBar"></div></div>
+      <pre class="report" id="podLog" style="margin-top:12px;max-height:220px">正在执行 claude plugin …（安装/更新可能需要拉取仓库，请稍候）</pre>
+      <div class="savebar" style="justify-content:flex-end">
+        <button class="btn primary" id="podClose" hidden>关闭</button>
+      </div>
+    </div>`;
+    document.body.appendChild(mask);
+    const bar = mask.querySelector('#podBar');
+    const log = mask.querySelector('#podLog');
+    const spin = mask.querySelector('.br-spin');
+    const titleEl = mask.querySelector('#podTitle');
+    const closeBtn = mask.querySelector('#podClose');
+    const setBar = (pct) => { bar.style.width = `${pct}%`; };
+    const appendLog = (line) => { log.textContent += `\n${line}`; log.scrollTop = log.scrollHeight; };
+    // 单请求无内部进度：缓动模拟；update-all 用真实 i/N 不走此定时器
+    let fakePct = 0;
+    const startedAt = Date.now();
+    const timer = op === 'update-all' ? null : setInterval(() => {
+      const elapsed = Date.now() - startedAt;
+      fakePct = elapsed < 2000 ? Math.min(70, (elapsed / 2000) * 70) : Math.min(90, fakePct + 1);
+      setBar(fakePct);
+    }, 300);
+    // 操作互斥 + 被点按钮进行时文案（遮罩之外的双保险）
+    const pageBtns = el.querySelectorAll('button');
+    const old = btn ? btn.textContent : '';
+    pageBtns.forEach((b) => { b.disabled = true; });
+    if (btn) btn.textContent = busyText[op] || '处理中…';
+    report(`执行中：${op} ${arg}${dir ? `（${dirLabel}）` : ''}`, '…（安装/更新可能需要拉取仓库，请稍候）');
+    const close = async () => { mask.remove(); await Promise.all([load(), loadAvailable()]); };
+    try {
+      let allOk = true;
+      const lines = [];
+      for (let i = 0; i < steps.length; i++) {
+        const s = steps[i];
+        if (op === 'update-all') setBar(Math.round(((i + 1) / steps.length) * 100));
+        const r = await api('POST', '/api/plugins/action', { op: s.op, arg: s.arg, ...(dir ? { dir } : {}) });
+        const line = `${r.ok ? '✅' : '❌'} ${s.label}${r.ok ? '' : `：${(r.text || '').split('\n').slice(0, 3).join(' ⏎ ').slice(0, 300)}`}`;
+        lines.push(line);
+        appendLog(line);
+        if (!r.ok) allOk = false;
+      }
+      if (timer) clearInterval(timer);
+      setBar(100);
+      bar.classList.add('done');
+      spin.style.display = 'none';
+      titleEl.textContent = `${allOk ? '✅' : '❌'} ${title} · ${allOk ? '完成' : '部分失败（详见日志与底部全文）'}`;
+      report(allOk ? `✅ ${op} 完成` : `❌ ${op} 部分失败`, lines.join('\n'));
+      closeBtn.hidden = false;
+      closeBtn.onclick = () => void close();
+    } catch (e) {
+      if (timer) clearInterval(timer);
+      setBar(100);
+      spin.style.display = 'none';
+      titleEl.textContent = `❌ ${title} · 失败`;
+      appendLog(`❌ 请求失败：${e.message}`);
+      report(`❌ ${op} 失败`, e.message);
+      closeBtn.hidden = false;
+      closeBtn.onclick = () => void close();
+    } finally {
+      pageBtns.forEach((b) => { b.disabled = false; });
+      if (btn) btn.textContent = old;
+    }
+  };
+  /** 安装 combobox 数据：该目录已添加市场里的可安装插件（扁平化 + 关键词过滤面板） */
+  const loadAvailable = async () => {
+    const input = $('#plInstall');
+    if (!input) return;
+    try {
+      const r = await api('GET', `/api/plugins/available?dir=${$('#plDir').value}`);
+      available = [];
+      for (const m of r.marketplaces || []) {
+        for (const p of m.plugins || []) {
+          available.push({ key: `${p.name}@${m.name}`, name: p.name, market: m.name, version: p.version || '', description: p.description || '' });
+        }
+      }
+      $('#plDoInstall').disabled = !available.length;
+      input.placeholder = available.length ? '输入关键词搜索插件，从结果中选择' : '（请先在下方添加市场）';
+    } catch (e) {
+      available = [];
+      $('#plDoInstall').disabled = true;
+      input.placeholder = `（加载失败：${e.message}）`;
+    }
+    input.value = '';
+    selectedInstall = '';
+    hidePanel();
+  };
+  const hidePanel = () => { const p = $('#plInstallPanel'); if (p) p.hidden = true; };
+  const pickInstall = (key) => {
+    selectedInstall = key;
+    $('#plInstall').value = key;
+    hidePanel();
+  };
+  const showMatches = () => {
+    const panel = $('#plInstallPanel');
+    if (!panel) return;
+    const q = $('#plInstall').value.trim().toLowerCase();
+    const hits = q
+      ? available.filter((it) => `${it.name} ${it.description} ${it.market}`.toLowerCase().includes(q))
+      : available;
+    const shown = hits.slice(0, 50);
+    panel.hidden = false;
+    panel.innerHTML = shown.length
+      ? shown.map((it) => `<div class="combo-item" data-key="${esc(it.key)}"><b>${esc(it.name)}</b><span class="tag off">${esc(it.market)}</span>${it.version ? ` <span class="hint">v${esc(it.version)}</span>` : ''}${it.description ? `<div class="hint">${esc(it.description.slice(0, 80))}</div>` : ''}</div>`).join('')
+        + (hits.length > shown.length ? `<div class="combo-empty">仅显示前 ${shown.length} 项，继续输入关键词缩小范围</div>` : '')
+      : `<div class="combo-empty">${q ? '无匹配插件' : '（该目录还没有可安装插件）'}</div>`;
+    panel.querySelectorAll('.combo-item').forEach((item) => {
+      item.onmousedown = (e) => { e.preventDefault(); pickInstall(item.dataset.key); }; // mousedown+preventDefault 防输入框 blur 抢先收起面板
+    });
+  };
+  $('#plInstall').oninput = () => { selectedInstall = ''; showMatches(); };
+  $('#plInstall').onfocus = showMatches;
+  $('#plInstall').onkeydown = (e) => {
+    if (e.key === 'Enter') {
+      e.preventDefault();
+      const first = $('#plInstallPanel')?.querySelector('.combo-item');
+      if (first) pickInstall(first.dataset.key);
+    } else if (e.key === 'Escape') hidePanel();
+  };
+  // 点击 combobox 之外收起面板（只注册一次：hidePanel 内 $ 按 id 查询当前 DOM，重渲染后仍指向新面板）
+  if (!comboHideBound) {
+    comboHideBound = true;
+    document.addEventListener('click', (e) => {
+      if (!(e.target instanceof Element) || !e.target.closest('.combo')) hidePanel();
+    });
+  }
+  $('#plDoInstall').onclick = () => {
+    if (!selectedInstall) return toast('请从搜索结果中选择要安装的插件', true);
+    runOpDialog('install', selectedInstall, $('#plDir').value, $('#plDoInstall'));
+  };
+  $('#plDir').onchange = loadAvailable; // 安装目标目录切换 → 可装清单随之变化
+  $('#plDoMarketAdd').onclick = () => {
+    const v = $('#plMarket').value.trim();
+    if (!v) return toast('请填写 marketplace git 地址或本机路径', true);
+    // 安装下拉的目录跟随市场添加的目标目录：两处 select 独立时容易出现
+    // 「市场添加到了 bridge、安装下拉还在 user」，新市场里的插件在默认视图搜不到
+    $('#plDir').value = $('#plMarketDir').value;
+    runOpDialog('marketplace-add', v, $('#plMarketDir').value, $('#plDoMarketAdd'));
+  };
+  $('#plDoMarketUpdate').onclick = () => runOpDialog('update-all', '', $('#plMarketDir').value, $('#plDoMarketUpdate'));
+  await Promise.all([load(), loadAvailable()]);
+}
+
+export const page = {
+  id: 'plugins',
+  title: '插件',
+  icon: '<path d="M19.439 7.85c-.049.322.059.648.289.878l1.568 1.568c.47.47.706 1.087.706 1.704s-.235 1.233-.706 1.704l-1.611 1.611a.98.98 0 0 1-.837.276c-.47-.07-.802-.48-.968-.925a2.501 2.501 0 1 0-3.214 3.214c.446.166.855.497.925.968a.979.979 0 0 1-.276.837l-1.61 1.61a2.404 2.404 0 0 1-1.705.707 2.402 2.402 0 0 1-1.704-.706l-1.568-1.568a1.026 1.026 0 0 0-.877-.29c-.493.074-.84.504-1.02.968a2.5 2.5 0 1 1-3.237-3.237c.464-.18.894-.527.967-1.02a1.026 1.026 0 0 0-.289-.877l-1.568-1.568A2.402 2.402 0 0 1 1.998 12c0-.617.236-1.234.706-1.704L4.23 8.77c.24-.24.581-.353.917-.303.515.077.877.528 1.073 1.01a2.5 2.5 0 1 0 3.259-3.259c-.482-.196-.933-.558-1.01-1.073-.05-.336.062-.676.303-.917l1.525-1.525A2.402 2.402 0 0 1 12 1.998c.617 0 1.234.236 1.704.706l1.568 1.568c.23.23.556.338.877.29.493-.074.84-.504 1.02-.968a2.5 2.5 0 1 1 3.237 3.237c-.464.18-.894.527-.967 1.02Z"/>',
+  render: renderPlugins,
+};

package/assets/web/js/pages/slash.js

@@ -0,0 +1,128 @@
+// ============ 斜杠命令（远端直操作飞书 API；本页与 config.yaml / 保存按钮无关） ============
+import { S, $, esc, toast, api } from '../core.js';
+import { openDrawer, closeDrawer } from '../ui.js';
+
+function renderSlash(el) {
+  el.innerHTML = `
+  <div class="card">
+    <h3>飞书斜杠命令（远端管理）</h3>
+    <div class="desc">直接读写飞书开放平台已注册的斜杠命令；聊天输入 <code>/</code> 弹出指令面板，选中后可继续输入描述再发送。需给应用开通 <code>application:app_slash_command</code> 读写权限并发布版本；改动约 5 分钟后生效（PC 端 7.70+）。<b>本页操作即时提交飞书，与底部「保存」按钮无关。</b></div>
+    <div class="row" style="align-items:end">
+      <div style="max-width:320px"><label>目标应用</label><select id="scApp"></select></div>
+      <button class="btn" id="scReload">刷新列表</button>
+      <button class="btn primary" id="scAdd">+ 新增命令</button>
+      <button class="btn" id="scBuiltins">补齐内置命令</button>
+    </div>
+    <table style="margin-top:12px"><thead><tr><th style="width:170px">命令</th><th>描述</th><th style="width:150px">图标</th><th style="width:130px">操作</th></tr></thead>
+    <tbody id="scBody"><tr><td colspan="4" style="padding:36px 0"><div class="br-spin-sm"></div><div class="hint" style="text-align:center">正在从飞书拉取斜杆命令…</div></td></tr></tbody></table>
+    <pre class="report" id="scReport" style="display:none;margin-top:12px"></pre>
+  </div>`;
+  const appSel = $('#scApp');
+  (S.status?.apps || []).forEach((a) => {
+    const opt = document.createElement('option');
+    opt.value = a.name;
+    opt.textContent = `${a.name}（${a.appId}）`;
+    appSel.appendChild(opt);
+  });
+  const showReport = (title, content) => {
+    $('#scReport').style.display = '';
+    $('#scReport').textContent = `${title}\n${content}`;
+  };
+  const loadRemote = async () => {
+    if (!appSel.value) { $('#scBody').innerHTML = '<tr><td colspan="4" class="hint">无可用应用（先到「飞书应用」页配置并保存）</td></tr>'; return; }
+    $('#scBody').innerHTML = '<tr><td colspan="4" style="padding:36px 0"><div class="br-spin-sm"></div><div class="hint" style="text-align:center">正在从飞书拉取斜杆命令…</div></td></tr>';
+    try {
+      const r = await api('GET', `/api/slash-commands/remote?app=${encodeURIComponent(appSel.value)}`);
+      $('#scBody').innerHTML = r.remote.map((x) => `
+        <tr data-cid="${esc(x.command_id)}" data-cmd="${esc(x.command)}">
+          <td><code>/${esc(x.command)}</code></td>
+          <td>${esc(x.description?.default_value || '')}</td>
+          <td class="hint">${esc(x.description?.icon?.icon_key || '—')}</td>
+          <td>
+            <button class="btn sm" data-op="edit">编辑</button>
+            <button class="btn sm danger" data-op="del">删除</button>
+          </td>
+        </tr>`).join('') || '<tr><td colspan="4" class="hint">远端暂无命令；点「补齐内置命令」一键注册 bridge 内置指令</td></tr>';
+      $('#scBody').querySelectorAll('button[data-op]').forEach((b) => b.onclick = () => {
+        const tr = b.closest('tr');
+        if (b.dataset.op === 'del') return delRemote(tr.dataset.cid, tr.dataset.cmd);
+        openSlashDrawer({
+          commandId: tr.dataset.cid,
+          command: tr.dataset.cmd,
+          description: tr.children[1].textContent,
+          icon: tr.children[2].textContent === '—' ? '' : tr.children[2].textContent,
+        });
+      });
+    } catch (e) {
+      $('#scBody').innerHTML = `<tr><td colspan="4" class="hint">加载失败：${esc(e.message)}（确认已开通斜杠命令权限后点「刷新列表」重试）</td></tr>`;
+    }
+  };
+  const delRemote = async (cid, cmd) => {
+    if (!window.confirm(`确认删除远端命令 /${cmd}？（约 5 分钟后从飞书面板消失，不可恢复）`)) return;
+    try {
+      await api('POST', '/api/slash-commands/action', { op: 'delete', app: appSel.value, commandId: cid });
+      toast(`已删除 /${cmd}`);
+      loadRemote();
+    } catch (e) { toast(e.message, true); }
+  };
+  const openSlashDrawer = ({ commandId, command, description, icon }) => {
+    const isCreate = !commandId;
+    openDrawer({
+      title: isCreate ? '新增斜杠命令' : `编辑 /${command}`,
+      bodyHtml: `
+        <label>命令（不带 /）</label>
+        <input type="text" id="dcCmd" ${isCreate ? '' : 'disabled title="飞书侧命令名不可修改（如需改名请删除后重建）"'} value="${esc(command || '')}" placeholder="produce">
+        <label>描述（指令面板展示）</label>
+        <input type="text" id="dcDesc" value="${esc(description || '')}" placeholder="内容生产流程">
+        <label>图标 icon_key（可空，取值见飞书开放平台图标列表）</label>
+        <input type="text" id="dcIcon" value="${esc(icon || '')}" placeholder="skill_outlined">`,
+      footHtml: `<button class="btn primary" id="dcSave">${isCreate ? '创建（即时提交飞书）' : '保存（即时提交飞书）'}</button>`,
+      onMount: () => {
+        document.getElementById('dcSave').onclick = async () => {
+          const cmd = document.getElementById('dcCmd').value.trim();
+          const desc = document.getElementById('dcDesc').value.trim();
+          const ic = document.getElementById('dcIcon').value.trim();
+          if (!desc) return toast('描述不能为空', true);
+          try {
+            if (isCreate) {
+              if (!cmd) return toast('命令名不能为空', true);
+              await api('POST', '/api/slash-commands/action', { op: 'create', app: appSel.value, command: cmd, description: desc, icon: ic });
+            } else {
+              await api('POST', '/api/slash-commands/action', { op: 'update', app: appSel.value, commandId, description: desc, icon: ic });
+            }
+            toast(isCreate ? `已创建 /${cmd}` : '已保存');
+            closeDrawer();
+            loadRemote();
+          } catch (e) { toast(e.message, true); }
+        };
+      },
+    });
+  };
+  appSel.onchange = loadRemote;
+  $('#scReload').onclick = loadRemote;
+  $('#scAdd').onclick = () => openSlashDrawer({ command: '', description: '', icon: '' });
+  $('#scBuiltins').onclick = async () => {
+    if (!appSel.value) return;
+    $('#scBuiltins').disabled = true;
+    try {
+      const r = await api('POST', '/api/slash-commands/sync', { app: appSel.value, mode: 'builtins-only' });
+      const lines = [
+        r.created.length ? `✅ 新建 ${r.created.length}：${r.created.join('、')}` : '· 内置命令已齐全（无新建）',
+        ...(r.errors.length ? [`⚠️ 失败 ${r.errors.length}：`, ...r.errors.map((e) => `  ${e.command}: ${e.error}`)] : []),
+        '（只补缺失的内置命令，不会删除或修改远端已有命令）',
+      ];
+      showReport('补齐内置命令完成（约 5 分钟后飞书生效）', lines.join('\n'));
+      toast(r.errors.length ? `补齐完成，但 ${r.errors.length} 条失败（详见报告）` : '✅ 内置命令已补齐，约 5 分钟后生效');
+      loadRemote();
+    } catch (e) { showReport('补齐失败', e.message); toast(e.message, true); }
+    $('#scBuiltins').disabled = false;
+  };
+  loadRemote();
+}
+
+export const page = {
+  id: 'slash',
+  title: '斜杠命令',
+  icon: '<path d="m4 17 6-6-6-6"/><path d="M12 19h8"/>',
+  render: renderSlash,
+};

package/assets/web/js/pages/workspaces.js

@@ -0,0 +1,100 @@
+// ============ 工作区（行内编辑 + 卡级保存；改动落盘后热生效） ============
+import { S, $, esc, toast, cardDirty, applyDirty } from '../core.js';
+import { saveBarHtml, dirtyDotHtml, bindSaveBar, pickDirectory } from '../ui.js';
+
+function renderWorkspaces(el) {
+  const doc = S.doc;
+  doc.workspaces = doc.workspaces || [];
+  el.innerHTML = `
+  <div class="card">
+    <h3>工作区${dirtyDotHtml('ws')}</h3>
+    <div class="desc">Claude 的工作目录白名单。「开发工作流（code-dev）」类型：先出计划（飞书批准）+ 收尾汇总 diff。</div>
+    <div style="display:flex;justify-content:flex-end;margin-bottom:10px">
+      <button class="btn sm" id="wsAdd">+ 添加工作区</button>
+    </div>
+    <table><thead><tr><th style="width:180px">名字</th><th>路径</th><th style="width:170px">类型</th><th style="width:50px"></th></tr></thead>
+    <tbody id="wsBody"></tbody></table>
+    ${saveBarHtml('ws')}
+    <div class="footer-note">运行中的桥接器下一条消息自动生效，无需重启。</div>
+  </div>
+  <div class="card">
+    <h3>全局默认${dirtyDotHtml('def')}</h3>
+    <div class="row">
+      <div><label>默认工作区（defaults.workspace）</label><select id="defWs"></select></div>
+      <div><label>全局并发（concurrency）</label><input type="number" id="globalCc" min="1" max="100"></div>
+    </div>
+    ${saveBarHtml('def')}
+  </div>`;
+  bindSaveBar(el, 'ws');
+  bindSaveBar(el, 'def');
+  /** 重建默认工作区下拉选项：保留当前选中；现值不在工作区列表（手工编辑过的脏配置）时注入该值本身，防静默丢数据 */
+  const syncDefWsOptions = () => {
+    const sel = $('#defWs');
+    if (!sel) return;
+    const cur = doc.defaults?.workspace || '';
+    const names = doc.workspaces.map((w) => w.name || '').filter(Boolean);
+    const extra = cur && !names.includes(cur) ? [cur] : [];
+    sel.innerHTML = ['', ...names, ...extra].map((n) =>
+      `<option value="${esc(n)}"${n === cur ? ' selected' : ''}>${n === '' ? '（未设置）' : esc(n)}${extra.includes(n) ? '（配置中不存在）' : ''}</option>`).join('');
+  };
+  const body = $('#wsBody');
+  const renderRow = (ws, idx) => {
+    const tr = document.createElement('tr');
+    tr.innerHTML = `
+      <td><input type="text" data-f="name" value="${esc(ws.name || '')}"></td>
+      <td><div class="input-btn">
+        <input type="text" data-f="path" value="${esc(ws.path || '')}">
+        <button class="btn sm" data-browse="path" title="浏览选择目录">浏览</button>
+      </div></td>
+      <td><select data-f="type">
+        <option value="generic" ${ws.type !== 'code-dev' ? 'selected' : ''}>通用（generic）</option>
+        <option value="code-dev" ${ws.type === 'code-dev' ? 'selected' : ''}>开发工作流（code-dev）</option>
+      </select></td>
+      <td><button class="btn sm danger">删</button></td>`;
+    tr.querySelectorAll('[data-f]').forEach((input) => {
+      input.oninput = input.onchange = () => {
+        const f = input.dataset.f;
+        if (f === 'type') { if (input.value === 'code-dev') ws.type = 'code-dev'; else delete ws.type; }
+        else if (f === 'name') {
+          // 改名联动：全局默认指向旧名时同步，否则保存会因 defaults.workspace 不在工作区列表报错
+          if (doc.defaults?.workspace && doc.defaults.workspace === ws.name) {
+            doc.defaults = { ...(doc.defaults || {}), workspace: input.value };
+          }
+          ws.name = input.value;
+          syncDefWsOptions();
+        }
+        else ws[f] = input.value;
+        cardDirty('ws', true);
+      };
+    });
+    tr.querySelector('.btn').onclick = () => {
+      if (doc.workspaces.length <= 1) return toast('至少保留一个工作区', true);
+      doc.workspaces.splice(idx, 1);
+      cardDirty('ws', true);
+      renderWorkspaces(el);
+    };
+    // 浏览选目录：回填后手动同步 ws.path（直接改 input.value 不触发 oninput）
+    tr.querySelector('[data-browse]').onclick = async () => {
+      const picked = await pickDirectory(ws.path || '');
+      if (picked == null) return;
+      ws.path = picked;
+      tr.querySelector('input[data-f=path]').value = picked;
+      cardDirty('ws', true);
+    };
+    body.appendChild(tr);
+  };
+  doc.workspaces.forEach(renderRow);
+  $('#wsAdd').onclick = () => { doc.workspaces.push({ name: '', path: '' }); cardDirty('ws', true); renderWorkspaces(el); };
+  syncDefWsOptions();
+  $('#defWs').onchange = () => { doc.defaults = { ...(doc.defaults || {}), workspace: $('#defWs').value }; cardDirty('def', true); };
+  $('#globalCc').value = doc.concurrency ?? 3;
+  $('#globalCc').oninput = () => { doc.concurrency = Number($('#globalCc').value) || 3; cardDirty('def', true); };
+  applyDirty(); // 增删行等操作先 cardDirty 再整卡重渲染：回放防止保存条/圆点随重建丢失
+}
+
+export const page = {
+  id: 'workspaces',
+  title: '工作区',
+  icon: '<path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"/>',
+  render: renderWorkspaces,
+};