Эх сурвалжийг харах

组长也有右上角按钮被消息弹框遮挡的情况,修复

刘洋 1 жил өмнө
parent
commit
0e0503dd8b

+ 9 - 1
src/components/shared/MarkHeader.vue

@@ -66,10 +66,11 @@
 </template>
 
 <script setup lang="ts" name="MarkHeader">
-import { reactive, ref, computed, useAttrs, watch, onUnmounted } from 'vue'
+import { reactive, ref, computed, useAttrs, watch, onMounted, onUnmounted } from 'vue'
 import { useRoute } from 'vue-router'
 import { add, minus } from '@/utils/common'
 import useMainStore from '@/store/main'
+import useLayoutStore from '@/store/layout'
 import SvgIcon from '@/components/common/SvgIcon.vue'
 import ColorPicker from '@/components/common/ColorPicker.vue'
 import Message from '@/components/shared/message/Message.vue'
@@ -341,6 +342,13 @@ const willLogout = async () => {
 //     })
 //   }
 // })
+const layoutStore = useLayoutStore()
+onMounted(() => {
+  layoutStore.toggleMarkerHeaderLoaded(true)
+})
+onUnmounted(() => {
+  layoutStore.toggleMarkerHeaderLoaded(false)
+})
 </script>
 
 <style scoped lang="scss">

+ 4 - 4
src/layout/main/MainHeader.vue

@@ -54,10 +54,7 @@ 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
@@ -67,6 +64,9 @@ const props = defineProps<{
 const mainLayoutStore = useMainLayoutStore()
 
 const mainStore = useMainStore()
+const showMessageComponent = computed(() => {
+  return !mainLayoutStore.markerHeaderLoaded
+})
 </script>
 
 <style scoped lang="scss">

+ 9 - 1
src/store/layout.ts

@@ -86,7 +86,11 @@ const useMainLayoutStore = defineStore<
   'main-layout',
   MainLayoutStore.State,
   any,
-  { toggleCollapse: () => void; getRenderMenuList: () => Promise<any> }
+  {
+    toggleCollapse: () => void
+    toggleMarkerHeaderLoaded: (bool: boolean) => void
+    getRenderMenuList: () => Promise<any>
+  }
 >('main-layout', {
   state() {
     return {
@@ -94,9 +98,13 @@ const useMainLayoutStore = defineStore<
       menuList: getMenuRotes(),
       renderMenus: [],
       permBtnCodes: [],
+      markerHeaderLoaded: false,
     }
   },
   actions: {
+    toggleMarkerHeaderLoaded(bool: boolean) {
+      this.markerHeaderLoaded = bool
+    },
     toggleCollapse() {
       this.collapse = !this.collapse
     },

+ 1 - 0
types/store.d.ts

@@ -15,5 +15,6 @@ declare namespace MainLayoutStore {
     menuList: MenuItem[]
     renderMenus: MenuItem[]
     permBtnCodes: any[]
+    markerHeaderLoaded: boolean
   }
 }