From 52157082f59c6fedb1d5663850e02b195abf5ef3 Mon Sep 17 00:00:00 2001
From: ray <1490493387@qq.com>
Date: Thu, 13 Feb 2025 21:38:32 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20:bug:=20=E5=AF=BC=E8=88=AA=E6=A0=8F?=
 =?UTF-8?q?=E9=80=9A=E7=9F=A5=E4=BC=98=E5=8C=96=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../NavBar/components/Notification.vue        | 69 +++++++++----------
 1 file changed, 34 insertions(+), 35 deletions(-)

diff --git a/src/layout/components/NavBar/components/Notification.vue b/src/layout/components/NavBar/components/Notification.vue
index d29c0a3f..9940ea5e 100644
--- a/src/layout/components/NavBar/components/Notification.vue
+++ b/src/layout/components/NavBar/components/Notification.vue
@@ -24,7 +24,7 @@
                       size="small"
                       class="w200px cursor-pointer !ml-2 !flex-1"
                       truncated
-                      @click="handleReadNotice(item.id)"
+                      @click="readNotice(item.id)"
                     >
                       {{ item.title }}
                     </el-text>
@@ -42,7 +42,7 @@
               </template>
               <el-divider />
               <div class="flex-x-between">
-                <el-link type="primary" :underline="false" @click="handleViewMore">
+                <el-link type="primary" :underline="false" @click="viewMoreNotice">
                   <span class="text-xs">查看更多</span>
                   <el-icon class="text-xs">
                     <ArrowRight />
@@ -70,7 +70,7 @@
                     <el-link
                       type="primary"
                       class="w200px cursor-pointer !ml-2 !flex-1"
-                      @click="handleReadNotice(item.id)"
+                      @click="readNotice(item.id)"
                     >
                       {{ item.title }}
                     </el-link>
@@ -92,7 +92,7 @@
                   v-if="tasks.length > 5"
                   type="primary"
                   :underline="false"
-                  @click="handleViewMore"
+                  @click="viewMoreNotice"
                 >
                   <span class="text-xs">查看更多</span>
                   <el-icon class="text-xs">
@@ -118,7 +118,7 @@
                     <el-link
                       type="primary"
                       class="w200px cursor-pointer !ml-2 !flex-1"
-                      @click="handleReadNotice(item.id)"
+                      @click="readNotice(item.id)"
                     >
                       {{ item.title }}
                     </el-link>
@@ -139,7 +139,7 @@
                   v-if="tasks.length > 5"
                   type="primary"
                   :underline="false"
-                  @click="handleViewMore"
+                  @click="viewMoreNotice"
                 >
                   <span class="text-xs">查看更多</span>
                   <el-icon class="text-xs">
@@ -176,36 +176,37 @@ const tasks = ref<any[]>([]);
 const noticeDetailRef = ref();
 
 import { useStomp } from "@/hooks/useStomp";
-
-const { subscribe, disconnect } = useStomp({
+const { subscribe, unsubscribe, isConnected } = useStomp({
   debug: true,
 });
 
-/**
- * 订阅通知消息
- */
-function subscribeNotice() {
-  subscribe("/user/queue/message", (message) => {
-    console.log("收到消息：", message);
-    const data = JSON.parse(message.body);
-    const id = data.id;
-    if (!notices.value.some((notice) => notice.id == id)) {
-      notices.value.unshift({
-        id,
-        title: data.title,
-        type: data.type,
-        publishTime: data.publishTime,
-      });
+watch(
+  () => isConnected.value,
+  (connected) => {
+    if (connected) {
+      subscribe("/user/queue/message", (message) => {
+        console.log("收到通知消息：", message);
+        const data = JSON.parse(message.body);
+        const id = data.id;
+        if (!notices.value.some((notice) => notice.id == id)) {
+          notices.value.unshift({
+            id,
+            title: data.title,
+            type: data.type,
+            publishTime: data.publishTime,
+          });
 
-      ElNotification({
-        title: "您收到一条新的通知消息！",
-        message: data.title,
-        type: "success",
-        position: "bottom-right",
+          ElNotification({
+            title: "您收到一条新的通知消息！",
+            message: data.title,
+            type: "success",
+            position: "bottom-right",
+          });
+        }
       });
     }
-  });
-}
+  }
+);
 
 /**
  * 获取我的通知公告
@@ -217,7 +218,7 @@ function featchMyNotice() {
 }
 
 // 阅读通知公告
-function handleReadNotice(id: string) {
+function readNotice(id: string) {
   noticeDetailRef.value.openNotice(id);
   const index = notices.value.findIndex((notice) => notice.id === id);
   if (index >= 0) {
@@ -226,7 +227,7 @@ function handleReadNotice(id: string) {
 }
 
 // 查看更多
-function handleViewMore() {
+function viewMoreNotice() {
   router.push({ path: "/myNotice" });
 }
 
@@ -237,14 +238,12 @@ function markAllAsRead() {
   });
 }
 
-// 获取未读消息列表并连接 WebSocket
 onMounted(() => {
   featchMyNotice();
-  subscribeNotice();
 });
 
 onBeforeUnmount(() => {
-  disconnect();
+  unsubscribe("/user/queue/message");
 });
 </script>