重大改变！登录，退出，侧边栏渲染均ok了

src/api/user.js

@@ -18,9 +18,10 @@ export function login(data) {
 export function getInfo(token) {
   return request({
     url: '/user/profile/get',
-    method: 'post',
-    params: {token},
+    method: 'get',
+    // params: {token},
     headers: {
+      'Authorization':'Bearer '+token,
       'Timestamp': getCurrentTimestamp()
     }
   });
@@ -31,8 +32,8 @@ export function logout(token) {
   return request({
     url: '/auth/logout',
     method: 'get',
-    params: { token },
     headers: {
+      'Authorization':'Bearer '+token,
       'Timestamp': getCurrentTimestamp()
     }
   });

src/layout/components/Navbar.vue

@@ -62,6 +62,7 @@ import Search from '@/components/HeaderSearch';
 import { defineComponent } from 'vue';
 import { CaretBottom } from '@element-plus/icons-vue';
 
+
 export default defineComponent({
   components: {
     Breadcrumb,
@@ -86,6 +87,8 @@ export default defineComponent({
       store.app().toggleSidebar();
     },
     async logout() {
+        console.log('5989569898')
+        // store.user().login()
       await store.user().logout();
       this.$router.push(`/login?redirect=${this.$route.fullPath}`);
     }

src/permission.ts

@@ -10,6 +10,7 @@ NProgress.configure({ showSpinner: false }); // NProgress Configuration
 
 const whiteList = ['/login', '/auth-redirect']; // no redirect whitelist
 
+//每次路由变动，都会调用这个路由守卫
 router.beforeEach(async (to, from, next) => {
   console.log('router.beforeEach', to.path, from.path);
   // start progress bar
@@ -21,31 +22,42 @@ router.beforeEach(async (to, from, next) => {
   // determine whether the user has logged in
   const hasToken = getToken();
   console.log('88888',hasToken)
+
   if (hasToken) {
+    //有token
+    // 且前往登录
     if (to.path === '/login') {
       // if is logged in, redirect to the home page
       NProgress.done(); // hack: https://github.com/PanJiaChen/vue-element-admin/pull/2939
       next({ path: '/' });
     } else {
+      // 有token，但是不去登录
       // determine whether the user has obtained his permission roles through getInfo
       // const hasRoles = userStore().roles && userStore().roles.length > 0;
       const hasRoles = true;
 
       // console.log('hasRoles=', hasRoles);
+      // 如果用角色
       if (hasRoles) {
+        // 继续执行
+        const accessRoutes = await permissionStore().generateRoutes(['admin']);
+        accessRoutes.forEach(item => {
+          router.addRoute(item);
+        });
         next();
       } else {
+        // 没有角色
         try {
           // get user info
           // note: roles must be a object array! such as: ['admin'] or ,['developer','editor']
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-          const infoRes = await userStore().getInfo() as any;
+          const infoRes = await userStore().getInfo() as any;     //获取角色，调用查询个人信息的接口
           console.log('permissionuserinfor:',infoRes)
-          let roles = [];
+          let roles:any = [];
           if (infoRes.roles) {
             roles = infoRes.roles;
           }
-
+          roles = ['admin']
           // generate accessible routes map based on roles
           const accessRoutes = await permissionStore().generateRoutes(roles);
           // console.log('accessRoutes=', accessRoutes)
@@ -71,6 +83,7 @@ router.beforeEach(async (to, from, next) => {
       }
     }
   } else {
+    // 没有token
     /* has no token*/
     if (whiteList.indexOf(to.path) !== -1) {
       // in the free login whitelist, go directly

src/store/modules/permission.ts

@@ -55,10 +55,15 @@ export default defineStore({
       this.routes = constantRoutes.concat(routes);
     },
     generateRoutes(roles: string[]) {
+      console.log("asdasd")
       let accessedRoutes;
-      if (roles.includes('teacher_user')) {
+      if (roles.includes('admin')) {
+        console.log("123")
+
         accessedRoutes = asyncRoutes || [];
       } else {
+        console.log("456")
+
         accessedRoutes = filterAsyncRoutes(asyncRoutes, roles);
       }
       this.setRoutes(accessedRoutes);

src/store/modules/user.ts

@@ -57,6 +57,7 @@ export default defineStore({
           const { data } = response;
           this.token = data.token;
           setToken(data.token);
+          console.log("token", this.token)
           router.push('/')
           resolve();
           console.log('2222',response)
@@ -76,11 +77,11 @@ export default defineStore({
           if (!data) {
             reject('Verification failed, please Login again.');
           }
-          const { id,username,address,phone,email,age,signature,avatar,nickname,sex,description,roles } = data;
+          const { id,username,address,phone,email,age,signature,avatar,nickname,sex,description } = data;
           // roles must be a non-empty array
-          if (!roles || roles.length <= 0) {
-            reject('getInfo: roles must be a non-null array!');
-          }
+          // if (!roles || roles.length <= 0) {
+          //   reject('getInfo: roles must be a non-null array!');
+          // }
           this.id = id;
           // this.roles = roles;
           // this.roles =['admin'];
@@ -103,17 +104,17 @@ export default defineStore({
 
     // user logout
     logout():Promise<void> {
+      console.log("token",this.token)
       return new Promise((resolve, reject) => {
         apiLogout(this.token).then(() => {
           this.token = '';
           this.roles = [];
+          console.log('退出',this.token)
           removeToken();
           resetRouter();
-
           // reset visited views and cached views
           // to fixed https://github.com/PanJiaChen/vue-element-admin/issues/2485
           tagsViewStore().delAllViews();
-
           resolve();
         }).catch(error => {
           reject(error);
@@ -137,11 +138,11 @@ export default defineStore({
 
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       const infoRes = await this.getInfo() as any;
-      let roles = [];
+      let roles : any[] = [];
       if (infoRes.roles) {
         roles = infoRes.roles;
       }
-
+      roles = ['admin']
       resetRouter();
 
       // generate accessible routes map based on roles

src/utils/request.js

@@ -1,6 +1,6 @@
 import axios from 'axios';
 import store from '@/store';
-import { getToken } from '@/utils/auth';
+import {getToken, removeToken} from '@/utils/auth';
 
 const BaseURL ='https://nbxt.oa.x-lf.cn'
 // create an axios instance
@@ -44,7 +44,8 @@ service.interceptors.response.use(
    */
   response => {
     const res = response.data;
-    console.log('999999',res)
+    // console.log("removeToken:",removeToken())
+    console.log('999999',response)
     // if the custom code is not 20000, it is judged as an error.
     if (res.code !== 20000 && res.code !== 200) {
       ElMessage({

src/views/dashboard/admin/components/TransactionTable.vue

@@ -32,7 +32,7 @@ export default defineComponent({
     };
   },
   created() {
-    this.fetchData();
+    // this.fetchData();
   },
   methods: {
     statusFilter(status) {