From d075dabf2aa3eaf69ce69231b2017c0e20f542d8 Mon Sep 17 00:00:00 2001
From: denggaofeng <1139968554@qq.com>
Date: Thu, 26 Mar 2026 14:49:49 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue           | 38 ++++++++++++++++++++++++++++++--------
 src/types/global.d.ts |  2 ++
 2 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index eb46699..7a989a3 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -58,7 +58,6 @@ import type { GlobalConfig, SourceItem, VideoInfo, DeviceItem } from './types'
 
 declare const mqtt: any
 
-const deviceId = 'fcfabf1d5dd036033419057075a56304' // 设备 ID，实际使用中可动态获取
 const selectedDeviceId = ref<string>('')
 const deviceList = ref<DeviceItem[]>([])
 
@@ -150,7 +149,7 @@ function openVideo(id: string, index: number) {
     if (box && sourcesMap[id]) {
       box.subscribeLive(sourcesMap[id])
       // 订阅流
-      apis.subscribeLive(deviceId,id).then((res) => {
+      apis.subscribeLive(selectedDeviceId.value,id).then((res) => {
         if (res) {
           box.startPlay(res)
         } else {
@@ -170,6 +169,24 @@ function closeVideo(index: number) {
   boxRefs[index]?.destroy()
 }
 
+// 清理所有资源（页面卸载时调用）
+function cleanupAll() {
+  // 关闭所有视频
+  for (let i = 0; i < 4; i++) {
+    if (playingSources[i]) {
+      closeVideo(i)
+    }
+  }
+  // 清空引用和状态
+  playingSources.fill(null)
+  boxRefs.fill(null)
+  sourceList.value = []
+  // MQTT 断联
+  mqttClient?.end(true)
+  mqttClient = null
+  drawerOpen.value = false
+}
+
 // VideoBox ready 事件（videoInfo 初始化完成）
 function onVideoReady(_info: VideoInfo, _index: number) {
   // 可在此做额外处理
@@ -219,10 +236,14 @@ function onDeviceChange() {
 }
 
 onMounted(async () => {
+  window.cleanupAll = cleanupAll;
+  window.handleInit = handleInit;
+  await handleInit()
+})
+
+
+async function handleInit(){
   try {
-    //const tokenRes = await apis.getToken()
-    // if (tokenRes.error_code === 0) {
-      //config.token = tokenRes.data
       apis = createApis()
       
       // 加载设备列表
@@ -236,12 +257,12 @@ onMounted(async () => {
       if (selectedDeviceId.value) {
         await loadSources(selectedDeviceId.value)
       }
-    //}
   } catch (e) {
     console.error('初始化失败', e)
   }
+  
   connectMqtt()
-})
+}
 
 async function loadSources(deviceId: string) {
   try {
@@ -260,7 +281,8 @@ async function loadSources(deviceId: string) {
 }
 
 onBeforeUnmount(() => {
-  mqttClient?.end()
+  window.cleanupAll = () => {};
+  window.handleInit = () => {};
 })
 </script>
 
diff --git a/src/types/global.d.ts b/src/types/global.d.ts
index b5509bd..d93e839 100644
--- a/src/types/global.d.ts
+++ b/src/types/global.d.ts
@@ -1,5 +1,7 @@
 declare interface Window {
   HybridWebView: HybridWebView
+  cleanupAll: () => void
+  handleInit: () => void
 }
 declare interface HybridWebView {
     InvokeDotNet(methodName: string, ...args: any[]): Promise<T>;