浏览代码

添加退出登录

zhaoke 2 年之前
父节点
当前提交
fc53365a54
共有 4 个文件被更改,包括 58 次插入45 次删除
  1. 2 2
      src/api/newLogin.ts
  2. 30 17
      src/layout/components/NavBarTop/index.vue
  3. 17 19
      src/store/user.ts
  4. 9 7
      src/utils/mockAxiosReq.ts

+ 2 - 2
src/api/newLogin.ts

@@ -27,7 +27,7 @@ export function login(params) {
 }
 
 //登出
-export function loginUp(params) {
+export function loginUp(params?) {
   return request({
     url: '/foxlibc/sign-out',
     method: 'post',
@@ -63,7 +63,7 @@ export function permission(params) {
 }
 
 //token
-export function gettoken(params) {
+export function gettoken(params?) {
   return request({
     url: '/foxlibc/application-token',
     method: 'post',

+ 30 - 17
src/layout/components/NavBarTop/index.vue

@@ -31,27 +31,40 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import { ElMessage } from 'element-plus'
-import { ArrowDownBold } from '@element-plus/icons-vue'
-import { useUserStore } from '@/store/user'
+import { ref } from "vue";
+import { ElMessage } from "element-plus";
+import { ArrowDownBold } from "@element-plus/icons-vue";
+import { useUserStore } from "@/store/user";
 
-const imgUrl = ref('https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png')
-const store = useUserStore()
-const name = store.$state.username
-const errorHandler = () => true
+const imgUrl = ref(
+  "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
+);
+const store = useUserStore();
+const name = store.$state.username;
+const errorHandler = () => true;
 /*
  * 退出登录
  * */
-const router = useRouter()
-const route = useRoute()
-const loginOut = () => {
-  const userStore = useUserStore()
-  userStore.logout().then(() => {
-    ElMessage({ message: '退出登录成功', type: 'success' })
-    router.push(`/login?redirect=/`)
-  })
-}
+const router = useRouter();
+const route = useRoute();
+const loginOut = async () => {
+  const userStore = useUserStore();
+  const result: any = await userStore.logout();
+  if (result.code == 0) {
+    ElMessage({
+      message: "退出成功",
+      type: "success",
+      duration: 2 * 1000,
+      onClose: () => {
+        useUserStore().resetState();
+        router.push(`/login`);
+        location.reload();
+      },
+    });
+  } else {
+    ElMessage.error(result.message);
+  }
+};
 </script>
 
 <style lang="scss" scoped>

+ 17 - 19
src/store/user.ts

@@ -189,10 +189,10 @@ export const useUserStore = defineStore('user', {
     // user logout
     logout() {
       return new Promise((resolve, reject) => {
-        loginUp({})
-          .then(() => {
-            this.resetState()
-            resolve(null)
+        loginUp()
+          .then((res) => {
+            useUserStore().resetState()
+            resolve(res)
           })
           .catch((error: any) => {
             reject(error)
@@ -200,21 +200,19 @@ export const useUserStore = defineStore('user', {
       })
     },
     resetState() {
-      return new Promise((resolve) => {
-        sessionStorage.clear()
-        removeToken('codeToken')
-        removeToken('systemSet')
-        removeToken('userid')
-        this.M_username('')
-        this.M_roles([])
-        removeToken() // must remove  token  first
-        resetRouter() // reset the router
-        const permissionStore = usePermissionStore()
-        permissionStore.M_isGetUserInfo(false)
-        const tagsViewStore = useTagsViewStore()
-        tagsViewStore.delAllViews()
-        resolve(null)
-      })
+      sessionStorage.clear()
+      removeToken('codeToken')
+      removeToken('systemSet')
+      removeToken('userid')
+      removeToken('userName')
+      this.M_username('')
+      this.M_roles([])
+      removeToken() // must remove  token  first
+      resetRouter() // reset the router
+      const permissionStore = usePermissionStore()
+      permissionStore.M_isGetUserInfo(false)
+      const tagsViewStore = useTagsViewStore()
+      tagsViewStore.delAllViews()
     },
   },
 })

+ 9 - 7
src/utils/mockAxiosReq.ts

@@ -1,6 +1,8 @@
 import axios from 'axios'
 import { getToken, getUserId, getCodeToken } from '@/utils/auth'
 import { ElMessage } from 'element-plus'
+import { useUserStore } from '@/store/user'
+import router from '@/router'
 let isMttoken
 // create an axios instance
 const service = axios.create({
@@ -16,7 +18,7 @@ const service = axios.create({
 })
 // request interceptor
 service.interceptors.request.use(
-  (config) => {
+  (config: any) => {
     // config.headers.common["content-type"] = "application/json"
     if (config.istoken) {
       config.headers['appSecret'] = PLATFROM_CONFIG.appKeyString
@@ -31,9 +33,9 @@ service.interceptors.request.use(
     if (getCodeToken() && !config.istoken) {
       config.headers['Authorization'] = getCodeToken()
     }
-    // if (store.getters.token) {
-    //   config.headers['Authorization'] = getToken()
-    // }
+    if (useUserStore().token) {
+      config.headers['Authorization'] = getToken()
+    }
     return config
   },
   (error) => {
@@ -75,9 +77,9 @@ service.interceptors.response.use(
             type: 'error',
             duration: 5 * 1000,
             onClose: () => {
-              // store.dispatch('user/resetToken').then(() => {
-              //   location.reload()
-              // })
+              useUserStore().resetState()
+              router.push(`/login`)
+              location.reload()
             },
           })
         }