缓存角色

src/layout/components/header-tools.vue

@@ -89,6 +89,7 @@
   import { logout } from '@/utils/page-tab-util';
   import { userLogout } from '@/api/system/user';
   import router from '@/router/index';
+  import { getCurrentUser, setCurrentUser } from '@/utils/token-util';
 
   export default {
     components: { HeaderNotice, PasswordModal, SettingDrawer, I18nIcon },
@@ -103,49 +104,49 @@
         // 是否显示主题设置抽屉
         settingVisible: false,
         groupId: '',
-      roleId: '',
-      currentUser:{
-        currentGroupId:'',
-        currentRoleId:''
-      }
+        roleId: '',
+        currentUser: {
+          currentGroupId: '',
+          currentRoleId: ''
+        }
       };
     },
     created() {
-    this.currentUser = JSON.parse(sessionStorage['currentUser']);
-    this.groupId =  this.currentUser.currentGroupId;
-    this.roleId =  this.currentUser.currentRoleId;
-  },
+      this.currentUser = getCurrentUser();
+      this.groupId = this.currentUser.currentGroupId;
+      this.roleId = this.currentUser.currentRoleId;
+    },
     computed: {
       // 当前用户信息
       loginUser() {
         return this.$store.state.user.info;
       },
-                   // 部门下拉
-    loginChangeGroupVOList() {
-      return this.$store.state.user?.info?.loginChangeGroupVOList;
-    },
-    // 角色下拉
-    loginChangeRoleVOList() {
-      return this.$store.state.user?.info?.loginChangeGroupVOList.find(
-        (item) => item.groupId == this.groupId
-      )?.loginChangeRoleVOList;
-    }
+      // 部门下拉
+      loginChangeGroupVOList() {
+        return this.$store.state.user?.info?.loginChangeGroupVOList;
+      },
+      // 角色下拉
+      loginChangeRoleVOList() {
+        return this.$store.state.user?.info?.loginChangeGroupVOList.find(
+          (item) => item.groupId == this.groupId
+        )?.loginChangeRoleVOList;
+      }
     },
     methods: {
       groupIdChange(val) {
-      this.roleChange(this.loginChangeRoleVOList[0].roleId);
-    },
-    roleChange(val) {
-      this.roleId = val;
-      this.currentUser.currentGroupId = this.groupId;
-      this.currentUser.currentRoleId = val;
-      sessionStorage['currentUser']=JSON.stringify(this.currentUser)
-      this.$store
-        .dispatch('user/fetchUserInfo')
-        .then(({ menus, homePath, authoritiesRouter }) => {
-          router.roleChange({ menus, homePath, authoritiesRouter });
-        });
-    },
+        this.roleChange(this.loginChangeRoleVOList[0].roleId);
+      },
+      roleChange(val) {
+        this.roleId = val;
+        this.currentUser.currentGroupId = this.groupId;
+        this.currentUser.currentRoleId = val;
+        setCurrentUser(this.currentUser)
+        this.$store
+          .dispatch('user/fetchUserInfo')
+          .then(({ menus, homePath, authoritiesRouter }) => {
+            router.roleChange({ menus, homePath, authoritiesRouter });
+          });
+      },
       /* 用户信息下拉点击事件 */
       onUserDropClick(command) {
         if (command === 'password') {

src/router/index.js

@@ -6,8 +6,7 @@ import NProgress from 'nprogress';
 import VueRouter from 'vue-router';
 import { WHITE_LIST, REDIRECT_PATH, LAYOUT_PATH } from '@/config/setting';
 import store from '@/store';
-import { getToken, setToken } from '@/utils/token-util';
-
+import { getToken, setToken, getCurrentUser  } from '@/utils/token-util';
 import { routes, getMenuRoutes } from './routes';
 import { changeRole } from '@/api/layout/index';
 Vue.use(VueRouter);
@@ -79,8 +78,7 @@ router.afterEach((to) => {
   }
 });
 router.roleChange = async ({ menus, homePath, authoritiesRouter }) => {
-  const currentUser = JSON.parse(sessionStorage['currentUser']);
-
+  const currentUser = getCurrentUser()
   if (menus && menus.length > 0) {
     router.addRoute(
       getMenuRoutes([...menus, ...authoritiesRouter], homePath)

src/store/modules/user.js

@@ -5,6 +5,7 @@ import { formatMenus, toTreeData, formatTreeData } from 'ele-admin';
 import { USER_MENUS } from '@/config/setting';
 import { getResourcesTree } from '@/api/layout';
 import {getCurrentUserAuthorityDeptAPI} from "@/api/login";
+import { getCurrentUser,setCurrentUser } from '@/utils/token-util';
 
 const formatRouter = (list) => {
   let menuList = []; // menuType
@@ -119,7 +120,7 @@ export default {
     // },
     //动态路由
     async fetchUserInfo({ commit }) {
-      let currentUser=JSON.parse(sessionStorage['currentUser'])
+      let currentUser = getCurrentUser()
       const result = await getResourcesTree({groupId:currentUser.currentGroupId,roleId:currentUser.currentRoleId}).catch(() => {});
       const list = result.filter((i) => i.path === '/page-eam');
       if (!list.length) {

src/utils/page-tab-util.js

@@ -4,7 +4,7 @@
 import store from '@/store';
 import router from '@/router';
 import { Message } from 'element-ui';
-import { removeToken } from '@/utils/token-util';
+import { removeToken,removeCurrentUser } from '@/utils/token-util';
 import { setDocumentTitle } from '@/utils/document-title-util';
 import {
   HOME_PATH,
@@ -239,6 +239,7 @@ export function goHomeRoute(from) {
  */
 export function logout(route, from) {
   removeToken();
+  removeCurrentUser();
   if (route) {
     router.push({
       path: '/login',

src/utils/token-util.js

@@ -30,6 +30,32 @@ export function setToken(token, remember) {
   }
 }
 
+/**
+ * 获取缓存的 当前登陆角色
+ */
+export function getCurrentUser() {
+  let currentUser = sessionStorage.getItem('currentUser');
+  if (!currentUser) {
+    currentUser = localStorage.getItem('currentUser');
+  }
+  return JSON.parse(currentUser);
+}
+
+/**
+ * 缓存 当前登陆角色
+ * @param token token
+ * @param remember 是否永久存储
+ */
+export function setCurrentUser(currentUser, remember) {
+  removeCurrentUser()
+  if (currentUser) {
+    if (remember) {
+      localStorage.setItem('currentUser', JSON.stringify(currentUser));
+    } else {
+      sessionStorage.setItem('currentUser', JSON.stringify(currentUser));
+    }
+  }
+}
 /**
  * 移除 token
  */
@@ -37,3 +63,10 @@ export function removeToken() {
   localStorage.removeItem(TOKEN_STORE_NAME);
   sessionStorage.removeItem(TOKEN_STORE_NAME);
 }
+/**
+ * 移除 currentUser
+ */
+export function removeCurrentUser() {
+  localStorage.removeItem('currentUser');
+  sessionStorage.removeItem('currentUser');
+}

src/views/login/index.vue

@@ -110,12 +110,13 @@
   import I18nIcon from '@/layout/components/i18n-icon.vue';
   import { getToken } from '@/utils/token-util';
   import { login, getCaptcha, sub } from '@/api/login';
-  
+  import { setCurrentUser } from '@/utils/token-util';
+
   export default {
     // eslint-disable-next-line vue/multi-word-component-names
     name: 'Login',
     components: { I18nIcon },
-    data () {
+    data() {
       return {
         // 登录框方向, 0居中, 1居右, 2居左
         direction: 0,
@@ -135,7 +136,7 @@
     },
     computed: {
       // 表单验证规则
-      rules () {
+      rules() {
         return {
           loginName: [
             {
@@ -156,7 +157,7 @@
         };
       }
     },
-    created () {
+    created() {
       if (getToken()) {
         this.goHome();
       } else {
@@ -166,7 +167,7 @@
     },
     methods: {
       /* 提交 */
-      submit () {
+      submit() {
         this.$refs.form.validate((valid) => {
           if (!valid) {
             return false;
@@ -177,13 +178,16 @@
               localStorage.setItem('userId', res.data.userId);
               // 用户信息
               if (res.data?.loginChangeGroupVOList.length > 0) {
-              sessionStorage['currentUser'] = JSON.stringify({
-                currentGroupId: res.data.loginChangeGroupVOList[0].groupId,
-                currentRoleId:
-                  res.data.loginChangeGroupVOList[0].loginChangeRoleVOList[0]
-                    .roleId
-              });
-            }
+                setCurrentUser(
+                  {
+                    currentGroupId: res.data.loginChangeGroupVOList[0].groupId,
+                    currentRoleId:
+                      res.data.loginChangeGroupVOList[0]
+                        .loginChangeRoleVOList[0].roleId
+                  },
+                  this.form.remember
+                );
+              }
               this.$store.commit('user/setUserInfo', res.data);
               this.loading = false;
               this.$message.success(res.message);
@@ -197,11 +201,11 @@
         });
       },
       /* 跳转到首页 */
-      goHome () {
+      goHome() {
         this.$router.push(this.$route?.query?.from ?? '/').catch(() => {});
       },
       /* 更换图形验证码 */
-      changeCaptcha () {
+      changeCaptcha() {
         // 这里演示的验证码是后端返回base64格式的形式, 如果后端地址直接是图片请参考忘记密码页面
         getCaptcha()
           .then((data) => {