From 9748b94046b2b3b2fdd47a56a532d0f9fe556d38 Mon Sep 17 00:00:00 2001
From: yangsy <ysy@ittc.sh.cn>
Date: Thu, 25 Dec 2025 00:38:48 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BC=98=E5=8C=96=E5=85=A8?=
 =?UTF-8?q?=E5=B1=80=E5=8A=A0=E8=BD=BD=E7=8A=B6=E6=80=81=E8=AE=A1=E7=AE=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/app-layout.vue | 23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/layouts/app-layout.vue b/src/layouts/app-layout.vue
index 4541d97..03d749a 100644
--- a/src/layouts/app-layout.vue
+++ b/src/layouts/app-layout.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { SettingsDrawer, SyncCameraResultModal } from '@/components';
 import { useLineStationsQuery, useStompClient, useVerifyUserQuery } from '@/composables';
+import { LINE_ALARMS_QUERY_KEY, LINE_DEVICES_QUERY_KEY, LINE_STATIONS_MUTATION_KEY, LINE_STATIONS_QUERY_KEY, STATION_ALARMS_MUTATION_KEY, STATION_DEVICES_MUTATION_KEY } from '@/constants';
 import { useAlarmStore, useSettingStore, useUserStore } from '@/stores';
 import { parseErrorFeedback } from '@/utils';
 import { useIsFetching, useIsMutating, useMutation } from '@tanstack/vue-query';
@@ -43,10 +44,22 @@ const { syncCameraResult, afterCheckSyncCameraResult } = useStompClient();
 useVerifyUserQuery();
 useLineStationsQuery();
 
-// 带key的query和mutation用于全局轮询 可用于渲染loading状态
-const fetchingCount = useIsFetching({ predicate: (query) => !!query.options.queryKey });
-const mutatingCount = useIsMutating({ predicate: (mutation) => !!mutation.options.mutationKey });
-const loadingCount = computed(() => fetchingCount.value + mutatingCount.value);
+// 全局loading状态依赖于轮询query的queryKey以及相关的mutationKey
+const queryingCount = useIsFetching({
+  predicate: (query) => {
+    const pollingKeys = [LINE_STATIONS_QUERY_KEY, LINE_DEVICES_QUERY_KEY, LINE_ALARMS_QUERY_KEY];
+    const queryKey = query.options.queryKey;
+    return !!queryKey && Array.isArray(queryKey) && pollingKeys.some((key) => queryKey.includes(key));
+  },
+});
+const mutatingCount = useIsMutating({
+  predicate: (mutation) => {
+    const mutationKeys = [LINE_STATIONS_MUTATION_KEY, STATION_DEVICES_MUTATION_KEY, STATION_ALARMS_MUTATION_KEY];
+    const mutationKey = mutation.options.mutationKey;
+    return !!mutationKey && Array.isArray(mutationKey) && mutationKeys.some((key) => mutationKey.includes(key));
+  },
+});
+const appLoading = computed(() => queryingCount.value + mutatingCount.value > 0);
 
 const onToggleMenuCollapsed = () => {
   menuCollpased.value = !menuCollpased.value;
@@ -169,7 +182,7 @@ function renderIcon(icon: Component): () => VNode {
         <NFlex justify="space-between" align="center" :size="8" style="width: 100%; height: 100%">
           <NFlex align="center">
             <h3 style="margin: 0 0 0 16px; cursor: pointer" @click="routeToRoot">网络设备管理平台</h3>
-            <NButton text size="tiny" :loading="loadingCount > 0"></NButton>
+            <NButton text size="tiny" :loading="appLoading"></NButton>
           </NFlex>
           <NFlex align="center" :size="0" style="height: 100%">
             <NDropdown trigger="hover" show-arrow :options="dropdownOptions" @select="onSelectDropdownOption">