@wenbin_wb/dsh-bridge 2.5.0 → 2.5.2

package/client/index.js

@@ -1,5 +1,26 @@
 // dsh-bridge 客户端插件：设置页「远程访问」面板
 
+// 兼容非 HTTPS 环境（如手机局域网 HTTP 访问）：为非安全上下文补齐 crypto.randomUUID
+if (typeof window !== 'undefined') {
+  if (!window.crypto) {
+    window.crypto = {};
+  }
+  if (!window.crypto.randomUUID) {
+    window.crypto.randomUUID = function() {
+      if (typeof window.crypto.getRandomValues === 'function') {
+        return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, function(c) {
+          return (c ^ window.crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> (c / 4)).toString(16);
+        });
+      }
+      return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
+        var r = (Math.random() * 16) | 0;
+        var v = c === 'x' ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+      });
+    };
+  }
+}
+
 import { BRIDGE_RPC_CHANNEL, BRIDGE_ENDPOINTS } from '../lib/bridge-rpc-constants.js';
 
 const GITHUB_URL = 'https://github.com/wenbin-wb/dsh-bridge';
@@ -270,18 +291,23 @@ const CustomTunnelConfigForm = React.memo(function CustomTunnelConfigForm({ serv
   }, [initUrl, initToken]);
 
   const dirty = serverUrl !== (initUrl ?? '') || accessToken !== (initToken ?? '');
+  const [saveErr, setSaveErr] = React.useState(null);
   const handleSave = React.useCallback(async () => {
     setSaving(true);
     setSaveSuccess(false);
+    setSaveErr(null);
     try {
       await onSave(serverUrl, accessToken);
       setSaveSuccess(true);
       setTimeout(() => setSaveSuccess(false), 2500);
+    } catch (e) {
+      setSaveErr(e.message || '保存配置失败');
+    } finally {
+      setSaving(false);
     }
-    finally { setSaving(false); }
   }, [onSave, serverUrl, accessToken]);
-  const handleUrlChange   = React.useCallback((e) => { setServerUrl(e.target.value); setSaveSuccess(false); }, []);
-  const handleTokenChange = React.useCallback((e) => { setAccessToken(e.target.value); setSaveSuccess(false); }, []);
+  const handleUrlChange   = React.useCallback((e) => { setServerUrl(e.target.value); setSaveSuccess(false); setSaveErr(null); }, []);
+  const handleTokenChange = React.useCallback((e) => { setAccessToken(e.target.value); setSaveSuccess(false); setSaveErr(null); }, []);
 
   return React.createElement('div', { style: s.block },
     React.createElement('div', { style: { ...s.muted, marginBottom: 8 } }, '隧道服务器配置'),
@@ -303,6 +329,7 @@ const CustomTunnelConfigForm = React.memo(function CustomTunnelConfigForm({ serv
         onKeyDown: (e) => { if (e.key === 'Enter' && dirty && !saving) handleSave(); },
         disabled: saving,
       }),
+      saveErr && React.createElement('div', { style: s.err }, `❌ ${saveErr}`),
       React.createElement('div', { style: { ...s.muted, fontSize: 11 } },
         '💡 用于与您的 VPS 隧道服务端建立反向通道（与 Web 网页访客访问密码互相独立）。'
       ),
@@ -388,46 +415,58 @@ const AccessAuthCard = React.memo(function AccessAuthCard({ auth, rpcCall, onUpd
   }, [auth]);
 
   const handleToggleEnabled = async () => {
+    const prev = enabled;
     const next = !enabled;
     setEnabled(next);
     try {
-      await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { enabled: next });
+      const res = await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { enabled: next });
+      if (!res?.ok) throw new Error(res?.error?.message || '更新失败');
       setTopMsg({ ok: true, text: next ? '✓ 访问安全认证已开启（现有登录态已刷新）' : '✓ 访问安全认证已关闭' });
       onUpdate?.();
     } catch (e) {
+      setEnabled(prev);
       setTopMsg({ ok: false, text: e.message || '更新失败' });
     }
   };
 
   const handleChangeMode = async (m) => {
+    const prev = mode;
     setMode(m);
     try {
-      await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { mode: m });
+      const res = await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { mode: m });
+      if (!res?.ok) throw new Error(res?.error?.message || '更新失败');
       setTopMsg({ ok: true, text: '✓ 外部验证模式已切换，已刷新全域登录态' });
       onUpdate?.();
     } catch (e) {
+      setMode(prev);
       setTopMsg({ ok: false, text: e.message || '更新失败' });
     }
   };
 
   const handleChangeScope = async (sc) => {
+    const prev = scope;
     setScope(sc);
     try {
-      await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { scope: sc });
+      const res = await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { scope: sc });
+      if (!res?.ok) throw new Error(res?.error?.message || '更新失败');
       setTopMsg({ ok: true, text: '✓ 防护生效范围已更新' });
       onUpdate?.();
     } catch (e) {
+      setScope(prev);
       setTopMsg({ ok: false, text: e.message || '更新失败' });
     }
   };
 
   const handleChangeAdminPolicy = async (pol) => {
+    const prev = adminPolicy;
     setAdminPolicy(pol);
     try {
-      await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { adminPolicy: pol });
+      const res = await rpcCall(BRIDGE_ENDPOINTS.authUpdateConfig, { adminPolicy: pol });
+      if (!res?.ok) throw new Error(res?.error?.message || '更新失败');
       setTopMsg({ ok: true, text: '✓ 远程管理防篡改策略已更新' });
       onUpdate?.();
     } catch (e) {
+      setAdminPolicy(prev);
       setTopMsg({ ok: false, text: e.message || '更新失败' });
     }
   };
