刘洋 1 жил өмнө
parent
commit
5321c25f21

+ 14 - 10
src/store/main.ts

@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia'
 import { sessionStorage } from '@/plugins/storage'
 import useFetch from '@/hooks/useFetch'
+import PauseIntervalWorker from '@/utils/pauseInterval.worker?worker'
 
 import type { ExtractApiResponse } from '@/api/api'
 interface MainStoreState {
@@ -19,7 +20,7 @@ interface MainStoreState {
   paneSizeConfig: any
   showRowNextBottomDialog: boolean
   markerPausedLimit: number
-  markerPausedTimer: any
+  markerPausedWorker: any
 }
 
 interface MainStoreActions {
@@ -63,21 +64,24 @@ const useMainStore = defineStore<'main', MainStoreState, Record<string, any>, Ma
         : {},
       showRowNextBottomDialog: false,
       markerPausedLimit: 0,
-      markerPausedTimer: null,
+      markerPausedWorker: null,
     }
   },
   actions: {
     setMarkerPausedLimit(time: number) {
-      if (time > 0 && this.markerPausedLimit == 0 && !this.markerPausedTimer) {
+      if (time > 0 && this.markerPausedLimit == 0 && !this.markerPausedWorker) {
         this.markerPausedLimit = time
-        this.markerPausedTimer = setInterval(() => {
-          this.markerPausedLimit = this.markerPausedLimit - 50 < 0 ? 0 : this.markerPausedLimit - 50
-          if (this.markerPausedLimit == 0) {
-            this.markerPausedLimit = 0
-            clearInterval(this.markerPausedTimer)
-            this.markerPausedTimer = null
+        //开启worker线程执行定时器操作,不然的话,浏览器最小化或切换tab时,窗口的非活跃状态会导致setInterval或setTimeout等定时器休眠!
+        this.markerPausedWorker = new PauseIntervalWorker()
+        this.markerPausedWorker.postMessage(time)
+        this.markerPausedWorker.onmessage = (e: any) => {
+          const data = e.data
+          this.markerPausedLimit = data
+          if (data == 0) {
+            //暂停时间结束时,页面解锁,同时销毁worker
+            this.markerPausedWorker && this.markerPausedWorker.terminate()
           }
-        }, 50)
+        }
       }
     },
     setRowNextBottomDialogStatus(bool: boolean) {

+ 35 - 0
src/utils/pauseInterval.worker.ts

@@ -0,0 +1,35 @@
+class PauseInterval {
+  markerPausedLimit = 0
+  timer: any = null
+  start(time: number) {
+    this.markerPausedLimit = time
+    this.reduceStep()
+  }
+  reduceStep() {
+    if (this.timer) {
+      clearTimeout(this.timer)
+      this.timer = null
+    }
+    this.timer = setTimeout(() => {
+      this.markerPausedLimit = this.markerPausedLimit - 50 < 0 ? 0 : this.markerPausedLimit - 50
+      postMessage(this.markerPausedLimit)
+      this.check()
+    }, 50)
+  }
+  check() {
+    if (this.markerPausedLimit > 0) {
+      this.reduceStep()
+    } else {
+      clearTimeout(this.timer)
+      this.timer = null
+    }
+  }
+}
+
+const pauseInterval = new PauseInterval()
+
+addEventListener('message', (e: any) => {
+  const data = e.data as number
+
+  pauseInterval.start(data)
+})