From f7ef90558a7bcd7c4251c501f616eac5571b91e2 Mon Sep 17 00:00:00 2001 From: fwb Date: Thu, 5 Dec 2024 16:37:55 +0800 Subject: [PATCH] =?UTF-8?q?'=E7=99=BB=E5=BD=95=E5=AE=8C=E5=96=84'?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 2 +- src/api/user/index.ts | 3 -- src/api/user/type.ts | 3 +- src/store/modules/types/types.ts | 4 ++ src/store/modules/user.ts | 32 ++++++++--- src/utils/time.ts | 15 ++++++ src/utils/token.ts | 10 ++++ src/views/login/index.vue | 91 +++++++++++++++++++++++++++++--- 8 files changed, 141 insertions(+), 19 deletions(-) create mode 100644 src/store/modules/types/types.ts create mode 100644 src/utils/time.ts create mode 100644 src/utils/token.ts diff --git a/index.html b/index.html index 741f3d2..e5d3ef8 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,7 @@ - 小得盈满，爱逢其时 + Control is Power
diff --git a/src/api/user/index.ts b/src/api/user/index.ts index 0f1ff57..3cc4199 100644 --- a/src/api/user/index.ts +++ b/src/api/user/index.ts @@ -5,7 +5,6 @@ import type { loginForm, loginResponseDate, userReponseData } from './type' enum API { LOGIN_URL = '/user/login', USERINFO_URL = '/user/info', - // LOGOUT_URL = '/admin/acl/index/logout', } //登录接口 export const reqLogin = (data: loginForm) => @@ -13,5 +12,3 @@ export const reqLogin = (data: loginForm) => //获取用户信息 export const reqUserInfo = () => request.get(API.USERINFO_URL) -//退出登录 -// export const reqLogout = () => request.post(API.LOGOUT_URL) diff --git a/src/api/user/type.ts b/src/api/user/type.ts index 1c4ef30..29259c5 100644 --- a/src/api/user/type.ts +++ b/src/api/user/type.ts @@ -5,7 +5,8 @@ export interface loginForm { } interface dataType { - token: string + token?: string + message?: string } //登录接口返回数据类型 export interface loginResponseDate { diff --git a/src/store/modules/types/types.ts b/src/store/modules/types/types.ts new file mode 100644 index 0000000..4d8b659 --- /dev/null +++ b/src/store/modules/types/types.ts @@ -0,0 +1,4 @@ +//定义小仓库数据state类型 +export interface UserState { + token: string | null +} diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts index cdf5bad..ea47f61 100644 --- a/src/store/modules/user.ts +++ b/src/store/modules/user.ts @@ -3,23 +3,41 @@ import { defineStore } from 'pinia' //引入登录接口 import { reqLogin } from '@/api/user' //引入数据类型 -import type { loginForm } from '@/api/user/type' +import type { loginForm, loginResponseDate } from '@/api/user/type' +import type { UserState } from '@/store/modules/types/types' +//引入操作本地存储的工具方法 +import { SET_TOKEN, GET_TOKEN } from '@/utils/token' //创建小仓库 let useUserStore = defineStore('User', { //小仓库存储数据的地方 - state: () => {}, + state: (): UserState => { + return { + token: GET_TOKEN(), + // token: localStorage.getItem('TOKEN'), //用户唯一标识token + } + }, //异步|逻辑的地方 actions: { //用户登录方法 //括号内data收集参数(实参) async userLogin(data: loginForm) { //登录请求 - let result = await reqLogin(data) - console.log(result) + let result: loginResponseDate = await reqLogin(data) + // console.log(result) + if (result.code == 200) { + //pinia仓库存储token + //由于pinia|vuex存储数据其实利用js对象 + this.token = result.data.token as string + //本地存储持久化存储一份 + // localStorage.setItem('TOKEN', (result.data.token as string)) + SET_TOKEN(result.data.token as string) + //能保证当前async函数返回一个成功的promise + return 'OK' + } else { + return Promise.reject(new Error(result.data.message)) + } }, }, - getters: { - - }, + getters: {}, }) export default useUserStore diff --git a/src/utils/time.ts b/src/utils/time.ts new file mode 100644 index 0000000..f5972c1 --- /dev/null +++ b/src/utils/time.ts @@ -0,0 +1,15 @@ +//封装一个函数判断时间 +export const getTime = () => { + let message = '' + let hours = new Date().getHours() + if (hours <= 9) { + message = '早上' + } else if (hours <= 12) { + message = '上午' + } else if (hours <= 18) { + message = '下午' + } else { + message = '晚上' + } + return message +} diff --git a/src/utils/token.ts b/src/utils/token.ts new file mode 100644 index 0000000..50ea1d3 --- /dev/null +++ b/src/utils/token.ts @@ -0,0 +1,10 @@ +//封装本地存储数据与读取数据方法 + +//存储数据 +export const SET_TOKEN = (token: string) => { + localStorage.setItem('TOKEN', token) +} +//本地存储获取数据 +export const GET_TOKEN = () => { + return localStorage.getItem('TOKEN') +} diff --git a/src/views/login/index.vue b/src/views/login/index.vue index 2a94600..b5a58f4 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -3,20 +3,26 @@ -