2026-04-16-19-28-04 - 彻底重构自动保存机制，修复路由切换后所有内容丢失问题

src/pages/ReportEditor.tsx

@@ -86,12 +86,16 @@ export default function ReportEditor() {
     const key = user ? `reportEditorDraft_${user.username}` : '';
     if (key) {
       storage.set(key, {
-        content: contentRef.current,
+        content: editorRef.current?.innerHTML || '',
         draftReportId: reportId || null,
-        ...stateRef.current
+        reportData,
+        videos,
+        capturedFrames,
+        activeTab,
+        loadedTemplateId
       });
     }
-  }, [reportId]);
+  }, [reportData, videos, capturedFrames, activeTab, loadedTemplateId, reportId]);
 
   useEffect(() => {
     const user = storage.get<User | null>('currentUser', null);
@@ -220,25 +224,18 @@ export default function ReportEditor() {
   }, [reportId, navigate, draftKey, restoreFlag]);
 
   useEffect(() => {
-    const save = () => {
-      const user = storage.get<User | null>('currentUser', null);
-      const key = user ? `reportEditorDraft_${user.username}` : '';
-      if (key) {
-        storage.set(key, {
-          content: contentRef.current,
-          draftReportId: reportId || null,
-          ...stateRef.current
-        });
-      }
+    const handleBeforeUnload = () => saveDraftToStorage();
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === 'hidden') saveDraftToStorage();
     };
-    window.addEventListener('beforeunload', save);
-    document.addEventListener('visibilitychange', save);
+    window.addEventListener('beforeunload', handleBeforeUnload);
+    document.addEventListener('visibilitychange', handleVisibilityChange);
     return () => {
-      window.removeEventListener('beforeunload', save);
-      document.removeEventListener('visibilitychange', save);
-      save();
+      window.removeEventListener('beforeunload', handleBeforeUnload);
+      document.removeEventListener('visibilitychange', handleVisibilityChange);
+      saveDraftToStorage();
     };
-  }, [reportId]);
+  }, [saveDraftToStorage]);
 
   useEffect(() => {
     if (!editorRef.current) return;
@@ -762,7 +759,7 @@ export default function ReportEditor() {
     }
     contentLoadedRef.current = true;
     setTimeout(() => updatePageHeight(), 0);
-  });
+  }, []);
 
   const hourOptions = Array.from({ length: 24 }, (_, i) => i.toString().padStart(2, '0'));
   const minuteOptions = Array.from({ length: 60 }, (_, i) => i.toString().padStart(2, '0'));