skycurtain/ndm-web-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
yangsy
2025-11-14 16:36:07 +08:00
parent 1ed091f54d
commit 686fdc8724
13 changed files with 69 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/pages/dashboard-page.vue
View File

@@ -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"