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 | 83 ++++++++++++++++++++++++++++++----------- 1 files changed, 60 insertions(+), 23 deletions(-) diff --git a/zy-asrs-flow/src/pages/map/utils.js b/zy-asrs-flow/src/pages/map/utils.js index de532ab..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", }) @@ -105,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'); @@ -115,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 = { @@ -134,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; } } } @@ -151,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; @@ -187,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); @@ -198,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; @@ -307,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; } @@ -315,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 +343,9 @@ case SENSOR_TYPE.AGV: sprite = PIXI.Sprite.from(agv); break; + case SENSOR_TYPE.POINT: + sprite = PIXI.Sprite.from(point); + break; default: break; } @@ -336,6 +354,9 @@ // data 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); @@ -351,7 +372,7 @@ } -export const saveMapData = async (intl) => { +export const saveMapData = async (intl, floor) => { if (!mapContainer) { return; } @@ -359,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, @@ -376,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(); @@ -411,20 +437,31 @@ return; } - // 鑾峰彇 sprite 鐨勪腑蹇冪偣鍧愭爣 + 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 }; - // 璁$畻 sprite 搴斿綋骞崇Щ鐨勫儚绱犻噺浠ヨ兘澶熷皢鍏舵斁缃埌灞忓箷涓績 let targetPos = { - x: app.renderer.width / 2 - centerPoint.x * this.scale, - y: app.renderer.height / 2 - centerPoint.y * this.scale + x: app.renderer.width / 3 - centerPoint.x * mapContainer.scale.x, + y: app.renderer.height / 3 - centerPoint.y * mapContainer.scale.y }; - // 浣跨敤 TWEEDLE.Tween 鍔ㄧ敾搴撲负骞崇Щ杩囩▼娣诲姞杩囨浮鏁堟灉 new TWEEDLE.Tween(mapContainer.position).easing(TWEEDLE.Easing.Quadratic.Out) - .to(targetPos, 200).start(); + .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