Browse Source

fix: online改为isOnline

master
guoapeng 1 week ago
parent
commit
69153e0ab5
  1. 7
      src/app.vue
  2. 2
      src/components/home/Environment.vue
  3. 44
      src/components/system/NetReconnection.vue
  4. 7
      src/hooks/useActivateDebug.ts
  5. 5
      src/router/index.ts
  6. 20
      src/stores/homeStore.ts
  7. 4
      src/types/home.d.ts
  8. 6
      src/views/home/chart.vue

7
src/app.vue

@ -1,4 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { delToken } from 'libs/token'
import { useDebugStore } from 'stores/debugStore' import { useDebugStore } from 'stores/debugStore'
import { useDeviceStore } from 'stores/deviceStore' import { useDeviceStore } from 'stores/deviceStore'
import { useFormulaStore } from 'stores/formulaStore' import { useFormulaStore } from 'stores/formulaStore'
@ -6,7 +7,7 @@ import { useHomeStore } from 'stores/homeStore'
import { useLiquidStore } from 'stores/liquidStore' import { useLiquidStore } from 'stores/liquidStore'
import { useSealStore } from 'stores/sealStore' import { useSealStore } from 'stores/sealStore'
import { useSystemStore } from 'stores/systemStore' import { useSystemStore } from 'stores/systemStore'
import { onBeforeMount, ref } from 'vue'
import { onBeforeMount, onUnmounted, ref } from 'vue'
import { sendCmd, subscribeEvent } from '@/apis/system' import { sendCmd, subscribeEvent } from '@/apis/system'
@ -144,6 +145,10 @@ const initLiquidConfig = async () => {
// liquidStore.updateLiquidState(liquidData) // liquidStore.updateLiquidState(liquidData)
} }
console.log(__DEVICE_TYPE__) console.log(__DEVICE_TYPE__)
onUnmounted(() => {
console.log(1111)
delToken()
})
</script> </script>
<template> <template>

2
src/components/home/Environment.vue

@ -65,7 +65,7 @@ onMounted(() => {
}}{{ envParams.sensorId }} }}{{ envParams.sensorId }}
</div> </div>
<el-tag v-if="!envParams.online" type="danger">
<el-tag v-if="!envParams.isOnline" type="danger">
离线 离线
</el-tag> </el-tag>
</div> </div>

44
src/components/system/NetReconnection.vue

