feat: docking Gf-Vben-Admin backend

src/api/sys/user.ts

@@ -1,20 +1,24 @@
 import { defHttp } from '/@/utils/http/axios';
-import { LoginParams, LoginResultModel, GetUserInfoModel } from './model/userModel';
+import {
+  LoginParams,
+  GetUserInfoByUserIdParams,
+  GetUserInfoByUserIdModel,
+} from './model/userModel';
 
 import { ErrorMessageMode } from '/#/axios';
 
 enum Api {
   Login = '/login',
   Logout = '/logout',
-  GetUserInfo = '/getUserInfo',
+  GetUserInfo = '/api/user/info',
-  GetPermCode = '/getPermCode',
+  GetPermCodeByUserId = '/getPermCodeByUserId',
 }
 
 /**
  * @description: user login api
  */
 export function loginApi(params: LoginParams, mode: ErrorMessageMode = 'modal') {
-  return defHttp.post<LoginResultModel>(
+  return defHttp.post(
     {
       url: Api.Login,
       params,
@@ -29,12 +33,11 @@ export function loginApi(params: LoginParams, mode: ErrorMessageMode = 'modal')
  * @description: getUserInfo
  */
 export function getUserInfo() {
-  return defHttp.get<GetUserInfoModel>({ url: Api.GetUserInfo }, { errorMessageMode: 'none' });
+  return defHttp.get<GetUserInfoByUserIdModel>({
+    url: Api.GetUserInfo,
+  });
 }
 
-export function getPermCode() {
-  return defHttp.get<string[]>({ url: Api.GetPermCode });
-}
 
 export function doLogout() {
   return defHttp.get({ url: Api.Logout });

src/store/modules/user.ts

@@ -95,13 +95,6 @@ export const useUserStore = defineStore({
 
         // save token
         this.setToken(token);
-        return this.afterLoginAction(goHome);
-      } catch (error) {
-        return Promise.reject(error);
-      }
-    },
-    async afterLoginAction(goHome?: boolean): Promise<GetUserInfoModel | null> {
-      if (!this.getToken) return null;
         // get user info
         const userInfo = await this.getUserInfoAction();
 
@@ -121,19 +114,13 @@ export const useUserStore = defineStore({
         goHome && (await router.replace(userInfo?.homePath || PageEnum.BASE_HOME));
       }
       return userInfo;
-    },
+    }},
-    async getUserInfoAction(): Promise<UserInfo | null> {
+    async getUserInfoAction() {
-      if (!this.getToken) return null;
       const userInfo = await getUserInfo();
-      const { roles = [] } = userInfo;
+      const { roles } = userInfo;
-      if (isArray(roles)) {
       const roleList = roles.map((item) => item.value) as RoleEnum[];
-        this.setRoleList(roleList);
-      } else {
-        userInfo.roles = [];
-        this.setRoleList([]);
-      }
       this.setUserInfo(userInfo);
+      this.setRoleList(roleList);
       return userInfo;
     },
     /**

src/utils/http/axios/index.ts

@@ -19,7 +19,7 @@ import { useUserStoreWithOut } from '/@/store/modules/user';
 
 const globSetting = useGlobSetting();
 const urlPrefix = globSetting.urlPrefix;
-const { createMessage, createErrorModal } = useMessage();
+const { createMessage, createErrorModal,notification } = useMessage();
 
 /**
  * @description: 数据处理，方便区分多种处理方式
@@ -52,35 +52,49 @@ const transform: AxiosTransform = {
 
     // 这里逻辑可以根据项目进行修改
     const hasSuccess = data && Reflect.has(data, 'code') && code === ResultEnum.SUCCESS;
-    if (hasSuccess) {
+    if (!hasSuccess) {
+      if (message) {
+        // errorMessageMode=‘modal’的时候会显示modal错误弹窗，而不是消息提示，用于一些比较重要的错误
+        if (options.errorMessageMode === 'modal') {
+          createErrorModal({ title: t('sys.api.errorTip'), content: message });
+        } else if (options.errorMessageMode === 'message') {
+          createMessage.error(message);
+        }
+      }
+      Promise.reject(new Error(message));
+      return message;
+    }
+
+    // 接口请求成功，直接返回结果
+    if (code === ResultEnum.SUCCESS) {
+      if (message) {
+        notification.success({ message });
+      }
       return result;
     }
-
+    // 接口请求错误，统一提示错误信息
-    // 在此处根据自己项目的实际情况对不同的code执行不同的操作
+    if (code === ResultEnum.ERROR) {
-    // 如果不希望中断当前请求，请return数据，否则直接抛出异常即可
-    let timeoutMsg = '';
-    switch (code) {
-      case ResultEnum.TIMEOUT:
-        timeoutMsg = t('sys.api.timeoutMessage');
-        const userStore = useUserStoreWithOut();
-        userStore.setToken(undefined);
-        userStore.logout(true);
-        break;
-      default:
       if (message) {
-          timeoutMsg = message;
+        createMessage.error(data.message);
+        Promise.reject(new Error(message));
+      } else {
+        const msg = t('sys.api.errorMessage');
+        createMessage.error(msg);
+        Promise.reject(new Error(msg));
       }
+      throw new Error( t('sys.api.apiRequestFailed'));
     }
-
+    // 登录超时
-    // errorMessageMode=‘modal’的时候会显示modal错误弹窗，而不是消息提示，用于一些比较重要的错误
+    if (code === ResultEnum.TIMEOUT) {
-    // errorMessageMode='none' 一般是调用时明确表示不希望自动弹出错误提示
+      const timeoutMsg = t('sys.api.timeoutMessage');
-    if (options.errorMessageMode === 'modal') {
+      createErrorModal({
-      createErrorModal({ title: t('sys.api.errorTip'), content: timeoutMsg });
+        title: t('sys.api.operationFailed'),
-    } else if (options.errorMessageMode === 'message') {
+        content: timeoutMsg,
-      createMessage.error(timeoutMsg);
+      });
+      Promise.reject(new Error(timeoutMsg));
+      return message;
     }
-
+    return message;
-    throw new Error(timeoutMsg || t('sys.api.apiRequestFailed'));
   },
 
   // 请求之前处理config
@@ -199,7 +213,7 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) {
         // See https://developer.mozilla.org/en-US/docs/Web/HTTP/Authentication#authentication_schemes
         // authentication schemes，e.g: Bearer
         // authenticationScheme: 'Bearer',
-        authenticationScheme: '',
+        authenticationScheme: 'Bearer',
         timeout: 10 * 1000,
         // 基础接口地址
         // baseURL: globSetting.apiUrl,

src/views/sys/login/LoginForm.vue

@@ -1,20 +1,8 @@
 <template>
   <LoginFormTitle v-show="getShow" class="enter-x" />
-  <Form
+  <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef" v-show="getShow">
-    class="p-4 enter-x"
-    :model="formData"
-    :rules="getFormRules"
-    ref="formRef"
-    v-show="getShow"
-    @keypress.enter="handleLogin"
-  >
     <FormItem name="account" class="enter-x">
-      <Input
+      <Input size="large" v-model:value="formData.account" :placeholder="t('sys.login.userName')" />
-        size="large"
-        v-model:value="formData.account"
-        :placeholder="t('sys.login.userName')"
-        class="fix-auto-fill"
-      />
     </FormItem>
     <FormItem name="password" class="enter-x">
       <InputPassword