| import * as PIXI from 'pixi.js'; | 
| import * as TWEEDLE from 'tweedle.js'; | 
| import Http from '@/utils/http'; | 
| import { message } from 'antd'; | 
| import { API_TIMEOUT } from '@/config/setting' | 
|   | 
| import agv from '/public/img/map/agv.svg' | 
| import shelf from '/public/img/map/shelf.png' | 
| import conveyor from '/public/img/map/conveyor.png' | 
| import point from '/public/img/map/point.svg' | 
| import shuttle from '/public/img/map/shuttle.svg' | 
| import { log } from 'three/examples/jsm/nodes/Nodes.js'; | 
|   | 
| let app = null; | 
| let mapContainer = null; | 
| let notify = null; | 
| let selectedSprite, effectTick, effectHalfCircle, effectRectangle; | 
|   | 
| export function syncApp(param) { | 
|     app = param; | 
| } | 
|   | 
| export function syncMapContainer(param) { | 
|     mapContainer = param; | 
| } | 
|   | 
| export function syncNotify(param) { | 
|     notify = param; | 
| } | 
|   | 
| export function getMapContainer() { | 
|     return mapContainer; | 
| } | 
|   | 
| export const MapEvent = Object.freeze({ | 
|     SELECTION_BOX: Symbol.for(0), | 
| }) | 
|   | 
| export const SENSOR_TYPE = Object.freeze({ | 
|     SHELF: "SHELF", | 
|     SHUTTLE: "SHUTTLE", | 
|     LIFT: "LIFT", | 
|     CONVEYOR: "CONVEYOR", | 
|     POINT: "POINT", | 
|     AGV: "AGV", | 
| }) | 
|   | 
| export const SENSOR_ZINDEX = Object.freeze({ | 
|     SHELF: 1, | 
|     CONVEYOR: 1, | 
|     POINT: 1, | 
|     TRAVEL_PATH: 80, | 
|     SHUTTLE: 100, | 
|     AGV: 100, | 
| }) | 
|   | 
| export const SHELF_TYPE = Object.freeze({ | 
|     STORE: 0, | 
|     TRACK: 3, | 
|     LIFT: 67, | 
|     CHARGE: 5, | 
|     CONVEYOR: 4, | 
|     DISABLE: -1, | 
| }) | 
|   | 
| export const NOTIFY_TYPE = Object.freeze({ | 
|     OPEN: 'open', | 
|     SUCCESS: 'success', | 
|     INFO: 'info', | 
|     WARNING: 'warning', | 
|     ERROR: 'error', | 
| }) | 
|   | 
| export const getRealPosition = (x, y, mapContainer) => { | 
|     const rect = app.view.getBoundingClientRect(); | 
|     return { | 
|         mapX: (x - rect.left) / mapContainer.scale.x - mapContainer.x / mapContainer.scale.x, | 
|         mapY: (y - rect.top) / mapContainer.scale.y - mapContainer.y / mapContainer.scale.y | 
|     } | 
| } | 
|   | 
| export const generateSprite = (sensorType) => { | 
|     let sprite; | 
|     switch (sensorType) { | 
|         case SENSOR_TYPE.SHUTTLE: | 
|             sprite = new PIXI.Sprite(PIXI.Texture.from(shuttle, { resourceOptions: { scale: 5 } })); | 
|             sprite.width = 50; | 
|             sprite.height = 50; | 
|             sprite.zIndex = SENSOR_ZINDEX.SHUTTLE; | 
|             break; | 
|         case SENSOR_TYPE.AGV: | 
|             sprite = new PIXI.Sprite(PIXI.Texture.from(agv, { resourceOptions: { scale: 5 } })); | 
|             sprite.width = 50; | 
|             sprite.height = 50; | 
|             sprite.zIndex = SENSOR_ZINDEX.AGV; | 
|             break; | 
|         case SENSOR_TYPE.SHELF: | 
|             sprite = new PIXI.Sprite(PIXI.Texture.from(shelf, { resourceOptions: { scale: 1 } })); | 
|             sprite.width = 60; | 
|             sprite.height = 60; | 
|             sprite.zIndex = SENSOR_ZINDEX.SHELF; | 
|             break; | 
|         case SENSOR_TYPE.CONVEYOR: | 
|             sprite = new PIXI.Sprite(PIXI.Texture.from(conveyor, { resourceOptions: { scale: 5 } })); | 
|             sprite.width = 112; | 
|             sprite.height = 63; | 
|             sprite.zIndex = SENSOR_ZINDEX.CONVEYOR; | 
|             break; | 
|         case SENSOR_TYPE.POINT: | 
|             sprite = new PIXI.Sprite(PIXI.Texture.from(point, { resourceOptions: { scale: 5 } })); | 
|             sprite.width = 10; | 
|             sprite.height = 10; | 
|             sprite.zIndex = SENSOR_ZINDEX.POINT; | 
|             break; | 
|         default: | 
|             break; | 
|     } | 
|     return sprite; | 
| } | 
|   | 
| export const initSprite = (sprite, type) => { | 
|     sprite.anchor.set(0.5); | 
|     sprite.cursor = 'pointer'; | 
|     sprite.eventMode = 'static'; | 
|     sprite.data = { | 
|         type: type, | 
|         uuid: generateID() | 
|     }; | 
| } | 
|   | 
| export const querySprite = (type, no) => { | 
|     if (!mapContainer) { | 
|         return; | 
|     } | 
|     for (const sprite of mapContainer.children) { | 
|         if (sprite.data?.type === type && sprite.data?.no === no) { | 
|             return sprite; | 
|         } | 
|     } | 
| } | 
|   | 
| // show sprite feature from sprite click event | 
| export const viewFeature = (sprite, setCurSPrite) => { | 
|     sprite.off('pointerup'); | 
|     sprite.off('pointermove'); | 
|     sprite.off('pointerdown'); | 
|     sprite.off('click'); | 
|   | 
|     sprite.on("click", onClick); | 
|   | 
|     function onClick(event) { | 
|         setCurSPrite(sprite); | 
|     } | 
|   | 
| } | 
|   | 
| // sprite be movable from sprite click event | 
| export const beMovable = (sprite) => { | 
|     sprite.off('pointerup'); | 
|     sprite.off('pointermove'); | 
|     sprite.off('pointerdown'); | 
|     sprite.off('click'); | 
|   | 
|     sprite.on("pointerdown", onDragStart); | 
|   | 
|     let dragTarget; | 
|     function onDragStart(event) { | 
|         if (event.button === 0) { | 
|             dragTarget = event.currentTarget; | 
|             mapContainer.parent.off('pointermove'); | 
|             mapContainer.parent.on('pointermove', onDragMove, dragTarget); | 
|   | 
|             mapContainer.parent.off('pointerup'); | 
|             mapContainer.parent.on('pointerup', onDragEnd.bind(mapContainer)); | 
|         } | 
|     } | 
|   | 
|     function onDragMove(event) { | 
|         if (this) { | 
|             this.parent.toLocal(event.global, null, this.position); | 
|         } | 
|     } | 
|   | 
|     function onDragEnd() { | 
|         if (dragTarget) { | 
|             this.parent.off('pointermove'); | 
|             this.parent.off('pointerup'); | 
|             dragTarget.alpha = 1; | 
|             dragTarget = null; | 
|         } | 
|     } | 
|   | 
| } | 
|   | 
| // sprite be beSettings from sprite click event | 
| export const beSettings = (sprite, setSpriteBySettings) => { | 
|     sprite.off('pointerup'); | 
|     sprite.off('pointermove'); | 
|     sprite.off('pointerdown'); | 
|     sprite.off('click'); | 
|   | 
|     sprite.on("click", onClick); | 
|   | 
|     function onClick(event) { | 
|         setSpriteBySettings(sprite); | 
|     } | 
| } | 
|   | 
| // sprites be movable from select box | 
| // the scale was dynamic | 
| export const spriteListBeMovable = (selectedSprites, resetFn) => { | 
|     if (selectedSprites && selectedSprites.length > 0) { | 
|         let batchMove = false; | 
|         let batchMoveStartPos = null; | 
|   | 
|         const batchMoving = (event) => { | 
|             const scale = mapContainer.scale.x; | 
|             if (batchMove && batchMoveStartPos) { | 
|                 // offset move val | 
|                 var mouseMovement = { | 
|                     x: (event.global.x - batchMoveStartPos.x) / scale, | 
|                     y: (event.global.y - batchMoveStartPos.y) / scale | 
|                 }; | 
|                 for (let sprite of selectedSprites) { | 
|                     sprite.position.x = sprite.batchMoveStartPos.x + mouseMovement.x; | 
|                     sprite.position.y = sprite.batchMoveStartPos.y + mouseMovement.y; | 
|                 } | 
|             } | 
|         } | 
|   | 
|         const batchMoveEnd = (event) => { | 
|             batchMove = false; | 
|             batchMoveStartPos = null; | 
|             selectedSprites.forEach(child => { | 
|                 unMarkSprite(child); | 
|             }) | 
|             selectedSprites = []; | 
|             mapContainer.parent.off('mousedown'); | 
|             mapContainer.parent.off('mousemove'); | 
|             mapContainer.parent.off('mouseup'); | 
|   | 
|             if (resetFn) { | 
|                 resetFn(); | 
|             } | 
|         } | 
|   | 
|         const batchMoveStart = (event) => { | 
|             batchMoveStartPos = { x: event.data.global.clone().x, y: event.data.global.clone().y }; | 
|             selectedSprites.forEach(child => { | 
|                 child.batchMoveStartPos = { x: child.position.x, y: child.position.y }; | 
|             }) | 
|   | 
|             batchMove = true; | 
|             mapContainer.parent.off('mousemove'); | 
|             mapContainer.parent.on('mousemove', batchMoving); | 
|   | 
|             mapContainer.parent.off('mouseup'); | 
|             mapContainer.parent.on('mouseup', batchMoveEnd); | 
|         } | 
|   | 
|         mapContainer.parent.off('mousedown') | 
|         mapContainer.parent.on('mousedown', batchMoveStart); | 
|     } | 
| } | 
|   | 
| export const isSpriteInSelectionBox = (sprite, selectionBox) => { | 
|     const spriteBounds = sprite.getBounds(); | 
|     const boxBounds = selectionBox.getBounds(); | 
|   | 
|     return spriteBounds.x + spriteBounds.width > boxBounds.x | 
|         && spriteBounds.x < boxBounds.x + boxBounds.width | 
|         && spriteBounds.y + spriteBounds.height > boxBounds.y | 
|         && spriteBounds.y < boxBounds.y + boxBounds.height; | 
| } | 
|   | 
| export const showSelectedEffect = (sprite) => { | 
|     const { width, height } = sprite; | 
|     const scale = sprite.scale.x; | 
|     const sideLen = (Math.max(width, height) + 10) * scale; | 
|     const color = app.renderer.backgroundColor === '#f1f2f6' ? 0x273c75 : 0xffffff; | 
|   | 
|     effectHalfCircle = new PIXI.Graphics(); | 
|     effectHalfCircle.beginFill(color); | 
|     effectHalfCircle.lineStyle(2 * scale, color); | 
|     effectHalfCircle.arc(0, 0, sideLen, 0, Math.PI); | 
|     effectHalfCircle.endFill(); | 
|     effectHalfCircle.position.set(sprite.x, sprite.y); | 
|     effectHalfCircle.scale.set(1 / scale); | 
|     effectHalfCircle.zIndex = 9999; | 
|   | 
|     effectRectangle = new PIXI.Graphics(); | 
|     effectRectangle.lineStyle(5 * scale, color, 1); | 
|     effectRectangle.drawRoundedRect(0, 0, sideLen, sideLen, 16 * scale); | 
|     effectRectangle.endFill(); | 
|     effectRectangle.mask = effectHalfCircle; | 
|     effectRectangle.zIndex = 9999; | 
|   | 
|     const scaledWidth = sideLen * (1 / scale); | 
|     const scaledHeight = sideLen * (1 / scale); | 
|   | 
|     effectRectangle.scale.set(1 / scale); | 
|     effectRectangle.position.set(sprite.x - scaledWidth / 2, sprite.y - scaledHeight / 2); | 
|   | 
|     mapContainer.addChild(effectRectangle); | 
|     mapContainer.addChild(effectHalfCircle); | 
|   | 
|     selectedSprite = sprite; | 
|   | 
|     let phase = 0; | 
|     effectTick = (delta) => { | 
|         phase += delta / 10; | 
|         phase %= (Math.PI * 2); | 
|         if (effectHalfCircle) { | 
|             effectHalfCircle.rotation = phase; | 
|         } | 
|     }; | 
|   | 
|     app.ticker.add(effectTick); | 
| } | 
|   | 
| export const updateEffect = (sprite) => { | 
|     if (!sprite || sprite !== selectedSprite || !effectRectangle || !effectHalfCircle) { | 
|         return | 
|     } | 
|     const { width, height } = sprite; | 
|     const scale = sprite?.scale.x; | 
|     const sideLen = (Math.max(width, height) + 10) * scale; | 
|     const scaledWidth = sideLen * (1 / scale); | 
|     const scaledHeight = sideLen * (1 / scale); | 
|   | 
|     effectRectangle.position.set(sprite.x - scaledWidth / 2, sprite.y - scaledHeight / 2); | 
|   | 
|     effectHalfCircle.position.set(sprite.x, sprite.y); | 
| } | 
|   | 
| export const removeSelectedEffect = () => { | 
|     if (effectTick) { | 
|         app.ticker.remove(effectTick); | 
|     } | 
|     if (effectHalfCircle) { | 
|         mapContainer.removeChild(effectHalfCircle); | 
|         effectHalfCircle = null; | 
|     } | 
|     if (effectRectangle) { | 
|         mapContainer.removeChild(effectRectangle); | 
|         effectRectangle = null; | 
|     } | 
|     selectedSprite = null; | 
| } | 
|   | 
| export const copySprite = (sprite) => { | 
|     const copiedSprite = generateSprite(sprite.data.type) | 
|     initSprite(copiedSprite); | 
|     copiedSprite.position.set(sprite.position.x, sprite.position.y); | 
|     copiedSprite.scale.set(sprite.scale.x, sprite.scale.y); | 
|     copiedSprite.rotation = sprite.rotation; | 
|     copiedSprite.data = deepCopy(sprite.data); | 
|     copiedSprite.data.uuid = generateID(); | 
|     if (copiedSprite.data.type === SENSOR_TYPE.SHELF) { | 
|         showSheflType(copiedSprite); | 
|     } | 
|     return copiedSprite; | 
| } | 
|   | 
| export const markSprite = (sprite) => { | 
|     sprite.alpha = 0.5; | 
| } | 
|   | 
| export const unMarkSprite = (sprite) => { | 
|     sprite.alpha = 1; | 
| } | 
|   | 
| export const generateID = () => { | 
|     return Date.now().toString(36) + Math.random().toString(36).substring(2); | 
| } | 
|   | 
| export const deepCopy = (data) => { | 
|     return JSON.parse(JSON.stringify(data)); | 
| } | 
|   | 
| export const pureNumStr = (param) => { | 
|     if (param) { | 
|         return Number(param); | 
|     } else { | 
|         return ''; | 
|     } | 
| } | 
|   | 
| export const rotationToNum = (rotation) => { | 
|     let res = rotation * 180 / Math.PI; | 
|     if (res < 0) { | 
|         res += 360; | 
|     } else if (res > 360) { | 
|         res -= 360; | 
|     } | 
|     return res; | 
| } | 
|   | 
| export const rotationParseNum = (num) => { | 
|     return num * Math.PI / 180; | 
| } | 
|   | 
| export const findSpriteByUuid = (uuid) => { | 
|     return mapContainer?.children?.find(child => child?.data?.uuid === uuid); | 
| } | 
|   | 
| export const fetchMapFloor = async () => { | 
|     const res = await Http.doPost('api/map/floor/list'); | 
|     if (res.code === 200) { | 
|         return eval(res.data); | 
|     } else { | 
|         mapNotify(res.msg, NOTIFY_TYPE.ERROR); | 
|     } | 
| } | 
|   | 
| export const fetchMapData = async (curFloor) => { | 
|     clearMapData(); | 
|     await Http.doPostPromise('api/map/list', { floor: curFloor }, (res) => { | 
|         const mapItemList = eval(res.data); | 
|         mapItemList.forEach(item => { | 
|             if (!( | 
|                 item.type === SENSOR_TYPE.SHUTTLE | 
|                 || item.type === SENSOR_TYPE.AGV | 
|             )) { | 
|                 const sprite = generateSprite(item.type); | 
|                 if (sprite) { | 
|                     initSprite(sprite, item.type); | 
|                     // data | 
|                     sprite.data.uuid = item.uuid; | 
|                     sprite.data.no = item.no; | 
|   | 
|                     // dynamical data | 
|                     Object.assign(sprite.data, item.property); | 
|   | 
|                     showSheflType(sprite); | 
|                     // graph | 
|                     setTimeout(() => { | 
|                         sprite.position.set(item.positionX, item.positionY); | 
|                         sprite.scale.set(item.scaleX, item.scaleY); | 
|                         sprite.rotation = rotationParseNum(item.rotation); | 
|                     }, 50); | 
|   | 
|                     mapContainer.addChild(sprite); | 
|                 } | 
|             } | 
|         }) | 
|   | 
|     }).catch((error) => { | 
|         console.error(error); | 
|     }) | 
| } | 
|   | 
| export const saveMapData = async (intl, floor) => { | 
|     if (!mapContainer) { | 
|         return; | 
|     } | 
|   | 
|     let mapItemList = []; | 
|     mapContainer?.children.forEach(child => { | 
|         if (child.data?.uuid) { | 
|             const { type, uuid, no, ...property } = child.data; | 
|             if (!( | 
|                 type === SENSOR_TYPE.SHUTTLE | 
|                 || type === SENSOR_TYPE.AGV | 
|             )) { | 
|                 mapItemList.push({ | 
|                     // data | 
|                     type: type, | 
|                     uuid: uuid, | 
|                     no: no, | 
|                     property: property, | 
|   | 
|                     // graph | 
|                     positionX: child.position.x, | 
|                     positionY: child.position.y, | 
|                     scaleX: child.scale.x, | 
|                     scaleY: child.scale.y, | 
|                     rotation: rotationToNum(child.rotation) | 
|                 }) | 
|             } | 
|         } | 
|     }) | 
|   | 
|     const closeLoading = message.loading({ content: intl.formatMessage({ id: 'common.loading.api.message', defaultMessage: '等待服务器......' }), duration: API_TIMEOUT }); | 
|     await Http.doPostPromise('api/map/save', { | 
|         itemList: mapItemList, | 
|         floor: floor | 
|     }, (res) => { | 
|         closeLoading(); | 
|     }).catch((error) => { | 
|         closeLoading(); | 
|         console.error(error); | 
|     }) | 
| } | 
|   | 
| export const clearMapData = (intl) => { | 
|     if (!mapContainer) { | 
|         return; | 
|     } | 
|     let childList = []; | 
|     mapContainer.children.forEach(child => { | 
|         if (child.data?.uuid) { | 
|             childList.push(child); | 
|         } | 
|     }) | 
|     if (childList.length > 0) { | 
|         childList.forEach(child => { | 
|             mapContainer.removeChild(child); | 
|             child.destroy({ children: true, texture: false, baseTexture: false }); | 
|         }) | 
|         childList.forEach((child, index) => { | 
|             childList[index] = null; | 
|         }); | 
|         childList = []; | 
|     } | 
| } | 
|   | 
| export const beCenter = (sprite) => { | 
|     if (!sprite || !app || !mapContainer) { | 
|         return; | 
|     } | 
|   | 
|     mapContainer.scale.set(1); | 
|     mapContainer.position.set(0, 0); | 
|   | 
|     let bounds = sprite.getBounds(); | 
|     let centerPoint = { | 
|         x: bounds.x + bounds.width / 2, | 
|         y: bounds.y + bounds.height / 2 | 
|     }; | 
|   | 
|     let targetPos = { | 
|         x: app.renderer.width / 3 - centerPoint.x * mapContainer.scale.x, | 
|         y: app.renderer.height / 3 - centerPoint.y * mapContainer.scale.y | 
|     }; | 
|   | 
|     new TWEEDLE.Tween(mapContainer.position).easing(TWEEDLE.Easing.Quadratic.Out) | 
|         .to(targetPos, 500).start(); | 
| } | 
|   | 
| export const mapNotify = (msg, type = NOTIFY_TYPE.OPEN) => { | 
|     notify[type]({ | 
|         description: msg, | 
|         duration: 1.5, | 
|         style: { width: 300 }, | 
|         placement: 'bottom', | 
|         closeIcon: false, | 
|         onClick: () => { } | 
|     }); | 
| } | 
|   | 
| export const showSheflType = (sprite) => { | 
|     let showColor; | 
|     switch (sprite.data.shelfType) { | 
|         case SHELF_TYPE.STORE: | 
|             break; | 
|         case SHELF_TYPE.TRACK: | 
|             showColor = '#faf6e9'; | 
|             break; | 
|         case SHELF_TYPE.LIFT: | 
|             showColor = '#EBDEF0'; | 
|             break; | 
|         case SHELF_TYPE.CHARGE: | 
|             showColor = '#D4EFDF'; | 
|             break; | 
|         case SHELF_TYPE.CONVEYOR: | 
|             showColor = '#54FF9F'; | 
|             break; | 
|         case SHELF_TYPE.DISABLE: | 
|             showColor = '#ffc8c8'; | 
|             break; | 
|         default: | 
|             break; | 
|     } | 
|     if (showColor) { | 
|         sprite.tint = showColor; | 
|     } else { | 
|         sprite.tint = 0xFFFFFF;  // recovery | 
|     } | 
|     return showColor; | 
| } | 
|   | 
| export const waitTime = (time = 1000) => { | 
|     return new Promise((resolve) => { | 
|         setTimeout(() => { | 
|             resolve(true); | 
|         }, time); | 
|     }); | 
| }; | 
|   | 
| export const isNullOfUndefined = (param) => { | 
|     if (null === param || undefined === param) { | 
|         return true; | 
|     } else { | 
|         return false; | 
|     } | 
| } | 
|   | 
| export const parseLocNo = (locNo) => { | 
|     if (!locNo || typeof locNo !== 'string') { | 
|         return null; | 
|     } | 
|     const locParseArr = locNo.split('-'); | 
|     return { | 
|         row: locParseArr?.[0], | 
|         bay: locParseArr?.[1], | 
|         lev: locParseArr?.[2], | 
|     } | 
| } | 
|   | 
| export const generateLocNo = (row, bay, lev) => { | 
|     return row + '-' + bay + '-' + lev; | 
| } | 
|   | 
| export const updateMapStatusInRealTime = (data, curFloorGetter, setCurSPrite) => { | 
|     const curFloor = curFloorGetter(); | 
|     if (isNullOfUndefined(curFloor)) { return; } | 
|     const mapVo = JSON.parse(data); | 
|     // shuttleVo | 
|     for (const shuttleVo of mapVo.shuttleVos) { | 
|         // path | 
|         drawTravelPath(shuttleVo, curFloor); | 
|         // shuttle | 
|         showShuttle(shuttleVo, curFloor, setCurSPrite); | 
|     } | 
|   | 
|     showLockPath(mapVo.lockPath, curFloor, setCurSPrite); | 
|     showConveyorSta(mapVo.conveyorSta, curFloor, setCurSPrite); | 
| } | 
|   | 
| export const drawTravelPath = (shuttleVo, curFloor) => { | 
|     const { shuttleNo, curLocNo, travelPath: path } = shuttleVo; | 
|     if (!mapContainer) { | 
|         return; | 
|     } | 
|     const pathLineName = 'preTravelPath-' + shuttleNo; | 
|     let pathLine = mapContainer.getChildByName(pathLineName); | 
|     if (pathLine) { | 
|         mapContainer.removeChild(pathLine); | 
|     } | 
|   | 
|     pathLine = new PIXI.Graphics(); | 
|     pathLine.name = pathLineName; | 
|     pathLine.lineStyle(3 * (1 / mapContainer.scale.x), 0x3498db, 0.8); | 
|     pathLine.zIndex = SENSOR_ZINDEX.TRAVEL_PATH; | 
|     let firstNode = true; | 
|     for (let i = Math.max(0, path.indexOf(curLocNo)); i < path.length; i++) { | 
|         const { row, bay, lev } = parseLocNo(path[i]); | 
|         if (Number(lev) !== curFloor) { continue } | 
|         const shelf = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); | 
|         if (!shelf) { continue }; | 
|         let position = shelf.position; | 
|         let x = position.x; | 
|         let y = position.y; | 
|         if (firstNode) { | 
|             pathLine.moveTo(x, y); | 
|             firstNode = false; | 
|         } else { | 
|             pathLine.lineTo(x, y); | 
|         } | 
|     } | 
|     mapContainer.addChild(pathLine); | 
| } | 
|   | 
| export const showShuttle = (shuttleVo, curFloor, setCurSPrite) => { | 
|     const { shuttleNo, curLocNo } = shuttleVo; | 
|     if (!curLocNo) { return } | 
|     const { row, bay, lev } = parseLocNo(curLocNo); | 
|     if (Number(lev) !== curFloor) { return } | 
|   | 
|     const shelf = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); | 
|     if (!shelf) { return } | 
|   | 
|     let shuttle = querySprite(SENSOR_TYPE.SHUTTLE, shuttleNo); | 
|     if (!shuttle) { | 
|         shuttle = generateSprite(SENSOR_TYPE.SHUTTLE); | 
|         initSprite(shuttle, SENSOR_TYPE.SHUTTLE); | 
|         shuttle.data.no = shuttleNo; | 
|         shuttle.position.set(shelf.position.x, shelf.position.y); | 
|         mapContainer.addChild(shuttle); | 
|         viewFeature(shuttle, setCurSPrite); | 
|     } | 
|   | 
|     new TWEEDLE.Tween(shuttle?.position).easing(TWEEDLE.Easing.Linear.None).to({ | 
|         x: shelf.position.x, | 
|         y: shelf.position.y | 
|     }, 1000).onUpdate(() => { | 
|         updateEffect(shuttle); | 
|     }).start(); | 
| } | 
|   | 
| export const showLockPath = (lockPath, curFloor, setCurSPrite) => { | 
|     const pathLineName = 'lockPath'; | 
|     let pathLine = mapContainer.getChildByName(pathLineName); | 
|     if (pathLine) { | 
|         mapContainer.removeChild(pathLine); | 
|     } | 
|   | 
|     for (let i = 0; i < lockPath.length; i++) { | 
|         const item = lockPath[i] | 
|         if(item.lev != curFloor) {continue} | 
|         const nodes = item.path; | 
|   | 
|         pathLine = new PIXI.Graphics(); | 
|         pathLine.name = pathLineName; | 
|         pathLine.lineStyle(3 * (1 / mapContainer.scale.x), 0xff0000, 0.8); | 
|         pathLine.zIndex = SENSOR_ZINDEX.TRAVEL_PATH; | 
|         let firstNode = true; | 
|      | 
|         for (let i = 0; i < nodes.length; i++) { | 
|             const node = nodes[i]; | 
|             const shelf = querySprite(SENSOR_TYPE.SHELF, node.x + '-' + node.y); | 
|             if (!shelf) { continue } | 
|      | 
|             let position = shelf.position; | 
|             let x = position.x; | 
|             let y = position.y; | 
|             if (firstNode) { | 
|                 pathLine.moveTo(x, y); | 
|                 firstNode = false; | 
|             } else { | 
|                 pathLine.lineTo(x, y); | 
|             } | 
|      | 
|         } | 
|      | 
|         mapContainer.addChild(pathLine); | 
|     } | 
| } | 
|   | 
| export const showConveyorSta = (conveyorSta, curFloor, setCurSPrite) => { | 
|     for (let i = 0; i < conveyorSta.length; i++) { | 
|         const sta = conveyorSta[i]; | 
|         if (!sta.locNo) { continue } | 
|         const { row, bay, lev } = parseLocNo(sta.locNo); | 
|         if (Number(lev) !== curFloor) { continue } | 
|         const sprite = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); | 
|         if (!sprite) { continue } | 
|         if (sprite.data.conveyorNo !== sta.siteNo) { continue } | 
|   | 
|         const conveyorName = 'conveyorSta-' + sprite.data.conveyorNo; | 
|         let conveyorChild = sprite.getChildByName(conveyorName); | 
|         if (conveyorChild) { | 
|             sprite.removeChild(conveyorChild); | 
|         } | 
|   | 
|         let textColor; | 
|         let staText; | 
|         let positionX = -11; | 
|         let positionY = -6; | 
|         if (sta.siteStatusType$ == 'site-auto-run') { | 
|             textColor = 0xfa51f6; | 
|             staText = sprite.data.conveyorNo; | 
|         } else if (sta.siteStatusType$ == 'site-unauto') { | 
|             textColor = 0xb8b8b8; | 
|             staText = sprite.data.conveyorNo; | 
|         } else if (sta.siteStatusType$ == 'site-auto-id') { | 
|             textColor = 0xc4c40; | 
|             staText = sprite.data.conveyorNo + '(' + sta.taskNo + ')'; | 
|             positionX = -20; | 
|             positionY = -6; | 
|         } else if (sta.siteStatusType$ == 'site-auto-run-id') { | 
|             textColor = 0xfc3030; | 
|             staText = sprite.data.conveyorNo + '(' + sta.taskNo + ')'; | 
|             positionX = -20; | 
|             positionY = -6; | 
|         }else { | 
|             textColor = '#54FF9F'; | 
|             staText = sprite.data.conveyorNo; | 
|         } | 
|   | 
|         const text = new PIXI.Text(staText, { | 
|             fill: 0x000000, | 
|             fontSize: 13, | 
|             fontFamily: 'MicrosoftYaHei', | 
|         }); | 
|         text.name = conveyorName; | 
|         text.position.set(positionX, positionY); | 
|         sprite.addChild(text); | 
|         sprite.textObj = text; | 
|         sprite.tint = textColor; | 
|         // sprite.tint = showColor; | 
|         // let position = shelf.position; | 
|         // let x = position.x; | 
|         // let y = position.y; | 
|         // conveyorChild.lineTo(x, y); | 
|     } | 
| } |