站内信：跳转查看全部后关闭弹窗

src/layout/components/Message/src/Message.vue

@@ -5,6 +5,7 @@ import * as NotifyMessageApi from '@/api/system/notify/message'
 defineOptions({ name: 'Message' })
 
 const { push } = useRouter()
+const popoverRef = ref()
 const activeName = ref('notice')
 const unreadCount = ref(0) // 未读消息数量
 const list = ref<any[]>([]) // 消息列表
@@ -12,7 +13,7 @@ const list = ref<any[]>([]) // 消息列表
 // 获得消息列表
 const getList = async () => {
   list.value = await NotifyMessageApi.getUnreadNotifyMessageList()
-  
+
   // 强制设置 unreadCount 为 0，避免小红点因为轮询太慢，不消除
   // unreadCount.value = 0
 }
@@ -34,9 +35,8 @@ const handleRead = async (item) => {
 
 // 跳转我的站内信
 const goMyList = () => {
-  push({
-    name: 'MyNotifyMessage'
-  })
+  unref(popoverRef).hide?.() // 关闭弹窗
+  push({ name: 'MyNotifyMessage' })
 }
 
 // ========== 初始化 =========
@@ -54,7 +54,7 @@ onMounted(() => {
 </script>
 <template>
   <div class="message">
-    <ElPopover :width="400" placement="bottom" trigger="click">
+    <ElPopover ref="popoverRef" :width="400" placement="bottom" trigger="click">
       <template #reference>
         <ElBadge :value="unreadCount" :show-zero="false" :max="99" class="item">
           <Icon :size="18" class="cursor-pointer" icon="ep:bell" @click="getList" />