refactor:
- extend NdmDeviceAlarmLogVO - only query alarm counts - separate request and store update in useQuery - refactor station card and alarm modal, data fetching is now inside modal - optimize device tree - optimize query station list - make export size follow page size - fix query sequence and make them follow stations -> devices -> alarms
This commit is contained in:
yangsy
@@ -1,10 +1,7 @@
|
||||
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, useQueryClient } from '@tanstack/vue-query';
|
||||
import { useMutation, useQuery } from '@tanstack/vue-query';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { computed } from 'vue';
|
||||
import type { StationDevices } from './domains';
|
||||
@@ -12,10 +9,7 @@ import { useLineDevicesStore } from '@/stores/line-devices';
|
||||
import { LINE_DEVICES_QUERY_KEY } from '@/constants';
|
||||
import { ndmClient } from '@/apis/client';
|
||||
import { sleep } from '@/utils/sleep';
|
||||
|
||||
export interface LineDevices {
|
||||
[stationCode: Station['code']]: StationDevices;
|
||||
}
|
||||
import type { Station } from '@/apis/domains';
|
||||
|
||||
const createEmptyStationDevices = (): StationDevices => {
|
||||
return {
|
||||
@@ -30,138 +24,64 @@ const createEmptyStationDevices = (): StationDevices => {
|
||||
};
|
||||
};
|
||||
|
||||
const getNdmDevicesAll = async (stationCode: string, signal: AbortSignal) => {
|
||||
const getNdmDevicesAll = async (stationCode: string, signal?: AbortSignal) => {
|
||||
const resp = await ndmClient.get<StationDevices>(`/${stationCode}/api/ndm/ndmDevices/all`, { retRaw: true, signal });
|
||||
const [err, stationDevices] = resp;
|
||||
if (err || !stationDevices) {
|
||||
const [err, data] = resp;
|
||||
if (err || !data) {
|
||||
throw err;
|
||||
}
|
||||
return stationDevices;
|
||||
return data;
|
||||
};
|
||||
|
||||
export function useLineDevicesQuery() {
|
||||
const stationStore = useStationStore();
|
||||
const { stationList, onlineStationList } = storeToRefs(stationStore);
|
||||
const { stationList } = storeToRefs(stationStore);
|
||||
const queryControlStore = useQueryControlStore();
|
||||
const { pollingEnabled } = storeToRefs(queryControlStore);
|
||||
const lineDevicesStore = useLineDevicesStore();
|
||||
const { lineDevices } = storeToRefs(lineDevicesStore);
|
||||
const queryClient = useQueryClient();
|
||||
const { deviceQueryStamp } = storeToRefs(queryControlStore);
|
||||
const { mutateAsync: getStationDevices } = useStationDevicesMutation();
|
||||
|
||||
return useQuery({
|
||||
queryKey: [LINE_DEVICES_QUERY_KEY],
|
||||
enabled: computed(() => onlineStationList.value.length > 0 && pollingEnabled.value),
|
||||
queryKey: [LINE_DEVICES_QUERY_KEY, deviceQueryStamp],
|
||||
enabled: computed(() => deviceQueryStamp.value > 0),
|
||||
staleTime: Infinity,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
queryFn: async ({ signal }): Promise<LineDevices> => {
|
||||
queryFn: async ({ signal }) => {
|
||||
console.time('useLineDevicesQuery');
|
||||
|
||||
// const pageQuery: PageParams<{}> = { model: {}, extra: {}, size: 5000, current: 1, sort: 'id', order: 'ascending' };
|
||||
|
||||
// const lineDevices: LineDevices = {};
|
||||
|
||||
// 如果没有车站列表，返回空数据
|
||||
if (!stationList?.value) {
|
||||
lineDevices.value = {};
|
||||
return lineDevices.value;
|
||||
}
|
||||
|
||||
// 遍历所有车站
|
||||
for (const station of stationList.value) {
|
||||
// 如果车站离线，设置空数据
|
||||
if (!station.online) {
|
||||
lineDevices.value[station.code] = createEmptyStationDevices();
|
||||
continue;
|
||||
}
|
||||
|
||||
if (!lineDevices.value[station.code]) {
|
||||
lineDevices.value[station.code] = createEmptyStationDevices();
|
||||
}
|
||||
|
||||
// const stationDevices = createEmptyStationDevices();
|
||||
|
||||
// await Promise.allSettled([
|
||||
// postNdmCameraPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.Camera] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 摄像机数据失败:`, error);
|
||||
// stationDevices[DeviceType.Camera] = [];
|
||||
// }),
|
||||
// postNdmDecoderPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.Decoder] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 解码器数据失败:`, error);
|
||||
// stationDevices[DeviceType.Decoder] = [];
|
||||
// }),
|
||||
// postNdmKeyboardPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.Keyboard] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 网络键盘数据失败:`, error);
|
||||
// stationDevices[DeviceType.Keyboard] = [];
|
||||
// }),
|
||||
// postNdmMediaServerPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.MediaServer] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 媒体服务器数据失败:`, error);
|
||||
// stationDevices[DeviceType.MediaServer] = [];
|
||||
// }),
|
||||
// postNdmNvrPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.Nvr] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 录像机数据失败:`, error);
|
||||
// stationDevices[DeviceType.Nvr] = [];
|
||||
// }),
|
||||
// postNdmSecurityBoxPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.SecurityBox] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 安防箱数据失败:`, error);
|
||||
// stationDevices[DeviceType.SecurityBox] = [];
|
||||
// }),
|
||||
// postNdmSwitchPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.Switch] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 交换机数据失败:`, error);
|
||||
// stationDevices[DeviceType.Switch] = [];
|
||||
// }),
|
||||
// postNdmVideoServerPage(station.code, pageQuery, signal)
|
||||
// .then(({ records }) => {
|
||||
// stationDevices[DeviceType.VideoServer] = records;
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(`获取车站 ${station.name} 视频服务器数据失败:`, error);
|
||||
// stationDevices[DeviceType.VideoServer] = [];
|
||||
// }),
|
||||
// ]);
|
||||
|
||||
const stationDevices = await getNdmDevicesAll(station.code, signal);
|
||||
|
||||
lineDevices.value[station.code] = stationDevices;
|
||||
|
||||
await sleep();
|
||||
await getStationDevices({ station, signal });
|
||||
}
|
||||
|
||||
console.timeEnd('useLineDevicesQuery');
|
||||
|
||||
queryClient.invalidateQueries({ queryKey: ['line-alarms'] });
|
||||
|
||||
return lineDevices.value;
|
||||
queryControlStore.updateAlarmQueryStamp();
|
||||
return null;
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
interface StationDevicesMutationParams {
|
||||
station: Station;
|
||||
signal?: AbortSignal;
|
||||
}
|
||||
|
||||
function useStationDevicesMutation() {
|
||||
const lineDevicesStore = useLineDevicesStore();
|
||||
const { lineDevices } = storeToRefs(lineDevicesStore);
|
||||
|
||||
return useMutation<StationDevices, Error, StationDevicesMutationParams>({
|
||||
mutationFn: async ({ station, signal }) => {
|
||||
if (!station.online) {
|
||||
return createEmptyStationDevices();
|
||||
}
|
||||
return await getNdmDevicesAll(station.code, signal);
|
||||
},
|
||||
onSuccess: async (stationDevices, { station }) => {
|
||||
lineDevices.value[station.code] = stationDevices;
|
||||
await sleep();
|
||||
},
|
||||
onError: (error, { station }) => {
|
||||
console.error(`获取车站 ${station.name} 设备数据失败:`, error);
|
||||
lineDevices.value[station.code] = createEmptyStationDevices();
|
||||
},
|
||||
placeholderData: (prev) => prev,
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user