From 0c1d1b2886acb84ad47ac20d3afcfefdcf398275 Mon Sep 17 00:00:00 2001
From: yangsy <ysy@ittc.sh.cn>
Date: Tue, 26 Aug 2025 14:04:28 +0800
Subject: [PATCH] feat: isFetching

---
 src/pages/dashboard-page.vue | 20 ++++++++++++++++++--
 src/pages/device-page.vue    | 15 ++++++++++++++-
 2 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/src/pages/dashboard-page.vue b/src/pages/dashboard-page.vue
index 247dc6b..8ab65ee 100644
--- a/src/pages/dashboard-page.vue
+++ b/src/pages/dashboard-page.vue
@@ -6,6 +6,7 @@ import { storeToRefs } from 'pinia';
 import { useLineDevicesStore } from '@/stores/line-devices';
 import { useLineAlarmsStore } from '@/stores/line-alarms';
 import { useLineAlarmsQuery, useLineDevicesQuery } from '@/composables/query';
+import { watch } from 'vue';
 
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
@@ -14,8 +15,23 @@ const { lineDevices } = storeToRefs(lineDevicesStore);
 const lineAlarmsStore = useLineAlarmsStore();
 const { lineAlarms } = storeToRefs(lineAlarmsStore);
 
-useLineDevicesQuery();
-useLineAlarmsQuery();
+const { isFetching: lineDevicesFetching } = useLineDevicesQuery();
+const { isFetching: lineAlarmsFetching } = useLineAlarmsQuery();
+
+// 当设备查询或告警查询正在进行时，显示加载条
+watch(
+  [lineDevicesFetching, lineAlarmsFetching],
+  (fetchingList) => {
+    if (fetchingList.some((pending) => pending)) {
+      window.$loadingBar.start();
+    } else {
+      window.$loadingBar.finish();
+    }
+  },
+  {
+    immediate: true,
+  },
+);
 </script>
 
 <template>
diff --git a/src/pages/device-page.vue b/src/pages/device-page.vue
index 175e224..838faca 100644
--- a/src/pages/device-page.vue
+++ b/src/pages/device-page.vue
@@ -34,7 +34,20 @@ import { h, onMounted, useTemplateRef } from 'vue';
 import { computed, ref, watch } from 'vue';
 import { useRoute, useRouter, type LocationQuery } from 'vue-router';
 
-useLineDevicesQuery();
+const { isFetching: lineDevicesFetching } = useLineDevicesQuery();
+watch(
+  lineDevicesFetching,
+  (fetching) => {
+    if (fetching) {
+      window.$loadingBar.start();
+    } else {
+      window.$loadingBar.finish();
+    }
+  },
+  {
+    immediate: true,
+  },
+);
 
 const route = useRoute();
 const router = useRouter();