refactor(query): remove unnecessary query calls and optimize global loading

src/pages/alarm-page.vue

@@ -2,9 +2,9 @@
 import type { NdmDeviceAlarmLogResultVO } from '@/apis/models';
 import { ndmDeviceAlarmLogDefaultExportByTemplate, postNdmDeviceAlarmLogPage, putNdmDeviceAlarmLog } from '@/apis/requests';
 import { renderAlarmDateCell, renderAlarmTypeCell, renderDeviceTypeCell, renderFaultLevelCell } from '@/components/helper';
-import { FaultLevel } from '@/enums/fault-level';
 import { AlarmType } from '@/enums/alarm-type';
 import { DeviceType, DeviceTypeCode, DeviceTypeName, type DeviceTypeVal } from '@/enums/device-type';
+import { FaultLevel } from '@/enums/fault-level';
 import { useCurrentAlarmsStore } from '@/stores/current-alarms';
 import { useStationStore } from '@/stores/station';
 import { downloadByData } from '@/utils/download';

src/pages/dashboard-page.vue

@@ -1,56 +1,42 @@
 <script setup lang="ts">
 import type { Station } from '@/apis/domains';
-import DeviceAlarmDetailModal from '@/components/dashboard-page/device-alarm-detail-modal.vue';
-import DeviceParamsConfigModal from '@/components/dashboard-page/device-params-config-modal.vue';
-import OfflineDeviceDetailModal from '@/components/dashboard-page/offline-device-detail-modal.vue';
-import StationCard from '@/components/dashboard-page/station-card.vue';
-import { useLineAlarmCountsQuery, useLineDevicesQuery } from '@/composables/query';
-import { useStationStore } from '@/stores/station';
+import { ndmExportDevices } from '@/apis/requests';
+import { useLineAlarmsQuery, useLineDevicesQuery } from '@/composables/query';
+import { useLayoutStore } from '@/stores/layout';
+import { useLineAlarmsStore } from '@/stores/line-alarms';
 import { useLineDevicesStore } from '@/stores/line-devices';
+import { useStationStore } from '@/stores/station';
+import { downloadByData } from '@/utils/download';
+import { useMutation } from '@tanstack/vue-query';
 import { NGrid, NGi } from 'naive-ui';
 import { storeToRefs } from 'pinia';
 import { ref, watch } from 'vue';
-import { useLineAlarmCountsStore } from '@/stores/line-alarm-counts';
-import { useLayoutStore } from '@/stores/layout';
-import DeviceStatistic from '@/components/dashboard-page/device-statistic.vue';
-import { useMutation } from '@tanstack/vue-query';
-import { ndmExportDevices } from '@/apis/requests';
-import { downloadByData } from '@/utils/download';
 import dayjs from 'dayjs';
 
+import DeviceAlarmDetailModal from '@/components/dashboard-page/device-alarm-detail-modal.vue';
+import DeviceParamsConfigModal from '@/components/dashboard-page/device-params-config-modal.vue';
+import DeviceStatisticCard from '@/components/dashboard-page/device-statistic-card.vue';
+import OfflineDeviceDetailModal from '@/components/dashboard-page/offline-device-detail-modal.vue';
+import StationCard from '@/components/dashboard-page/station-card.vue';
+
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
 const lineDevicesStore = useLineDevicesStore();
 const { lineDevices } = storeToRefs(lineDevicesStore);
-const lineAlarmCountsStore = useLineAlarmCountsStore();
-const { lineAlarmCounts } = storeToRefs(lineAlarmCountsStore);
+const lineAlarmsStore = useLineAlarmsStore();
+const { lineAlarmCounts } = storeToRefs(lineAlarmsStore);
 
-const { isFetching: lineDevicesFetching, error: lineDevicesQueryError } = useLineDevicesQuery();
-const { isFetching: lineAlarmCountsFetching, error: lineAlarmCountsQueryError } = useLineAlarmCountsQuery();
+const { error: lineDevicesQueryError } = useLineDevicesQuery();
+const { error: lineAlarmsQueryError } = useLineAlarmsQuery();
 const layoutStore = useLayoutStore();
 const { stationLayoutGridCols } = storeToRefs(layoutStore);
 
