✨ add image upscale

src/store/index.ts

@@ -3,6 +3,7 @@ import {useThemeStore} from "@/store/modules/themeStore.ts";
 import {langStore} from "@/store/modules/langStore.ts";
 import {useCommentStore} from "@/store/modules/commentStore.ts";
 import {useWebSocketStore} from "@/store/modules/websocketStore.ts";
+import {useUpscaleStore} from "@/store/modules/upscaleStore.ts";
 
 export default function useStore() {
     return {
@@ -11,5 +12,6 @@ export default function useStore() {
         lang: langStore(),
         comment: useCommentStore(),
         websocket: useWebSocketStore(),
+        upscale: useUpscaleStore(),
     };
 }

src/store/modules/commentStore.ts

@@ -8,6 +8,7 @@ import QQ_EMOJI from "@/constant/qq_emoji.ts";
 import {initNSFWJs, predictNSFW} from "@/utils/nsfw/nsfw.ts";
 import {NSFWJS} from "nsfwjs";
 import i18n from "@/locales";
+import localForage from "localforage";
 
 export const useCommentStore = defineStore(
     'comment',
@@ -325,10 +326,16 @@ export const useCommentStore = defineStore(
     },
     {
         // 开启数据持久化
-        persist: {
+        // persist: {
+        //     key: 'comment',
+        //     storage: localStorage,
+        //     pick: ["emojiList", "commentList", "replyVisibility", "commentMap"],
+        // }
+        persistedState: {
+            persist: true,
+            storage: localForage,
             key: 'comment',
-            storage: localStorage,
-            pick: ["emojiList", "commentList", "replyVisibility", "commentMap"],
+            includePaths: ["emojiList", "commentList", "replyVisibility", "commentMap"]
         }
     }
 );

src/store/modules/langStore.ts

@@ -1,6 +1,7 @@
 import {defineStore} from 'pinia';
 import {ref} from "vue";
 
+
 export const langStore = defineStore(
     'lang',
     () => {
@@ -11,10 +12,11 @@ export const langStore = defineStore(
     },
     {
         // 开启数据持久化
-        persist: {
-            key: 'lang',
+        persistedState: {
+            persist: true,
             storage: localStorage,
-            pick: ["lang"],
+            key: 'lang',
+            includePaths: ['lang']
         }
     }
 );

src/store/modules/themeStore.ts

@@ -37,10 +37,11 @@ export const useThemeStore = defineStore(
         return {themeName, themeConfig, darkMode, setThemeName, toggleDarkMode};
     },
     {
-        persist: {
-            key: 'theme',
+        persistedState: {
+            persist: true,
             storage: localStorage,
-            pick: ["themeName", "darkMode"],
+            key: 'theme',
+            includePaths: ['themeName', 'darkMode']
         }
     }
 );

src/store/modules/upscaleStore.ts

@@ -0,0 +1,88 @@
+import {defineStore} from 'pinia';
+import {initNSFWJs, predictNSFW} from "@/utils/nsfw/nsfw.ts";
+import i18n from "@/locales";
+import message from "@/components/MyUI/Message/Message.vue";
+import {NSFWJS} from "nsfwjs";
+import localForage from "localforage";
+
+export const useUpscaleStore = defineStore(
+        'upscale',
+        () => {
+            const imageList = ref<string[]>([]);
+            const fileList = ref<string[]>([]);
+            const uploading = ref<boolean>(false);
+
+            /**
+             * 图片上传前的校验
+             * @param file
+             */
+            async function beforeUpload(file: any) {
+                if (fileList.value.length >= 5) {
+                    return false;
+                }
+                uploading.value = true;
+                if (!window.FileReader) return false;
+                const reader = new FileReader();
+                reader.readAsDataURL(file); // 文件转换
+                reader.onloadend = async function () {
+                    const img: HTMLImageElement = document.createElement('img');
+                    img.src = reader.result as string;
+                    img.onload = async () => {
+                        // 图片 NSFW 检测
+                        const nsfw: NSFWJS = await initNSFWJs();
+                        const isNSFW: boolean = await predictNSFW(nsfw, img);
+                        if (isNSFW) {
+                            message.error(i18n.global.t('comment.illegalImage'));
+                            fileList.value.pop();
+                            return false;
+                        }
+                        fileList.value.push(img.src);
+                    };
+
+                    uploading.value = false;
+                    return true;
+                };
+            }
+
+            /**
+             *  自定义上传图片请求
+             */
+            async function customUploadRequest() {
+                imageList.value = fileList.value;
+
+            }
+
+            /**
+             *  移除图片
+             * @param index
+             */
+            async function removeImage(index: number) {
+                fileList.value.splice(index, 1);
+                imageList.value.splice(index, 1);
+            }
+
+            return {
+                imageList,
+                fileList,
+                uploading,
+                beforeUpload,
+                customUploadRequest,
+                removeImage
+            };
+        }
+
+        ,
+        {
+            // 开启数据持久化
+            persistedState: {
+                persist: true,
+                storage:
+                localForage,
+                key:
+                    'upscale',
+                includePaths:
+                    ['imageList', 'fileList']
+            }
+        }
+    )
+;

src/store/modules/userStore.ts

@@ -144,10 +144,16 @@ export const useAuthStore = defineStore(
     },
     {
         // 开启数据持久化
-        persist: {
-            key: 'user',
+        // persist: {
+        //     key: 'user',
+        //     storage: localStorage,
+        //     pick: ['user', "clientId", "githubRedirectUrl", "giteeRedirectUrl", "qqRedirectUrl"],
+        // }
+        persistedState: {
+            persist: true,
             storage: localStorage,
-            pick: ['user', "clientId", "githubRedirectUrl", "giteeRedirectUrl", "qqRedirectUrl"],
+            key: 'user',
+            includePaths: ['user', "clientId", "githubRedirectUrl", "giteeRedirectUrl", "qqRedirectUrl"]
         }
     }
 );

src/store/modules/websocketStore.ts

@@ -49,5 +49,7 @@ export const useWebSocketStore = defineStore('websocket', () => {
         getReadyState
     };
 }, {
-    persist: false,
+    persistedState: {
+        persist: false,
+    }
 });