refactor&perf
- proxy config - query export - optimize station card request
This commit is contained in:
@@ -1,6 +1,5 @@
|
||||
export interface Station {
|
||||
code: string;
|
||||
name: string;
|
||||
deviceIdPrefix: string; // 当查询设备告警记录时,需要通过deviceId的前4位来判断车站
|
||||
online: boolean;
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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 () => {
|
||||
|
||||
@@ -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,
|
||||
total: stationDevices.value[deviceType].length,
|
||||
offlineCount: stationDevices.value?.[deviceType].filter((device) => device.deviceStatus === '20').length ?? 0,
|
||||
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,
|
||||
|
||||
@@ -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 type { StationDevices } from '@/composables/query/use-line-devices-query';
|
||||
import { useStationDevicesQuery } from '@/composables/query/device/use-station-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;
|
||||
});
|
||||
|
||||
2
src/composables/query/alarm/index.ts
Normal file
2
src/composables/query/alarm/index.ts
Normal file
@@ -0,0 +1,2 @@
|
||||
export * from './use-line-alarms-query';
|
||||
export * from './use-today-alarms-query';
|
||||
87
src/composables/query/alarm/use-station-alarms-query.ts
Normal file
87
src/composables/query/alarm/use-station-alarms-query.ts
Normal file
@@ -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();
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
15
src/composables/query/alarm/use-today-alarms-query.ts
Normal file
15
src/composables/query/alarm/use-today-alarms-query.ts
Normal file
@@ -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 () => {},
|
||||
});
|
||||
}
|
||||
1
src/composables/query/device/domains/index.ts
Normal file
1
src/composables/query/device/domains/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export * from './station-devices';
|
||||
22
src/composables/query/device/domains/station-devices.ts
Normal file
22
src/composables/query/device/domains/station-devices.ts
Normal file
@@ -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[];
|
||||
}
|
||||
4
src/composables/query/device/index.ts
Normal file
4
src/composables/query/device/index.ts
Normal file
@@ -0,0 +1,4 @@
|
||||
export * from './domains';
|
||||
|
||||
export * from './use-line-devices-query';
|
||||
export * from './use-station-devices-query';
|
||||
@@ -1,15 +1,5 @@
|
||||
import type { Station } from '@/apis/domains';
|
||||
import type {
|
||||
NdmCameraResultVO,
|
||||
NdmDecoderResultVO,
|
||||
NdmKeyboardResultVO,
|
||||
NdmMediaServerResultVO,
|
||||
NdmNvrResultVO,
|
||||
NdmSecurityBoxResultVO,
|
||||
NdmSwitchResultVO,
|
||||
NdmVideoServerResultVO,
|
||||
PageParams,
|
||||
} from '@/apis/models';
|
||||
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';
|
||||
@@ -17,23 +7,25 @@ import { useStationStore } from '@/stores/station';
|
||||
import { useQuery } from '@tanstack/vue-query';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { computed } from 'vue';
|
||||
|
||||
// 定义设备数据类型
|
||||
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[];
|
||||
}
|
||||
import type { StationDevices } from './domains';
|
||||
|
||||
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] = {
|
||||
[DeviceType.Camera]: [],
|
||||
[DeviceType.Decoder]: [],
|
||||
[DeviceType.Keyboard]: [],
|
||||
[DeviceType.MediaServer]: [],
|
||||
[DeviceType.Nvr]: [],
|
||||
[DeviceType.SecurityBox]: [],
|
||||
[DeviceType.Switch]: [],
|
||||
[DeviceType.VideoServer]: [],
|
||||
};
|
||||
lineDevices[station.code] = createEmptyStationDevices();
|
||||
continue;
|
||||
}
|
||||
|
||||
@@ -100,16 +83,7 @@ export function useLineDevicesQuery() {
|
||||
} catch (error) {
|
||||
console.error(`获取车站 ${station.name} 设备数据失败:`, error);
|
||||
// 如果获取失败,设置空数组
|
||||
lineDevices[station.code] = {
|
||||
[DeviceType.Camera]: [],
|
||||
[DeviceType.Decoder]: [],
|
||||
[DeviceType.Keyboard]: [],
|
||||
[DeviceType.MediaServer]: [],
|
||||
[DeviceType.Nvr]: [],
|
||||
[DeviceType.SecurityBox]: [],
|
||||
[DeviceType.Switch]: [],
|
||||
[DeviceType.VideoServer]: [],
|
||||
};
|
||||
lineDevices[station.code] = createEmptyStationDevices();
|
||||
}
|
||||
}
|
||||
|
||||
75
src/composables/query/device/use-station-devices-query.ts
Normal file
75
src/composables/query/device/use-station-devices-query.ts
Normal file
@@ -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();
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
3
src/composables/query/index.ts
Normal file
3
src/composables/query/index.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
export * from './alarm';
|
||||
export * from './device';
|
||||
export * from './station';
|
||||
1
src/composables/query/station/index.ts
Normal file
1
src/composables/query/station/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export * from './use-station-list-query';
|
||||
@@ -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) {
|
||||
@@ -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';
|
||||
|
||||
@@ -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,
|
||||
}));
|
||||
});
|
||||
|
||||
|
||||
@@ -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
|
||||
: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: [],
|
||||
}
|
||||
"
|
||||
/>
|
||||
<StationCard :station="station" />
|
||||
</NGi>
|
||||
</NGrid>
|
||||
</template>
|
||||
|
||||
@@ -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';
|
||||
|
||||
@@ -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,
|
||||
}));
|
||||
});
|
||||
|
||||
@@ -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 };
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user