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

refactor:

Browse Source 
- 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
2025-09-02 14:21:13 +08:00
parent 54a150ec07
commit 7afb79f826
21 changed files with 475 additions and 439 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/apis/models/device/index.ts
View File

@@ -26,3 +26,4 @@ export * from './video/ndm-video-server';
export type NdmDeviceVO = NdmSecurityBoxVO | NdmSwitchVO | NdmNvrVO | NdmCameraVO | NdmDecoderVO | NdmKeyboardVO | NdmMediaServerVO | NdmVideoServerVO;
export type NdmDeviceResultVO = Partial<NdmDeviceVO>;
export type NdmServerVO = NdmMediaServerVO | NdmVideoServerVO;
export type NdmServerResultVO = Partial<NdmServerVO>;

1
src/apis/models/device/log/ndm-device-alarm-log.ts
View File

@@ -15,6 +15,7 @@ export interface NdmDeviceAlarmLogVO extends BaseModel {
impactService: string;
alarmType: string;
deviceType: string;
stationCode: string;
}
export type NdmDeviceAlarmLogResultVO = Partial<NdmDeviceAlarmLogVO>;

17
src/apis/requests/station/ndm-verify.ts
View File

@@ -8,3 +8,20 @@ export const ndmVerify = async (stationCode: string, signal?: AbortSignal) => {
throw err;
}
};
export interface BatchVerify {
name: string;
ipAddress: string;
stationCode: string;
verifyUrl: string;
onlineState: boolean;
}
export const batchVerify = async (signal?: AbortSignal) => {
const resp = await ndmClient.post<BatchVerify[]>('/api/ndm/ndmKeepAlive/batchVerify', {}, { retRaw: true, timeout: 5000, signal });
const [err, list] = resp;
if (err || !list) {
throw err;
}
return list;
};

170
src/components/dashboard-page/device-alarm-detail-modal.vue
View File

