fix: fix bugs

src/api/env/index.ts

@@ -1,8 +1,9 @@
 import request from '@/api';
+import { AxiosPromise } from 'axios';
 
 export function useEnvApi() {
   return {
-    getEnv: () => {
+    getEnv: (): AxiosPromise<MyAxiosRes> => {
       return request({
         url: '/api/utils/env',
         method: 'get',

src/api/index.ts

@@ -1,4 +1,9 @@
-import axios from 'axios';
+import axios, { AxiosResponse, AxiosPromise, AxiosError } from 'axios';
+import { Notify } from '@nutui/nutui';
+
+const notifyConfig = {
+  duration: 2000,
+};
 
 // 配置新建一个 axios 实例
 const service = axios.create({
@@ -7,33 +12,33 @@ const service = axios.create({
   headers: { 'Content-Type': 'application/json' },
 });
 
-// // 添加请求拦截器
-// service.interceptors.request.use(
-//   (config) => {
-//     // 在发送请求之前
-//     if (Session.get('token')) {
-//       (<any>config.headers).common['Authorization'] = `${Session.get('token')}`;
-//     }
-//     return config;
-//   },
-//   (error) => {
-//     // 对请求错误做些什么
-//     return Promise.reject(error);
-//   }
-// );
-
-// 添加响应拦截器
 service.interceptors.response.use(
-  (response) => {
-    // 对响应数据做点什么
-    return Promise.resolve(response.data);
+  (response: AxiosResponse<SucceedResponse>): AxiosPromise<SucceedResponse> => {
+    console.log('ddddddddd', response.data);
+    return Promise.resolve(response);
   },
-  (e) => {
-    // Notify.danger(e.response.error.message, {
-    //   duration: 2500,
-    // });
-    //
-    return Promise.reject(e.response);
+  (e: AxiosError<ErrorResponse>): AxiosPromise<ErrorResponse | undefined> => {
+    console.log('eeeeeeeee', e.response);
+
+    // 流量信息接口的报错 返回错误
+    if (e.config.url.startsWith('/api/sub/flow'))
+      return Promise.resolve(e.response);
+
+    let msg = '';
+    // 如果是网络错误，则提示网络错误
+    if (e.response.status === 0) {
+      msg += '网络错误，无法连接后端服务\n';
+      msg += 'code: ' + e.response.status + ' msg: ' + e.message;
+      Notify.danger(msg, notifyConfig);
+      return Promise.reject(e.response);
+    } else {
+      msg += e.response.data.error.message + '\n';
+      msg += 'type: ' + e.response.data.error.type + '\n';
+      msg += e.response.data.error.details;
+      Notify.danger(msg, notifyConfig);
+    }
+
+    return undefined;
   }
 );
 

src/api/settings/index.ts

@@ -1,21 +1,22 @@
 import request from '@/api';
+import { AxiosPromise } from 'axios';
 
 export function useSettingsApi() {
   return {
-    getSettings: () => {
+    getSettings: (): AxiosPromise<MyAxiosRes> => {
       return request({
         url: '/api/settings',
         method: 'get',
       });
     },
-    setSettings: (data: SettingsPostData) => {
+    setSettings: (data: SettingsPostData): AxiosPromise<MyAxiosRes> => {
       return request({
         url: '/api/settings',
         method: 'patch',
         data,
       });
     },
-    syncSettings: (query: 'download' | 'upload') => {
+    syncSettings: (query: 'download' | 'upload'): AxiosPromise<MyAxiosRes> => {
       return request({
         url: '/api/utils/backup?action=' + query,
         method: 'get',

src/api/subs/index.ts

@@ -1,52 +1,63 @@
 import request from '@/api';
+import { AxiosPromise } from 'axios';
 
 export function useSubsApi() {
   return {
-    getSubs: () => {
+    getSubs: (): AxiosPromise<MyAxiosRes> => {
       return request({
         url: '/api/subs',
         method: 'get',
       });
     },
-    getCollections: () => {
+    getCollections: (): AxiosPromise<MyAxiosRes> => {
       return request({
         url: `/api/collections`,
         method: 'get',
       });
     },
-    getOne: (type: string, name: string) => {
+    getOne: (type: string, name: string): AxiosPromise<MyAxiosRes> => {
       return request({
         url: `/api/${type}/${name}`,
         method: 'get',
       });
     },
-    getFlow: (name: string) => {
+    getFlow: (name: string): AxiosPromise<MyAxiosRes> => {
       return request({
         url: `/api/sub/flow/${name}`,
         method: 'get',
       });
     },
-    createSub: (type: string, data: Sub | Collection) => {
+    createSub: (
+      type: string,
+      data: Sub | Collection
+    ): AxiosPromise<MyAxiosRes> => {
       return request({
         url: `/api/${type}`,
         method: 'post',
         data,
       });
     },
-    editSub: (type: string, name: string, data: Sub | Collection) => {
+    editSub: (
+      type: string,
+      name: string,
+      data: Sub | Collection
+    ): AxiosPromise<MyAxiosRes> => {
       return request({
         url: `/api/${type}/${name}`,
         method: 'patch',
         data,
       });
     },
-    deleteSub: (type: string, name: string) => {
+    deleteSub: (type: string, name: string): AxiosPromise<MyAxiosRes> => {
       return request({
         url: `/api/${type}/${name}`,
         method: 'delete',
       });
     },
-    compareSub: (type: string, data: Sub | Collection) => {
+    compareSub: (
+      type: string,
+      data: Sub | Collection
+    ): AxiosPromise<MyAxiosRes> => {
       return request({
         url: `/api/preview/${type}`,
         method: 'post',

src/components/SubListItem.vue

@@ -127,7 +127,6 @@
     props[props.type].displayName || props[props.type]['display-name'];
 
   const name = props[props.type].name;
-  console.log(name);
   const { flows } = storeToRefs(subsStore);
   const collectionDetail = computed(() => {
     const nameList = props?.collection.subscriptions || [];
@@ -151,7 +150,14 @@
       if (isLoading.value) return t('subPage.subItem.loading');
 
       const target = toRaw(flows.value[props.sub.url]);
-      if (target?.status === 'success') {
+      if (!target) {
+        return {
+          firstLine: t('subPage.subItem.noRecord'),
+          secondLine: ``,
+        };
+      }
+
+      if (target.status === 'success') {
         const {
           expires,
           total,
@@ -169,16 +175,8 @@
         };
       } else if (target?.status === 'failed') {
         return {
-          firstLine: `${target.error?.message}`,
-          secondLine: '',
-        };
-      } else {
-        return {
-          // TODO: API 暂未升级，额外判断当前出错情况跑通代码
-          // @ts-ignore
-          firstLine: `Code: ${target?.status}`,
-          // @ts-ignore
-          secondLine: `Msg: ${target?.statusText}`,
+          firstLine: `Type: ${target.error?.type}`,
+          secondLine: `Msg: ${target.error?.message}`,
         };
       }
     }
@@ -194,13 +192,14 @@
       props.type,
       props.sub ?? props.collection
     );
-    compareData.value = res.data;
-    Toast.hide('compare');
-    compareTableIsVisible.value = true;
+    if (res.data.status === 'success') {
+      compareData.value = res.data.data;
+      compareTableIsVisible.value = true;
+      Toast.hide('compare');
+    }
   };
 
   const swipeController = () => {
-    // console.log(moreAction.value.style);
     if (swipeIsOpen.value) {
       swipe.value.close();
       swipeIsOpen.value = false;

src/locales/en.ts

@@ -7,6 +7,7 @@ export default {
   globalNotify: {
     refresh: {
       succeed: 'Refresh Successful!\nEnjoy the feeling',
+      flowFailed: 'Refresh flow of {name} failed！',
       failed: 'Refresh Failed\n',
     },
   },
@@ -61,6 +62,7 @@ export default {
       loading: 'Loading...',
       flow: 'Usage / Total',
       expires: 'Expires',
+      noRecord: 'Refresh to get usage',
     },
     deleteSub: {
       title: 'Delete Subscription',
@@ -136,7 +138,7 @@ export default {
         },
         icon: {
           label: 'Icon',
-          placeholder: '填入想要展示的图标链接，png最佳',
+          placeholder: '填入图标链接，不要使用jpg',
         },
         ua: {
           label: 'User-Agent',

src/locales/zh.ts

@@ -7,6 +7,7 @@ export default {
   globalNotify: {
     refresh: {
       succeed: '数据刷新成功！\n感受大佬的拥抱吧～',
+      flowFailed: '刷新 {name} 流量失败！',
       failed: '数据刷新失败\n',
     },
   },
@@ -61,6 +62,7 @@ export default {
       loading: '加载中...',
       flow: '已用/总流量',
       expires: '到期时间',
+      noRecord: '刷新后可获取流量情况',
     },
     deleteSub: {
       title: '删除订阅',
@@ -136,7 +138,7 @@ export default {
         },
         icon: {
           label: '图标链接',
-          placeholder: '填入想要展示的图标链接，png最佳',
+          placeholder: '填入图标链接，不要使用jpg',
         },
         ua: {
           label: 'User-Agent',

src/store/global.ts

@@ -28,8 +28,10 @@ export const useGlobalStore = defineStore('globalStore', {
       this.isDarkMode = isDarkMode;
     },
     async getEnv() {
-      const { data } = await envApi.getEnv();
-      this.env = data;
+      const res = await envApi.getEnv();
+      if (res.data.status === 'success') {
+        this.env = res.data.data;
+      }
     },
   },
 });

src/store/settings.ts

@@ -1,7 +1,10 @@
 import { defineStore } from 'pinia';
 import { useSettingsApi } from '@/api/settings';
+import { Notify } from '@nutui/nutui';
+import i18n from '@/locales';
 
 const settingsApi = useSettingsApi();
+const { t } = i18n.global;
 
 export const useSettingsStore = defineStore('settingsStore', {
   state: (): SettingsStoreState => {
@@ -18,18 +21,23 @@ export const useSettingsStore = defineStore('settingsStore', {
   getters: {},
   actions: {
     async fetchSettings() {
-      const { data } = await settingsApi.getSettings();
-      this.gistToken = data.gistToken || '';
-      this.githubUser = data.githubUser || '';
-      this.syncTime = data.syncTime || 0;
-      this.theme = data.theme || { darkMode: false };
-      this.avatarUrl = data.avatarUrl || '';
+      const { data: res } = await settingsApi.getSettings();
+      if (res.status === 'success') {
+        this.gistToken = res.data.gistToken || '';
+        this.githubUser = res.data.githubUser || '';
+        this.syncTime = res.data.syncTime || 0;
+        this.theme = res.data.theme || { darkMode: false };
+        this.avatarUrl = res.data.avatarUrl || '';
+      }
     },
     async editSettings(data: SettingsPostData) {
       const { data: res } = await settingsApi.setSettings(data);
-      this.gistToken = res.gistToken || '';
-      this.githubUser = res.githubUser || '';
-      this.avatarUrl = res.avatarUrl || '';
+      if (res.status === 'success') {
+        this.gistToken = res.data.gistToken || '';
+        this.githubUser = res.data.githubUser || '';
+        this.avatarUrl = res.data.avatarUrl || '';
+        Notify.success(t(`myPage.notify.save.succeed`));
+      }
     },
   },
 });