layout消息弹窗莫名出现并挡住右上角按钮

src/layout/main/MainHeader.vue

@@ -18,7 +18,7 @@
         <div class="icon-item">
           <lock-entry :in-layout="inLayout"></lock-entry>
         </div>
-        <div v-if="mainStore?.myUserInfo?.role !== 'ADMIN'" class="icon-item">
+        <div v-if="mainStore?.myUserInfo?.role !== 'ADMIN' && showMessageComponent" class="icon-item">
           <message
             :reply-user-id="props.replyUserId"
             :message-visible="props.messageVisible"
@@ -51,7 +51,13 @@ import CurrentTime from '@/components/shared/CurrentTime.vue'
 import Message from '@/components/shared/message/Message.vue'
 import UserInfo from '@/components/shared/UserInfo.vue'
 import LockEntry from '@/components/common/LockEntry.vue'
-
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+const route = useRoute()
+const showMessageComponent = computed(() => {
+  console.log('computed:', route.path !== '/marking/mark')
+  return route.path !== '/marking/mark'
+})
 const props = defineProps<{
   replyUserId?: number | null
   messageVisible?: boolean