oa消息

src/components/home/header.vue

@@ -351,7 +351,7 @@
 
 <script setup lang="ts">
 import { Icon } from "@iconify/vue";
-import { ref, computed, onMounted } from "vue";
+import { ref, computed, onMounted, onBeforeUnmount } from "vue";
 import { useRouter } from "vue-router";
 import logo from "@/assets/images/logo.png";
 import person from "@/assets/images/person.png";
@@ -375,6 +375,7 @@ import {
 } from "@utils/auth";
 
 import { deleteUserCache } from "@hooks/useCache";
+import { manualLogoutKey, reloginCancelKey } from "@/config/axios/service";
 
 // 新增消息中心状态
 const activeTab = ref("messages");
@@ -408,13 +409,19 @@ const oaMessagesList = ref([]);
 
 const unreadCount = ref(0); // 未读消息数量
 const getUnreadCount = async () => {
-  getUnreadNotifyMessageCount().then((data) => {
-    unreadCount.value = data;
-  });
+  if (!getAccessToken()) {
+    unreadCount.value = 0;
+    return;
+  }
+
+  const data = await getUnreadNotifyMessageCount();
+  unreadCount.value = data;
 };
+let messageTimer: ReturnType<typeof setInterval> | undefined;
+let unreadTimer: ReturnType<typeof setInterval> | undefined;
 onMounted(async () => {
-  getUnreadCount();
   if (isLoggedIn.value) {
+    getUnreadCount();
     await getNotifyMessages(userStore.getUser.username);
     const messageList = await getNotifyMessageList(userStore.getUser.username);
     messages.value = messageList.filter((msg: any) => msg.status === "0");
@@ -427,7 +434,7 @@ onMounted(async () => {
     oaMessagesList.value = oaMessageList.filter((msg) => msg.status === "0");
   }
 
-  setInterval(
+  messageTimer = setInterval(
     async () => {
       if (isLoggedIn.value) {
         await getNotifyMessages(userStore.getUser.username);
@@ -449,9 +456,9 @@ onMounted(async () => {
     1000 * 60 * 5,
   );
 
-  setInterval(
+  unreadTimer = setInterval(
     () => {
-      if (userStore.getIsSetUser) {
+      if (userStore.getIsSetUser && getAccessToken()) {
         console.log("轮询刷新小红点");
         getUnreadCount();
       } else {
@@ -462,6 +469,15 @@ onMounted(async () => {
   );
 });
 
+onBeforeUnmount(() => {
+  if (messageTimer) {
+    clearInterval(messageTimer);
+  }
+  if (unreadTimer) {
+    clearInterval(unreadTimer);
+  }
+});
+
 function timestampToDateTime(timestamp) {
   // 兼容 10位(秒) / 13位(毫秒)
   const len = String(timestamp).length;
@@ -521,8 +537,10 @@ const onUserCommand = async (command: string) => {
     // await userStore.loginOut();
 
     deleteUserCache(); // 删除用户缓存
+    sessionStorage.setItem(manualLogoutKey, "true");
+    sessionStorage.removeItem(reloginCancelKey);
     removeToken();
-    window.location.reload();
+    window.location.href = "/login";
   }
 };
 </script>

src/config/axios/service.ts

@@ -28,6 +28,8 @@ const ignoreMsgs = [
 ];
 // 是否显示重新登录
 export const isRelogin = { show: false };
+export const reloginCancelKey = "reloginCancel";
+export const manualLogoutKey = "manualLogout";
 // Axios 无感知刷新令牌，参考 https://www.dashingdog.cn/article/11 与 https://segmentfault.com/a/1190000020210980 实现
 // 请求队列
 let requestList: any[] = [];
@@ -203,13 +205,25 @@ const refreshToken = async () => {
   );
 };
 const handleAuthorized = () => {
+  const isManualLogout = sessionStorage.getItem(manualLogoutKey) === "true";
+  const isReloginCanceled = sessionStorage.getItem(reloginCancelKey) === "true";
+
+  if (isManualLogout || isReloginCanceled) {
+    deleteUserCache();
+    removeToken();
+    if (!window.location.href.includes("login")) {
+      window.location.href = "/login";
+    }
+    return Promise.reject("登录超时，请重新登录");
+  }
+
   if (!isRelogin.show) {
     if (window.location.href.includes("login")) {
-      return;
+      return Promise.reject("登录超时，请重新登录");
     }
     isRelogin.show = true;
     ElMessageBox.confirm("登录超时，请重新登录", "确定", {
-      showCancelButton: true,
+      showCancelButton: false,
       closeOnClickModal: false,
       showClose: false,
       closeOnPressEscape: false,
@@ -218,16 +232,18 @@ const handleAuthorized = () => {
       type: "warning",
     })
       .then(async () => {
+        sessionStorage.removeItem(reloginCancelKey);
         deleteUserCache(); // 删除用户缓存
         removeToken();
         isRelogin.show = false;
         window.location.href = "/login";
       })
       .catch(() => {
+        sessionStorage.setItem(reloginCancelKey, "true");
         deleteUserCache(); // 删除用户缓存
         removeToken();
         isRelogin.show = false; // 重置显示状态
-        window.location.href = "/";
+        window.location.href = "/login";
       });
   }
   return Promise.reject("登录超时，请重新登录");

src/router/index.ts

@@ -11,7 +11,7 @@ import Login from "@/views/login.vue";
 import { getAccessToken } from "@utils/auth";
 import { socialLogin } from "@/api/user";
 import * as authUtil from "@/utils/auth";
-import { isRelogin } from "@/config/axios/service";
+import { isRelogin, manualLogoutKey, reloginCancelKey } from "@/config/axios/service";
 
 import { useUserStoreWithOut } from "@/stores/useUserStore";
 
@@ -169,6 +169,8 @@ router.beforeEach(async (to, from, next) => {
         );
 
         authUtil.setToken(res);
+        sessionStorage.removeItem(manualLogoutKey);
+        sessionStorage.removeItem(reloginCancelKey);
         next({ path: "/" });
       } else {
         next(); // 正常导航

src/views/login.vue

@@ -21,7 +21,7 @@
         <h1 class="text-2xl font-bold text-center">登录</h1>
 
         <!-- 用户名密码登陆 -->
-        <div>
+        <!-- <div>
           <el-form
             :model="form"
             :rules="rules"
@@ -62,7 +62,7 @@
               >
             </div>
           </div>
-        </div>
+        </div> -->
 
         <!-- 钉钉登陆 -->
         <div class="text-center">
@@ -80,6 +80,7 @@ import logo from "@/assets/images/logo.png";
 import bgImage from "@/assets/images/bg.png";
 import { login } from "@/api/user";
 import * as authUtil from "@/utils/auth";
+import { manualLogoutKey, reloginCancelKey } from "@/config/axios/service";
 
 type LoginForm = {
   username: string;
@@ -112,6 +113,8 @@ const onSubmit = async () => {
       });
 
       authUtil.setToken(res);
+      sessionStorage.removeItem(manualLogoutKey);
+      sessionStorage.removeItem(reloginCancelKey);
 
       if (form.remember) {
         authUtil.setLoginForm(form);