From 78c4b2a2c10913efccf271c16011f40164099bdb Mon Sep 17 00:00:00 2001
From: rookie4show <rookie4show@gmail.com>
Date: Fri, 21 Mar 2025 14:43:03 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=AD=97=E4=BD=93=E6=A0=8F?=
 =?UTF-8?q?=E7=BC=96=E8=BE=91=E6=95=88=E6=9E=9C=EF=BC=8C=E5=A2=9E=E5=8A=A0?=
 =?UTF-8?q?LocalStorage=E7=BC=93=E5=AD=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Yys.vue | 18 +++++++++---------
 src/main.js            |  7 ++++++-
 src/ts/files.ts        | 39 +++++++++++++++++++++++++++++++++++++++
 3 files changed, 54 insertions(+), 10 deletions(-)

diff --git a/src/components/Yys.vue b/src/components/Yys.vue
index ef7daae..40c07cd 100644
--- a/src/components/Yys.vue
+++ b/src/components/Yys.vue
@@ -36,7 +36,7 @@
                 <el-button type="danger" icon="Delete" circle @click="removeGroup(groupIndex)"></el-button>
               </div>
             </div>
-            <QuillEditor ref="shortDescriptionEditor" contentType="html" theme="snow" :toolbar="toolbarOptions"/>
+            <QuillEditor ref="shortDescriptionEditor" v-model:content="group.shortDescription" contentType="html" theme="snow" :toolbar="toolbarOptions"/>
           </div>
           <div class="group-body">
             <draggable :list="group.groupInfo" item-key="name" class="body-content">
@@ -180,20 +180,20 @@ registerSizes()
 
 // 工具栏配置
 const toolbarOptions = ref([
+  [{ font: ['SimSun', 'SimHei', 'KaiTi', 'FangSong', 'Microsoft YaHei', 'PingFang SC'] }],
+  [{ header: 1 }, { header: 2 }],
+  [{ size: ['12px', '14px', '16px', '18px', '21px', '29px', '32px', '34px'] }],
   ['bold', 'italic', 'underline', 'strike'],
+  [{ color: [] }, { background: [] }],
   // ['blockquote', 'code-block'],
-  [{ header: 1 }, { header: 2 }],
-  [{ list: 'ordered' }, { list: 'bullet' }, {'list': 'check'}],
-  [{ script: 'sub' }, { script: 'super' }],
+  [ { list: 'bullet' }, { list: 'ordered' }, {'list': 'check'}],
+
   [{ indent: '-1' }, { indent: '+1' }],
+  [{ align: [] }],
   [{ direction: 'rtl' }],
-  [{ color: [] }, { background: [] }],
   // [{ header: [1, 2, 3, 4, 5, 6, false] }],
-  [{ size: ['12px', '14px', '16px', '18px', '21px', '29px', '32px', '34px'] }],
-  [{ font: ['SimSun', 'SimHei', 'KaiTi', 'FangSong', 'Microsoft YaHei', 'PingFang SC'] }],
-  [{ align: [] }],
   // ['link', 'image', 'video'],
-  ['clean']
+  // ['clean']
 ] as const)
 
 // 定义方法
diff --git a/src/main.js b/src/main.js
index 6cac8e5..2ce0f0d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -16,6 +16,7 @@ import zh from './locales/zh.json'
 import ja from './locales/ja.json'
 
 import { createPinia } from 'pinia' // 导入 Pinia
+import {useFilesStore} from "@/ts/files";
 
 const app = createApp(App)
 
@@ -59,4 +60,8 @@ app.use(pinia) // 使用 Pinia
     .use(i18n)
     .use(ElementPlus)
     .use(Vue3DraggableResizable)
-    .mount('#app')
\ No newline at end of file
+    .mount('#app')
+
+const filesStore = useFilesStore();
+filesStore.setupAutoSave();
+filesStore.initializeWithPrompt();
\ No newline at end of file
diff --git a/src/ts/files.ts b/src/ts/files.ts
index 9896c95..2e83c54 100644
--- a/src/ts/files.ts
+++ b/src/ts/files.ts
@@ -3,6 +3,19 @@ import {ElMessageBox} from "element-plus";
 import {useGlobalMessage} from "./useGlobalMessage";
 
 const { showMessage } = useGlobalMessage();
+
+function saveStateToLocalStorage(state) {
+    localStorage.setItem('filesStore', JSON.stringify(state));
+}
+
+function clearLocalStorage() {
+    localStorage.clear()
+}
+
+function loadStateFromLocalStorage() {
+    return JSON.parse(localStorage.getItem('filesStore'));
+}
+
 export const useFilesStore = defineStore('files', {
     state: () => ({
         fileList: [
@@ -194,6 +207,32 @@ export const useFilesStore = defineStore('files', {
         visibleFiles: (state) => state.fileList.filter(file => file.visible),
     },
     actions: {
+        initializeWithPrompt() {
+            const savedState = loadStateFromLocalStorage();
+            if (savedState) {
+                ElMessageBox.confirm(
+                    '检测到有未保存的旧数据，是否恢复？',
+                    '提示',
+                    {
+                        confirmButtonText: '恢复',
+                        cancelButtonText: '不恢复',
+                        type: 'warning',
+                    }
+                ).then(() => {
+                    this.fileList = savedState.fileList || [];
+                    this.activeFile = savedState.activeFile || "1";
+                    showMessage('success', '数据已恢复');
+                }).catch(() => {
+                    clearLocalStorage();
+                    showMessage('info', '选择了不恢复旧数据');
+                });
+            }
+        },
+        setupAutoSave() {
+            setInterval(() => {
+                saveStateToLocalStorage(this.$state);
+            }, 30000); // 设置间隔时间为30秒
+        },
         addFile(file) {
             this.fileList.push({...file, visible: true});
             this.activeFile = file.name;