From e598761189485f374bf36579f6f6d45bcb57a589 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=83=9D=E5=85=88=E7=91=9E?= <1490493387@qq.com> Date: Thu, 24 Feb 2022 00:17:42 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E7=BC=93=E5=AD=98=E9=87=8D?= =?UTF-8?q?=E5=91=BD=E5=90=8DLocal=E4=BF=AE=E6=94=B9=E4=B8=BAlocalStorage?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/store/modules/app.ts | 21 +++++++++++++-------- src/store/modules/user.ts | 12 ++++++------ src/utils/request.ts | 10 +++++----- src/utils/storage.ts | 6 +++--- 4 files changed, 27 insertions(+), 22 deletions(-) diff --git a/src/store/modules/app.ts b/src/store/modules/app.ts index a0df8aaa..88c4808b 100644 --- a/src/store/modules/app.ts +++ b/src/store/modules/app.ts @@ -1,31 +1,32 @@ import {AppState} from "@/store/interface"; -import {Local} from "@/utils/storage"; +import {localStorage} from "@/utils/storage"; import {store} from "@/store"; import {defineStore} from "pinia"; +import { getLanguage } from '@/lang/index' export const useAppStore = defineStore({ id: "app", state: (): AppState => ({ device: 'desktop', sidebar: { - opened: Local.get('sidebarStatus') ? !!+Local.get('sidebarStatus') : true, + opened: localStorage.get('sidebarStatus') ? !!+localStorage.get('sidebarStatus') : true, withoutAnimation: false }, - language: 'zh', - size: Local.get('size')||'default' + language: getLanguage(), + size: localStorage.get('size')||'default' }), actions: { toggleSidebar() { this.sidebar.opened = !this.sidebar.opened this.sidebar.withoutAnimation = false if (this.sidebar.opened) { - Local.set('sidebarStatus', 1) + localStorage.set('sidebarStatus', 1) } else { - Local.set('sidebarStatus', 0) + localStorage.set('sidebarStatus', 0) } }, closeSideBar(withoutAnimation: any) { - Local.set('sidebarStatus', 0) + localStorage.set('sidebarStatus', 0) this.sidebar.opened = false this.sidebar.withoutAnimation = withoutAnimation }, @@ -34,7 +35,11 @@ export const useAppStore = defineStore({ }, setSize(size: string) { this.size = size - Local.set('size', size) + localStorage.set('size', size) + }, + setLanguage(language: string) { + this.language = language + localStorage.set('language', language) } } }) diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts index c5bba965..a807d261 100644 --- a/src/store/modules/user.ts +++ b/src/store/modules/user.ts @@ -1,13 +1,13 @@ import { defineStore } from "pinia"; import { store } from "@/store"; import {UserState} from "@/store/interface"; -import {Local} from "@/utils/storage"; +import {localStorage} from "@/utils/storage"; import {getUserInfo, login, logout} from "@/api/login"; import {resetRouter} from "@/router"; const getDefaultState = () => { return { - token: Local.get('token'), + token: localStorage.get('token'), nickname: '', avatar: '', roles: [], @@ -18,7 +18,7 @@ const getDefaultState = () => { export const useUserStore = defineStore({ id:"user", state: ():UserState=>({ - token: Local.get('token') || '', + token: localStorage.get('token') || '', nickname: '', avatar: '', roles: [], @@ -50,7 +50,7 @@ export const useUserStore = defineStore({ ).then(response => { const {access_token, token_type} = response.data const accessToken = token_type + " " + access_token - Local.set("token", accessToken) + localStorage.set("token", accessToken) this.token = accessToken resolve(access_token) }).catch(error => { @@ -90,7 +90,7 @@ export const useUserStore = defineStore({ logout() { return new Promise(((resolve, reject) => { logout().then(() => { - Local.remove('token') + localStorage.remove('token') this.RESET_STATE() resetRouter() resolve(null) @@ -105,7 +105,7 @@ export const useUserStore = defineStore({ */ resetToken(){ return new Promise(resolve=>{ - Local.remove('token') + localStorage.remove('token') this.RESET_STATE() resolve(null) }) diff --git a/src/utils/request.ts b/src/utils/request.ts index 63eb4534..03a75015 100644 --- a/src/utils/request.ts +++ b/src/utils/request.ts @@ -1,7 +1,7 @@ import axios from "axios"; import {ElMessage, ElMessageBox} from "element-plus"; -import {Local} from "@/utils/storage"; -import { useUserStoreHook } from "@/store/modules/user"; +import {localStorage} from "@/utils/storage"; +import {useUserStoreHook} from "@/store/modules/user"; // 创建 axios 实例 const service = axios.create({ @@ -17,7 +17,7 @@ service.interceptors.request.use( throw new Error(`Expected 'config' and 'config.headers' not to be undefined`); } if (useUserStoreHook().token) { - config.headers.Authorization = `${Local.get('token')}`; + config.headers.Authorization = `${localStorage.get('token')}`; } return config }, (error) => { @@ -43,14 +43,14 @@ service.interceptors.response.use( (error) => { const {code, msg} = error.response.data if (code === 'A0230') { // token 过期 - Local.clear(); // 清除浏览器全部缓存 + localStorage.clear(); // 清除浏览器全部缓存 window.location.href = '/'; // 跳转登录页 ElMessageBox.alert('当前页面已失效，请重新登录', '提示', {}) .then(() => { }) .catch(() => { }); - }else{ + } else { ElMessage({ message: msg || '系统出错', type: 'error' diff --git a/src/utils/storage.ts b/src/utils/storage.ts index b65f8b87..29aac5fe 100644 --- a/src/utils/storage.ts +++ b/src/utils/storage.ts @@ -1,7 +1,7 @@ /** * window.localStorage 浏览器永久缓存 */ -export const Local = { +export const localStorage = { // 设置永久缓存 set(key: string, val: any) { window.localStorage.setItem(key, JSON.stringify(val)); @@ -18,13 +18,13 @@ export const Local = { // 移除全部永久缓存 clear() { window.localStorage.clear(); - }, + } }; /** * window.sessionStorage 浏览器临时缓存 */ -export const Session = { +export const sessionStorage = { // 设置临时缓存 set(key: string, val: any) { window.sessionStorage.setItem(key, JSON.stringify(val));