Browse Source

request请求拦截器修改

lisiyan 2 years ago
parent
commit
e1239ad69e
8 changed files with 94 additions and 56 deletions
  1. 1 1
      src/App.vue
  2. 17 6
      src/components/sideMenu.vue
  3. 2 7
      src/main.js
  4. 7 0
      src/store/index.js
  5. 34 0
      src/store/userInfo.js
  6. 0 13
      src/stores/index.js
  7. 31 26
      src/views/Login.vue
  8. 2 3
      utils/request.js

+ 1 - 1
src/App.vue

@@ -21,7 +21,7 @@ export default {
 
 <style lang="scss" scoped>
 ::v-deep .el-container {
-  min-height: 100vh;
+  height: 100vh;
 }
 ::v-deep .el-aside {
   box-shadow: 0px 0px 12px rgba(35, 97, 169, 0.05);

+ 17 - 6
src/components/sideMenu.vue

@@ -10,6 +10,8 @@ import Settings from '@/components/icon/menu_setting.vue'
 import Support from '@/components/icon/menu_support.vue'
 import Logout from '@/components/icon/logout.vue'
 import { Aside } from 'element-ui'
+import { userStore } from '@/store/userInfo'
+
 export default {
   name:'sideMenu',
   components:{
@@ -30,11 +32,11 @@ export default {
     }
   },
   mounted() {
-    get('http://81.68.234.235:8032/pdf-tech/vppMember/getMemberInfo').then((res)=>{
-      this.userName = res.data.result.fullName
-      this.email = res.data.result.email
-      this.role = res.data.result.role
-    })
+    if (userStore().user) {
+    this.userName = userStore().user.userName
+    this.email = userStore().user.email
+    this.role = userStore().user.role
+    }
   },
   methods:{
     logout(){
@@ -43,6 +45,15 @@ export default {
           this.$router.push('login')
         }
       })
+      this.$cookies.remove('accessToken')
+      userStore().clearUserInfo()
+    }
+  },
+  filters:{
+    avant(){
+      if (userStore().user.userName) {
+        return userStore().user.userName.substr(0, 1).toUpperCase()
+      }
     }
   }
 }
