From 8d365e8d23d626c9b675ef084678ab863fa2fff5 Mon Sep 17 00:00:00 2001
From: lzh <sickone075@gmail.com>
Date: Sun, 1 Mar 2026 16:39:18 +0800
Subject: [PATCH] =?UTF-8?q?fix(ops):=20=E5=B0=8F=E6=97=B6=E8=B6=8B?=
 =?UTF-8?q?=E5=8A=BF=E6=97=A5=E6=9C=9F=E4=BB=85=E5=88=B7=E6=96=B0=E8=B6=8B?=
 =?UTF-8?q?=E5=8A=BF=E5=9B=BE=E4=B8=8D=E5=BD=B1=E5=93=8D=E7=BB=9F=E8=AE=A1?=
 =?UTF-8?q?=E6=8C=87=E6=A0=87=EF=BC=8C=E8=B6=8B=E5=8A=BF=E8=8C=83=E5=9B=B4?=
 =?UTF-8?q?=E9=99=90=E5=88=B630=E5=A4=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 拆分 loadHourlyData：hourlyDate 变化时只更新 hourlyTrend 数据，
  不覆盖 totalIn/totalOut 等统计指标
- loadGlobalData/loadAreaData：不再传 hourlyDate 给 realtime 接口，
  统计指标始终显示今日数据
- disabledTrendDate：增加最早30天前的限制

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 apps/web-antd/src/views/ops/traffic/index.vue | 41 +++++++++++++++----
 1 file changed, 33 insertions(+), 8 deletions(-)

diff --git a/apps/web-antd/src/views/ops/traffic/index.vue b/apps/web-antd/src/views/ops/traffic/index.vue
index 8d77d9033..1444ab1b0 100644
--- a/apps/web-antd/src/views/ops/traffic/index.vue
+++ b/apps/web-antd/src/views/ops/traffic/index.vue
@@ -79,9 +79,10 @@ const trendDateRange = ref<[dayjs.Dayjs, dayjs.Dayjs]>([
   dayjs().subtract(6, 'day'),
   dayjs(),
 ]);
-// 限制趋势范围最多1个月
+// 限制趋势范围：不能选未来，最早30天前
 function disabledTrendDate(current: dayjs.Dayjs) {
-  return current && current > dayjs().endOf('day');
+  if (!current) return false;
+  return current > dayjs().endOf('day') || current < dayjs().subtract(30, 'day').startOf('day');
 }
 
 const realtimeData = ref<TrafficRealtimeResp>({
@@ -293,10 +294,9 @@ function getTrendChartOptions(): ECOption {
 async function loadGlobalData() {
   loading.value = true;
   try {
-    const dateStr = hourlyDate.value.format('YYYY-MM-DD');
     const [startDate, endDate] = trendDateRange.value;
     const [realtime, trend] = await Promise.all([
-      getTrafficRealtime(dateStr),
+      getTrafficRealtime(),
       getTrafficTrend({
         startDate: startDate.format('YYYY-MM-DD'),
         endDate: endDate.format('YYYY-MM-DD'),
@@ -319,10 +319,9 @@ async function loadGlobalData() {
 async function loadAreaData(areaIds: number[]) {
   loading.value = true;
   try {
-    const dateStr = hourlyDate.value.format('YYYY-MM-DD');
     const [startDate, endDate] = trendDateRange.value;
     const [realtime, trend] = await Promise.all([
-      getAreaRealtime(areaIds, dateStr),
+      getAreaRealtime(areaIds),
       getAreaTrend({
         areaIds: areaIds.join(','),
         startDate: startDate.format('YYYY-MM-DD'),
@@ -349,6 +348,29 @@ async function loadData() {
     : loadGlobalData());
 }
 
+/** 仅刷新小时趋势图（不影响统计指标） */
+async function loadHourlyData() {
+  try {
+    const dateStr = hourlyDate.value.format('YYYY-MM-DD');
+    let realtime: TrafficRealtimeResp;
+    if (selectedAreaId.value && selectedAreaIds.value.length > 0) {
+      realtime = await getAreaRealtime(selectedAreaIds.value, dateStr);
+    } else {
+      realtime = await getTrafficRealtime(dateStr);
+    }
+    // 只更新小时趋势数据，不覆盖统计指标
+    realtimeData.value = {
+      ...realtimeData.value,
+      hourlyTrend: realtime.hourlyTrend,
+      yesterdayHourlyTrend: realtime.yesterdayHourlyTrend,
+    };
+    await nextTick();
+    renderHourlyChart(getHourlyChartOptions());
+  } catch {
+    // 静默失败
+  }
+}
+
 // ========== 统计指标 ==========
 
 function getStatTotalIn(): number {
@@ -424,13 +446,16 @@ const statDailyAvg = computed(() => {
   return Math.round(totalAll / t.inData.length);
 });
 
-// ========== 日期变化时重新加载（防抖避免并发请求） ==========
+// ========== 日期变化时重新加载 ==========
 const debouncedLoadData = useDebounceFn(loadData, 300);
+const debouncedLoadHourly = useDebounceFn(loadHourlyData, 300);
 
+// 小时趋势日期变化：仅刷新小时趋势图
 watch(hourlyDate, () => {
-  debouncedLoadData();
+  debouncedLoadHourly();
 });
 
+// 趋势日期范围变化：刷新趋势图和统计指标
 watch(trendDateRange, () => {
   debouncedLoadData();
 });