From 9f4a1cf5f91f85c49d3e609f19c9e833a08ca8ee Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期五, 22 三月 2024 08:29:48 +0800 Subject: [PATCH] # --- zy-asrs-flow/src/pages/map/utils.js | 97 +++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 78 insertions(+), 19 deletions(-) diff --git a/zy-asrs-flow/src/pages/map/utils.js b/zy-asrs-flow/src/pages/map/utils.js index 61be79d..227f565 100644 --- a/zy-asrs-flow/src/pages/map/utils.js +++ b/zy-asrs-flow/src/pages/map/utils.js @@ -5,9 +5,11 @@ import { API_TIMEOUT } from '@/config/setting' import agv from '/public/img/map/agv.svg' import shelf from '/public/img/map/shelf.png' +import point from '/public/img/map/point.svg' let app = null; let mapContainer = null; +let notify = null; let effectTick, effectHalfCircle, effectRectangle; export function syncApp(param) { @@ -16,6 +18,10 @@ export function syncMapContainer(param) { mapContainer = param; +} + +export function syncNotify(param) { + notify = param; } export function getMapContainer() { @@ -28,6 +34,7 @@ export const SENSOR_TYPE = Object.freeze({ SHELF: "SHELF", + POINT: "POINT", AGV: "AGV", }) @@ -56,7 +63,6 @@ sprite.off('pointerdown'); sprite.off('click'); - let viewTarget; sprite.on("click", onClick); function onClick(event) { @@ -106,7 +112,7 @@ } // 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'); @@ -116,18 +122,18 @@ 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 = { @@ -135,8 +141,8 @@ 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; } } } @@ -152,13 +158,15 @@ 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; @@ -188,7 +196,7 @@ 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); @@ -199,7 +207,7 @@ 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; @@ -308,6 +316,12 @@ label: intl.formatMessage({ id: 'map.sensor.type.agv', defaultMessage: '鏃犱汉灏忚溅' }) }) break; + case SENSOR_TYPE.POINT: + options.push({ + value: value, + label: intl.formatMessage({ id: 'map.sensor.type.point', defaultMessage: '瀹氫綅鐐�' }) + }) + break; default: break; } @@ -316,10 +330,10 @@ return options; } -export const fetchMapData = async (intl) => { +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) { @@ -328,6 +342,9 @@ break; case SENSOR_TYPE.AGV: sprite = PIXI.Sprite.from(agv); + break; + case SENSOR_TYPE.POINT: + sprite = PIXI.Sprite.from(point); break; default: break; @@ -338,6 +355,9 @@ sprite.data.uuid = item.uuid; sprite.data.no = item.no; + // dynamical data + Object.assign(sprite.data, item.property); + // graph sprite.position.set(item.positionX, item.positionY); sprite.scale.set(item.scaleX, item.scaleY); @@ -345,14 +365,14 @@ mapContainer.addChild(sprite); } }) - + }).catch((error) => { console.error(error); }) } -export const saveMapData = async (intl) => { +export const saveMapData = async (intl, floor) => { if (!mapContainer) { return; } @@ -360,11 +380,13 @@ 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, @@ -377,7 +399,10 @@ }) 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(); @@ -405,4 +430,38 @@ }); 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) => { + notify.open({ + description: msg, + duration: 1.5, + style: { width: 300 }, + placement: 'bottom', + closeIcon: false, + onClick: () => { } + }); } \ No newline at end of file -- Gitblit v1.9.1