@@ -52,7 +63,7 @@ export default {
   <div class=" flex flex-col justify-between h-100vh">
     <div class="aside">
       <div class="user-info">
-        <div class="head-photo"><p>{{ userName.substr(0, 1).toUpperCase() }}</p></div>
+        <div class="head-photo"><p>{{ userName | avant() }}</p></div>
         <div class="info">
           <p>{{ userName }}</p>
           <p>{{ email }}</p>

+ 2 - 7
src/main.js

@@ -1,6 +1,5 @@
 import Vue from "vue"
-import { createPinia, PiniaVuePlugin } from "pinia"
-
+import pinia from '@/store/index'
 import App from "./App.vue"
 import router from "./router"
 
@@ -13,14 +12,10 @@ import '@/assets/style/element-variables.scss'
 // 配置cookie
 import cookies from 'vue-cookies'
 Vue.prototype.$cookies = cookies
-
 Vue.use(ElementUI)
 
-
-Vue.use(PiniaVuePlugin)
-
 new Vue({
   router,
-  pinia: createPinia(),
+  pinia,
   render: (h) => h(App),
 }).$mount("#app")

+ 7 - 0
src/store/index.js

@@ -0,0 +1,7 @@
+import Vue from 'vue'
+import { createPinia, PiniaVuePlugin } from 'pinia'
+
+Vue.use(PiniaVuePlugin)
+const pinia = createPinia()
+
+export default pinia

+ 34 - 0
src/store/userInfo.js

@@ -0,0 +1,34 @@
+import { defineStore } from 'pinia'
+
+export const userStore = defineStore('user', {
+    state: () => ({
+        user: JSON.parse(localStorage.getItem('userInfo')) || ''
+    }),
+    getters: {
+        getUser: (state) => state.user
+    },
+    actions: {
+        // 获取用户信息
+        setUserInfo(user) {
+            if (user) {
+                this.user = {
+                    userName: user.fullName,
+                    email: user.email,
+                    role: user.role
+                }
+                localStorage.setItem('userInfo', JSON.stringify(this.user))
+            } else {
+                this.user = {
+                    userName: '',
+                    email: '',
+                    role: ''
+                }
+            }
+        },
+        // 清除用户信息
+        clearUserInfo() {
+            this.user = ''
+            localStorage.removeItem('userInfo')
+        }
+    }
+})

+ 0 - 13
src/stores/index.js

@@ -1,13 +0,0 @@
-import { defineStore } from "pinia"
-
-export const useCounterStore = defineStore({
-  state: () => ({
-    
-  }),
-  getters: {
-    
-  },
-  actions: {
-    
-  },
-})

+ 31 - 26
src/views/Login.vue

@@ -4,6 +4,7 @@ import crypto from '@/crypto/crypto'
 import Eyecolse from '@/components/icon/eye_colse.vue'
 import Eyeopen from '@/components/icon/eye_open.vue'
 import Error from '@/components/icon/error.vue'
+import { userStore } from '@/store/userInfo'
 
 export default {
   components: { Eyecolse, Eyeopen, Error },
@@ -65,6 +66,35 @@ export default {
                     res.data.result
                 ).then((res) => {
                   this.$cookies.set('accessToken', res.data.result.accessToken)
+                  setTimeout(() => {
+                    if (this.$route.query.teamIds) {
+                      this.teamIds = this.$route.query.teamIds.split(',')
+                    }
+                    var urlencoded = new URLSearchParams()
+                    urlencoded.append('memberId', this.$route.query.memberId)
+                    urlencoded.append('teamIds', this.teamIds)
+                    urlencoded.append('action', this.$route.query.action)
+                    urlencoded.append('code', this.$route.query.code)
+                    post(
+                      'http://81.68.234.235:8032/pdf-tech/vppTeam/enterTeam',
+                      urlencoded
+                    ).then((res) => {})
+                    get(
+                      'http://81.68.234.235:8032/pdf-tech/vppMember/getMemberInfo'
+                    ).then((res) => {
+                      if (res.data.code === 200 && res.data.msg == 'success') {
+                        userStore().setUserInfo(res.data.result)
+                      }
+                      if (
+                        parseInt(res.data.result.role) === 1 ||
+                        parseInt(res.data.result.role) === 2
+                      ) {
+                        this.$router.push('/dashboard')
+                      } else {
+                        this.$router.push('/noadmin')
+                      }
+                    })
+                  })
                 })
                 localStorage.setItem('username', this.ruleForm.email)
                 const SECRET_PWD = crypto.set(this.ruleForm.password) // 加密
@@ -74,32 +104,7 @@ export default {
                 } else {
                   localStorage.removeItem('isRemenber')
                 }
-                setTimeout(() => {
-                  if (this.$route.query.teamIds) {
-                    this.teamIds = this.$route.query.teamIds.split(',')
-                  }
-                  var urlencoded = new URLSearchParams()
-                  urlencoded.append('memberId', this.$route.query.memberId)
-                  urlencoded.append('teamIds', this.teamIds)
-                  urlencoded.append('action', this.$route.query.action)
-                  urlencoded.append('code', this.$route.query.code)
-                  post(
-                    'http://81.68.234.235:8032/pdf-tech/vppTeam/enterTeam',
-                    urlencoded
-                  ).then((res) => {})
-                  get(
-                    'http://81.68.234.235:8032/pdf-tech/vppMember/getMemberInfo'
-                  ).then((res) => {
-                    if (
-                      res.data.result.role == 1 ||
-                      res.data.result.role == 2
-                    ) {
-                      this.$router.push('/dashboard')
-                    } else {
-                      this.$router.push('/noadmin')
-                    }
-                  })
-                })
+                
               } else if (
                 res.data.code === 306 &&
                 res.data.msg === '账号或者密码错误'

+ 2 - 3
utils/request.js

@@ -2,9 +2,6 @@ import axios from 'axios';
 import cookies from 'vue-cookies'
 import Qs from 'qs'
 
-const token = cookies.get('accessToken')
-axios.defaults.headers['authorization'] = `Bearer ${token}`;
-
 // 创建请求实例
 const instance = axios.create({
   baseURL: '/api',
@@ -24,6 +21,8 @@ instance.interceptors.request.use(
      *  config.headers.token = token
      * }
      */
+    const token = cookies.get('accessToken')
+    config.headers.Authorization = 'Bearer ' + token
     return config;
   },
   (error) => {