fix obs components display

src/views/obs/LiveRequestProcessedOBS.vue

@@ -15,7 +15,9 @@ import { useRoute } from 'vue-router'
 import { Vue3Marquee } from 'vue3-marquee'
 
 const props = defineProps<{
-  id?: number
+  id?: number,
+  active: boolean,
+  visible: boolean,
 }>()
 
 const message = useMessage()
@@ -94,7 +96,6 @@ const allowGuardTypes = computed(() => {
   return types
 })
 async function update() {
-  if (!visiable.value || !active.value) return
   const r = await get()
   if (r) {
     const isCountChange = originSongs.value.length != r.songs.length
@@ -110,26 +111,14 @@ async function update() {
 
 const direction = ref<'normal' | 'reverse'>('normal')
 
-const visiable = ref(true)
-const active = ref(true)
-let timer: any
 onMounted(() => {
   update()
-  timer = setInterval(update, 2000)
-  //@ts-expect-error 这里获取不了
-  if (window.obsstudio) {
-    //@ts-expect-error 这里获取不了
-    window.obsstudio.onVisibilityChange = function (visibility: boolean) {
-      visiable.value = visibility
-    }
-    //@ts-expect-error 这里获取不了
-    window.obsstudio.onActiveChange = function (a: boolean) {
-      active.value = a
-    }
-  }
+  window.$mitt.on('onOBSComponentUpdate', () => {
+    update()
+  })
 })
 onUnmounted(() => {
-  clearInterval(timer)
+  window.$mitt.off('onOBSComponentUpdate')
 })
 </script>