From 43fffc8b0d2ea88f379e8c72385bdfb42bb88108 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期六, 16 三月 2024 16:03:54 +0800 Subject: [PATCH] # --- zy-asrs-flow/src/pages/map/utils.js | 230 +++++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 222 insertions(+), 8 deletions(-) diff --git a/zy-asrs-flow/src/pages/map/utils.js b/zy-asrs-flow/src/pages/map/utils.js index 574803e..58fb2b2 100644 --- a/zy-asrs-flow/src/pages/map/utils.js +++ b/zy-asrs-flow/src/pages/map/utils.js @@ -1,4 +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; @@ -20,6 +26,11 @@ SELECTION_BOX: Symbol.for(0), }) +export const SENSOR_TYPE = Object.freeze({ + SHELF: "SHELF", + AGV: "AGV", +}) + export const getRealPosition = (x, y, mapContainer) => { const rect = app.view.getBoundingClientRect(); return { @@ -33,8 +44,24 @@ sprite.cursor = 'pointer'; sprite.eventMode = 'static'; sprite.data = { - type: type + type: type, + uuid: generateID() }; +} + +// 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 @@ -48,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) { @@ -187,7 +216,9 @@ effectTick = (delta) => { phase += delta / 10; phase %= (Math.PI * 2); - effectHalfCircle.rotation = phase; + if (effectHalfCircle) { + effectHalfCircle.rotation = phase; + } }; app.ticker.add(effectTick); @@ -207,10 +238,193 @@ } } +export const copySprite = (sprite) => { + const copiedSprite = new PIXI.Sprite(sprite.texture); + 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(); + 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 sensorTypeSelectOptions = (intl) => { + let options = []; + Object.entries(SENSOR_TYPE).forEach(([key, value]) => { + switch (key) { + case SENSOR_TYPE.SHELF: + options.push({ + value: value, + label: intl.formatMessage({ id: 'map.sensor.type.shelf', defaultMessage: '璐ф灦' }) + }) + break; + case SENSOR_TYPE.AGV: + options.push({ + value: value, + label: intl.formatMessage({ id: 'map.sensor.type.agv', defaultMessage: '鏃犱汉灏忚溅' }) + }) + break; + default: + break; + } + + }) + return options; +} + +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; + + // graph + sprite.position.set(item.positionX, item.positionY); + sprite.scale.set(item.scaleX, item.scaleY); + sprite.rotation = rotationParseNum(item.rotation); + mapContainer.addChild(sprite); + } + }) + + }).catch((error) => { + console.error(error); + }) + +} + +export const saveMapData = async (intl) => { + if (!mapContainer) { + return; + } + + 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 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(); } \ No newline at end of file -- Gitblit v1.9.1