@ -1,5 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { startTimer, stopTimer } from 'libs/countdownTimer' import { startTimer, stopTimer } from 'libs/countdownTimer'
import { delToken } from 'libs/token'
import { ref, watchEffect } from 'vue' import { ref, watchEffect } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
@ -13,6 +14,7 @@ const websocketConnected = ref(true)
const countdownToReconnection = () => { const countdownToReconnection = () => {
startTimer(10 * 1000, (times: string) => { startTimer(10 * 1000, (times: string) => {
if (times === '0') { if (times === '0') {
delToken()
router.push('/login') router.push('/login')
return return
} }
@ -46,7 +48,7 @@ watchEffect(() => {
</template> </template>
<style scoped> <style scoped>
.reconnect-modal-overlay {
.reconnect-modal-overlay {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
@ -58,18 +60,18 @@ watchEffect(() => {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
z-index: 9999; z-index: 9999;
}
}
.reconnect-modal-container {
.reconnect-modal-container {
background-color: white; background-color: white;
border-radius: 12px; border-radius: 12px;
padding: 40px; padding: 40px;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
text-align: center; text-align: center;
animation: fadeIn 0.3s ease-out; animation: fadeIn 0.3s ease-out;
}
}
.reconnect-spinner {
.reconnect-spinner {
width: 64px; width: 64px;
height: 64px; height: 64px;
border: 6px solid #f3f3f3; border: 6px solid #f3f3f3;
@ -77,27 +79,37 @@ watchEffect(() => {
border-top: 6px solid #3b82f6; border-top: 6px solid #3b82f6;
margin: 0 auto 24px; margin: 0 auto 24px;
animation: spin 1s linear infinite; animation: spin 1s linear infinite;
}
}
.reconnect-title {
.reconnect-title {
font-size: 1.12rem; font-size: 1.12rem;
font-weight: bold; font-weight: bold;
color: #1f2937; color: #1f2937;
margin-bottom: 12px; margin-bottom: 12px;
}
}
.reconnect-message {
.reconnect-message {
font-size: 16px; font-size: 16px;
color: #4b5563; 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> </style>

7
src/hooks/useActivateDebug.ts

@ -1,8 +1,9 @@
import { ElMessageBox } from 'element-plus' import { ElMessageBox } from 'element-plus'
import { delToken } from 'libs/token'
import { useSystemStore } from 'stores/systemStore' import { useSystemStore } from 'stores/systemStore'
import { ref } from 'vue' import { ref } from 'vue'
import router from '@/router'
export const useActivateDebug = () => { export const useActivateDebug = () => {
const systemStore = useSystemStore() const systemStore = useSystemStore()
const logoClickCount = ref(0) const logoClickCount = ref(0)
@ -24,8 +25,8 @@ export const useActivateDebug = () => {
.finally(() => { .finally(() => {
logoClickCount.value = 0 // 重置计数器 logoClickCount.value = 0 // 重置计数器
}) })
.then(() => {
delToken()
.then(async () => {
await router.push('/home')
location.reload() location.reload()
}) })
} }

5
src/router/index.ts

@ -15,8 +15,13 @@ const router = createRouter({
router.beforeEach((to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) => { router.beforeEach((to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) => {
if (getToken() && wsClient.isConnected) { if (getToken() && wsClient.isConnected) {
if (to.name === 'login') {
next({ name: from.name })
}
else {
next() next()
} }
}
else { else {
if (to.name === 'login') { if (to.name === 'login') {
next() next()

20
src/stores/homeStore.ts

@ -18,7 +18,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
? [ ? [
{ {
type: 'Internal', type: 'Internal',
online: true,
isOnline: true,
temp: -1, temp: -1,
rh: -1, rh: -1,
rs: -1, rs: -1,
@ -26,7 +26,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WirelessExtSensor', type: 'WirelessExtSensor',
online: false,
isOnline: false,
sensorId: 1, sensorId: 1,
temp: -1, temp: -1,
rh: -1, rh: -1,
@ -35,7 +35,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WirelessExtSensor', type: 'WirelessExtSensor',
online: false,
isOnline: false,
sensorId: 2, sensorId: 2,
temp: -1, temp: -1,
rh: -1, rh: -1,
@ -44,7 +44,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WirelessExtSensor', type: 'WirelessExtSensor',
online: false,
isOnline: false,
sensorId: 3, sensorId: 3,
temp: -1, temp: -1,
rh: -1, rh: -1,
@ -55,7 +55,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
: [ : [
{ {
type: 'Internal', type: 'Internal',
online: true,
isOnline: true,
temp: -1, temp: -1,
rh: -1, rh: -1,
rs: -1, rs: -1,
@ -63,7 +63,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WiredExtSensor', type: 'WiredExtSensor',
online: false,
isOnline: false,
sensorId: 1, sensorId: 1,
temp: -1, temp: -1,
rh: -1, rh: -1,
@ -72,7 +72,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WiredExtSensor', type: 'WiredExtSensor',
online: false,
isOnline: false,
sensorId: 2, sensorId: 2,
temp: -1, temp: -1,
rh: -1, rh: -1,
@ -81,7 +81,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WirelessExtSensor', type: 'WirelessExtSensor',
online: false,
isOnline: false,
temp: -1, temp: -1,
sensorId: 1, sensorId: 1,
rh: -1, rh: -1,
@ -90,7 +90,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WirelessExtSensor', type: 'WirelessExtSensor',
online: false,
isOnline: false,
sensorId: 2, sensorId: 2,
temp: -1, temp: -1,
rh: -1, rh: -1,
@ -99,7 +99,7 @@ const h2O2Data: Home.DisplayrelyMgrParams[] = [deviceTypeMap.PipeDM, deviceTypeM
}, },
{ {
type: 'WirelessExtSensor', type: 'WirelessExtSensor',
online: false,
isOnline: false,
sensorId: 3, sensorId: 3,
temp: -1, temp: -1,
rh: -1, rh: -1,

4
src/types/home.d.ts

@ -10,7 +10,7 @@ declare namespace Home {
interface DisplayrelyMgrParams extends DisplayrelyMgr { interface DisplayrelyMgrParams extends DisplayrelyMgr {
title?: string title?: string
chartId?: string chartId?: string
online?: boolean
isOnline?: boolean
} }
interface DisplayrelyMgrs { interface DisplayrelyMgrs {
internalSensorNum: number // 内置传感器数量 internalSensorNum: number // 内置传感器数量
@ -30,7 +30,7 @@ declare namespace Home {
temp: number temp: number
rh: number rh: number
rs: number rs: number
online?: boolean
isOnline?: boolean
} }
interface DisinfectState { interface DisinfectState {

6
src/views/home/chart.vue

@ -127,7 +127,8 @@ const getData = async (type?: string) => {
}) })
const list = data.rely 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++) { for (let i = 0; i < list.length; i++) {
const item: any = list[i] const item: any = list[i]
const res = await syncSendCmd({ const res = await syncSendCmd({
@ -141,7 +142,8 @@ const getData = async (type?: string) => {
}) })
item.data = res.rely 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) console.log(chartList.value)
} }

Loading…
Cancel
Save