fix:修复密封测试开始计时切换页面再返回该页面计时不会再显示问题

src/stores/sealStore.ts

@@ -1,34 +1,62 @@
 import { defineStore } from 'pinia'
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
+
+interface SealStateItem {
+  pressure: string
+  workState: string
+  workStateDisplay: string
+}
 
-/**
- * 密封状态管理模块
- * @module useSealStore
- */
 export const useSealStore = defineStore('seal', () => {
-  // 状态定义
-  const sealState = ref('idle')
-  const sealInfo = ref<Seal.SealStateItem>({
+  const sealInfo = ref<SealStateItem>({
     pressure: '0',
     workState: 'idle',
     workStateDisplay: '空闲',
   })
 
-  /**
-   * @function updateSealInfo
-   * @param {Seal.SealStateItem} dataInfo - 密封状态信息
-   * @desc 更新密封状态信息，包括压力值和工作状态
-   */
-  const updateSealInfo = (dataInfo: Seal.SealStateItem) => {
+  const leakRemainingTime = ref('')
+  const _leakTimerId = ref<number | undefined>(undefined)
+  const _leakStartTs = ref(0)
+
+  function startLeakTimer() {
+    if (_leakTimerId.value)
+      return
+    _leakStartTs.value = Date.now()
+    leakRemainingTime.value = '00:00:00'
+    _leakTimerId.value = window.setInterval(() => {
+      const diff = Date.now() - _leakStartTs.value
+      const secs = Math.floor(diff / 1000)
+      const h = Math.floor(secs / 3600)
+      const m = Math.floor((secs % 3600) / 60)
+      const s = secs % 60
+      const hh = String(h).padStart(2, '0')
+      const mm = String(m).padStart(2, '0')
+      const ss = String(s).padStart(2, '0')
+      leakRemainingTime.value = `${hh}:${mm}:${ss}`
+    }, 1000)
+  }
+
+  function stopLeakTimer() {
+    if (_leakTimerId.value) {
+      clearInterval(_leakTimerId.value)
+      _leakTimerId.value = undefined
+    }
+    leakRemainingTime.value = ''
+    _leakStartTs.value = 0
+  }
+
+  function updateSealInfo(dataInfo: SealStateItem) {
     sealInfo.value = dataInfo
   }
 
+  const currentPressure = computed(() => sealInfo.value.pressure)
+
   return {
-    // 状态属性
-    sealState,
     sealInfo,
-
-    // 操作方法
+    leakRemainingTime,
+    currentPressure,
+    startLeakTimer,
+    stopLeakTimer,
     updateSealInfo,
   }
 })

src/views/seal/index.vue

@@ -5,139 +5,79 @@ import homeStart from 'assets/images/home/home-start.svg'
 import SealInstrumentSvg from 'assets/images/seal/seal-instrument.svg'
 import SoftKeyboard from 'components/common/SoftKeyboard/index.vue'
 import DashboardChart from 'components/seal/DashboardChart.vue'
-import { startPosityveTimer, stopPosityveTimer } from 'libs/timer'
 import { roundNumber } from 'libs/utils'
-import { computed, onMounted, ref, watch, watchEffect } from 'vue'
+import { computed, onMounted, ref } from 'vue'
 
 import { getDeviceStatus } from '@/libs/deviceComm'
 import { FtMessage } from '@/libs/message'
 import { FtMessageBox } from '@/libs/messageBox'
 import { useSealStore } from '@/stores/sealStore'
 
-defineOptions({
-  name: 'Seal',
-})
+defineOptions({ name: 'Seal' })
+
 const sealStore = useSealStore()
-const sealInfo = ref(sealStore.sealInfo)
+
+const sealInfo = computed(() => sealStore.sealInfo)
+const leakRemainingTime = computed(() => sealStore.leakRemainingTime)
+const currentPressure = computed(() => sealStore.currentPressure)
+const diffPressure = computed(() =>
+  Number(sealStore.currentPressure) - Number(sealStore.sealInfo.pressure),
+)
+
 const inputValue = ref('')
 const keyboardVisible = ref(false)
 const keyboardType = ref<'text' | 'number'>('number')
 const softKeyboardRef = ref()
-const inflationTime = ref()
-const sealRemainTimeS = ref<string>()
-const currentPressure = ref(sealStore.sealInfo.pressure)
-const realTimePressure = ref(sealStore.sealInfo.pressure)
+const inflationTime = ref<number>()
 const loading = ref(false)
 
-onMounted(() => {
-  initAirLeakConfig() // 初始化打压配置
-})
-
-const getFirstPressure = () => {
-  // 当前气压是开始测试后，状态变为leakTesting后，6秒后获取的压力值为初始值。 由赵贺确认
-  if (sealInfo.value.workState === 'leakTesting') {
-    // 开始计时
-    startPosityveTimer((time) => {
-      sealRemainTimeS.value = time
-    })
-    loading.value = false
-    if (!currentPressure.value) {
-      currentPressure.value = realTimePressure.value
-    }
-  }
-}
-
-watchEffect(() => {
-  sealInfo.value = sealStore.sealInfo
-  realTimePressure.value = sealStore.sealInfo.pressure
-  getFirstPressure()
-})
-
-watch(inputValue, (newVal: string | number) => {
-  if (Number(newVal) < 1000) {
-    inflationTime.value = newVal
-  }
-  // else {
-  //   inputValue.value = inflationTime.value
-  // }
-})
-
-/**
- * @function 初始化打压配置
- * @desc 获取打压配置
- */
-const initAirLeakConfig = async () => {
-  const params = {
-    className: 'AirLeakDetectTest',
-    fnName: 'getServiceConfig',
-  }
-  const res = await sendCmd(params)
+onMounted(async () => {
+  const res = await sendCmd({ className: 'AirLeakDetectTest', fnName: 'getServiceConfig' })
   inflationTime.value = res.inflationTimeMs
-}
-
-const stopText = computed(() => {
-  return sealInfo.value.workState === 'stopping' ? '停止中...' : '停止测试'
 })
 
-// const pressure = ref()
-const onStartTest = () => {
+const stopText = computed(() =>
+  sealInfo.value.workState === 'stopping' ? '停止中...' : '停止测试',
+)
+const stopDisabled = computed(() =>
+  sealInfo.value.workState === 'stopping' || sealInfo.value.workState === 'idle',
+)
+
+function onStartTest() {
   const statusName = getDeviceStatus()
   if (statusName) {
     FtMessageBox.error(statusName)
     return
   }
-  const params = {
-    className: 'AirLeakDetectTest',
-    fnName: 'start',
-    params: {
-      inflationTimeMs: 0,
-    },
-  }
   loading.value = true
-  syncSendCmd(params).then((res) => {
-    if (res.ackcode === 0) {
-      FtMessage.success('开始执行密封测试')
-    }
-    else {
-      FtMessage.error('指令发送失败，请稍候再试')
-    }
-  }).catch(() => {
-    FtMessage.error('指令发送失败，请稍候再试')
-  }).finally(() => {
-    loading.value = false
-  })
+  syncSendCmd({ className: 'AirLeakDetectTest', fnName: 'start', params: { inflationTimeMs: 0 } })
+    .then((res) => {
+      if (res.ackcode === 0) {
+        sealStore.startLeakTimer()
+        FtMessage.success('开始执行密封测试')
+      }
+      else {
+        FtMessage.error('指令发送失败，请稍候再试')
+      }
+    })
+    .finally(() => { loading.value = false })
 }
-const onFinishTest = () => {
-  const stopParams = {
-    className: 'AirLeakDetectTest',
-    fnName: 'stop',
-    params: {},
-  }
+
+function onFinishTest() {
   loading.value = true
-  syncSendCmd(stopParams).then((res) => {
-    if (res.ackcode === 0) {
-      // 停止倒计时
-      stopPosityveTimer()
-      FtMessage.success('测试已停止')
-      sealRemainTimeS.value = ''
-    }
-    loading.value = false
-  }).finally(() => {
-    loading.value = false
-  })
+  syncSendCmd({ className: 'AirLeakDetectTest', fnName: 'stop', params: {} })
+    .then((res) => {
+      if (res.ackcode === 0) {
+        sealStore.stopLeakTimer()
+        FtMessage.success('测试已停止')
+      }
+    })
+    .finally(() => { loading.value = false })
 }
 
-const handleConfirm = (value: string) => {
+function handleConfirm(value: string) {
   console.log('确认输入:', value)
 }
-
-const stopDisabled = computed(() => {
-  return sealInfo.value.workState === 'stopping' || sealInfo.value.workState === 'idle'
-})
-
-const diffPressure = computed(() => {
-  return Number(currentPressure.value) - Number(realTimePressure.value)
-})
 </script>
 
 <template>
@@ -158,7 +98,7 @@ const diffPressure = computed(() => {
                 未开始
               </div>
               <div v-else class="seal-test-time">
-                {{ sealRemainTimeS }}
+                {{ leakRemainingTime }}
               </div>
             </div>
             <div class="seal-status">