From 69153e0ab5d023ccf2a9fc5d5ac2fa7afc0a4ef5 Mon Sep 17 00:00:00 2001
From: guoapeng <GuoAnPeng@163.com>
Date: Wed, 9 Jul 2025 19:15:49 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20online=E6=94=B9=E4=B8=BAisOnline?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app.vue                               |   7 ++-
 src/components/home/Environment.vue       |   2 +-
 src/components/system/NetReconnection.vue | 100 +++++++++++++++++-------------
 src/hooks/useActivateDebug.ts             |   7 ++-
 src/router/index.ts                       |   7 ++-
 src/stores/homeStore.ts                   |  20 +++---
 src/types/home.d.ts                       |   4 +-
 src/views/home/chart.vue                  |   6 +-
 8 files changed, 89 insertions(+), 64 deletions(-)

diff --git a/src/app.vue b/src/app.vue
index 6075edb..97f7503 100644
--- a/src/app.vue
+++ b/src/app.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { delToken } from 'libs/token'
 import { useDebugStore } from 'stores/debugStore'
 import { useDeviceStore } from 'stores/deviceStore'
 import { useFormulaStore } from 'stores/formulaStore'
@@ -6,7 +7,7 @@ import { useHomeStore } from 'stores/homeStore'
 import { useLiquidStore } from 'stores/liquidStore'
 import { useSealStore } from 'stores/sealStore'
 import { useSystemStore } from 'stores/systemStore'
-import { onBeforeMount, ref } from 'vue'
+import { onBeforeMount, onUnmounted, ref } from 'vue'
 
 import { sendCmd, subscribeEvent } from '@/apis/system'
 
@@ -144,6 +145,10 @@ const initLiquidConfig = async () => {
   // liquidStore.updateLiquidState(liquidData)
 }
 console.log(__DEVICE_TYPE__)
+onUnmounted(() => {
+  console.log(1111)
+  delToken()
+})
 </script>
 
 <template>
diff --git a/src/components/home/Environment.vue b/src/components/home/Environment.vue
index 3eead59..7c63901 100644
--- a/src/components/home/Environment.vue
+++ b/src/components/home/Environment.vue
@@ -65,7 +65,7 @@ onMounted(() => {
         }}{{ envParams.sensorId }}
       </div>
 
-      <el-tag v-if="!envParams.online" type="danger">
+      <el-tag v-if="!envParams.isOnline" type="danger">
         离线
       </el-tag>
     </div>
diff --git a/src/components/system/NetReconnection.vue b/src/components/system/NetReconnection.vue
index 82290f8..279ba3b 100644
--- a/src/components/system/NetReconnection.vue
+++ b/src/components/system/NetReconnection.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { startTimer, stopTimer } from 'libs/countdownTimer'
+import { delToken } from 'libs/token'
 import { ref, watchEffect } from 'vue'
 import { useRouter } from 'vue-router'
 
@@ -13,6 +14,7 @@ const websocketConnected = ref(true)
 const countdownToReconnection = () => {
   startTimer(10 * 1000, (times: string) => {
     if (times === '0') {
+      delToken()
       router.push('/login')
       return
     }
@@ -46,58 +48,68 @@ watchEffect(() => {
 </template>
 
 <style scoped>
-  .reconnect-modal-overlay {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.5);
-    backdrop-filter: blur(4px);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 9999;
-  }
+.reconnect-modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.5);
+  backdrop-filter: blur(4px);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 9999;
+}
 
-  .reconnect-modal-container {
-    background-color: white;
-    border-radius: 12px;
-    padding: 40px;
-    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
-    text-align: center;
-    animation: fadeIn 0.3s ease-out;
-  }
+.reconnect-modal-container {
+  background-color: white;
+  border-radius: 12px;
+  padding: 40px;
+  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
+  text-align: center;
+  animation: fadeIn 0.3s ease-out;
+}
 
-  .reconnect-spinner {
-    width: 64px;
-    height: 64px;
-    border: 6px solid #f3f3f3;
-    border-radius: 50%;
-    border-top: 6px solid #3b82f6;
-    margin: 0 auto 24px;
-    animation: spin 1s linear infinite;
-  }
+.reconnect-spinner {
+  width: 64px;
+  height: 64px;
+  border: 6px solid #f3f3f3;
+  border-radius: 50%;
+  border-top: 6px solid #3b82f6;
+  margin: 0 auto 24px;
+  animation: spin 1s linear infinite;
+}
 
-  .reconnect-title {
-    font-size: 1.12rem;
-    font-weight: bold;
-    color: #1f2937;
-    margin-bottom: 12px;
-  }
+.reconnect-title {
+  font-size: 1.12rem;
+  font-weight: bold;
+  color: #1f2937;
+  margin-bottom: 12px;
+}
 
-  .reconnect-message {
+.reconnect-message {
   font-size: 16px;
   color: #4b5563;
-  }
+}
 
-  @keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
   }
+}
 
