From b670c64208a10c789bc7ab61eddb1f8528ef8daa Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期一, 18 三月 2024 15:22:41 +0800 Subject: [PATCH] # --- zy-asrs-flow/src/pages/map/utils.js | 187 ++++++++++++++++++++++++++++++++++------------ 1 files changed, 138 insertions(+), 49 deletions(-) diff --git a/zy-asrs-flow/src/pages/map/utils.js b/zy-asrs-flow/src/pages/map/utils.js index fcb9d12..58fb2b2 100644 --- a/zy-asrs-flow/src/pages/map/utils.js +++ b/zy-asrs-flow/src/pages/map/utils.js @@ -1,5 +1,10 @@ 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' let app = null; let mapContainer = null; @@ -44,6 +49,21 @@ }; } +// 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, setDidClickSprite) => { sprite.off('pointerup'); @@ -55,13 +75,15 @@ let dragTarget; function onDragStart(event) { - setDidClickSprite(true); - dragTarget = event.currentTarget; - mapContainer.parent.off('pointermove'); - mapContainer.parent.on('pointermove', onDragMove, dragTarget); + if (event.button === 0) { + setDidClickSprite(true); + dragTarget = event.currentTarget; + mapContainer.parent.off('pointermove'); + mapContainer.parent.on('pointermove', onDragMove, dragTarget); - mapContainer.parent.off('pointerup'); - mapContainer.parent.on('pointerup', onDragEnd.bind(mapContainer)); + mapContainer.parent.off('pointerup'); + mapContainer.parent.on('pointerup', onDragEnd.bind(mapContainer)); + } } function onDragMove(event) { @@ -251,6 +273,20 @@ } } +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); } @@ -279,63 +315,116 @@ return options; } -/** - * // - let sprite = mapContainer.children[0]; - let bounds = sprite.getBounds(); - console.log(bounds, sprite.getLocalBounds()); - console.log(sprite.position); +export const fetchMapData = async (intl) => { + clearMapData(); + await Http.doPostPromise('api/map/list', {}, (res) => { + const mapItemList = res.data.itemList; + mapItemList.forEach(item => { + let sprite; + switch (item.type) { + case SENSOR_TYPE.SHELF: + sprite = PIXI.Sprite.from(shelf); + break; + case SENSOR_TYPE.AGV: + sprite = PIXI.Sprite.from(agv); + break; + default: + break; + } + if (sprite) { + initSprite(sprite, item.type); + // data + sprite.data.uuid = item.uuid; + sprite.data.no = item.no; - console.log('-'); + // graph + sprite.position.set(item.positionX, item.positionY); + sprite.scale.set(item.scaleX, item.scaleY); + sprite.rotation = rotationParseNum(item.rotation); + mapContainer.addChild(sprite); + } + }) - console.log(mapContainer.scale, mapContainer.position); + }).catch((error) => { + console.error(error); + }) - console.log('==========='); +} - - return; - */ - -export const adaptScreen = () => { - if (!mapContainer || !app) { +export const saveMapData = async (intl) => { + if (!mapContainer) { return; } - if (mapContainer.children.length === 0) { + + let mapItemList = []; + mapContainer?.children.forEach(child => { + if (child.data?.uuid) { + mapItemList.push({ + // data + type: child.data.type, + uuid: child.data.uuid, + no: child.data.no, + + // 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 }, (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 minX, maxX, minY, maxY; - for (let sprite of mapContainer.children) { - if (sprite?.data?.uuid) { - let bounds = sprite.getBounds(); - minX = minX !== undefined ? Math.min(minX, bounds.x) : bounds.x; - minY = minY !== undefined ? Math.min(minY, bounds.y) : bounds.y; - maxX = maxX !== undefined ? Math.max(maxX, bounds.x + bounds.width) : bounds.x + bounds.width; - maxY = maxY !== undefined ? Math.max(maxY, bounds.y + bounds.height) : bounds.y + bounds.height; - } - } - - let newScale = Math.min( - app.renderer.width / (maxX - minX) * 0.8, - app.renderer.height / (maxY - minY) * 0.8 - ); - + let bounds = sprite.getBounds(); let centerPoint = { - x: (minX + maxX) / 2 * mapContainer.scale.x, - y: (minY + maxY) / 2 * mapContainer.scale.y + x: bounds.x + bounds.width / 2, + y: bounds.y + bounds.height / 2 }; - new TWEEDLE.Tween(mapContainer.scale).easing(TWEEDLE.Easing.Quadratic.Out) - .to({ - x: newScale, - y: newScale - }, 200).start(); + 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({ - x: app.renderer.width / 2 - centerPoint.x * newScale, - y: app.renderer.height / 2 - centerPoint.y * newScale - }, 200).start(); + .to(targetPos, 500).start(); } \ No newline at end of file -- Gitblit v1.9.1