temp：备份代码

app/components/collabora/CollaboraViewer.tsx

@@ -10,30 +10,63 @@
  * @encoding UTF-8
  */
 
-import { useRef } from 'react';
-import type { CollaboraViewerProps } from './types';
+import { useRef, forwardRef, useImperativeHandle, useState, useEffect } from 'react';
+import type { CollaboraViewerProps, CollaboraViewerHandle } from './types';
 import { useCollaboraConfig, useDocumentReady, useCollaboraUnoCommands } from './hooks';
+import { sendUnoCommand } from './Uno';
 
 /**
  * Collabora 文档查看器组件
  * @param props - 组件属性
+ * @param ref - 父组件传入的 ref，用于暴露命令接口
  */
-export function CollaboraViewer({
-  fileId,
-  mode = 'view',
-  userId = 'guest',
-  userName = '访客',
-}: CollaboraViewerProps) {
-  const iframeRef = useRef<HTMLIFrameElement>(null);
+export const CollaboraViewer = forwardRef<CollaboraViewerHandle, CollaboraViewerProps>(
+  function CollaboraViewer(
+    {
+      fileId,
+      mode = 'view',
+      userId = 'guest',
+      userName = '访客',
+    },
+    ref
+  ) {
+    const iframeRef = useRef<HTMLIFrameElement>(null);
 
-  // 1. 加载 Collabora 配置
-  const { config, loading, error } = useCollaboraConfig(fileId, mode, userId, userName);
+    // 调试面板状态
+    const [unoCmd, setUnoCmd] = useState('.uno:GoToStartOfDoc');
+    const [unoArgs, setUnoArgs] = useState('{}');
+    const [unoResult, setUnoResult] = useState<string | null>(null);
 
-  // 2. 监听文档加载状态
-  const { isDocumentLoaded } = useDocumentReady(iframeRef);
+    // 1. 加载 Collabora 配置
+    const { config, loading, error } = useCollaboraConfig(fileId, mode, userId, userName);
 
-  // 3. UNO 命令封装
-  const unoCommands = useCollaboraUnoCommands(iframeRef);
+    // 2. 监听文档加载状态
+    const { isDocumentLoaded } = useDocumentReady(iframeRef);
+
+    // 3. UNO 命令封装
+    const unoCommands = useCollaboraUnoCommands(iframeRef);
+
+    // 4. 暴露接口给父组件
+    useImperativeHandle(ref, () => ({
+      unoCommands,
+      isReady: isDocumentLoaded,
+      mode,
+    }), [unoCommands, isDocumentLoaded, mode]);
+
+    // 5. 将 sendUnoCommand 挂载到 window 对象，供调试面板和控制台使用
+    useEffect(() => {
+      if (iframeRef.current?.contentWindow) {
+        (window as any).sendUno = (cmd: string, args: any = {}) => {
+          if (iframeRef.current?.contentWindow) {
+            sendUnoCommand(iframeRef.current.contentWindow, cmd, args);
+          }
+        };
+      }
+
+      return () => {
+        delete (window as any).sendUno;
+      };
+    }, [isDocumentLoaded]);
 
   // 加载中状态
   if (loading) {
@@ -60,8 +93,75 @@ export function CollaboraViewer({
     );
   }
 
+  // 发送 UNO 命令的处理函数
+  const sendUno = () => {
+    if (!iframeRef.current?.contentWindow) {
+      setUnoResult('iframe 不可用');
+      return;
+    }
+
+    if (!(window as any).sendUno) {
+      setUnoResult('window.sendUno 未初始化');
+      return;
+    }
+
+    let args: any = {};
+    const raw = (unoArgs || '').trim();
+    if (raw !== '') {
+      try {
+        args = JSON.parse(raw);
+      } catch (err) {
+        try {
+          // fallback: replace single quotes with double quotes and parse
+          args = JSON.parse(raw.replace(/'(.*?)'/g, '"$1"'));
+        } catch (err2) {
+          console.error('解析 UNO Args 失败:', err2);
+          setUnoResult('Args 解析失败，请使用有效 JSON');
+          return;
+        }
+      }
+    }
+
+    try {
+      // 先让 iframe 获得焦点
+      iframeRef.current.focus();
+      console.log('[调试面板] 已聚焦 iframe');
+
+      (window as any).sendUno?.(unoCmd, args);
+      setUnoResult(`已发送: ${unoCmd}`);
+    } catch (e) {
+      console.error('发送 UNO 失败:', e);
+      setUnoResult('发送失败，请查看控制台');
+    }
+  };
+
   return (
     <div className="collabora-viewer relative w-full h-full min-h-[600px]">
+      {/* UNO 命令测试面板 */}
+      <div className="absolute top-2 left-2 z-50 bg-white bg-opacity-90 px-2 py-1 rounded shadow flex items-center gap-2">
+        <input
+          className="px-2 py-1 border rounded text-sm w-48"
+          value={unoCmd}
+          onChange={(e) => setUnoCmd(e.target.value)}
+          placeholder="UNO 命令"
+          aria-label="UNO 命令"
+        />
+        <input
+          className="px-2 py-1 border rounded text-sm w-64"
+          value={unoArgs}
+          onChange={(e) => setUnoArgs(e.target.value)}
+          placeholder="UNO Args (JSON)"
+          aria-label="UNO Args (JSON)"
+        />
+        <button
+          className="px-3 py-1 bg-indigo-600 text-white rounded hover:bg-indigo-700 text-sm"
+          onClick={sendUno}
+        >
+          发送 UNO
+        </button>
+        {unoResult && <span className="text-xs text-gray-500 ml-2">{unoResult}</span>}
+      </div>
+
       {/* 文档加载提示 */}
       {!isDocumentLoaded && (
         <div className="absolute inset-0 flex items-center justify-center bg-white bg-opacity-90 z-10">
@@ -85,10 +185,12 @@ export function CollaboraViewer({
         allow="clipboard-read; clipboard-write"
         title={`Collabora Online - ${config.fileName}`}
         sandbox="allow-same-origin allow-scripts allow-forms allow-popups allow-modals"
+        tabIndex={0}
       />
     </div>
   );
-}
+});
 
-// 导出 UNO 命令 hook 供父组件使用（如果需要）
+// 导出类型和 hook
+export type { CollaboraViewerHandle };
 export { useCollaboraUnoCommands };