-  @keyframes fadeIn {
-    from { opacity: 0; transform: scale(0.95); }
-    to { opacity: 1; transform: scale(1); }
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: scale(0.95);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
   }
+}
 </style>
diff --git a/src/hooks/useActivateDebug.ts b/src/hooks/useActivateDebug.ts
index d70f82c..32ae70f 100644
--- a/src/hooks/useActivateDebug.ts
+++ b/src/hooks/useActivateDebug.ts
@@ -1,8 +1,9 @@
 import { ElMessageBox } from 'element-plus'
-import { delToken } from 'libs/token'
 import { useSystemStore } from 'stores/systemStore'
 import { ref } from 'vue'
 
+import router from '@/router'
+
 export const useActivateDebug = () => {
   const systemStore = useSystemStore()
   const logoClickCount = ref(0)
@@ -24,8 +25,8 @@ export const useActivateDebug = () => {
         .finally(() => {
           logoClickCount.value = 0 // 重置计数器
         })
-        .then(() => {
-          delToken()
+        .then(async () => {
+          await router.push('/home')
           location.reload()
         })
     }
diff --git a/src/router/index.ts b/src/router/index.ts
index c3ddacc..2f661bf 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -15,7 +15,12 @@ const router = createRouter({
 
 router.beforeEach((to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) => {
   if (getToken() && wsClient.isConnected) {
-    next()
+    if (to.name === 'login') {
+      next({ name: from.name })
+    }
+    else {
+      next()
+    }
   }
   else {
     if (to.name === 'login') {
diff --git a/src/stores/homeStore.ts b/src/stores/homeStore.ts
index 4b3968e..4c225e4 100644
--- a/src/stores/homeStore.ts
+++ b/src/stores/homeStore.ts
@@ -18,7 +18,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
   ? [
       {
         type: 'Internal',
-        online: true,
+        isOnline: true,
         temp: -1,
         rh: -1,
         rs: -1,
@@ -26,7 +26,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WirelessExtSensor',
-        online: false,
+        isOnline: false,
         sensorId: 1,
         temp: -1,
         rh: -1,
@@ -35,7 +35,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WirelessExtSensor',
-        online: false,
+        isOnline: false,
         sensorId: 2,
         temp: -1,
         rh: -1,
@@ -44,7 +44,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WirelessExtSensor',
-        online: false,
+        isOnline: false,
         sensorId: 3,
         temp: -1,
         rh: -1,
@@ -55,7 +55,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
   : [
       {
         type: 'Internal',
-        online: true,
+        isOnline: true,
         temp: -1,
         rh: -1,
         rs: -1,
@@ -63,7 +63,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WiredExtSensor',
-        online: false,
+        isOnline: false,
         sensorId: 1,
         temp: -1,
         rh: -1,
@@ -72,7 +72,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WiredExtSensor',
-        online: false,
+        isOnline: false,
         sensorId: 2,
         temp: -1,
         rh: -1,
@@ -81,7 +81,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WirelessExtSensor',
-        online: false,
+        isOnline: false,
         temp: -1,
         sensorId: 1,
         rh: -1,
@@ -90,7 +90,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WirelessExtSensor',
-        online: false,
+        isOnline: false,
         sensorId: 2,
         temp: -1,
         rh: -1,
@@ -99,7 +99,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
       },
       {
         type: 'WirelessExtSensor',
-        online: false,
+        isOnline: false,
         sensorId: 3,
         temp: -1,
         rh: -1,
diff --git a/src/types/home.d.ts b/src/types/home.d.ts
index 209e4cc..78a97ca 100644
--- a/src/types/home.d.ts
+++ b/src/types/home.d.ts
@@ -10,7 +10,7 @@ declare namespace Home {
   interface DisplayrelyMgrParams extends DisplayrelyMgr {
     title?: string
     chartId?: string
-    online?: boolean
+    isOnline?: boolean
   }
   interface DisplayrelyMgrs {
     internalSensorNum: number // 内置传感器数量
@@ -30,7 +30,7 @@ declare namespace Home {
     temp: number
     rh: number
     rs: number
-    online?: boolean
+    isOnline?: boolean
   }
 
   interface DisinfectState {
diff --git a/src/views/home/chart.vue b/src/views/home/chart.vue
index 51fddd9..1dc2a28 100644
--- a/src/views/home/chart.vue
+++ b/src/views/home/chart.vue
@@ -127,7 +127,8 @@ const getData = async (type?: string) => {
   })
 
   const list = data.rely
-  !type && (chartList.value = list.filter(item => item.online).map(item => ({ ...item, data: [] })))
+  console.log(list)
+  !type && (chartList.value = list.filter(item => item.isOnline).map(item => ({ ...item, data: [] })))
   for (let i = 0; i < list.length; i++) {
     const item: any = list[i]
     const res = await syncSendCmd({
@@ -141,7 +142,8 @@ const getData = async (type?: string) => {
     })
     item.data = res.rely
   }
-  chartList.value = list.filter(item => item.online)
+  console.log(list)
+  chartList.value = list.filter(item => item.isOnline)
   console.log(chartList.value)
 }