修复(vimp设备中心): 按编码排序站点与通道以稳定UI显示顺序
- 新增通用排序工具函数,对站点和通道数组按code字段排序,确保线路面板、站点节点和通道节点的显示顺序稳定一致,避免UI因数据源顺序波动出现跳动。
This commit is contained in:
@@ -30,6 +30,20 @@ const buildTrainAreas = () => {
|
|||||||
return codeTrainAreas;
|
return codeTrainAreas;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const compareByCode = <T extends { code: string }>(a: T, b: T) => {
|
||||||
|
if (a.code < b.code) return -1;
|
||||||
|
if (a.code > b.code) return 1;
|
||||||
|
return 0;
|
||||||
|
};
|
||||||
|
const sortSitesByCode = (sites: VimpStation[]) => {
|
||||||
|
sites.sort(compareByCode);
|
||||||
|
};
|
||||||
|
const sortChannelsMapByCode = (siteCodeToChannelsMap: Map<string, VimpChannel[]>) => {
|
||||||
|
for (const channels of siteCodeToChannelsMap.values()) {
|
||||||
|
channels.sort(compareByCode);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
export const useDeviceCenterQuery = () => {
|
export const useDeviceCenterQuery = () => {
|
||||||
const cameraStore = useCameraStore();
|
const cameraStore = useCameraStore();
|
||||||
const alarmStore = useAlarmStore();
|
const alarmStore = useAlarmStore();
|
||||||
@@ -105,6 +119,13 @@ export const useDeviceCenterQuery = () => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 1. 站点数组排序:稳定线路面板顺序和站点节点顺序
|
||||||
|
sortSitesByCode(cameraSites);
|
||||||
|
sortSitesByCode(alarmSites);
|
||||||
|
// 2. 每站通道数组排序:稳定区域节点顺序和通道节点顺序
|
||||||
|
sortChannelsMapByCode(siteCodeToCamerasMap);
|
||||||
|
sortChannelsMapByCode(siteCodeToAlarmsMap);
|
||||||
|
|
||||||
cameraStore.buildLineTabPanes({
|
cameraStore.buildLineTabPanes({
|
||||||
sites: cameraSites,
|
sites: cameraSites,
|
||||||
siteCodeToCamerasMap: siteCodeToCamerasMap,
|
siteCodeToCamerasMap: siteCodeToCamerasMap,
|
||||||
|
|||||||
Reference in New Issue
Block a user