perf: 整点刷新充电站详情

component/resultDetailPage/resultDetailPageComponent.tsx

@@ -49,8 +49,7 @@ const ChargingStationTabView: React.FC<ChargingStationTabViewProps> = ({ titles,
         
         return `${timeString}${period}`;
     };
-    
-    useEffect(() => { 
+    const fetchElectricityPrice = () => {
         chargeStationService.fetchElectricityPrice(pricemodel_id || 'a').then(res => {
             const date = new Date();
             const str = (date.toLocaleString('en-US', { weekday: 'short' })).toLowerCase();
@@ -62,7 +61,43 @@ const ChargingStationTabView: React.FC<ChargingStationTabViewProps> = ({ titles,
                 setList(newList)
             })
         })
-    }, [pricemodel_id])
+    };
+    useEffect(() => { 
+        // 初始加载
+        fetchElectricityPrice();
+        
+        // 计算到下一个整点的时间
+        const now = new Date();
+        const nextHour = new Date(now);
+        nextHour.setHours(nextHour.getHours() + 1, 0, 0, 0); // 设置为下一个整点
+        const timeToNextHour = nextHour.getTime() - now.getTime();
+        
+        // 设置第一次定时器，在下一个整点触发
+        const firstTimer = setTimeout(() => {
+            fetchElectricityPrice();
+            
+            // 之后每小时执行一次
+            const hourlyInterval = setInterval(fetchElectricityPrice, 60 * 60 * 1000);
+            
+            // 保存interval ID以便清理
+            intervalRef.current = hourlyInterval;
+        }, timeToNextHour);
+        
+        // 保存timeout ID以便清理
+        timeoutRef.current = firstTimer;
+        
+        // 清理函数
+        return () => {
+            clearTimeout(firstTimer);
+            if (intervalRef.current) {
+                clearInterval(intervalRef.current);
+            }
+        };
+    }, [pricemodel_id]);
+
+    // 使用useRef保存定时器ID
+    const timeoutRef = React.useRef<NodeJS.Timeout | null>(null);
+    const intervalRef = React.useRef<NodeJS.Timeout | null>(null);
 
     //tab 1
     const FirstRoute = () => (