feat(user.ts):用户登录接口

src/api/login/index.ts

@@ -0,0 +1,45 @@
+import request from "@utils/request";
+
+/**
+ * 登录
+ * @param data
+ */
+export function login(data: object) {
+    return request({
+        url: '/youlai-auth/oauth/token',
+        params: data,
+        headers: {
+            'Authorization': 'Basic bWFsbC1hZG1pbi13ZWI6MTIzNDU2' // 客户端信息加密摘要认证，明文：mall-admin-web:123456
+        }
+    })
+}
+
+/**
+ * 登录成功后获取用户信息（包括用户头像、权限列表等）
+ */
+export function getUserInfo() {
+    return request({
+        url: '/youlai-admin/api/v1/users/me',
+        method: 'get'
+    })
+}
+
+/**
+ * 注销
+ */
+export function logout() {
+    return request({
+        url: '/youlai-auth/oauth/logout',
+        method: 'delete'
+    })
+}
+
+/**
+ * 获取图片验证码
+ */
+export function getCaptcha() {
+    return request({
+        url: '/captcha',
+        method: 'get'
+    })
+}

src/store/interface.ts

@@ -0,0 +1,15 @@
+// 接口类型声明
+export interface UserState {
+    token: string,
+    name: string,
+    avatar: string,
+    introduction: string,
+    roles: string[],
+    perms: string[]
+}
+
+
+// 顶级类型声明
+export interface RootStateTypes {
+    user: UserState
+}

src/store/modules/user.ts

@@ -1,11 +1,57 @@
 import {Module} from "vuex";
+import {UserState, RootStateTypes} from "@store/interface";
+import {Local} from "@utils/storage";
+import {login} from "@api/login"
+import {rejects} from "assert";
+
+const userModule: Module<UserState, RootStateTypes> = {
+    namespaced: true,
+    state: {
+        token: Local.get('token') || '',
+        name: '',
+        avatar: '',
+        introduction: '',
+        roles: [],
+        perms: []
+    },
+    mutations: {
+        SET_TOKEN(state: UserState, token: string) {
+            state.token = token
+        },
+        SET_NAME(state: UserState, name: string) {
+            state.name = name
+        },
+        SET_AVATAR(state: UserState, avatar: string) {
+            state.avatar = avatar
+        },
+        SET_INTRODUCTION(state: UserState, introduction: string) {
+            state.introduction = introduction
+        },
+        SET_ROLES(state: UserState, roles: string[]) {
+            state.roles = roles
+        },
+        SET_PERMS(state: UserState, perms: string[]) {
+            state.perms = perms
+        }
+    },
+    actions: {
+        // 登录
+         login({commit}, userInfo: { username: string, password: string }) {
+            const {username, password} = userInfo
+            return new Promise((resolve, reject) => {
+                login({ username: username.trim(), password: password }).then(response => {
+                    const {access_token, token_type} = response.data
+                    const accessToken = token_type + " " + access_token
+                    Local.set("token",accessToken)
+                    commit('SET_TOKEN',accessToken)
+                }).catch(error => {
+                    reject(error)
+                })
+            })
+        }
+
+    }
+}
+
+export default userModule;
 
-// vuex的Module使用 https://blog.csdn.net/fanweilin0123/article/details/109903447
-export interface State {
-    token:string,
-    name:string,
-    avatar:string,
-    introduction:string,
-    roles:string[],
-    perms:string[]
-}

src/utils/request.ts

@@ -1,6 +1,6 @@
 import axios from "axios";
 import {ElMessage, ElMessageBox} from "element-plus";
-import {Session} from "@utils/storage";
+import {Local} from "@utils/storage";
 
 
 // 创建 axios 实例
@@ -16,9 +16,7 @@ service.interceptors.request.use(
         if (!config?.headers) {
             throw new Error(`Expected 'config' and 'config.headers' not to be undefined`);
         }
-        if (Session.get('token')) {
-            config.headers.Authorization = `${Session.get('token')}`;
-        }
+        config.headers.Authorization = `${Local.get('token')}`;
 
     }, (error) => {
         return Promise.reject(error);
@@ -43,7 +41,7 @@ service.interceptors.response.use(
     (error) => {
         const {code, msg} = error.response.data
         if (code === 'A0230') {  // token 过期
-            Session.clear(); // 清除浏览器全部临时缓存
+            Local.clear(); // 清除浏览器全部缓存
             window.location.href = '/'; // 跳转登录页
             ElMessageBox.alert('当前页面已失效，请重新登录', '提示', {})
                 .then(() => {