chore: 调整 toast, 通知和部分错误提示

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sub-store-front-end",
-  "version": "2.14.22",
+  "version": "2.14.23",
   "private": true,
   "scripts": {
     "dev": "vite --host",
@@ -30,6 +30,7 @@
     "vue-clipboard3": "^2.0.0",
     "vue-i18n": "^9.2.0-beta.36",
     "vue-router": "^4.0.16",
+    "vue3-toastify": "^0.2.0",
     "vuedraggable": "^4.1.0"
   },
   "devDependencies": {

src/components/SubListItem.vue

@@ -332,12 +332,12 @@
   };
 
   const compareSub = async () => {
-    Toast.loading('生成节点对比中...', { id: 'compare', cover: true });
+    Toast.loading('生成节点对比中...', { id: 'compare', cover: true, duration: 1500 });
     const res = await useSubsApi().compareSub(
       props.type,
       props.sub ?? props.collection
     );
-    if (res.data.status === 'success') {
+    if (res?.data?.status === 'success') {
       compareData.value = res.data.data;
       compareTableIsVisible.value = true;
       Toast.hide('compare');

src/hooks/useHostAPI.ts

@@ -89,7 +89,7 @@ export const useHostAPI = () => {
         const res = await axios.get<{ status: 'success' | 'failed' }>(
           url + '/api/utils/env'
         );
-        if (res && res.data && res.data.status === 'success') {
+        if (res?.data?.status === 'success') {
           apis.value.push({ name, url });
           return true;
         } else {

src/router/index.ts

@@ -145,7 +145,7 @@ router.beforeResolve(async to => {
       .then(async res => {
         const envNow = res;
         const storeEnv = toRaw(globalStore.env);
-        if (envNow.data.status === 'success') {
+        if (envNow?.data?.status === 'success') {
           const backend = envNow.data.data.backend;
           const version = envNow.data.data.version;
           const hasNewVersion = envNow.data.data.hasNewVersion;

src/store/appNotify.ts

@@ -1,4 +1,6 @@
 import { defineStore } from 'pinia';
+import { toast } from "vue3-toastify";
+import "vue3-toastify/dist/index.css";
 
 export const useAppNotifyStore = defineStore('appNotify', {
   state: (): AppNotifyStoreState => {
@@ -14,14 +16,35 @@ export const useAppNotifyStore = defineStore('appNotify', {
   actions: {
     showNotify(settings: NotifySettings) {
       const { title, content, type, duration } = settings;
-      this.title = title;
-      this.content = content || '';
-      this.type = type || 'primary';
-      this.duration = duration || 2500;
-      this.isVisible = true;
-      setTimeout(() => {
-        this.setVisible(false);
-      }, this.duration); // 防止重复通知 持续时间过长
+      // this.title = title;
+      // this.content = content || '';
+      // this.type = type || 'primary';
+      // this.duration = duration || 2500;
+      // this.isVisible = true;
+      // setTimeout(() => {
+      //   this.setVisible(false);
+      // }, this.duration); // 防止重复通知 持续时间过长
+      let html = `<strong>${title}</strong>`;
+      if (content != null && content !== '') {
+        html += `<br/>${content}`;
+      }
+      // primary，success ，danger，warning
+      // info, success, warning, error, default
+      const types = {primary: 'INFO', success: 'SUCCESS', danger: 'ERROR', warning: 'WARNING'};
+      console.log(`html`, html)
+      toast(html, {
+        theme: 'colored',
+        type: toast.TYPE[types[type] || 'DEFAULT'],
+        position: 'top-center',
+        transition: 'slide',
+        dangerouslyHTMLString: true,
+        closeButton: true,
+        pauseOnHover: true,
+        pauseOnFocusLoss: true,
+        closeOnClick: false,
+        autoClose: duration || 2500,
+        style: { zIndex: 65535 }
+      })
     },
     setVisible(isVisible: boolean) {
       this.isVisible = isVisible;

src/store/artifacts.ts

@@ -23,7 +23,7 @@ export const useArtifactsStore = defineStore('artifactsStore', {
     async createArtifact(data: Artifact) {
       const { showNotify } = useAppNotifyStore();
       const res = await artifactsApi.createArtifact(data);
-      if (res.data.status === 'success') {
+      if (res?.data?.status === 'success') {
         await this.fetchArtifactsData();
         showNotify({
           title: t('syncPage.addArtForm.succeedNotify'),
@@ -35,7 +35,7 @@ export const useArtifactsStore = defineStore('artifactsStore', {
       const { showNotify } = useAppNotifyStore();
 
       const res = await artifactsApi.editArtifact(name, data);
-      if (res.data.status === 'success') {
+      if (res?.data?.status === 'success') {
         await this.fetchArtifactsData();
         showNotify({
           title: t('syncPage.editArtForm.succeedNotify'),

src/store/global.ts

@@ -96,7 +96,7 @@ export const useGlobalStore = defineStore('globalStore', {
     },
     async setEnv() {
       const res = await envApi.getEnv();
-      if (res.data.status === 'success') {
+      if (res?.data?.status === 'success') {
         this.env = res.data.data;
       }
     },

src/store/settings.ts

@@ -48,7 +48,7 @@ export const useSettingsStore = defineStore('settingsStore', {
         if (ressss) {
           console.log("启动时自动下载 Gist 成功");
             const syncRes = await settingsApi.syncSettings('download');
-            if (syncRes.data.status === 'success') {
+            if (syncRes?.data?.status === 'success') {
               console.log('自动下载 Gist 成功');
               const subsStore = useSubsStore();
               await subsStore.fetchSubsData();
@@ -85,10 +85,10 @@ export const useSettingsStore = defineStore('settingsStore', {
         let tfvalue = res.data.autoDownloadGistSync;
         this.autoDownloadGistSync = tfvalue;
         // const syncRes = await settingsApi.syncSettings('upload');
-        // if (syncRes.data.status === 'success') {
+        // if (syncRes?.data?.status === 'success') {
         //   // console.log('上载')
         //   // const syncRes = await settingsApi.syncSettings('download');
-        //   // if (syncRes.data.status === 'success') {
+        //   // if (syncRes?.data?.status === 'success') {
         //   //   console.log('下载')
         //   //   showNotify({ type: 'primary', duration:500, title: t(`同步成功 状态：${tfvalue}`) });
         //   //   const subsStore = useSubsStore();

src/store/subs.ts

@@ -45,7 +45,7 @@ export const useSubsStore = defineStore('subsStore', {
       } else if (type === 'collections') {
         res = await subsApi.getOne('collection', name);
       }
-      if (res.data.status === 'success') {
+      if (res?.data?.status === 'success') {
         const index = this[type].findIndex(item => item.name === name);
         this[type][index] = res.data.data;
       }

src/views/CompareTable.vue

@@ -318,7 +318,7 @@
     });
     const nodeData = toRaw(val);
     const res = await useSubsApi().getSubInfo(nodeData);
-    if (res.data.status === 'success') {
+    if (res?.data?.status === 'success') {
       ipApi.value = res.data.data;
       nodeInfo.value = nodeData;
       nodeInfoIsVisible.value = true;

src/views/Sub.vue

@@ -263,7 +263,7 @@ const changeSort = async (
       );
     }
     // console.log(JSON.stringify(sortDataRes))
-    if (sortDataRes.data.status !== "success") {
+    if (sortDataRes?.data?.status !== "success") {
       sortFailed.value = true;
       showNotify({
         title: t("notify.sortsub.failed"),

src/views/SubEditor.vue

@@ -434,7 +434,7 @@
         return;
       }
 
-      Toast.loading('生成节点对比中...', { id: 'compare', cover: true });
+      Toast.loading('生成节点对比中...', { id: 'compare', cover: true, duration: 1500 });
       const data: any = JSON.parse(JSON.stringify(toRaw(form)));
       data.process = actionsToProcess(data.process, actionsList, ignoreList);
 
@@ -450,7 +450,7 @@
 
       const type = editType === 'collections' ? 'collection' : 'sub';
       const res = await subsApi.compareSub(type, data);
-      if (res.data.status === 'success') {
+      if (res?.data?.status === 'success') {
         compareData.value = res.data.data;
         compareTableIsVisible.value = true;
         Toast.hide('compare');
@@ -482,7 +482,7 @@
         });
         return;
       }
-      Toast.loading('拉取订阅中...', { id: 'submits', cover: true });
+      Toast.loading('拉取订阅中...', { id: 'submits', cover: true, duration: 1500 });
       // 如果验证成功，开始保存/修改
       const data: any = JSON.parse(JSON.stringify(toRaw(form)));
       data['display-name'] = data.displayName;

src/views/Sync.vue

@@ -253,7 +253,7 @@ const changeArtifacts = async () => {
         JSON.parse(JSON.stringify(toRaw(artifacts.value)))
       );
     }
-    if (sortArtifacts.data.status !== "success") {
+    if (sortArtifacts?.data?.status !== "success") {
       sortFailed.value = true;
       showNotify({
         title: t("notify.sortsub.failed"),