diff --git a/src/pages/movement-supervision.vue b/src/pages/movement-supervision.vue index aea3d33..74085c1 100644 --- a/src/pages/movement-supervision.vue +++ b/src/pages/movement-supervision.vue @@ -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 }); + + } }); diff --git a/src/stores/elevator.store.ts b/src/stores/elevator.store.ts index 1a841cc..f61960f 100644 --- a/src/stores/elevator.store.ts +++ b/src/stores/elevator.store.ts @@ -54,10 +54,6 @@ export const useElevatorStore = defineStore('elevator', () => { const elevatorPoints = ref>(new Map()); const editorService = ref(null); - // 防抖更新队列 - const updateQueue = new Map(); - 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('🛗 电梯数据已清除'); };