@@ -1,24 +1,23 @@
<script setup lang="ts">
import type { Station } from '@/apis/domains';
import type { NdmDeviceAlarmLogResultVO } from '@/apis/models';
import { ndmDeviceAlarmLogDefaultExportByTemplate } from '@/apis/requests';
import type { StationAlarms } from '@/composables/query';
import { JAVA_INTEGER_MAX_VALUE } from '@/constants';
import { DeviceType, DeviceTypeName, getDeviceTypeVal } from '@/enums/device-type';
import type { NdmDeviceAlarmLogPageQuery, NdmDeviceAlarmLogResultVO, NdmDeviceAlarmLogVO, PageQueryExtra } from '@/apis/models';
import { ndmDeviceAlarmLogDefaultExportByTemplate, postNdmDeviceAlarmLogPage } from '@/apis/requests';
import type { StationAlarmCounts } from '@/composables/query';
import { DeviceType, DeviceTypeCode, DeviceTypeName, getDeviceTypeVal, type DeviceTypeVal } from '@/enums/device-type';
import { useQueryControlStore } from '@/stores/query-control';
import { downloadByData } from '@/utils/download';
import { useMutation } from '@tanstack/vue-query';
import dayjs from 'dayjs';
import { NButton, NCol, NDataTable, NModal, NRow, NSpace, NStatistic, type DataTableColumns, type DataTableRowData, type PaginationProps } from 'naive-ui';
import { computed, h, reactive, toRefs, watch } from 'vue';
import { NButton, NCol, NDataTable, NModal, NRow, NSpace, NStatistic, type DataTableColumns, type DataTableProps, type DataTableRowData, type PaginationProps } from 'naive-ui';
import { computed, h, reactive, ref, toRefs, watch } from 'vue';
interface Props {
station?: Station;
stationAlarms?: StationAlarms;
stationAlarmCounts?: StationAlarmCounts;
}
const props = defineProps<Props>();
const { station, stationAlarms } = toRefs(props);
const { station, stationAlarmCounts } = toRefs(props);
const show = defineModel<boolean>('show', { required: true, default: false });
watch(show, (newValue) => {
@@ -32,17 +31,13 @@ watch(show, (newValue) => {
}
});
const alarmCount = computed(() => {
return Object.values(DeviceType).reduce((count, deviceType) => {
return count + (stationAlarms.value?.[deviceType].length ?? 0);
}, 0);
});
const alarmCount = computed(() => stationAlarmCounts.value?.unclassified ?? 0);
const classifiedCounts = computed(() => {
const classifiedAlarmCounts = computed(() => {
return Object.values(DeviceType).map<{ label: string; count: number }>((deviceType) => {
return {
label: DeviceTypeName[deviceType],
count: stationAlarms.value?.[deviceType].length ?? 0,
count: stationAlarmCounts.value?.[deviceType] ?? 0,
};
});
});
@@ -62,11 +57,9 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO> = [
render: (rowData) => {
return DeviceTypeName[getDeviceTypeVal(rowData.deviceType)];
},
filter: true,
filterMultiple: true,
filterOptions: Object.values(DeviceType).map((deviceType) => ({ label: DeviceTypeName[deviceType], value: deviceType })),
filter: (filterOptionValue, row) => {
return getDeviceTypeVal(row.deviceType) === filterOptionValue;
},
},
{ title: '设备名称', key: 'deviceName' },
{ title: '告警类型', key: 'alarmType', align: 'center' },
@@ -82,14 +75,12 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO> = [
render: (rowData) => {
return rowData.alarmCategory === '2' ? '是' : '否';
},
filter: true,
filterMultiple: false,
filterOptions: [
{ label: '是', value: '2' },
{ label: '否', value: '1' },
],
filter: (filterOptionValue, row) => {
return row.alarmCategory === filterOptionValue;
},
},
{ title: '恢复时间', key: 'updatedTime' },
{
@@ -99,18 +90,27 @@ const tableColumns: DataTableColumns<NdmDeviceAlarmLogResultVO> = [
render: (rowData) => {
return rowData.alarmConfirm === '1' ? '已确认' : '未确认';
},
filter: true,
filterMultiple: false,
filterOptions: [
{ label: '已确认', value: '1' },
{ label: '未确认', value: '2' },
],
filter: (filterOptionValue, row) => {
return row.alarmConfirm === filterOptionValue;
},
},
// { title: '设备ID', key: 'deviceId' },
];
const filterFields = reactive<NdmDeviceAlarmLogPageQuery & PageQueryExtra<NdmDeviceAlarmLogVO>>({
alarmCategory: '',
alarmConfirm: '',
deviceType_in: [] as string[],
});
const resetFilterFields = () => {
filterFields.alarmCategory = '';
filterFields.alarmConfirm = '';
filterFields.deviceType_in = [];
};
const tablePagination = reactive<PaginationProps>({
size: 'small',
showSizePicker: true,
@@ -124,52 +124,126 @@ const tablePagination = reactive<PaginationProps>({
},
onUpdatePage: (page: number) => {
tablePagination.page = page;
getStaionAlarmList();
},
onUpdatePageSize: (pageSize: number) => {
tablePagination.pageSize = pageSize;
tablePagination.page = 1;
getStaionAlarmList();
},
});
const tableData = computed<DataTableRowData[]>(() => stationAlarms.value?.unclassified ?? []);
const tableData = ref<DataTableRowData[]>([]);
const { mutate: downloadTableData, isPending: isDownloading } = useMutation({
const exportTableData = () => {
downloadTableData();
};
const onAfterModalEnter = () => {
getStaionAlarmList();
};
const onAfterModalLeave = () => {
resetFilterFields();
tablePagination.page = 1;
tablePagination.pageSize = 10;
tablePagination.pageCount = 1;
tablePagination.itemCount = 0;
tableData.value = [];
};
const onUpdateFilters: DataTableProps['onUpdateFilters'] = (filterState) => {
filterFields.alarmCategory = filterState['alarmCategory'] as string;
filterFields.alarmConfirm = filterState['alarmConfirm'] as string;
const deviceTypeVals = filterState['deviceType'] as DeviceTypeVal[];
filterFields.deviceType_in = deviceTypeVals.flatMap((typeVal) => DeviceTypeCode[typeVal]);
getStaionAlarmList();
};
const { mutate: getStaionAlarmList, isPending: isTableLoading } = useMutation({
mutationFn: async () => {
const data = await ndmDeviceAlarmLogDefaultExportByTemplate(station.value?.code ?? '', {
model: {},
extra: {
createdTime_precisest: dayjs().startOf('date').format('YYYY-MM-DD HH:mm:ss'),
createdTime_preciseed: dayjs().endOf('date').format('YYYY-MM-DD HH:mm:ss'),
const now = dayjs();
const res = await postNdmDeviceAlarmLogPage(station.value?.code ?? '', {
model: {
stationCode: station.value?.code,
alarmCategory: filterFields.alarmCategory,
alarmConfirm: filterFields.alarmConfirm,
},
current: 1,
size: JAVA_INTEGER_MAX_VALUE,
extra: {
deviceType_in: filterFields.deviceType_in,
createdTime_precisest: now.startOf('date').format('YYYY-MM-DD HH:mm:ss'),
createdTime_preciseed: now.endOf('date').format('YYYY-MM-DD HH:mm:ss'),
},
current: tablePagination.page ?? 1,
size: tablePagination.pageSize ?? 10,
order: 'descending',
sort: 'id',
});
return data;
return res;
},
onSuccess: (data) => {
downloadByData(data, `${station.value?.name}-设备告警记录.xlsx`);
onSuccess: (res) => {
const { records, pages, size, total } = res;
tablePagination.pageSize = parseInt(size);
tablePagination.pageCount = parseInt(pages);
tablePagination.itemCount = parseInt(total);
tableData.value = records;
},
onError: (error) => {
window.$message.error(error.message);
},
});
const exportTableData = () => downloadTableData();
const onModalClose = () => {};
const { mutate: downloadTableData, isPending: isDownloading } = useMutation({
mutationFn: async () => {
const now = dayjs();
const data = await ndmDeviceAlarmLogDefaultExportByTemplate(station.value?.code ?? '', {
model: {
stationCode: station.value?.code,
alarmCategory: filterFields.alarmCategory,
alarmConfirm: filterFields.alarmConfirm,
},
extra: {
deviceType_in: filterFields.deviceType_in,
createdTime_precisest: now.startOf('date').format('YYYY-MM-DD HH:mm:ss'),
createdTime_preciseed: now.endOf('date').format('YYYY-MM-DD HH:mm:ss'),
},
current: tablePagination.page ?? 1,
size: tablePagination.pageSize ?? 10,
order: 'descending',
sort: 'id',
});
return data;
},
onSuccess: (data) => {
const now = dayjs();
const fmt = now.format('YYYY-MM-DD_HH:mm:ss');
console.log(fmt);
downloadByData(data, `${station.value?.name}-设备告警记录-${fmt}.xlsx`);
},
onError: (error) => {
window.$message.error(error.message);
},
});
</script>
<template>
<NModal v-model:show="show" preset="card" style="width: 100vw; height: 100vh" :title="`${station?.name} - 设备告警详情`" :close-on-esc="false" :mask-closable="false" @close="onModalClose">
<NModal
v-model:show="show"
preset="card"
style="width: 100vw; height: 100vh"
:title="`${station?.name} - 设备告警详情`"
:close-on-esc="false"
:mask-closable="false"
@after-enter="onAfterModalEnter"
@after-leave="onAfterModalLeave"
>
<div v-if="alarmCount === 0" style="text-align: center; padding: 20px; color: #6c757d">
<span>当前没有设备告警</span>
</div>
<div v-else style="height: 100%; display: flex; flex-direction: column">
<div style="flex: 0 0 auto; margin-bottom: 16px">
<NRow>
<NCol :span="3" v-for="item in classifiedCounts" :key="item.label">
<NCol :span="3" v-for="item in classifiedAlarmCounts" :key="item.label">
<NStatistic :label="item.label + '告警'" :value="item.count" />
</NCol>
</NRow>
@@ -181,7 +255,17 @@ const onModalClose = () => {};
</NSpace>
</div>
<div style="flex: 1 1 auto; min-height: 0">
<NDataTable :columns="tableColumns" :data="tableData" :pagination="tablePagination" :single-line="false" flex-height style="height: 100%" />
<NDataTable
:loading="isTableLoading"
:columns="tableColumns"
:data="tableData"
:pagination="tablePagination"
:single-line="false"
remote
flex-height
style="height: 100%"
@update:filters="onUpdateFilters"
/>
</div>
</div>
</NModal>

16
src/components/dashboard-page/station-card.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import type { Station } from '@/apis/domains';
import { DeviceType } from '@/enums/device-type';
import { type StationAlarms, type StationDevices } from '@/composables/query';
import { type StationAlarmCounts, type StationDevices } from '@/composables/query';
import { ControlOutlined } from '@vicons/antd';
import { Video as VideoIcon } from '@vicons/carbon';
import axios from 'axios';
@@ -11,7 +11,7 @@ import { toRefs, computed } from 'vue';
interface Props {
station: Station;
stationDevices?: StationDevices;
stationAlarms?: StationAlarms;
stationAlarmCounts?: StationAlarmCounts;
}
const props = defineProps<Props>();
@@ -22,7 +22,7 @@ const emit = defineEmits<{
'open-device-params-config-modal': [station: Station];
}>();
const { station, stationDevices, stationAlarms } = toRefs(props);
const { station, stationDevices, stationAlarmCounts } = toRefs(props);
// 计算总离线设备数量
const offlineDeviceCount = computed(() => {
@@ -40,12 +40,8 @@ const deviceCount = computed(() => {
});
return count;
});
const devicAlarmCount = computed(() => {
let count = 0;
Object.values(DeviceType).forEach((deviceType) => {
count += stationAlarms.value?.[deviceType].length ?? 0;
});
return count;
const alarmCount = computed(() => {
return stationAlarmCounts.value?.unclassified ?? 0;
});
// 打开对话框
@@ -148,7 +144,7 @@ const theme = useThemeVars();
<span class="font-xx-small" :class="[station.online ? 'clickable' : '']" @click="openDeviceAlarmTreeModal">告警记录</span>
</template>
<template #default>
<span class="font-small">{{ devicAlarmCount }}</span>
<span class="font-small">{{ alarmCount }}</span>
</template>
<template #suffix>
<span class="font-xx-small">条</span>

67
src/components/device-page/device-tree.vue
View File

@@ -11,7 +11,7 @@ const deviceTabPanes = Object.keys(DeviceType).map((key) => {
<script setup lang="ts">
import type { Station } from '@/apis/domains';
import type { NdmDeviceResultVO, NdmNvrResultVO } from '@/apis/models';
import type { LineDevices } from '@/composables/query/device/use-line-devices-query';
import type { LineDevices } from '@/composables/query';
import { DeviceType, DeviceTypeName, getDeviceTypeVal, type DeviceTypeKey, type DeviceTypeVal } from '@/enums/device-type';
import { destr } from 'destr';
import { NButton, NFlex, NInput, NRadio, NRadioGroup, NTab, NTabs, NTag, NTree, type TagProps, type TreeInst, type TreeOption, type TreeOverrideNodeClickBehavior, type TreeProps } from 'naive-ui';
@@ -67,44 +67,45 @@ const lineDeviceTreeData = computed<Record<string, TreeOption[]>>(() => {
const onlineDevices = devices?.filter((device) => device.deviceStatus === '10');
const offlineDevices = devices?.filter((device) => device.deviceStatus === '20');
// 对于录像机，需要根据clusterList字段以分号分隔设备IP，进一步形成子树结构
const isCluster = (maybeNvrCluster: NdmNvrResultVO) => !!maybeNvrCluster.clusterList?.trim() && maybeNvrCluster.clusterList !== maybeNvrCluster.ipAddress;
if (paneName === DeviceType.Nvr) {
const nvrs = devices as NdmNvrResultVO[] | undefined;
const nvrs = devices as NdmNvrResultVO[];
const nvrClusters: NdmNvrResultVO[] = [];
const nvrSingletons: NdmNvrResultVO[] = [];
for (const device of nvrs) {
if (isCluster(device)) {
nvrClusters.push(device);
} else {
nvrSingletons.push(device);
}
}
return {
label: stationName,
key: stationCode,
prefix: () => renderStationNodePrefix(station),
suffix: () => `(${onlineDevices?.length ?? 0}/${offlineDevices?.length ?? 0}/${devices?.length ?? 0})`,
children: nvrs
?.filter((device) => {
const nvr = device as NdmNvrResultVO;
return !!nvr.clusterList?.trim() && nvr.clusterList !== nvr.ipAddress;
})
.map<TreeOption>((nvrCluster) => {
return {
label: `${nvrCluster.name}`,
key: nvrCluster.id,
prefix: () => renderDeviceNodePrefix(nvrCluster, stationCode),
suffix: () => `${nvrCluster.ipAddress}`,
children: nvrs
.filter((nvr) => {
return nvrCluster.clusterList?.includes(nvr.ipAddress ?? '');
})
.map<TreeOption>((nvr) => {
return {
label: `${nvr.name}`,
key: nvr.id,
prefix: () => renderDeviceNodePrefix(nvr, stationCode),
suffix: () => `${nvr.ipAddress}`,
// 当选择设备时，能获取到设备的所有信息，以及设备所属的车站
device: nvr,
stationCode,
};
}),
// 当选择设备时，能获取到设备的所有信息，以及设备所属的车站
device: nvrCluster,
stationCode,
};
}),
children: nvrClusters.map<TreeOption>((nvrCluster) => {
return {
label: `${nvrCluster.name}`,
key: nvrCluster.id,
prefix: () => renderDeviceNodePrefix(nvrCluster, stationCode),
suffix: () => `${nvrCluster.ipAddress}`,
children: nvrSingletons.map<TreeOption>((nvr) => {
return {
label: `${nvr.name}`,
key: nvr.id,
prefix: () => renderDeviceNodePrefix(nvr, stationCode),
suffix: () => `${nvr.ipAddress}`,
// 当选择设备时，能获取到设备的所有信息，以及设备所属的车站
device: nvr,
stationCode,
};
}),
// 当选择设备时，能获取到设备的所有信息，以及设备所属的车站
device: nvrCluster,
stationCode,
};
}),
};
}
return {

35
src/composables/query/alarm/domains/index.ts
View File

@@ -1 +1,34 @@
export * from './station-alarms';
import type { NdmDeviceAlarmLogResultVO } from '@/apis/models';
import type { DeviceType } from '@/enums/device-type';
export interface StationAlarms {
[DeviceType.Camera]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Decoder]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Keyboard]: NdmDeviceAlarmLogResultVO[];
[DeviceType.MediaServer]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Nvr]: NdmDeviceAlarmLogResultVO[];
[DeviceType.SecurityBox]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Switch]: NdmDeviceAlarmLogResultVO[];
[DeviceType.VideoServer]: NdmDeviceAlarmLogResultVO[];
unclassified: NdmDeviceAlarmLogResultVO[];
}
export interface LineAlarms {
[stationCode: string]: StationAlarms;
}
export interface StationAlarmCounts {
[DeviceType.Camera]: number;
[DeviceType.Decoder]: number;
[DeviceType.Keyboard]: number;
[DeviceType.MediaServer]: number;
[DeviceType.Nvr]: number;
[DeviceType.SecurityBox]: number;
[DeviceType.Switch]: number;
[DeviceType.VideoServer]: number;
unclassified: number;
}
export interface LineAlarmCounts {
[stationCode: string]: StationAlarmCounts;
}

14
src/composables/query/alarm/domains/station-alarms.ts
View File

@@ -1,14 +0,0 @@
import type { NdmDeviceAlarmLogResultVO } from '@/apis/models';
import type { DeviceType } from '@/enums/device-type';
export interface StationAlarms {
[DeviceType.Camera]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Decoder]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Keyboard]: NdmDeviceAlarmLogResultVO[];
[DeviceType.MediaServer]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Nvr]: NdmDeviceAlarmLogResultVO[];
[DeviceType.SecurityBox]: NdmDeviceAlarmLogResultVO[];
[DeviceType.Switch]: NdmDeviceAlarmLogResultVO[];
[DeviceType.VideoServer]: NdmDeviceAlarmLogResultVO[];
unclassified: NdmDeviceAlarmLogResultVO[];
}

2
src/composables/query/alarm/index.ts
View File

@@ -1,3 +1,3 @@
export * from './domains';
export * from './use-line-alarms-query';
export * from './use-line-alarm-counts-query';

104
src/composables/query/alarm/use-line-alarm-counts-query.ts Normal file
View File

@@ -0,0 +1,104 @@
import { LINE_ALARM_COUNTS_QUERY_KEY } from '@/constants';
import { useLineAlarmCountsStore } from '@/stores/line-alarm-counts';
import { useQueryControlStore } from '@/stores/query-control';
import { useStationStore } from '@/stores/station';
import { useMutation, useQuery } from '@tanstack/vue-query';
import { storeToRefs } from 'pinia';
import { computed } from 'vue';
import dayjs from 'dayjs';
import { postNdmDeviceAlarmLogPage } from '@/apis/requests';
import { sleep } from '@/utils/sleep';
import type { Station } from '@/apis/domains';
import { DeviceType, getDeviceTypeVal } from '@/enums/device-type';
import type { StationAlarmCounts } from './domains';
const createEmptyStationAlarmCounts = () => {
return {
[DeviceType.Camera]: 0,
[DeviceType.Decoder]: 0,
[DeviceType.Keyboard]: 0,
[DeviceType.MediaServer]: 0,
[DeviceType.Nvr]: 0,
[DeviceType.SecurityBox]: 0,
[DeviceType.Switch]: 0,
[DeviceType.VideoServer]: 0,
unclassified: 0,
};
};
export function useLineAlarmCountsQuery() {
const stationStore = useStationStore();
const { stationList } = storeToRefs(stationStore);
const queryControlStore = useQueryControlStore();
const { alarmQueryStamp } = storeToRefs(queryControlStore);
const { mutateAsync: getStationAlarmCounts } = useStationAlarmCountsMutation();
return useQuery({
queryKey: [LINE_ALARM_COUNTS_QUERY_KEY, alarmQueryStamp],
enabled: computed(() => alarmQueryStamp.value > 0),
staleTime: Infinity,
refetchOnMount: false,
refetchOnReconnect: false,
refetchOnWindowFocus: false,
queryFn: async ({ signal }) => {
console.time('useLineALarmCountsQuery');
for (const station of stationList.value) {
await getStationAlarmCounts({ station, signal });
}
console.timeEnd('useLineALarmCountsQuery');
return null;
},
});
}
interface StationAlarmCountsMutationParams {
station: Station;
signal?: AbortSignal;
}
function useStationAlarmCountsMutation() {
const lineAlarmCountsStore = useLineAlarmCountsStore();
const { lineAlarmCounts } = storeToRefs(lineAlarmCountsStore);
return useMutation<StationAlarmCounts, Error, StationAlarmCountsMutationParams>({
mutationFn: async ({ station, signal }) => {
const stationAlarmCounts = createEmptyStationAlarmCounts();
if (!station.online) {
return stationAlarmCounts;
}
const now = dayjs();
const todayStart = now.startOf('date').valueOf();
const todayEnd = now.endOf('date').valueOf();
const { records: alarmList, total } = await postNdmDeviceAlarmLogPage(
station.code,
{
model: {
stationCode: station.code,
},
extra: {
alarmDate_ge: todayStart,
alarmDate_le: todayEnd,
},
size: 50000,
current: 1,
sort: 'id',
order: 'descending',
},
signal,
);
for (const alarm of alarmList) {
stationAlarmCounts[getDeviceTypeVal(alarm.deviceType)]++;
}
stationAlarmCounts.unclassified = parseInt(total);
return stationAlarmCounts;
},
onSuccess: async (stationAlarmCounts, { station }) => {
lineAlarmCounts.value[station.code] = stationAlarmCounts;
await sleep();
},
onError: (error, { station }) => {
console.error(`获取车站 ${station.name} 设备告警数据失败:`, error);
lineAlarmCounts.value[station.code] = createEmptyStationAlarmCounts();
},
});
}

117
src/composables/query/alarm/use-line-alarms-query.ts
View File

@@ -1,117 +0,0 @@
import type { Station } from '@/apis/domains';
import { postNdmDeviceAlarmLogPage } from '@/apis/requests';
import { DeviceType, getDeviceTypeVal } 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 './domains';
import { useLineAlarmsStore } from '@/stores/line-alarms';
import { CanceledError } from 'axios';
import { LINE_ALARMS_QUERY_KEY } from '@/constants';
import { sleep } from '@/utils/sleep';
export interface LineAlarms {
[stationCode: Station['code']]: StationAlarms;
}
const createEmptyStationAlarms = (): StationAlarms => {
return {
[DeviceType.Camera]: [],
[DeviceType.Decoder]: [],
[DeviceType.Keyboard]: [],
[DeviceType.MediaServer]: [],
[DeviceType.Nvr]: [],
[DeviceType.SecurityBox]: [],
[DeviceType.Switch]: [],
[DeviceType.VideoServer]: [],
unclassified: [],
};
};
export function useLineAlarmsQuery() {
const stationStore = useStationStore();
const { stationList, onlineStationList } = storeToRefs(stationStore);
const queryControlStore = useQueryControlStore();
const { pollingEnabled } = storeToRefs(queryControlStore);
const lineAlarmsStore = useLineAlarmsStore();
const { lineAlarms } = storeToRefs(lineAlarmsStore);
return useQuery({
queryKey: [LINE_ALARMS_QUERY_KEY],
enabled: computed(() => onlineStationList.value.length > 0 && pollingEnabled.value),
staleTime: Infinity,
refetchOnMount: false,
refetchOnReconnect: false,
refetchOnWindowFocus: false,
queryFn: async ({ signal }): Promise<LineAlarms> => {
console.time('useLineAlarmsQuery');
if (!stationList?.value) {
lineAlarms.value = {};
return lineAlarms.value;
}
for (const station of stationList.value) {
if (!station.online) {
lineAlarms.value[station.code] = createEmptyStationAlarms();
continue;
}
if (!lineAlarms.value[station.code]) {
lineAlarms.value[station.code] = createEmptyStationAlarms();
}
const stationAlarms = createEmptyStationAlarms();
const now = dayjs();
const todayStart = now.startOf('date').valueOf();
const todayEnd = now.endOf('date').valueOf();
try {
const { records: alarmList } = await postNdmDeviceAlarmLogPage(
station.code,
{
model: {},
extra: {
alarmDate_ge: todayStart,
alarmDate_le: todayEnd,
deviceId_likeRight: station.code,
},
size: 50000,
current: 1,
sort: 'id',
order: 'descending',
},
signal,
);
for (const alarm of alarmList) {
const deviceType = getDeviceTypeVal(alarm.deviceType);
stationAlarms[deviceType].push(alarm);
}
stationAlarms.unclassified = alarmList;
lineAlarms.value[station.code] = stationAlarms;
await sleep();
} catch (error) {
if (error instanceof CanceledError) return lineAlarms.value;
console.error(`获取车站 ${station.name} 设备告警数据失败:`, error);
stationAlarms[DeviceType.Camera] = [];
stationAlarms[DeviceType.Decoder] = [];
stationAlarms[DeviceType.Keyboard] = [];
stationAlarms[DeviceType.MediaServer] = [];
stationAlarms[DeviceType.Nvr] = [];
stationAlarms[DeviceType.SecurityBox] = [];
stationAlarms[DeviceType.Switch] = [];
stationAlarms[DeviceType.VideoServer] = [];
stationAlarms.unclassified = [];
}
}
console.timeEnd('useLineAlarmsQuery');
return lineAlarms.value;
},
placeholderData: (prev) => prev,
});
}

27
src/composables/query/device/domains/index.ts
View File

@@ -1 +1,26 @@
export * from './station-devices';
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[];
}
export interface LineDevices {
[stationCode: string]: StationDevices;
}

22
src/composables/query/device/domains/station-devices.ts
View File

@@ -1,22 +0,0 @@
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[];
}

164
src/composables/query/device/use-line-devices-query.ts
View File

@@ -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,
});
}

67
src/composables/query/station/use-station-list-query.ts
View File

@@ -1,66 +1,63 @@
import { userClient } from '@/apis/client';
import type { Station } from '@/apis/domains';
import { ndmVerify } from '@/apis/requests';
import { batchVerify } from '@/apis/requests';
import { STATION_LIST_QUERY_KEY } from '@/constants';
import { useQueryControlStore } from '@/stores/query-control';
import { useStationStore } from '@/stores/station';
import { getAppEnvConfig } from '@/utils/env';
import { useQuery, useQueryClient } from '@tanstack/vue-query';
import { useMutation, useQuery } from '@tanstack/vue-query';
import axios from 'axios';
import dayjs from 'dayjs';
import { storeToRefs } from 'pinia';
import { computed } from 'vue';
export function useStationListQuery() {
const stationStore = useStationStore();
const { stationList } = storeToRefs(stationStore);
const queryControlStore = useQueryControlStore();
const { pollingEnabled } = storeToRefs(queryControlStore);
const queryClient = useQueryClient();
const { mutateAsync: getStationList } = useStationListMutation();
return useQuery({
queryKey: [STATION_LIST_QUERY_KEY],
enabled: computed(() => pollingEnabled.value),
refetchInterval: getAppEnvConfig().requestInterval * 1000,
staleTime: getAppEnvConfig().requestInterval * 1000,
queryFn: async ({ signal }) => {
// 主动登录校验
const [err] = await userClient.post<void>(`/api/ndm/ndmKeepAlive/verify`, {}, { timeout: 5000, signal });
if (err) {
throw err;
}
console.time('useStationListQuery');
await getStationList({ signal });
console.timeEnd('useStationListQuery');
queryControlStore.updateDeviceQueryStamp();
return null;
},
});
}
interface StationListMutationParams {
signal?: AbortSignal;
}
function useStationListMutation() {
const stationStore = useStationStore();
const { stationList } = storeToRefs(stationStore);
return useMutation<Station[], Error, StationListMutationParams>({
mutationFn: async ({ signal }) => {
const { data: ndmStationList } = await axios.get<{ code: string; name: string }[]>(`/minio/ndm/ndm-stations.json?_t=${dayjs().unix()}`, { signal });
let stations = ndmStationList.map<Station>((station) => ({
const stations = ndmStationList.map<Station>((station) => ({
code: station.code ?? '',
name: station.name ?? '',
online: false,
}));
const pingResultList = await Promise.allSettled(stations.map((station) => ndmVerify(station.code, signal)));
stations = stations.map((station, index) => ({
...station,
online: pingResultList[index].status === 'fulfilled',
}));
const isSame =
stationList.value.length === stations.length &&
stationList.value.every((oldStation, index) => {
const newStation = stations[index];
return oldStation.code === newStation.code && oldStation.name === newStation.name && oldStation.online === newStation.online;
});
const verifyList = await batchVerify(signal);
return stations.map((station) => {
return {
...station,
online: !!verifyList.find((stn) => stn.stationCode === station.code)?.onlineState,
};
});
},
onSuccess: (stations) => {
const isSame = JSON.stringify(stationList.value) === JSON.stringify(stations);
if (!isSame) {
stationList.value.splice(0, stationList.value.length, ...stations);
}
// queryClient.invalidateQueries({ queryKey: ['station-devices'] });
// queryClient.invalidateQueries({ queryKey: ['station-alarms'] });
queryClient.invalidateQueries({ queryKey: ['line-devices'] });
// queryClient.invalidateQueries({ queryKey: ['line-alarms'] });
return stations;
},
});
}

1
src/constants/query.ts
View File

@@ -1,3 +1,4 @@
export const STATION_LIST_QUERY_KEY = 'station-list';
export const LINE_DEVICES_QUERY_KEY = 'line-devices';
export const LINE_ALARM_COUNTS_QUERY_KEY = 'line-alarm-counts';
export const LINE_ALARMS_QUERY_KEY = 'line-alarms';

21
src/pages/alarm-page.vue
View File

@@ -1,7 +1,6 @@
<script setup lang="ts">
import type { NdmDeviceAlarmLogResultVO } from '@/apis/models';
import { ndmDeviceAlarmLogDefaultExportByTemplate, postNdmDeviceAlarmLogPage } from '@/apis/requests';
import { JAVA_INTEGER_MAX_VALUE } from '@/constants';
import { DeviceType, DeviceTypeCode, DeviceTypeName, type DeviceTypeVal } from '@/enums/device-type';
import { useCurrentAlarmsStore } from '@/stores/current-alarms';
import { useStationStore } from '@/stores/station';
@@ -140,18 +139,18 @@ const { mutate: getAlarmList, isPending: isTableLoading } = useMutation({
alarmDate_ge: searchFields.alarmDate[0],
alarmDate_le: searchFields.alarmDate[1],
},
size: tablePagination.pageSize!,
current: tablePagination.page!,
sort: 'id',
current: tablePagination.page ?? 1,
size: tablePagination.pageSize ?? 10,
order: 'descending',
sort: 'id',
});
return res;
},
onSuccess: (res) => {
const { records, pages, size, total } = res;
tablePagination.pageSize = parseInt(size);
tablePagination.pageCount = parseInt(pages);
tablePagination.itemCount = parseInt(total);
return records;
},
onSuccess: (records) => {
tableData.value = records;
},
onError: (error) => {
@@ -180,10 +179,10 @@ const { mutate: downloadTableData, isPending: isDownloading } = useMutation({
alarmDate_ge: searchFields.alarmDate[0],
alarmDate_le: searchFields.alarmDate[1],
},
current: 1,
size: JAVA_INTEGER_MAX_VALUE,
sort: 'id',
current: tablePagination.page ?? 1,
size: tablePagination.pageSize ?? 10,
order: 'descending',
sort: 'id',
});
return data;
},
@@ -255,7 +254,7 @@ onBeforeMount(() => getAlarmList());
<!-- 表格区域：填满剩余空间 -->
<div style="flex: 1 1 auto; min-height: 0; padding: 8px">
<NDataTable remote :columns="tableColumns" :data="tableData" :pagination="tablePagination" :loading="isTableLoading" :single-line="false" flex-height style="height: 100%" />
<NDataTable :loading="isTableLoading" :columns="tableColumns" :data="tableData" :pagination="tablePagination" :single-line="false" remote flex-height style="height: 100%" />
</div>
</div>
</template>

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

@@ -4,27 +4,27 @@ import DeviceAlarmDetailModal from '@/components/dashboard-page/device-alarm-det
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 { useLineAlarmsQuery, useLineDevicesQuery } from '@/composables/query';
import { useLineAlarmCountsQuery, useLineDevicesQuery } from '@/composables/query';
import { useStationStore } from '@/stores/station';
import { useLineDevicesStore } from '@/stores/line-devices';
import { useLineAlarmsStore } from '@/stores/line-alarms';
import { NGrid, NGi } from 'naive-ui';
import { storeToRefs } from 'pinia';
import { ref, watch } from 'vue';
import { useLineAlarmCountsStore } from '@/stores/line-alarm-counts';
const stationStore = useStationStore();
const { stationList } = storeToRefs(stationStore);
const lineDevicesStore = useLineDevicesStore();
const { lineDevices } = storeToRefs(lineDevicesStore);
const lineAlarmsStore = useLineAlarmsStore();
const { lineAlarms } = storeToRefs(lineAlarmsStore);
const lineAlarmCountsStore = useLineAlarmCountsStore();
const { lineAlarmCounts } = storeToRefs(lineAlarmCountsStore);
const { isFetching: lineDevicesFetching } = useLineDevicesQuery();
const { isFetching: lineAlarmsFetching } = useLineAlarmsQuery();
const { isFetching: lineAlarmCountsFetching } = useLineAlarmCountsQuery();
// 当设备查询或告警查询正在进行时，显示加载条
watch(
[lineDevicesFetching, lineAlarmsFetching],
[lineDevicesFetching, lineAlarmCountsFetching],
(fetchingList) => {
if (fetchingList.some((pending) => pending)) {
window.$loadingBar.start();
@@ -61,7 +61,7 @@ const openDeviceParamsConfigModal = (station: Station) => {
<StationCard
:station="station"
:station-devices="lineDevices[station.code]"
:station-alarms="lineAlarms[station.code]"
:station-alarm-counts="lineAlarmCounts[station.code]"
@open-offline-device-detail-modal="openOfflineDeviceDetailModal"
@open-device-alarm-detail-modal="openDeviceAlarmDetailModal"
@open-device-params-config-modal="openDeviceParamsConfigModal"
@@ -72,7 +72,7 @@ const openDeviceParamsConfigModal = (station: Station) => {
<!-- 离线设备详情对话框 -->
<OfflineDeviceDetailModal v-model:show="offlineDeviceTreeModalShow" :station="selectedStation" :station-devices="selectedStation?.code ? lineDevices[selectedStation.code] : undefined" />
<!-- 设备告警详情对话框 -->
<DeviceAlarmDetailModal v-model:show="deviceAlarmTreeModalShow" :station="selectedStation" :station-alarms="selectedStation?.code ? lineAlarms[selectedStation.code] : undefined" />
<DeviceAlarmDetailModal v-model:show="deviceAlarmTreeModalShow" :station="selectedStation" :station-alarm-counts="selectedStation?.code ? lineAlarmCounts[selectedStation.code] : undefined" />
<!-- 设备配置面板对话框 -->
<DeviceParamsConfigModal v-model:show="deviceParamsConfigModalShow" :station="selectedStation" />
</template>

21
src/pages/vimp-log-page.vue
View File

@@ -2,7 +2,6 @@
import type { NdmVimpLogResultVO } from '@/apis/models/device';
import { ndmVimpLogDefaultExportByTemplate, postNdmVimpLogPage } from '@/apis/requests';
import { useStationListQuery } from '@/composables/query';
import { JAVA_INTEGER_MAX_VALUE } from '@/constants';
import { useStationStore } from '@/stores/station';
import { downloadByData } from '@/utils/download';
import { useMutation } from '@tanstack/vue-query';
@@ -79,25 +78,25 @@ const tablePagination = reactive<PaginationProps>({
const { mutate: getVimpLogList, isPending: isTableLoading } = useMutation({
mutationFn: async () => {
if (!searchFields.stationCode) return [];
if (!searchFields.stationCode) throw Error('请选择车站');
const res = await postNdmVimpLogPage(searchFields.stationCode, {
model: {},
extra: {
createdTime_precisest: searchFields.createdTime[0],
createdTime_preciseed: searchFields.createdTime[1],
},
size: tablePagination.pageSize!,
current: tablePagination.page!,
sort: 'id',
current: tablePagination.page ?? 1,
size: tablePagination.pageSize ?? 10,
order: 'descending',
sort: 'id',
});
return res;
},
onSuccess: (res) => {
const { records, pages, size, total } = res;
tablePagination.pageSize = parseInt(size);
tablePagination.pageCount = parseInt(pages);
tablePagination.itemCount = parseInt(total);
return records;
},
onSuccess: (records) => {
tableData.value = records;
},
onError: (error) => {
@@ -124,10 +123,10 @@ const { mutate: downloadTableData, isPending: isDownloading } = useMutation({
createdTime_precisest: searchFields.createdTime[0],
createdTime_preciseed: searchFields.createdTime[1],
},
current: 1,
size: JAVA_INTEGER_MAX_VALUE,
sort: 'id',
current: tablePagination.page ?? 1,
size: tablePagination.pageSize ?? 10,
order: 'descending',
sort: 'id',
});
return data;
},

11
src/stores/line-alarm-counts.ts Normal file
View File

@@ -0,0 +1,11 @@
import type { LineAlarmCounts } from '@/composables/query';
import { defineStore } from 'pinia';
import { ref } from 'vue';
export const useLineAlarmCountsStore = defineStore('ndm-line-alarm-counts-store', () => {
const lineAlarmCounts = ref<LineAlarmCounts>({});
return {
lineAlarmCounts,
};
});

20
src/stores/query-control.ts
View File

@@ -1,25 +1,25 @@
import dayjs from 'dayjs';
import { defineStore } from 'pinia';
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);
const enableGlobalPolling = () => (globalPollingEnabled.value = true);
const disableGlobalPolling = () => (globalPollingEnabled.value = false);
const deviceQueryStamp = ref(0);
const alarmQueryStamp = ref(0);
const updateDeviceQueryStamp = () => (deviceQueryStamp.value = dayjs().valueOf());
const updateAlarmQueryStamp = () => (alarmQueryStamp.value = dayjs().valueOf());
return {
pollingEnabled,
enablePolling,
disablePolling,
globalPollingEnabled,
enableGlobalPolling,
disableGlobalPolling,
deviceQueryStamp,
alarmQueryStamp,
updateDeviceQueryStamp,
updateAlarmQueryStamp,
};
});