抢单大厅新增自动刷新开关并移除延迟可见提示

apps/frontend/src/pages/worker/WorkerHallPage.tsx

@@ -14,11 +14,13 @@ import {
   Pagination,
   Space,
   Spin,
+  Switch,
   Tabs,
   Tag,
+  Tooltip,
   Typography,
 } from 'antd'
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 
 import {
   fetchWorkerHallOrders,
@@ -49,6 +51,20 @@ export default function WorkerHallPage() {
   const [sharingOrder, setSharingOrder] = useState<WorkOrder | null>(null)
   const [sharingQuantity, setSharingQuantity] = useState(1)
   const [submittingSharing, setSubmittingSharing] = useState(false)
+  const [autoRefresh, setAutoRefresh] = useState(loadAutoRefreshPreference)
+
+  useEffect(() => {
+    if (!autoRefresh) return
+    const timer = window.setInterval(() => {
+      refreshAll()
+    }, 5000)
+    return () => window.clearInterval(timer)
+  }, [autoRefresh])
+
+  function toggleAutoRefresh(enabled: boolean) {
+    setAutoRefresh(enabled)
+    localStorage.setItem(AUTO_REFRESH_STORAGE_KEY, enabled ? '1' : '0')
+  }
 
   const ordersQuery = useQuery({
     queryKey: ['worker-hall-orders', keyword, categoryId, page, pageSize],
@@ -104,7 +120,6 @@ export default function WorkerHallPage() {
   const orders = ordersQuery.data?.data.items || []
   const pagination = ordersQuery.data?.data.pagination
   const categories = ordersQuery.data?.data.categories || []
-  const visibleDelaySeconds = Number(ordersQuery.data?.data.visibleDelaySeconds || 0)
   const worker = profileQuery.data?.data.worker
   const activeCount = hallSummaryQuery.data?.activeCount || 0
   const pendingAcceptanceCount = hallSummaryQuery.data?.pendingAcceptanceCount || 0
@@ -220,6 +235,19 @@ export default function WorkerHallPage() {
           >
             刷新
           </Button>
+          <Tooltip
+            title={
+              autoRefresh
+                ? '已开启自动刷新，每 5 秒刷新一次，点击关闭'
+                : '开启后每 5 秒自动刷新订单列表'
+            }
+          >
+            <Switch
+              size="small"
+              checked={autoRefresh}
+              onChange={toggleAutoRefresh}
+            />
+          </Tooltip>
           <Space.Compact className="worker-hall-search">
             <Input
               allowClear
@@ -290,14 +318,6 @@ export default function WorkerHallPage() {
           />
         ) : null}
 
-        {visibleDelaySeconds > 0 ? (
-          <Alert
-            showIcon
-            type="info"
-            message={`新发布的订单将延迟 ${visibleDelaySeconds} 秒后对本等级可见（高等级打手优先）`}
-          />
-        ) : null}
-
         {ordersQuery.isLoading ? (
           <div className="worker-hall-loading">
             <Spin size="large" />
@@ -647,6 +667,12 @@ function asRecord(value: unknown): Record<string, unknown> {
     : {}
 }
 
+const AUTO_REFRESH_STORAGE_KEY = 'worker-hall-auto-refresh'
+
+function loadAutoRefreshPreference(): boolean {
+  return localStorage.getItem(AUTO_REFRESH_STORAGE_KEY) === '1'
+}
+
 function formatMoney(value: number | undefined) {
   return `￥${((Number(value || 0) || 0) / 100).toFixed(2)}`
 }