|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let app = null; | 
|---|
|  |  |  | let mapContainer = null; | 
|---|
|  |  |  | let notify = null; | 
|---|
|  |  |  | let effectTick, effectHalfCircle, effectRectangle; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export function syncApp(param) { | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export function syncMapContainer(param) { | 
|---|
|  |  |  | mapContainer = param; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export function syncNotify(param) { | 
|---|
|  |  |  | notify = param; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export function getMapContainer() { | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export const SENSOR_TYPE = Object.freeze({ | 
|---|
|  |  |  | SHUTTLE: "SHUTTLE", | 
|---|
|  |  |  | SHELF: "SHELF", | 
|---|
|  |  |  | POINT: "POINT", | 
|---|
|  |  |  | AGV: "AGV", | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export const SHELF_TYPE = Object.freeze({ | 
|---|
|  |  |  | STORE: 0, | 
|---|
|  |  |  | TRACK: 3, | 
|---|
|  |  |  | DISABLE: 1, | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export const NOTIFY_TYPE = Object.freeze({ | 
|---|
|  |  |  | OPEN: 'open', | 
|---|
|  |  |  | SUCCESS: 'success', | 
|---|
|  |  |  | INFO: 'info', | 
|---|
|  |  |  | WARNING: 'warning', | 
|---|
|  |  |  | ERROR: 'error', | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export const getRealPosition = (x, y, mapContainer) => { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // sprite be movable from sprite click event | 
|---|
|  |  |  | export const beMovable = (sprite, setDidClickSprite) => { | 
|---|
|  |  |  | export const beMovable = (sprite) => { | 
|---|
|  |  |  | sprite.off('pointerup'); | 
|---|
|  |  |  | sprite.off('pointermove'); | 
|---|
|  |  |  | sprite.off('pointerdown'); | 
|---|
|  |  |  | 
|---|
|  |  |  | let dragTarget; | 
|---|
|  |  |  | function onDragStart(event) { | 
|---|
|  |  |  | if (event.button === 0) { | 
|---|
|  |  |  | setDidClickSprite(true); | 
|---|
|  |  |  | dragTarget = event.currentTarget; | 
|---|
|  |  |  | mapContainer.parent.off('pointermove'); | 
|---|
|  |  |  | mapContainer.parent.on('pointermove', onDragMove, dragTarget); | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function onDragEnd() { | 
|---|
|  |  |  | if (dragTarget) { | 
|---|
|  |  |  | setDidClickSprite(false); | 
|---|
|  |  |  | this.parent.off('pointermove'); | 
|---|
|  |  |  | this.parent.off('pointerup'); | 
|---|
|  |  |  | dragTarget.alpha = 1; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // sprite be beSettings from sprite click event | 
|---|
|  |  |  | export const beSettings = (sprite, setSpriteBySettings, setDidClickSprite) => { | 
|---|
|  |  |  | export const beSettings = (sprite, setSpriteBySettings) => { | 
|---|
|  |  |  | sprite.off('pointerup'); | 
|---|
|  |  |  | sprite.off('pointermove'); | 
|---|
|  |  |  | sprite.off('pointerdown'); | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function onClick(event) { | 
|---|
|  |  |  | setSpriteBySettings(sprite); | 
|---|
|  |  |  | // setDidClickSprite(true); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // sprites be movable from select box | 
|---|
|  |  |  | // the scale was dynamic | 
|---|
|  |  |  | export const spriteListBeMovable = (selectedSprites, scale, resetFn) => { | 
|---|
|  |  |  | 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 = { | 
|---|
|  |  |  | 
|---|
|  |  |  | y: (event.global.y - batchMoveStartPos.y) / scale | 
|---|
|  |  |  | }; | 
|---|
|  |  |  | for (let sprite of selectedSprites) { | 
|---|
|  |  |  | sprite.position.x = sprite.data.batchMoveStartPos.x + mouseMovement.x; | 
|---|
|  |  |  | sprite.position.y = sprite.data.batchMoveStartPos.y + mouseMovement.y; | 
|---|
|  |  |  | sprite.position.x = sprite.batchMoveStartPos.x + mouseMovement.x; | 
|---|
|  |  |  | sprite.position.y = sprite.batchMoveStartPos.y + mouseMovement.y; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | mapContainer.parent.off('mousemove'); | 
|---|
|  |  |  | mapContainer.parent.off('mouseup'); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | resetFn(); | 
|---|
|  |  |  | if (resetFn) { | 
|---|
|  |  |  | resetFn(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const batchMoveStart = (event) => { | 
|---|
|  |  |  | batchMoveStartPos = { x: event.data.global.clone().x, y: event.data.global.clone().y }; | 
|---|
|  |  |  | selectedSprites.forEach(child => { | 
|---|
|  |  |  | child.data.batchMoveStartPos = { x: child.position.x, y: child.position.y }; | 
|---|
|  |  |  | child.batchMoveStartPos = { x: child.position.x, y: child.position.y }; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | batchMove = true; | 
|---|
|  |  |  | 
|---|
|  |  |  | const { width, height } = sprite; | 
|---|
|  |  |  | const scale = sprite.scale.x; | 
|---|
|  |  |  | const sideLen = (Math.max(width, height) + 10) * scale; | 
|---|
|  |  |  | const color = 0x273c75; | 
|---|
|  |  |  | const color = app.renderer.backgroundColor === '#f1f2f6' ? 0x273c75 : 0xffffff; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | effectHalfCircle = new PIXI.Graphics(); | 
|---|
|  |  |  | effectHalfCircle.beginFill(color); | 
|---|
|  |  |  | 
|---|
|  |  |  | effectHalfCircle.scale.set(1 / scale); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | effectRectangle = new PIXI.Graphics(); | 
|---|
|  |  |  | effectRectangle.lineStyle(2 * scale, color, 1); | 
|---|
|  |  |  | effectRectangle.lineStyle(5 * scale, color, 1); | 
|---|
|  |  |  | effectRectangle.drawRoundedRect(0, 0, sideLen, sideLen, 16 * scale); | 
|---|
|  |  |  | effectRectangle.endFill(); | 
|---|
|  |  |  | effectRectangle.mask = effectHalfCircle; | 
|---|
|  |  |  | 
|---|
|  |  |  | copiedSprite.rotation = sprite.rotation; | 
|---|
|  |  |  | copiedSprite.data = deepCopy(sprite.data); | 
|---|
|  |  |  | copiedSprite.data.uuid = generateID(); | 
|---|
|  |  |  | showSheflType(copiedSprite); | 
|---|
|  |  |  | return copiedSprite; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  | return options; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export const fetchMapData = async (intl) => { | 
|---|
|  |  |  | 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', {}, (res) => { | 
|---|
|  |  |  | const mapItemList = res.data.itemList; | 
|---|
|  |  |  | await Http.doPostPromise('api/map/list', { floor: curFloor }, (res) => { | 
|---|
|  |  |  | const mapItemList = eval(res.data); | 
|---|
|  |  |  | mapItemList.forEach(item => { | 
|---|
|  |  |  | let sprite; | 
|---|
|  |  |  | switch (item.type) { | 
|---|
|  |  |  | 
|---|
|  |  |  | sprite.data.uuid = item.uuid; | 
|---|
|  |  |  | sprite.data.no = item.no; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // dynamical data | 
|---|
|  |  |  | Object.assign(sprite.data, item.property); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | showSheflType(sprite); | 
|---|
|  |  |  | // graph | 
|---|
|  |  |  | sprite.position.set(item.positionX, item.positionY); | 
|---|
|  |  |  | sprite.scale.set(item.scaleX, item.scaleY); | 
|---|
|  |  |  | sprite.rotation = rotationParseNum(item.rotation); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | mapContainer.addChild(sprite); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export const saveMapData = async (intl) => { | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | mapItemList.push({ | 
|---|
|  |  |  | // data | 
|---|
|  |  |  | type: child.data.type, | 
|---|
|  |  |  | uuid: child.data.uuid, | 
|---|
|  |  |  | no: child.data.no, | 
|---|
|  |  |  | type: type, | 
|---|
|  |  |  | uuid: uuid, | 
|---|
|  |  |  | no: no, | 
|---|
|  |  |  | property: property, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // graph | 
|---|
|  |  |  | positionX: child.position.x, | 
|---|
|  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const closeLoading = message.loading({ content: intl.formatMessage({ id: 'common.loading.api.message', defaultMessage: '等待服务器......' }), duration: API_TIMEOUT }); | 
|---|
|  |  |  | await Http.doPostPromise('api/map/save', { itemList: mapItemList }, (res) => { | 
|---|
|  |  |  | await Http.doPostPromise('api/map/save', { | 
|---|
|  |  |  | itemList: mapItemList, | 
|---|
|  |  |  | floor: floor | 
|---|
|  |  |  | }, (res) => { | 
|---|
|  |  |  | closeLoading(); | 
|---|
|  |  |  | }).catch((error) => { | 
|---|
|  |  |  | closeLoading(); | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 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.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; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|