refactor&perf

- proxy config
- query export
- optimize station card request

src/apis/domains/station.ts

@@ -1,6 +1,5 @@
 export interface Station {
   code: string;
   name: string;
-  deviceIdPrefix: string; // 当查询设备告警记录时，需要通过deviceId的前4位来判断车站
   online: boolean;
 }

src/apis/requests/device/log/ndm-device-alarm-log.ts

@@ -31,7 +31,7 @@ export const ndmDeviceAlarmLogDefaultExportByTemplate = async (stationCode: stri
     }
     return data;
   }
-  const resp = await ndmClient.post<BlobPart>(`${endpoint}`, pageQuery, { responseType: 'blob', retRaw: true });
+  const resp = await ndmClient.post<BlobPart>(`/${stationCode}${endpoint}`, pageQuery, { responseType: 'blob', retRaw: true });
   const [err, data] = resp;
   if (err || !data) {
     throw err;

src/components/device-alarm-detail-modal.vue

@@ -3,7 +3,7 @@
 import type { Station } from '@/apis/domains';
 import type { NdmDeviceAlarmLogResultVO } from '@/apis/models';
 import { ndmDeviceAlarmLogDefaultExportByTemplate } from '@/apis/requests';
-import type { StationAlarms } from '@/composables/query/use-line-alarms-query';
+import type { StationAlarms } from '@/composables/query/alarm/use-line-alarms-query';
 import { JAVA_INTEGER_MAX_VALUE } from '@/constants';
 import { DeviceType, DeviceTypeName, type DeviceTypeCode } from '@/enums/device-type';
 import { useQueryControlStore } from '@/stores/query-control';
@@ -15,7 +15,7 @@ import { computed, h, reactive, toRefs, watch } from 'vue';
 
 interface Props {
   station: Station;
-  stationAlarms: StationAlarms;
+  stationAlarms?: StationAlarms;
 }
 
 const props = defineProps<Props>();
@@ -35,7 +35,7 @@ watch(show, (newValue) => {
 
 const alarmCount = computed(() => {
   return Object.values(DeviceType).reduce((count, deviceType) => {
-    return count + stationAlarms.value[deviceType].length;
+    return count + (stationAlarms.value?.[deviceType].length ?? 0);
   }, 0);
 });
 
@@ -43,7 +43,7 @@ const classifiedCounts = computed(() => {
   return Object.values(DeviceType).map<{ label: string; count: number }>((deviceType) => {
     return {
       label: DeviceTypeName[deviceType],
-      count: stationAlarms.value[deviceType].length,
+      count: stationAlarms.value?.[deviceType].length ?? 0,
     };
   });
 });
@@ -132,7 +132,7 @@ const tablePagination = reactive<PaginationProps>({
   },
 });
 
-const tableData = computed<DataTableRowData[]>(() => stationAlarms.value.unclassified);
+const tableData = computed<DataTableRowData[]>(() => stationAlarms.value?.unclassified ?? []);
 
 const { mutate: downloadTableData, isPending: isDownloading } = useMutation({
   mutationFn: async () => {

src/components/offline-device-detail-modal.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { Station } from '@/apis/domains';
 import type { NdmDeviceVO } from '@/apis/models';
-import type { StationDevices } from '@/composables/query/use-line-devices-query';
+import type { StationDevices } from '@/composables/query';
 import { DeviceType, DeviceTypeName } from '@/enums/device-type';
 import { useQueryControlStore } from '@/stores/query-control';
 import { NButton, NCol, NInput, NModal, NRow, NStatistic, NTree } from 'naive-ui';
@@ -11,7 +11,7 @@ import { useRoute, useRouter } from 'vue-router';
 
 interface Props {
   station: Station;
-  stationDevices: StationDevices;
+  stationDevices?: StationDevices;
 }
 
 const props = defineProps<Props>();
@@ -42,7 +42,7 @@ const searchFilter: (pattern: string, node: TreeOption) => boolean = (pattern, n
 const offlineDeviceCount = computed(() => {
   let count = 0;
   Object.values(DeviceType).forEach((deviceType) => {
-    const offlineDeviceList = stationDevices.value[deviceType].filter((device) => device.deviceStatus === '20');
+    const offlineDeviceList = stationDevices.value?.[deviceType].filter((device) => device.deviceStatus === '20') ?? [];
     count += offlineDeviceList.length;
   });
   return count;
@@ -52,15 +52,15 @@ const classifiedCounts = computed(() => {
   return Object.values(DeviceType).map((deviceType) => {
     return {
       label: DeviceTypeName[deviceType],
-      offlineCount: stationDevices.value[deviceType].filter((device) => device.deviceStatus === '20').length,
+      offlineCount: stationDevices.value?.[deviceType].filter((device) => device.deviceStatus === '20').length ?? 0,
-      total: stationDevices.value[deviceType].length,
+      total: stationDevices.value?.[deviceType].length ?? 0,
     };
   });
 });
 
 const treeData = computed<TreeOption[]>(() => {
   return Object.values(DeviceType).map<TreeOption>((deviceType) => {
-    const offlineDeviceList = stationDevices.value[deviceType].filter((device) => device.deviceStatus === '20');
+    const offlineDeviceList = stationDevices.value?.[deviceType].filter((device) => device.deviceStatus === '20') ?? [];
     return {
       label: `${DeviceTypeName[deviceType]} (${offlineDeviceList.length}台)`,
       key: deviceType,

src/components/station-card.vue

@@ -4,30 +4,31 @@ import DeviceParamsConfigModal from './device-params-config-modal.vue';
 import OfflineDeviceDetailModal from './offline-device-detail-modal.vue';
 import type { Station } from '@/apis/domains';
 import { DeviceType } from '@/enums/device-type';
-import type { StationAlarms } from '@/composables/query/use-line-alarms-query';
+import { useStationDevicesQuery } from '@/composables/query/device/use-station-devices-query';
-import type { StationDevices } from '@/composables/query/use-line-devices-query';
 import { ControlOutlined } from '@vicons/antd';
 import { Video as VideoIcon } from '@vicons/carbon';
 import axios from 'axios';
 import { NCard, NStatistic, NTag, NGrid, NGi, NButton, NIcon, useThemeVars, NSpace, NTooltip } from 'naive-ui';
 import { toRefs, computed, ref } from 'vue';
+import { useStationAlarmsQuery } from '@/composables/query/alarm/use-station-alarms-query';
 
 interface Props {
   station: Station;
-  stationDevices: StationDevices;
-  stationAlarms: StationAlarms;
 }
 
 const props = defineProps<Props>();
 
-const { station, stationDevices, stationAlarms } = toRefs(props);
+const { station } = toRefs(props);
 const { code, name, online } = toRefs(station.value);
 
+const { data: stationDevices } = useStationDevicesQuery(code.value);
+const { data: stationAlarms } = useStationAlarmsQuery(station.value.code);
+
 // 计算总离线设备数量
 const offlineDeviceCount = computed(() => {
   let count = 0;
   Object.values(DeviceType).forEach((deviceType) => {
-    const offlineDeviceList = stationDevices.value[deviceType].filter((device) => device.deviceStatus === '20');
+    const offlineDeviceList = stationDevices.value?.[deviceType].filter((device) => device.deviceStatus === '20') ?? [];
     count += offlineDeviceList.length;
   });
   return count;
@@ -35,14 +36,14 @@ const offlineDeviceCount = computed(() => {
 const deviceCount = computed(() => {
   let count = 0;
   Object.values(DeviceType).forEach((deviceType) => {
-    count += stationDevices.value[deviceType].length;
+    count += stationDevices.value?.[deviceType].length ?? 0;
   });
   return count;
 });
 const devicAlarmCount = computed(() => {
   let count = 0;
   Object.values(DeviceType).forEach((deviceType) => {
-    count += stationAlarms.value[deviceType].length;
+    count += stationAlarms.value?.[deviceType].length ?? 0;
   });
   return count;
 });

src/composables/query/alarm/index.ts

@@ -0,0 +1,2 @@
+export * from './use-line-alarms-query';
+export * from './use-today-alarms-query';

src/composables/query/alarm/use-station-alarms-query.ts

@@ -0,0 +1,87 @@
+import type { Station } from '@/apis/domains';
+import { postNdmDeviceAlarmLogPage } from '@/apis/requests';
+import { DeviceType } from '@/enums/device-type';
+import { useQueryControlStore } from '@/stores/query-control';
+import { useStationStore } from '@/stores/station';
+import { useQuery } from '@tanstack/vue-query';
+import dayjs from 'dayjs';
+import { storeToRefs } from 'pinia';
+import { computed } from 'vue';
+import type { StationAlarms } from './use-line-alarms-query';
+
+const createEmptyStationAlarms = (): StationAlarms => ({
+  [DeviceType.Camera]: [],
+  [DeviceType.Decoder]: [],
+  [DeviceType.Keyboard]: [],
+  [DeviceType.MediaServer]: [],
+  [DeviceType.Nvr]: [],
+  [DeviceType.SecurityBox]: [],
+  [DeviceType.Switch]: [],
+  [DeviceType.VideoServer]: [],
+  unclassified: [],
+});
+
+export function useStationAlarmsQuery(stationCode: Station['code']) {
+  const stationStore = useStationStore();
+  const { updatedTime, onlineStationList } = storeToRefs(stationStore);
+
+  const queryControlStore = useQueryControlStore();
+  const { pollingEnabled } = storeToRefs(queryControlStore);
+
+  const isOnline = computed(() => onlineStationList.value.some((stn) => stn.code === stationCode));
+
+  return useQuery({
+    queryKey: ['station-alarms', stationCode, updatedTime],
+    enabled: computed(() => isOnline.value && pollingEnabled.value),
+    placeholderData: (prev) => prev ?? createEmptyStationAlarms(),
+    queryFn: async (): Promise<StationAlarms> => {
+      // 如果车站离线，返回空数据
+      if (!isOnline.value) {
+        return createEmptyStationAlarms();
+      }
+
+      try {
+        const now = dayjs();
+        const todayStart = now.startOf('date').valueOf();
+        const todayEnd = now.endOf('date').valueOf();
+
+        const { records: alarmList } = await postNdmDeviceAlarmLogPage(stationCode, {
+          model: {},
+          extra: {
+            alarmDate_ge: todayStart,
+            alarmDate_le: todayEnd,
+          },
+          size: 50000,
+          current: 1,
+          sort: 'id',
+          order: 'descending',
+        });
+
+        const cameraAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.Camera);
+        const decoderAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.Decoder);
+        const keyboardAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.Keyboard);
+        const mediaServerAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.MediaServer);
+        const nvrAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.Nvr);
+        const securityBoxAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.SecurityBox);
+        const switchAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.Switch);
+        const videoServerAlarms = alarmList.filter((alarm) => alarm.deviceType === DeviceType.VideoServer);
+
+        return {
+          [DeviceType.Camera]: cameraAlarms,
+          [DeviceType.Decoder]: decoderAlarms,
+          [DeviceType.Keyboard]: keyboardAlarms,
+          [DeviceType.MediaServer]: mediaServerAlarms,
+          [DeviceType.Nvr]: nvrAlarms,
+          [DeviceType.SecurityBox]: securityBoxAlarms,
+          [DeviceType.Switch]: switchAlarms,
+          [DeviceType.VideoServer]: videoServerAlarms,
+          unclassified: alarmList ?? [],
+        };
+      } catch (error) {
+        console.error(`获取车站 ${stationCode} 告警数据失败:`, error);
+        // 如果获取失败，返回空数据
+        return createEmptyStationAlarms();
+      }
+    },
+  });
+}

src/composables/query/alarm/use-today-alarms-query.ts

@@ -0,0 +1,15 @@
+import { useQueryControlStore } from '@/stores/query-control';
+import { useQuery } from '@tanstack/vue-query';
+import { storeToRefs } from 'pinia';
+import { computed } from 'vue';
+
+export function useTodayAlarmsQuery() {
+  const queryControlStore = useQueryControlStore();
+  const { globalPollingEnabled } = storeToRefs(queryControlStore);
+  return useQuery({
+    queryKey: ['today-alarms'],
+    enabled: computed(() => globalPollingEnabled.value),
+    placeholderData: (prev) => prev,
+    queryFn: async () => {},
+  });
+}

src/composables/query/device/domains/index.ts

@@ -0,0 +1 @@
+export * from './station-devices';

src/composables/query/device/domains/station-devices.ts

@@ -0,0 +1,22 @@
+import type {
+  NdmCameraResultVO,
+  NdmDecoderResultVO,
+  NdmKeyboardResultVO,
+  NdmMediaServerResultVO,
+  NdmNvrResultVO,
+  NdmSecurityBoxResultVO,
+  NdmSwitchResultVO,
+  NdmVideoServerResultVO,
+} from '@/apis/models';
+import type { DeviceType } from '@/enums/device-type';
+
+export interface StationDevices {
+  [DeviceType.Camera]: NdmCameraResultVO[];
+  [DeviceType.Decoder]: NdmDecoderResultVO[];
+  [DeviceType.Keyboard]: NdmKeyboardResultVO[];
+  [DeviceType.MediaServer]: NdmMediaServerResultVO[];
+  [DeviceType.Nvr]: NdmNvrResultVO[];
+  [DeviceType.SecurityBox]: NdmSecurityBoxResultVO[];
+  [DeviceType.Switch]: NdmSwitchResultVO[];
+  [DeviceType.VideoServer]: NdmVideoServerResultVO[];
+}

src/composables/query/device/index.ts

@@ -0,0 +1,4 @@
+export * from './domains';
+
+export * from './use-line-devices-query';
+export * from './use-station-devices-query';

src/composables/query/device/use-line-devices-query.ts

@@ -1,15 +1,5 @@
 import type { Station } from '@/apis/domains';
-import type {
+import type { PageParams } from '@/apis/models';
-  NdmCameraResultVO,
-  NdmDecoderResultVO,
-  NdmKeyboardResultVO,
-  NdmMediaServerResultVO,
-  NdmNvrResultVO,
-  NdmSecurityBoxResultVO,
-  NdmSwitchResultVO,
-  NdmVideoServerResultVO,
-  PageParams,
-} from '@/apis/models';
 import { postNdmCameraPage, postNdmDecoderPage, postNdmKeyboardPage, postNdmMediaServerPage, postNdmNvrPage, postNdmSecurityBoxPage, postNdmSwitchPage, postNdmVideoServerPage } from '@/apis/requests';
 import { DeviceType } from '@/enums/device-type';
 import { useQueryControlStore } from '@/stores/query-control';
@@ -17,23 +7,25 @@ import { useStationStore } from '@/stores/station';
 import { useQuery } from '@tanstack/vue-query';
 import { storeToRefs } from 'pinia';
 import { computed } from 'vue';
-
+import type { StationDevices } from './domains';
-// 定义设备数据类型
-export interface StationDevices {
-  [DeviceType.Camera]: NdmCameraResultVO[];
-  [DeviceType.Decoder]: NdmDecoderResultVO[];
-  [DeviceType.Keyboard]: NdmKeyboardResultVO[];
-  [DeviceType.MediaServer]: NdmMediaServerResultVO[];
-  [DeviceType.Nvr]: NdmNvrResultVO[];
-  [DeviceType.SecurityBox]: NdmSecurityBoxResultVO[];
-  [DeviceType.Switch]: NdmSwitchResultVO[];
-  [DeviceType.VideoServer]: NdmVideoServerResultVO[];
-}
 
 export interface LineDevices {
   [stationCode: Station['code']]: StationDevices;
 }
 
+const createEmptyStationDevices = (): StationDevices => {
+  return {
+    [DeviceType.Camera]: [],
+    [DeviceType.Decoder]: [],
+    [DeviceType.Keyboard]: [],
+    [DeviceType.MediaServer]: [],
+    [DeviceType.Nvr]: [],
+    [DeviceType.SecurityBox]: [],
+    [DeviceType.Switch]: [],
+    [DeviceType.VideoServer]: [],
+  };
+};
+
 export function useLineDevicesQuery() {
   const stationStore = useStationStore();
   const { updatedTime, stationList, onlineStationList } = storeToRefs(stationStore);
@@ -60,16 +52,7 @@ export function useLineDevicesQuery() {
       for (const station of stationList.value) {
         // 如果车站离线，设置空数组
         if (!station.online) {
-          lineDevices[station.code] = {
+          lineDevices[station.code] = createEmptyStationDevices();
-            [DeviceType.Camera]: [],
-            [DeviceType.Decoder]: [],
-            [DeviceType.Keyboard]: [],
-            [DeviceType.MediaServer]: [],
-            [DeviceType.Nvr]: [],
-            [DeviceType.SecurityBox]: [],
-            [DeviceType.Switch]: [],
-            [DeviceType.VideoServer]: [],
-          };
           continue;
         }
 
@@ -100,16 +83,7 @@ export function useLineDevicesQuery() {
         } catch (error) {
           console.error(`获取车站 ${station.name} 设备数据失败:`, error);
           // 如果获取失败，设置空数组
-          lineDevices[station.code] = {
+          lineDevices[station.code] = createEmptyStationDevices();
-            [DeviceType.Camera]: [],
-            [DeviceType.Decoder]: [],
-            [DeviceType.Keyboard]: [],
-            [DeviceType.MediaServer]: [],
-            [DeviceType.Nvr]: [],
-            [DeviceType.SecurityBox]: [],
-            [DeviceType.Switch]: [],
-            [DeviceType.VideoServer]: [],
-          };
         }
       }
 

src/composables/query/device/use-station-devices-query.ts

@@ -0,0 +1,75 @@
+import type { Station } from '@/apis/domains';
+import type { PageParams } from '@/apis/models';
+import { postNdmCameraPage, postNdmDecoderPage, postNdmKeyboardPage, postNdmMediaServerPage, postNdmNvrPage, postNdmSecurityBoxPage, postNdmSwitchPage, postNdmVideoServerPage } from '@/apis/requests';
+import { DeviceType } from '@/enums/device-type';
+import { useQueryControlStore } from '@/stores/query-control';
+import { useStationStore } from '@/stores/station';
+import { useQuery } from '@tanstack/vue-query';
+import { storeToRefs } from 'pinia';
+import { computed } from 'vue';
+import type { StationDevices } from './domains/station-devices';
+
+const createEmptyStationDevices = (): StationDevices => {
+  return {
+    [DeviceType.Camera]: [],
+    [DeviceType.Decoder]: [],
+    [DeviceType.Keyboard]: [],
+    [DeviceType.MediaServer]: [],
+    [DeviceType.Nvr]: [],
+    [DeviceType.SecurityBox]: [],
+    [DeviceType.Switch]: [],
+    [DeviceType.VideoServer]: [],
+  };
+};
+
+export function useStationDevicesQuery(stationCode: Station['code']) {
+  const stationStore = useStationStore();
+  const { updatedTime, onlineStationList } = storeToRefs(stationStore);
+
+  const queryControlStore = useQueryControlStore();
+  const { pollingEnabled } = storeToRefs(queryControlStore);
+
+  const isOnline = computed(() => onlineStationList.value.some((s) => s.code === stationCode));
+
+  return useQuery({
+    queryKey: ['station-devices', stationCode, updatedTime],
+    enabled: computed(() => isOnline.value && pollingEnabled.value),
+    placeholderData: (prev) => prev ?? createEmptyStationDevices(),
+    queryFn: async (): Promise<StationDevices> => {
+      const pageQuery: PageParams<{}> = { model: {}, extra: {}, size: 5000, current: 1, sort: 'id', order: 'ascending' };
+
+      // 如果车站离线，返回空数据
+      if (!isOnline.value) {
+        return createEmptyStationDevices();
+      }
+
+      try {
+        const [cameraData, decoderData, keyboardData, mediaServerData, nvrData, securityBoxData, switchData, videoServerData] = await Promise.all([
+          postNdmCameraPage(stationCode, pageQuery),
+          postNdmDecoderPage(stationCode, pageQuery),
+          postNdmKeyboardPage(stationCode, pageQuery),
+          postNdmMediaServerPage(stationCode, pageQuery),
+          postNdmNvrPage(stationCode, pageQuery),
+          postNdmSecurityBoxPage(stationCode, pageQuery),
+          postNdmSwitchPage(stationCode, pageQuery),
+          postNdmVideoServerPage(stationCode, pageQuery),
+        ]);
+
+        return {
+          [DeviceType.Camera]: cameraData.records ?? [],
+          [DeviceType.Decoder]: decoderData.records ?? [],
+          [DeviceType.Keyboard]: keyboardData.records ?? [],
+          [DeviceType.MediaServer]: mediaServerData.records ?? [],
+          [DeviceType.Nvr]: nvrData.records ?? [],
+          [DeviceType.SecurityBox]: securityBoxData.records ?? [],
+          [DeviceType.Switch]: switchData.records ?? [],
+          [DeviceType.VideoServer]: videoServerData.records ?? [],
+        };
+      } catch (error) {
+        console.error(`获取车站 ${stationCode} 设备数据失败:`, error);
+        // 如果获取失败，返回空数据
+        return createEmptyStationDevices();
+      }
+    },
+  });
+}

src/composables/query/index.ts

@@ -0,0 +1,3 @@
+export * from './alarm';
+export * from './device';
+export * from './station';

src/composables/query/station/index.ts

@@ -0,0 +1 @@
+export * from './use-station-list-query';

src/composables/query/station/use-station-list-query.ts

@@ -19,12 +19,11 @@ export function useStationListQuery() {
     queryKey: ['station-list'],
     enabled: computed(() => pollingEnabled.value),
     queryFn: async () => {
-      const { data: ndmStationList } = await axios.get<{ code: string; name: string; deviceIdPrefix: string }[]>(`/minio/ndm/ndm-stations.json?_t=${dayjs().unix()}`);
+      const { data: ndmStationList } = await axios.get<{ code: string; name: string }[]>(`/minio/ndm/ndm-stations.json?_t=${dayjs().unix()}`);
 
       let stations = ndmStationList.map<Station>((station) => ({
         code: station.code ?? '',
         name: station.name ?? '',
-        deviceIdPrefix: station.deviceIdPrefix ?? '',
         online: false,
       }));
 
@@ -39,7 +38,7 @@ export function useStationListQuery() {
         stationList.value.length === stations.length &&
         stationList.value.every((oldStation, index) => {
           const newStation = stations[index];
-          return oldStation.code === newStation.code && oldStation.name === newStation.name && oldStation.deviceIdPrefix === newStation.deviceIdPrefix && oldStation.online === newStation.online;
+          return oldStation.code === newStation.code && oldStation.name === newStation.name && oldStation.online === newStation.online;
         });
 
       if (!isSame) {

src/layouts/app-layout.vue

@@ -6,7 +6,7 @@ function renderIcon(icon: Component): () => VNode {
 
 <script setup lang="ts">
 import ThemeSwitch from '@/components/theme-switch.vue';
-import { useStationListQuery } from '@/composables/query/use-station-list-query';
+import { useStationListQuery } from '@/composables/query';
 import { useStationStore } from '@/stores/station';
 import { useUserStore } from '@/stores/user';
 import { AlertFilled, AreaChartOutlined, FileTextFilled, HomeFilled, LogoutOutlined, VideoCameraFilled } from '@vicons/antd';

src/pages/alarm-page.vue

@@ -18,7 +18,7 @@ const { stationList } = storeToRefs(stationStore);
 const stationSelectOptions = computed(() => {
   return stationList.value.map<SelectOption>((station) => ({
     label: station.name,
-    value: station.deviceIdPrefix,
+    value: station.code,
   }));
 });
 

src/pages/dashboard-page.vue

@@ -3,50 +3,15 @@ import StationCard from '@/components/station-card.vue';
 import { NGrid, NGi } from 'naive-ui';
 import { useStationStore } from '@/stores/station';
 import { storeToRefs } from 'pinia';
-import { DeviceType } from '@/enums/device-type';
-import { useLineDevicesQuery } from '@/composables/query/use-line-devices-query';
-import { useLineAlarmsQuery } from '@/composables/query/use-line-alarms-query';
 
 const stationStore = useStationStore();
 const { stationList } = storeToRefs(stationStore);
-
-// 获取所有车站的设备数据
-const { data: lineDevices } = useLineDevicesQuery();
-// 获取所有车站的设备告警数据
-const { data: lineAlarms } = useLineAlarmsQuery();
 </script>
 
 <template>
   <NGrid :cols="8" :x-gap="6" :y-gap="6" style="padding: 8px">
     <NGi v-for="station in stationList" :key="station.name">
-      <StationCard
+      <StationCard :station="station" />
-        :station="station"
-        :station-devices="
-          lineDevices?.[station.code] ?? {
-            [DeviceType.Camera]: [],
-            [DeviceType.Decoder]: [],
-            [DeviceType.Keyboard]: [],
-            [DeviceType.MediaServer]: [],
-            [DeviceType.Nvr]: [],
-            [DeviceType.SecurityBox]: [],
-            [DeviceType.Switch]: [],
-            [DeviceType.VideoServer]: [],
-          }
-        "
-        :station-alarms="
-          lineAlarms?.[station.code] ?? {
-            [DeviceType.Camera]: [],
-            [DeviceType.Decoder]: [],
-            [DeviceType.Keyboard]: [],
-            [DeviceType.MediaServer]: [],
-            [DeviceType.Nvr]: [],
-            [DeviceType.SecurityBox]: [],
-            [DeviceType.Switch]: [],
-            [DeviceType.VideoServer]: [],
-            unclassified: [],
-          }
-        "
-      />
     </NGi>
   </NGrid>
 </template>

src/pages/device-page.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { Station } from '@/apis/domains';
 import type { NdmDeviceResultVO, NdmNvrResultVO } from '@/apis/models';
-import { useLineDevicesQuery } from '@/composables/query/use-line-devices-query';
+import { useLineDevicesQuery } from '@/composables/query';
 import { DeviceType, DeviceTypeName, type DeviceTypeCode, type DeviceTypeKey } from '@/enums/device-type';
 import { useStationStore } from '@/stores/station';
 import { ChevronBack } from '@vicons/ionicons5';

src/pages/vimp-log-page.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { NdmVimpLogResultVO } from '@/apis/models/device';
 import { ndmVimpLogDefaultExportByTemplate, postNdmVimpLogPage } from '@/apis/requests';
-import { useStationListQuery } from '@/composables/query/use-station-list-query';
+import { useStationListQuery } from '@/composables/query';
 import { JAVA_INTEGER_MAX_VALUE } from '@/constants';
 import { useStationStore } from '@/stores/station';
 import { downloadByData } from '@/utils/download';
@@ -33,7 +33,7 @@ const { stationList } = storeToRefs(stationStore);
 const stationSelectOptions = computed(() => {
   return stationList.value.map<SelectOption>((station) => ({
     label: station.name,
-    value: station.deviceIdPrefix,
+    value: station.code,
     disabled: !station.online,
   }));
 });

src/stores/query-control.ts

@@ -4,9 +4,15 @@ import { ref } from 'vue';
 export const useQueryControlStore = defineStore('ndm-query-control-store', () => {
   const pollingEnabled = ref(true);
 
+  const globalPollingEnabled = ref(true);
+
   const enablePolling = () => (pollingEnabled.value = true);
 
   const disablePolling = () => (pollingEnabled.value = false);
 
-  return { pollingEnabled, enablePolling, disablePolling };
+  const enableGlobalPolling = () => (globalPollingEnabled.value = true);
+
+  const disableGlobalPolling = () => (globalPollingEnabled.value = false);
+
+  return { pollingEnabled, enablePolling, disablePolling, globalPollingEnabled, enableGlobalPolling, disableGlobalPolling };
 });