-// 当设备查询或告警查询正在进行时，显示加载条
-watch(
-  [lineDevicesFetching, lineAlarmCountsFetching],
-  ([devicesFetching, alarmCountsFetching]) => {
-    if (devicesFetching || alarmCountsFetching) {
-      window.$loadingBar.start();
-    } else {
-      window.$loadingBar.finish();
-    }
-  },
-  {
-    immediate: true,
-  },
-);
-
-watch([lineDevicesQueryError, lineAlarmCountsQueryError], ([newLineDevicesQueryError, newLineAlarmCountsQueryError]) => {
+watch([lineDevicesQueryError, lineAlarmsQueryError], ([newLineDevicesQueryError, newLineAlarmsQueryError]) => {
   if (newLineDevicesQueryError) {
     window.$message.error(newLineDevicesQueryError.message);
   }
-  if (newLineAlarmCountsQueryError) {
-    window.$message.error(newLineAlarmCountsQueryError.message);
+  if (newLineAlarmsQueryError) {
+    window.$message.error(newLineAlarmsQueryError.message);
   }
 });
 
@@ -95,7 +81,7 @@ const openDeviceParamsConfigModal = (station: Station) => {
 </script>
 
 <template>
-  <DeviceStatistic
+  <DeviceStatisticCard
     :station-list="stationList"
     :line-devices="lineDevices"
     :button-loading="exporting"

src/pages/debug-page.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
+import { useQueryControlStore } from '@/stores/query-control';
 import { NLayout, NLayoutContent } from 'naive-ui';
 import { onBeforeUnmount } from 'vue';
-import { useQueryControlStore } from '@/stores/query-control';
 
 const queryControlStore = useQueryControlStore();
 queryControlStore.disablePolling();

src/pages/device-page.vue

@@ -1,20 +1,20 @@
 <script setup lang="ts">
 import { useDeviceSelection } from '@/composables/device';
-import { useLineDevicesQuery, type LineDevices } from '@/composables/query';
+import { useLineDevicesQuery } from '@/composables/query';
 import { useLineDevicesStore } from '@/stores/line-devices';
 import { useStationStore } from '@/stores/station';
 import { ChevronBack } from '@vicons/ionicons5';
 import { watchDebounced } from '@vueuse/core';
 import { NEmpty, NIcon, NLayout, NLayoutContent, NLayoutSider, NPageHeader, NScrollbar, NSpin } from 'naive-ui';
 import { storeToRefs } from 'pinia';
-import { onMounted, ref, watch } from 'vue';
+import { onMounted, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
 import DeviceTree from '@/components/device-page/device-tree.vue';
 import DeviceRenderer from '@/components/device-page/device-renderer.vue';
 
 // 数据获取
-const { isFetching: lineDevicesFetching, error: lineDevicesQueryError } = useLineDevicesQuery();
+const { error: lineDevicesQueryError } = useLineDevicesQuery();
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
 const lineDevicesStore = useLineDevicesStore();
@@ -32,21 +32,6 @@ onMounted(() => {
   initFromRoute(lineDevices.value);
 });
 
-// 加载条控制
-watch(
-  lineDevicesFetching,
-  (fetching) => {
-    if (fetching) {
-      window.$loadingBar.start();
-    } else {
-      window.$loadingBar.finish();
-    }
-  },
-  {
-    immediate: true,
-  },
-);
-
 // 当设备数据更新时，需要重新配置设备树
 watchDebounced(
   lineDevices,
@@ -98,11 +83,6 @@ watch(lineDevicesQueryError, (newLineDevicesQueryError) => {
               <DeviceRenderer :station-code="selectedStationCode" :device="selectedDevice" />
             </NScrollbar>
           </template>
-          <template v-else-if="lineDevicesFetching">
-            <div style="width: 100%; height: 100%; display: flex">
-              <NSpin style="margin: auto" />
-            </div>
-          </template>
           <template v-else>
             <div style="width: 100%; height: 100%; display: flex">
               <NEmpty description="选择设备查看诊断数据" style="margin: auto" />

src/pages/vimp-log-page.vue

@@ -30,7 +30,6 @@ const vimpOperationTypeOptions: SelectOption[] = [
 <script setup lang="ts">
 import type { NdmVimpLogResultVO } from '@/apis/models/device';
 import { ndmVimpLogDefaultExportByTemplate, postNdmVimpLogPage } from '@/apis/requests';
-import { useStationListQuery } from '@/composables/query';
 import { useStationStore } from '@/stores/station';
 import { downloadByData } from '@/utils/download';
 import { useMutation } from '@tanstack/vue-query';
@@ -57,7 +56,6 @@ import {
 import { storeToRefs } from 'pinia';
 import { computed, h, onMounted, reactive, ref, watch, watchEffect } from 'vue';
 
-useStationListQuery();
 const stationStore = useStationStore();
 const { stationList, onlineStationList } = storeToRefs(stationStore);