feat(elevator): 优化电梯映射构建时机与显示逻辑，移除防抖机制并统一图标路径生成
This commit is contained in:
parent
dcd6c54867
commit
434d4b72c4
@ -147,6 +147,10 @@ watch(playback.sceneJson, async (newJson) => {
|
||||
await editor.value?.load(newJson);
|
||||
// [移除] 不再需要在这里初始化机器人，交由 onFirstAmrData 回调处理
|
||||
// await editor.value?.initRobots();
|
||||
|
||||
// [电梯映射] 回放模式场景加载完成后构建电梯映射
|
||||
console.log('[回放模式] 构建电梯设备映射');
|
||||
elevatorStore.refreshMapping();
|
||||
} finally {
|
||||
isSceneLoading.value = false;
|
||||
}
|
||||
@ -476,6 +480,11 @@ onMounted(async () => {
|
||||
// [关键修复] 实时模式下需要显式初始化机器人
|
||||
console.log('[实时模式] 初始化机器人图元');
|
||||
await editor.value?.initRobots();
|
||||
|
||||
// [电梯映射] 场景加载完成后构建电梯映射
|
||||
console.log('[实时模式] 构建电梯设备映射');
|
||||
elevatorStore.refreshMapping();
|
||||
|
||||
await monitorScene();
|
||||
} else {
|
||||
console.log('[回放模式] 初始化回放模式');
|
||||
@ -525,6 +534,8 @@ onMounted(async () => {
|
||||
floor: 5,
|
||||
isConnected: true
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@ -54,10 +54,6 @@ export const useElevatorStore = defineStore('elevator', () => {
|
||||
const elevatorPoints = ref<Map<string, ElevatorPoint>>(new Map());
|
||||
const editorService = ref<EditorService | null>(null);
|
||||
|
||||
// 防抖更新队列
|
||||
const updateQueue = new Map<string, NodeJS.Timeout>();
|
||||
const UPDATE_DELAY = 300; // 300ms 防抖延迟
|
||||
|
||||
|
||||
|
||||
// ========== 计算属性 ==========
|
||||
@ -103,10 +99,12 @@ export const useElevatorStore = defineStore('elevator', () => {
|
||||
|
||||
/**
|
||||
* 设置编辑器服务
|
||||
* 注意：此方法只保存编辑器引用，不会立即构建映射
|
||||
* 需要在场景加载完成后手动调用 buildElevatorMapping() 或 refreshMapping()
|
||||
*/
|
||||
const setEditorService = (editor: EditorService) => {
|
||||
editorService.value = markRaw(editor);
|
||||
buildElevatorMapping();
|
||||
console.log('🛗 电梯Store: 编辑器服务已设置，等待场景加载后构建映射');
|
||||
};
|
||||
|
||||
/**
|
||||
@ -134,10 +132,19 @@ export const useElevatorStore = defineStore('elevator', () => {
|
||||
}
|
||||
});
|
||||
|
||||
// 打印详细的映射列表
|
||||
const mappingList = Array.from(elevatorPoints.value.entries()).map(([deviceId, point]) => ({
|
||||
设备ID: deviceId,
|
||||
点位ID: point.penId,
|
||||
点位类型: '电梯点'
|
||||
}));
|
||||
|
||||
console.log('🛗 电梯映射构建完成:', {
|
||||
totalPoints: elevatorPoints.value.size,
|
||||
deviceIds: Array.from(elevatorPoints.value.keys())
|
||||
映射总数: elevatorPoints.value.size,
|
||||
设备ID列表: Array.from(elevatorPoints.value.keys())
|
||||
});
|
||||
|
||||
console.table(mappingList);
|
||||
};
|
||||
|
||||
/**
|
||||
@ -173,7 +180,6 @@ export const useElevatorStore = defineStore('elevator', () => {
|
||||
|
||||
// 存储到Map
|
||||
elevators.value.set(deviceId, elevatorData);
|
||||
|
||||
// 更新画布上的电梯点显示
|
||||
if (elevatorData.penId && editorService.value) {
|
||||
updateElevatorPointDisplay(elevatorData);
|
||||
@ -181,52 +187,50 @@ export const useElevatorStore = defineStore('elevator', () => {
|
||||
};
|
||||
|
||||
/**
|
||||
* 更新画布上电梯点的显示（带防抖）
|
||||
* 更新画布上电梯点的显示
|
||||
*/
|
||||
const updateElevatorPointDisplay = (elevatorData: ElevatorData) => {
|
||||
if (!editorService.value || !elevatorData.penId) return;
|
||||
|
||||
const penId = elevatorData.penId;
|
||||
|
||||
// 清除之前的定时器
|
||||
if (updateQueue.has(penId)) {
|
||||
clearTimeout(updateQueue.get(penId)!);
|
||||
}
|
||||
// 获取状态对应的颜色和图标
|
||||
const { color, iconPath } = getElevatorDisplay(elevatorData.status, elevatorData.isConnected);
|
||||
|
||||
// 设置新的防抖定时器
|
||||
const timer = setTimeout(() => {
|
||||
// 获取状态对应的颜色
|
||||
const { color } = getElevatorDisplay(elevatorData.status, elevatorData.isConnected);
|
||||
// 基础更新数据
|
||||
const updateData: any = {
|
||||
// 设置图标
|
||||
image: iconPath,
|
||||
// 更新点位信息
|
||||
point: {
|
||||
...((editorService.value.getPenById(penId) as any)?.point || {}),
|
||||
elevatorStatus: elevatorData.status,
|
||||
isConnected: elevatorData.isConnected,
|
||||
currentFloor: elevatorData.floor,
|
||||
lastUpdate: elevatorData.lastUpdate,
|
||||
// 使用颜色区分状态
|
||||
color
|
||||
}
|
||||
};
|
||||
|
||||
// 更新电梯点
|
||||
editorService.value.updatePen(penId, {
|
||||
point: {
|
||||
...((editorService.value.getPenById(penId) as any)?.point || {}),
|
||||
elevatorStatus: elevatorData.status,
|
||||
isConnected: elevatorData.isConnected,
|
||||
currentFloor: elevatorData.floor,
|
||||
lastUpdate: elevatorData.lastUpdate,
|
||||
// 使用颜色区分状态
|
||||
color
|
||||
}
|
||||
}, false);
|
||||
// 更新电梯点
|
||||
editorService.value.updatePen(penId, updateData, false);
|
||||
|
||||
// 清除定时器
|
||||
updateQueue.delete(penId);
|
||||
}, UPDATE_DELAY);
|
||||
|
||||
updateQueue.set(penId, timer);
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取电梯显示配置（颜色、图标）
|
||||
*/
|
||||
const getElevatorDisplay = (status: ElevatorStatus, isConnected: boolean) => {
|
||||
// 生成图标路径的辅助函数
|
||||
const getIconPath = (theme: string) => `${import.meta.env.BASE_URL}/point/elevator-${theme}.svg`;
|
||||
|
||||
// 如果离线，显示灰色
|
||||
if (!isConnected) {
|
||||
return {
|
||||
color: '#999999',
|
||||
iconPath: '/icons/elevator/elevator-offline.svg',
|
||||
iconPath: getIconPath('offline'),
|
||||
text: '离线'
|
||||
};
|
||||
}
|
||||
@ -234,42 +238,42 @@ export const useElevatorStore = defineStore('elevator', () => {
|
||||
const statusMap = {
|
||||
[ElevatorStatus.IDLE]: {
|
||||
color: '#1890FF',
|
||||
iconPath: '/icons/elevator/elevator-idle.svg',
|
||||
iconPath: getIconPath('idle'),
|
||||
text: '静止'
|
||||
},
|
||||
[ElevatorStatus.OPENING]: {
|
||||
color: '#52C41A',
|
||||
iconPath: '/icons/elevator/elevator-opening.svg',
|
||||
iconPath: getIconPath('opening'),
|
||||
text: '开门中'
|
||||
},
|
||||
[ElevatorStatus.CLOSING]: {
|
||||
color: '#FA8C16',
|
||||
iconPath: '/icons/elevator/elevator-closing.svg',
|
||||
iconPath: getIconPath('closing'),
|
||||
text: '关门中'
|
||||
},
|
||||
[ElevatorStatus.MOVING_UP]: {
|
||||
color: '#722ED1',
|
||||
iconPath: '/icons/elevator/elevator-up.svg',
|
||||
iconPath: getIconPath('up'),
|
||||
text: '上行中'
|
||||
},
|
||||
[ElevatorStatus.MOVING_DOWN]: {
|
||||
color: '#13C2C2',
|
||||
iconPath: '/icons/elevator/elevator-down.svg',
|
||||
iconPath: getIconPath('down'),
|
||||
text: '下行中'
|
||||
},
|
||||
[ElevatorStatus.DOOR_OPEN]: {
|
||||
color: '#52C41A',
|
||||
iconPath: '/icons/elevator/elevator-door-open.svg',
|
||||
iconPath: getIconPath('door-open'),
|
||||
text: '门已开'
|
||||
},
|
||||
[ElevatorStatus.DOOR_CLOSED]: {
|
||||
color: '#1890FF',
|
||||
iconPath: '/icons/elevator/elevator-door-closed.svg',
|
||||
iconPath: getIconPath('door-closed'),
|
||||
text: '门已关'
|
||||
},
|
||||
[ElevatorStatus.FAULT]: {
|
||||
color: '#FF4D4F',
|
||||
iconPath: '/icons/elevator/elevator-fault.svg',
|
||||
iconPath: getIconPath('fault'),
|
||||
text: '故障'
|
||||
},
|
||||
};
|
||||
@ -320,10 +324,6 @@ export const useElevatorStore = defineStore('elevator', () => {
|
||||
* 清除所有电梯数据
|
||||
*/
|
||||
const clearAllData = () => {
|
||||
// 清理防抖队列
|
||||
updateQueue.forEach((timer) => clearTimeout(timer));
|
||||
updateQueue.clear();
|
||||
|
||||
elevators.value.clear();
|
||||
console.log('🛗 电梯数据已清除');
|
||||
};
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user