@@ -479,7 +518,8 @@ const AccessAuthCard = React.memo(function AccessAuthCard({ auth, rpcCall, onUpd
   const handleRegenerateToken = async () => {
     if (!confirm('重置后，之前包含旧 Token 的二维码和分享链接将立即失效。是否确认重置？')) return;
     try {
-      await rpcCall(BRIDGE_ENDPOINTS.authRegenerateToken, {});
+      const res = await rpcCall(BRIDGE_ENDPOINTS.authRegenerateToken, {});
+      if (!res?.ok) throw new Error(res?.error?.message || '重置失败');
       setTopMsg({ ok: true, text: '✓ 安全 Token 已重置，二维码与专属链接已刷新' });
       onUpdate?.();
     } catch (e) {
@@ -804,16 +844,24 @@ function PlatformCard({ platformId, platformName, platformDesc, rpcCall, onStatu
     onStatusChange?.(connected);
   }, [platform?.status, onStatusChange]);
 
+  const loadInFlightRef = React.useRef(false);
+  const seqRef = React.useRef(0);
   const load = React.useCallback(async (quiet = false) => {
+    if (loadInFlightRef.current) return;
+    loadInFlightRef.current = true;
+    const currentSeq = ++seqRef.current;
     try {
       // 用通用端点读取平台状态（不执行登录操作，只获取状态）
       const r = await rpcCall(BRIDGE_ENDPOINTS.listPlatforms, {});
+      if (currentSeq !== seqRef.current) return; // 丢弃过时响应
       if (!r?.ok) throw new Error(r?.error?.message ?? 'RPC failed');
       const allPlatforms = r.value ?? {};
       setPlatform(allPlatforms[platformId] ?? null);
       if (!quiet) setErr(null);
     } catch (e) {
-      if (!quiet) setErr(e.message);
+      if (currentSeq === seqRef.current && !quiet) setErr(e.message);
+    } finally {
+      loadInFlightRef.current = false;
     }
   }, [rpcCall, platformId]);
 
@@ -850,9 +898,20 @@ function PlatformCard({ platformId, platformName, platformDesc, rpcCall, onStatu
     const id = newId.trim();
     if (!id) return;
     const list = [...(platform?.allowFrom ?? []), id];
-    await act(BRIDGE_ENDPOINTS.platformSetAllowFrom, { allowFrom: list });
-    setNewId('');
-  }, [act, newId, platform?.allowFrom]);
+    setBusy(true);
+    try {
+      const r = await rpcCall(BRIDGE_ENDPOINTS.platformSetAllowFrom, { platformId, allowFrom: list });
+      if (!r?.ok) throw new Error(r?.error?.message ?? '添加白名单失败');
+      setPlatform(r.value);
+      setNewId('');
+      setErr(null);
+      await load(true);
+    } catch (e) {
+      setErr(e.message);
+    } finally {
+      setBusy(false);
+    }
+  }, [rpcCall, platformId, newId, platform?.allowFrom, load]);
   const removeAllow = React.useCallback(async (id) => {
     const list = (platform?.allowFrom ?? []).filter((x) => x !== id);
     await act(BRIDGE_ENDPOINTS.platformSetAllowFrom, { allowFrom: list });
@@ -922,7 +981,7 @@ function PlatformCard({ platformId, platformName, platformDesc, rpcCall, onStatu
     );
   }
 
-  const connected = platform?.status === 'connected' || platform?.status === 'starting';
+  const connected = platform?.status === 'connected' || platform?.status === 'starting' || platform?.status === 'reconnecting';
   const login = platform?.login ?? {};
   const showQr = login.phase === 'qr' || login.phase === 'scaned';
   const statusLabel = platform?.status === 'connected' ? '已连接'
@@ -1580,11 +1639,69 @@ function BridgePanel({ rpcCall }) {
     window.location.protocol === 'app:' ||
     window.location.hostname.endsWith('.local')
   );
+  const [adminToken, setAdminToken]       = React.useState('');
   const [adminUnlocked, setAdminUnlocked] = React.useState(false);
   const [unlockPassword, setUnlockPassword] = React.useState('');
-  const [unlockErr, setUnlockErr] = React.useState(null);
-  const [unlocking, setUnlocking] = React.useState(false);
+  const [unlockErr, setUnlockErr]         = React.useState(null);
+  const [unlocking, setUnlocking]         = React.useState(false);
   const [showForgotGuide, setShowForgotGuide] = React.useState(false);
+  const [showUnlockModal, setShowUnlockModal] = React.useState(false);
+
+  // 本机物理访问自动静默获取 adminToken，免输密码直通管理（支持 3080 原生端口与 3082 代理端口）
+  const fetchLoopbackToken = React.useCallback(async () => {
+    if (!isLocalhost) return null;
+    const currentPort = typeof window !== 'undefined' ? (window.location.port || (window.location.protocol === 'https:' ? '443' : '80')) : '3082';
+    const proxyPort = status?.proxy?.port || 3082;
+    const candidateUrls = [
+      '/__dsh_bridge__/loopback-token',
+      `http://127.0.0.1:${proxyPort}/__dsh_bridge__/loopback-token`,
+      `http://localhost:${proxyPort}/__dsh_bridge__/loopback-token`,
+      'http://127.0.0.1:3082/__dsh_bridge__/loopback-token',
+    ];
+    const uniqueUrls = [...new Set(candidateUrls)];
+
+    for (const url of uniqueUrls) {
+      try {
+        const res = await fetch(url, { method: 'POST' });
+        if (res.ok) {
+          const data = await res.json();
+          if (data?.ok && data.adminToken) {
+            setAdminToken(data.adminToken);
+            setAdminUnlocked(true);
+            return data.adminToken;
+          }
+        }
+      } catch {}
+    }
+    return null;
+  }, [isLocalhost, status?.proxy?.port]);
+
+  React.useEffect(() => {
+    if (isLocalhost && !adminUnlocked) {
+      fetchLoopbackToken();
+    }
+  }, [isLocalhost, adminUnlocked, fetchLoopbackToken]);
+
+  const authRpcCall = React.useCallback(async (endpoint, payload = {}, signal) => {
+    let token = adminToken;
+    if (isLocalhost && !token) {
+      token = await fetchLoopbackToken();
+    }
+    const enriched = {
+      ...payload,
+      ...(token ? { adminToken: token } : {}),
+      ...(isLocalhost ? { isLocalhost: true } : {}),
+    };
+    const res = await rpcCall(endpoint, enriched, signal);
+    if (res?.ok === false) {
+      const msg = res?.error?.message || '';
+      if (msg.includes('管理员权限') || msg.includes('管理密码解锁')) {
+        setUnlockErr(msg);
+        setShowUnlockModal(true);
+      }
+    }
+    return res;
+  }, [rpcCall, adminToken, isLocalhost, fetchLoopbackToken]);
 
   const handleUnlockAdmin = React.useCallback(async (e) => {
     e?.preventDefault?.();
@@ -1593,8 +1710,11 @@ function BridgePanel({ rpcCall }) {
     try {
       const res = await rpcCall(BRIDGE_ENDPOINTS.authAdminUnlock, { password: unlockPassword });
       if (res?.ok) {
+        setAdminToken(res.value?.adminToken || '');
         setAdminUnlocked(true);
         setUnlockPassword('');
+        setShowUnlockModal(false);
+        setErr(null);
       } else {
         setUnlockErr(res?.error?.message || '管理员密码错误');
       }
@@ -1605,32 +1725,58 @@ function BridgePanel({ rpcCall }) {
     }
   }, [rpcCall, unlockPassword]);
 
+  const handleLockAdmin = React.useCallback(async () => {
+    try {
+      if (adminToken) {
+        await rpcCall(BRIDGE_ENDPOINTS.authAdminLock, { adminToken });
+      }
+    } catch {}
+    setAdminToken('');
+    setAdminUnlocked(false);
+  }, [rpcCall, adminToken]);
+
+  const loadInFlightRef = React.useRef(false);
+  const loadSeqRef = React.useRef(0);
   const load = React.useCallback(async (quiet = false) => {
+    if (loadInFlightRef.current) return;
+    loadInFlightRef.current = true;
+    const currentSeq = ++loadSeqRef.current;
     try {
-      const r = await rpcCall(BRIDGE_ENDPOINTS.getStatus, {});
+      const r = await authRpcCall(BRIDGE_ENDPOINTS.getStatus, {});
+      if (currentSeq !== loadSeqRef.current) return;
       if (!r?.ok) throw new Error(r?.error?.message ?? 'RPC failed');
       setStatus(r.value);
       if (!quiet) setErr(null);
     } catch (e) {
-      setErr(e.message);
+      if (currentSeq === loadSeqRef.current) setErr(e.message);
+    } finally {
+      loadInFlightRef.current = false;
     }
-  }, [rpcCall]);
+  }, [authRpcCall]);
 
-  // 独立轮询所有平台状态（Tab 未选中时也能更新）
+  // 独立轮询所有平台状态（Tab 未选中时也能更新），带 in-flight 锁与序列号防乱序
+  const pollPlatformsSeqRef = React.useRef(0);
   React.useEffect(() => {
     let alive = true;
+    let inFlight = false;
     const poll = async () => {
+      if (inFlight || !alive) return;
+      inFlight = true;
+      const currentSeq = ++pollPlatformsSeqRef.current;
       try {
-        const r = await rpcCall(BRIDGE_ENDPOINTS.listPlatforms, {});
-        if (alive && r?.ok) {
+        const r = await authRpcCall(BRIDGE_ENDPOINTS.listPlatforms, {});
+        if (alive && currentSeq === pollPlatformsSeqRef.current && r?.ok) {
           setPlatforms(r.value ?? {});
         }
       } catch { /* 忽略，不影响主面板 */ }
+      finally {
+        inFlight = false;
+      }
     };
     poll();
     const t = setInterval(poll, 4000);
     return () => { alive = false; clearInterval(t); };
-  }, [rpcCall]);
+  }, [authRpcCall]);
 
   React.useEffect(() => {
     load();
@@ -1640,14 +1786,14 @@ function BridgePanel({ rpcCall }) {
 
   const act = React.useCallback(async (endpoint, payload) => {
     try {
-      const r = await rpcCall(endpoint, payload ?? {});
+      const r = await authRpcCall(endpoint, payload ?? {});
       if (!r?.ok) throw new Error(r?.error?.message ?? 'RPC failed');
       setStatus(r.value);
       setErr(null);
     } catch (e) {
       setErr(e.message);
     }
-  }, [rpcCall]);
+  }, [authRpcCall]);
 
   const onStartCloudflared = React.useCallback(() => act(BRIDGE_ENDPOINTS.startCloudflared), [act]);
   const onStopCloudflared  = React.useCallback(() => act(BRIDGE_ENDPOINTS.stopCloudflared), [act]);
@@ -1734,7 +1880,7 @@ function BridgePanel({ rpcCall }) {
   } else if (activeTab === 'security') {
     tabContent = React.createElement(AccessAuthCard, {
       auth: status?.auth,
-      rpcCall,
+      rpcCall: authRpcCall,
       onUpdate: () => load(true),
     });
   } else if (activeTab === 'im') {
@@ -1790,12 +1936,13 @@ function BridgePanel({ rpcCall }) {
           );
         }),
       ),
-      // 显示选中的平台卡片
+      // 显示选中的平台卡片（带有 key 保证切换时重置表单状态）
       selectedPlatform && platforms?.[selectedPlatform] && React.createElement(PlatformCard, {
+        key: selectedPlatform,
         platformId: selectedPlatform,
         platformName: IM_PLATFORMS.find(p => p.id === selectedPlatform)?.label ?? selectedPlatform,
         platformDesc: IM_PLATFORMS.find(p => p.id === selectedPlatform)?.desc ?? '',
-        rpcCall,
+        rpcCall: authRpcCall,
         onStatusChange: () => {}, // 状态变化已由 listPlatforms 轮询处理，不需要回调
       }),
     );
@@ -1891,11 +2038,36 @@ function BridgePanel({ rpcCall }) {
     );
   }
 
-  return React.createElement('div', { style: { maxWidth: 620 } },
+  const isInterceptionErr = err && (err.includes('管理员权限') || err.includes('管理密码解锁'));
+
+  return React.createElement('div', { style: { maxWidth: 620, position: 'relative' } },
+    // 错误横幅（如果是权限拦截，直接提供醒目的输入密码解锁按钮）
     err && React.createElement('div', {
-      style: { ...s.card, background: 'var(--dsw-alias-state-error-bg,#fef2f2)', color: 'var(--dsw-alias-state-error-primary,#dc2626)', fontSize: 13, marginBottom: 16 },
-    }, err),
+      style: {
+        ...s.card,
+        background: 'var(--dsw-alias-state-error-bg,#fef2f2)',
+        color: 'var(--dsw-alias-state-error-primary,#dc2626)',
+        fontSize: 13,
+        marginBottom: 16,
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        flexWrap: 'wrap',
+        gap: 10,
+      },
+    },
+      React.createElement('span', { style: { flex: '1 1 auto' } }, err),
+      isInterceptionErr && React.createElement('button', {
+        type: 'button',
+        style: { ...s.btnPri, background: '#dc2626', color: '#ffffff', height: 26, fontSize: 12, padding: '0 10px', flexShrink: 0 },
+        onClick: () => {
+          setUnlockErr(err);
+          setShowUnlockModal(true);
+        },
+      }, '🔑 立即输入管理密码解锁'),
+    ),
 
+    // 管理员解锁状态提示条
     !isLocalhost && adminUnlocked && React.createElement('div', {
       style: {
         display: 'flex', alignItems: 'center', justifyContent: 'space-between',
@@ -1907,15 +2079,94 @@ function BridgePanel({ rpcCall }) {
       React.createElement('span', null, '🔓 管理员权限已解锁（当前临时会话有效）'),
       React.createElement('button', {
         style: { ...s.btnGhost, height: 24, fontSize: 11, padding: '0 8px' },
-        onClick: () => setAdminUnlocked(false),
+        onClick: handleLockAdmin,
       }, '🔒 重新锁定后台'),
     ),
 
-    React.createElement(VersionBanner, { rpcCall }),
+    // 未解锁时的顶部引导条
+    !isLocalhost && !adminUnlocked && auth?.enabled && policy !== 'open' && React.createElement('div', {
+      style: {
+        display: 'flex', alignItems: 'center', justifyContent: 'space-between',
+        padding: '8px 14px', background: 'var(--dsw-alias-state-warn-bg,#fffbeb)',
+        border: '1px solid var(--dsw-alias-state-warn-border,#fde68a)', borderRadius: 8,
+        marginBottom: 14, fontSize: 12, color: 'var(--dsw-alias-state-warn-primary,#92400e)',
+      },
+    },
+      React.createElement('span', null, '🔒 后台管理权限未解锁（修改敏感配置需先解锁）'),
+      React.createElement('button', {
+        type: 'button',
+        style: { ...s.btnPri, height: 24, fontSize: 11, padding: '0 10px', background: '#d97706' },
+        onClick: () => setShowUnlockModal(true),
+      }, '🔑 解锁管理权限'),
+    ),
+
+    React.createElement(VersionBanner, { rpcCall: authRpcCall }),
 
     React.createElement(TabBar, { active: activeTab, onChange: setActiveTab, dots }),
 
     tabContent,
+
+    // 全局交互式解锁弹窗 Modal
+    showUnlockModal && React.createElement('div', {
+      style: {
+        position: 'fixed', inset: 0, background: 'rgba(0,0,0,0.5)', zIndex: 99999,
+        display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 16,
+      },
+      onClick: (e) => { if (e.target === e.currentTarget) setShowUnlockModal(false); },
+    },
+      React.createElement('div', {
+        style: {
+          background: 'var(--dsw-alias-bg-layer-1,#ffffff)', borderRadius: 14,
+          padding: '24px 24px', maxWidth: 420, width: '100%',
+          boxShadow: '0 20px 25px -5px rgba(0,0,0,0.2)', border: '1px solid var(--dsw-alias-border-l2,#e5e7eb)',
+        },
+      },
+        React.createElement('div', { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 12 } },
+          React.createElement('div', { style: { fontSize: 16, fontWeight: 600, color: 'var(--dsw-alias-label-primary,currentColor)', display: 'flex', alignItems: 'center', gap: 8 } },
+            '🔒 解锁后台管理权限'
+          ),
+          React.createElement('button', {
+            type: 'button',
+            style: { border: 'none', background: 'none', cursor: 'pointer', fontSize: 18, color: 'var(--dsw-alias-label-tertiary,#9ca3af)', padding: 0 },
+            onClick: () => setShowUnlockModal(false),
+          }, '✕'),
+        ),
+        React.createElement('div', { style: { fontSize: 13, color: 'var(--dsw-alias-label-secondary,#4b5563)', marginBottom: 16, lineHeight: 1.5 } },
+          '当前操作需要后台管理员权限。为保护您的网络配置与机器人平台安全，请输入管理密码解锁：'
+        ),
+        React.createElement('form', {
+          onSubmit: handleUnlockAdmin,
+          style: { display: 'flex', flexDirection: 'column', gap: 12 },
+        },
+          React.createElement('input', {
+            type: 'password',
+            style: s.input,
+            placeholder: '请输入后台管理密码',
+            value: unlockPassword,
+            onChange: (e) => setUnlockPassword(e.target.value),
+            autoFocus: true,
+          }),
+          unlockErr && React.createElement('div', {
+            style: { fontSize: 12, color: 'var(--dsw-alias-state-error-primary,#dc2626)' },
+          }, unlockErr),
+          React.createElement('div', { style: { display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 4 } },
+            React.createElement('button', {
+              type: 'button',
+              style: s.btnGhost,
+              onClick: () => setShowUnlockModal(false),
+            }, '取消'),
+            React.createElement('button', {
+              type: 'submit',
+              style: { ...s.btnPri, background: '#4f6ef7', color: '#fff' },
+              disabled: unlocking || !unlockPassword,
+            }, unlocking ? '验证中…' : '立即解锁'),
+          ),
+        ),
+        React.createElement('div', { style: { marginTop: 14, paddingTop: 10, borderTop: '1px solid var(--dsw-alias-border-l2,#f3f4f6)', fontSize: 11, color: 'var(--dsw-alias-label-tertiary,#9ca3af)', textAlign: 'center', lineHeight: 1.5 } },
+          '💡 提示：若未单独配置管理密码，请输入初次设置的访问密码；电脑本机（127.0.0.1）访问享有免密管理特权。'
+        ),
+      ),
+    ),
   );
 }
 

package/docs/feishu-usage.md

@@ -69,6 +69,8 @@
 3. 点击 **「保存并连接」**；
 4. 状态显示为绿色 **「已连接」** 即表示长连接成功建立！
 
+![飞书机器人配置](screenshots/feishu-bot-config.jpg)
+
 ---
 
 ## 💬 常用操作与指令
@@ -91,3 +93,6 @@
 当 Agent 尝试执行需授权的操作（如终端命令、写敏感文件）时，飞书端会自动推送 **原生交互卡片**：
 - 点击卡片上的 **「✓ 批准执行」** 或 **「✕ 拒绝执行」** 按钮即可一键处理；
 - 亦可直接回复文字 `/yes` (或 `1`) / `/no` (或 `2`)。
+
+![飞书对话与卡片审批](screenshots/feishu-chat.jpg)
+