refactor(projects): 精简版+动态路由权限初步

src/utils/service/error.ts

@@ -1,5 +1,4 @@
 import type { AxiosError, AxiosResponse } from 'axios';
-import type { RequestServiceError, BackendServiceResult } from '@/interface';
 import {
   DEFAULT_REQUEST_ERROR_CODE,
   DEFAULT_REQUEST_ERROR_MSG,
@@ -9,33 +8,49 @@ import {
   REQUEST_TIMEOUT_MSG,
   ERROR_STATUS
 } from '@/config';
+import { exeStrategyActions } from '../common';
 import { showErrorMsg } from './msg';
 
 type ErrorStatus = keyof typeof ERROR_STATUS;
 
 /**
- * 处理请求失败的错误
+ * 处理axios请求失败的错误
  * @param error - 错误
  */
 export function handleAxiosError(axiosError: AxiosError) {
-  const error: RequestServiceError = {
+  const error: Service.RequestError = {
     type: 'axios',
     code: DEFAULT_REQUEST_ERROR_CODE,
     msg: DEFAULT_REQUEST_ERROR_MSG
   };
 
-  if (!window.navigator.onLine || axiosError.message === 'Network Error') {
-    // 网路错误
-    Object.assign(error, { code: NETWORK_ERROR_CODE, msg: NETWORK_ERROR_MSG });
-  } else if (axiosError.code === REQUEST_TIMEOUT_CODE && axiosError.message.includes('timeout')) {
-    /** 超时错误 */
-    Object.assign(error, { code: REQUEST_TIMEOUT_CODE, msg: REQUEST_TIMEOUT_MSG });
-  } else if (axiosError.response) {
-    // 请求不成功的错误
-    const errorCode: ErrorStatus = axiosError.response.status as ErrorStatus;
-    const msg = ERROR_STATUS[errorCode] || DEFAULT_REQUEST_ERROR_MSG;
-    Object.assign(error, { code: errorCode || DEFAULT_REQUEST_ERROR_CODE, msg });
-  }
+  const actions: Common.StrategyAction[] = [
+    [
+      // 网路错误
+      !window.navigator.onLine || axiosError.message === 'Network Error',
+      () => {
+        Object.assign(error, { code: NETWORK_ERROR_CODE, msg: NETWORK_ERROR_MSG });
+      }
+    ],
+    [
+      // 超时错误
+      axiosError.code === REQUEST_TIMEOUT_CODE && axiosError.message.includes('timeout'),
+      () => {
+        Object.assign(error, { code: REQUEST_TIMEOUT_CODE, msg: REQUEST_TIMEOUT_MSG });
+      }
+    ],
+    [
+      // 请求不成功的错误
+      Boolean(axiosError.response),
+      () => {
+        const errorCode: ErrorStatus = (axiosError.response?.status as ErrorStatus) || 'DEFAULT';
+        const msg = ERROR_STATUS[errorCode];
+        Object.assign(error, { code: errorCode, msg });
+      }
+    ]
+  ];
+
+  exeStrategyActions(actions);
 
   showErrorMsg(error);
 
@@ -47,7 +62,7 @@ export function handleAxiosError(axiosError: AxiosError) {
  * @param response - 请求的响应
  */
 export function handleResponseError(response: AxiosResponse) {
-  const error: RequestServiceError = {
+  const error: Service.RequestError = {
     type: 'axios',
     code: DEFAULT_REQUEST_ERROR_CODE,
     msg: DEFAULT_REQUEST_ERROR_MSG
@@ -69,11 +84,11 @@ export function handleResponseError(response: AxiosResponse) {
 }
 
 /**
- * 处理后端返回的错误
+ * 处理后端返回的错误(业务错误)
  * @param backendResult - 后端接口的响应数据
  */
-export function handleBackendError(backendResult: BackendServiceResult) {
-  const error: RequestServiceError = {
+export function handleBackendError(backendResult: Service.BackendServiceResult) {
+  const error: Service.RequestError = {
     type: 'backend',
     code: backendResult.code,
     msg: backendResult.message

src/utils/service/handler.ts

@@ -1,27 +1,15 @@
-import { CustomRequestResult, CustomSuccessRequestResult, CustomFailRequestResult } from '@/interface';
-
-type ResultHandler<T> = (...arg: any) => T;
-/**
- * 对请求的结果数据进行格式化的处理
- * @param resultHandler - 处理函数
- * @param requests - 请求结果
- */
-export function requestMiddleware<MiddlewareData>(
-  resultHandler: ResultHandler<MiddlewareData>,
-  requests: CustomRequestResult<any>[]
-) {
-  const errorIndex = requests.findIndex(item => item.error !== null);
-  const hasError = errorIndex > -1;
-  if (hasError) {
-    const failResult: CustomFailRequestResult = {
-      data: null,
-      error: requests[errorIndex].error!
+/** 统一失败和成功的请求结果的数据类型 */
+export async function handleServiceResult<T = any>(error: Service.RequestError | null, data: any) {
+  if (error) {
+    const fail: Service.FailedResult = {
+      error,
+      data: null
     };
-    return failResult;
+    return fail;
   }
-  const successResult: CustomSuccessRequestResult<MiddlewareData> = {
-    data: resultHandler(...requests.map(item => item.data)),
-    error: null
+  const success: Service.SuccessResult<T> = {
+    error: null,
+    data
   };
-  return successResult;
+  return success;
 }

src/utils/service/msg.ts

@@ -1,16 +1,16 @@
-import type { RequestServiceError } from '@/interface';
 import { NO_ERROR_MSG_CODE, ERROR_MSG_DURATION } from '@/config';
+import { consoleWarn } from '../common';
 
 /** 错误消息栈，防止同一错误同时出现 */
 const errorMsgStack = new Map<string | number, string>([]);
 
-function addErrorMsg(error: RequestServiceError) {
+function addErrorMsg(error: Service.RequestError) {
   errorMsgStack.set(error.code, error.msg);
 }
-function removeErrorMsg(error: RequestServiceError) {
+function removeErrorMsg(error: Service.RequestError) {
   errorMsgStack.delete(error.code);
 }
-function hasErrorMsg(error: RequestServiceError) {
+function hasErrorMsg(error: Service.RequestError) {
   return errorMsgStack.has(error.code);
 }
 
@@ -18,11 +18,12 @@ function hasErrorMsg(error: RequestServiceError) {
  * 显示错误信息
  * @param error
  */
-export function showErrorMsg(error: RequestServiceError) {
+export function showErrorMsg(error: Service.RequestError) {
   if (!error.msg) return;
   if (!NO_ERROR_MSG_CODE.includes(error.code)) {
     if (!hasErrorMsg(error)) {
       addErrorMsg(error);
+      consoleWarn(error.code, error.msg);
       window.$message?.error(error.msg, { duration: ERROR_MSG_DURATION });
       setTimeout(() => {
         removeErrorMsg(error);

src/utils/service/transform.ts

@@ -1,7 +1,7 @@
 import qs from 'qs';
 import FormData from 'form-data';
-import { isArray } from '@/utils';
 import { ContentType } from '@/enum';
+import { isArray } from '../common';
 
 /**
  * 请求数据的转换