feat: projectSetting add closeMessageOnSwitch and removeAllHttpPending

build/script/preview.ts

@@ -16,9 +16,6 @@ const startApp = () => {
   const port = 9680;
   portfinder.basePort = port;
   const app = new Koa();
-  // const connect = require('connect');
-  // const serveStatic = require('serve-static');
-  // const app = connect();
 
   app.use(staticServer(resolve(process.cwd(), viteConfig.outDir || 'dist')));
 

src/router/guard/index.ts

@@ -11,22 +11,27 @@ import { getIsOpenTab } from '/@/utils/helper/routeHelper';
 
 const { projectSetting } = useSetting();
 export function createGuard(router: Router) {
-  const axiosCanceler = new AxiosCanceler();
-
+  const { openNProgress, closeMessageOnSwitch, removeAllHttpPending } = projectSetting;
+  let axiosCanceler: AxiosCanceler | null;
+  if (removeAllHttpPending) {
+    axiosCanceler = new AxiosCanceler();
+  }
   router.beforeEach(async (to) => {
     const isOpen = getIsOpenTab(to.path);
     to.meta.inTab = isOpen;
     try {
+      if (closeMessageOnSwitch) {
         Modal.destroyAll();
         notification.destroy();
+      }
       // TODO Some special interfaces require long connections
       // Switching the route will delete the previous request
-      axiosCanceler.removeAllPending();
+      removeAllHttpPending && axiosCanceler!.removeAllPending();
     } catch (error) {
       console.warn('basic guard error:' + error);
     }
   });
-  projectSetting.openNProgress && createProgressGuard(router);
+  openNProgress && createProgressGuard(router);
   createPermissionGuard(router);
   createPageTitleGuard(router);
   createPageLoadingGuard(router);

src/settings/projectSetting.ts

@@ -116,6 +116,13 @@ const setting: ProjectConfig = {
 
   //  是否可以嵌入iframe页面
   canEmbedIFramePage: true,
+
+  // 切换界面的时候是否删除未关闭的message及notify
+  closeMessageOnSwitch: true,
+
+  // 切换界面的时候是否取消已经发送但是未响应的http请求。
+  // 如果开启,想对单独接口覆盖。可以在单独接口设置
+  removeAllHttpPending: true,
 };
 
 export default setting;

src/types/config.d.ts

@@ -102,6 +102,10 @@ export interface ProjectConfig {
   openNProgress: boolean;
   // 是否可以嵌入iframe页面
   canEmbedIFramePage: boolean;
+  // 切换界面的时候是否删除未关闭的message及notify
+  closeMessageOnSwitch: boolean;
+  // 切换界面的时候是否取消已经发送但是未响应的http请求。
+  removeAllHttpPending: boolean;
 }
 
 export interface GlobConfig {

src/utils/http/axios/Axios.ts

@@ -5,8 +5,9 @@ import { AxiosCanceler } from './axiosCancel';
 import { isFunction } from '/@/utils/is';
 import { cloneDeep } from 'lodash-es';
 
-import { RequestOptions, CreateAxiosOptions, Result } from './types';
+import type { RequestOptions, CreateAxiosOptions, Result } from './types';
 import { ContentTypeEnum } from '/@/enums/httpEnum';
+import { errorResult } from './const';
 
 export * from './axiosTransform';
 
@@ -147,7 +148,7 @@ export class VAxios {
         .then((res: AxiosResponse<Result>) => {
           if (transformRequestData && isFunction(transformRequestData)) {
             const ret = transformRequestData(res, opt);
-            ret !== undefined ? resolve(ret) : reject(new Error('request error!'));
+            ret !== errorResult ? resolve(ret) : reject(new Error('request error!'));
             return;
           }
           resolve((res as unknown) as Promise<T>);

src/utils/http/axios/checkStatus.ts

@@ -1,4 +1,5 @@
 import { useMessage } from '/@/hooks/web/useMessage';
+import { userStore } from '/@/store/modules/user';
 const { createMessage } = useMessage();
 
 const error = createMessage.error!;
@@ -12,9 +13,7 @@ export function checkStatus(status: number, msg: string): void {
     // 在登录成功后返回当前页面，这一步需要在登录页操作。
     case 401:
       error('用户没有权限（令牌、用户名、密码错误）!');
-      // store.dispatch('user/loginOut', {
-      //   goLogin: true,
-      // });
+      userStore.loginOut(true);
       break;
     case 403:
       error('用户得到授权，但是访问是被禁止的。!');

src/utils/http/axios/const.ts

@@ -0,0 +1 @@
+export const errorResult = '__ERROR_RESULT__';

src/utils/http/axios/index.ts

@@ -20,6 +20,7 @@ import { formatRequestDate } from '/@/utils/dateUtil';
 import { setObjToUrlParams, deepMerge } from '/@/utils';
 import { errorStore, ErrorTypeEnum, ErrorInfo } from '/@/store/modules/error';
 import { appStore } from '/@/store/modules/app';
+import { errorResult } from './const';
 
 const { globSetting } = useSetting();
 const prefix = globSetting.urlPrefix;
@@ -62,7 +63,6 @@ const transform: AxiosTransform = {
       return res.data;
     }
     // 错误的时候返回
-    const errorResult = undefined;
 
     const { data } = res;
     if (!data) {
@@ -89,7 +89,7 @@ const transform: AxiosTransform = {
 
     // 接口请求成功，直接返回结果
     if (code === ResultEnum.SUCCESS) {
-      return result || true;
+      return result;
     }
     // 接口请求错误，统一提示错误信息
     if (code === ResultEnum.ERROR) {
@@ -234,13 +234,6 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) {
 }
 export const defHttp = createAxios();
 
-// var mock = new MockAdapter(axios);
-// mock.onGet('/api/aaa').reply(200, {
-//   users: [{ id: 1, name: 'John Smith' }],
-// });
-
-// default
-
 // other api url
 // export const otherHttp = createAxios({
 //   requestOptions: {