工作台: 自动刷新

yshop-drink-vue3/src/views/mall/order/storeOrder/work.vue

@@ -101,6 +101,7 @@
 // import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as StoreOrderApi from '@/api/mall/order/storeOrder'
+import * as ConfigApi from '@/api/infra/config'
 import StoreOrderForm from './StoreOrderForm.vue'
 import OrderSend from './OrderSend.vue'
 import OrderSendInfo from './OrderSendInfo.vue'
@@ -219,9 +220,61 @@ const handleExport = async () => {
  }
 }
 
+/** 自动刷新:10秒轮询 + 页面可见时立即刷新,间隔可由 infra 配置 order.work.poll.interval 调整 */
+const DEFAULT_POLL_INTERVAL = 10000 // 默认 10 秒
+const POLL_CONFIG_KEY = 'order.work.poll.interval'
+const MIN_POLL_INTERVAL = 3000 // 最小 3 秒,防止配错打爆服务器
+const MAX_POLL_INTERVAL = 300000 // 最大 5 分钟
+let pollInterval = DEFAULT_POLL_INTERVAL
+let pollTimer: ReturnType<typeof setInterval> | null = null
+
+/** 读取轮询间隔配置(毫秒),失败/非法时用默认值 */
+const loadPollInterval = async () => {
+  try {
+    const value = await ConfigApi.getConfigKey(POLL_CONFIG_KEY)
+    const ms = Number(value)
+    if (Number.isFinite(ms) && ms >= MIN_POLL_INTERVAL && ms <= MAX_POLL_INTERVAL) {
+      pollInterval = ms
+      return
+    }
+  } catch {}
+  pollInterval = DEFAULT_POLL_INTERVAL
+}
+
+const stopPolling = () => {
+  if (pollTimer) {
+    clearInterval(pollTimer)
+    pollTimer = null
+  }
+}
+
+const startPolling = () => {
+  stopPolling()
+  pollTimer = setInterval(getList, pollInterval)
+}
+
+/** 页面可见性变化:切走时暂停轮询,切回时立即刷新、重读配置并恢复轮询 */
+const handleVisibilityChange = async () => {
+  if (document.hidden) {
+    stopPolling()
+  } else {
+    getList()
+    await loadPollInterval()
+    startPolling()
+  }
+}
+
 /** 初始化 **/
-onMounted(() => {
- getList()
+onMounted(async () => {
+  getList()
+  await loadPollInterval()
+  startPolling()
+  document.addEventListener('visibilitychange', handleVisibilityChange)
+})
+
+onUnmounted(() => {
+  stopPolling()
+  document.removeEventListener('visibilitychange', handleVisibilityChange)
 })
 </script>