From 9d0acfb65c80c4948c305ca01338f894b87346a0 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期一, 08 四月 2024 09:44:37 +0800 Subject: [PATCH] Merge branch 'Four-Way-Rack' of http://47.97.1.152:5880/r/zy-asrs-master into Four-Way-Rack --- zy-asrs-flow/src/pages/map/utils.js | 194 +++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 174 insertions(+), 20 deletions(-) diff --git a/zy-asrs-flow/src/pages/map/utils.js b/zy-asrs-flow/src/pages/map/utils.js index a54f4b1..e77f217 100644 --- a/zy-asrs-flow/src/pages/map/utils.js +++ b/zy-asrs-flow/src/pages/map/utils.js @@ -3,14 +3,16 @@ 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' import point from '/public/img/map/point.svg' +import shuttle from '/public/img/map/shuttle.svg' let app = null; let mapContainer = null; let notify = null; -let effectTick, effectHalfCircle, effectRectangle; +let selectedSprite, effectTick, effectHalfCircle, effectRectangle; export function syncApp(param) { app = param; @@ -34,14 +36,30 @@ export const SENSOR_TYPE = Object.freeze({ SHELF: "SHELF", + SHUTTLE: "SHUTTLE", POINT: "POINT", AGV: "AGV", +}) + +export const SENSOR_ZINDEX = Object.freeze({ + SHELF: 1, + POINT: 1, + SHUTTLE: 100, + AGV: 100, }) 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) => { @@ -52,6 +70,39 @@ } } +export const generateSprite = (sensorType) => { + let sprite; + switch (sensorType) { + case SENSOR_TYPE.SHUTTLE: + sprite = new PIXI.Sprite(PIXI.Texture.from(shuttle, { resourceOptions: { scale: 5 } })); + sprite.width = 50; + sprite.height = 50; + sprite.zIndex = SENSOR_ZINDEX.SHUTTLE; + break; + case SENSOR_TYPE.AGV: + sprite = new PIXI.Sprite(PIXI.Texture.from(agv, { resourceOptions: { scale: 5 } })); + sprite.width = 50; + sprite.height = 50; + sprite.zIndex = SENSOR_ZINDEX.AGV; + break; + case SENSOR_TYPE.SHELF: + sprite = new PIXI.Sprite(PIXI.Texture.from(shelf, { resourceOptions: { scale: 1 } })); + sprite.width = 60; + sprite.height = 60; + sprite.zIndex = SENSOR_ZINDEX.SHELF; + break; + case SENSOR_TYPE.POINT: + sprite = new PIXI.Sprite(PIXI.Texture.from(point, { resourceOptions: { scale: 5 } })); + sprite.width = 10; + sprite.height = 10; + sprite.zIndex = SENSOR_ZINDEX.POINT; + break; + default: + break; + } + return sprite; +} + export const initSprite = (sprite, type) => { sprite.anchor.set(0.5); sprite.cursor = 'pointer'; @@ -60,6 +111,17 @@ type: type, uuid: generateID() }; +} + +export const querySprite = (type, no) => { + if (!mapContainer) { + return; + } + for (const sprite of mapContainer.children) { + if (sprite.data?.type === type && sprite.data?.no === no) { + return sprite; + } + } } // show sprite feature from sprite click event @@ -209,12 +271,14 @@ effectHalfCircle.endFill(); effectHalfCircle.position.set(sprite.x, sprite.y); effectHalfCircle.scale.set(1 / scale); + effectHalfCircle.zIndex = 9999; effectRectangle = new PIXI.Graphics(); effectRectangle.lineStyle(5 * scale, color, 1); effectRectangle.drawRoundedRect(0, 0, sideLen, sideLen, 16 * scale); effectRectangle.endFill(); effectRectangle.mask = effectHalfCircle; + effectRectangle.zIndex = 9999; const scaledWidth = sideLen * (1 / scale); const scaledHeight = sideLen * (1 / scale); @@ -224,6 +288,8 @@ mapContainer.addChild(effectRectangle); mapContainer.addChild(effectHalfCircle); + + selectedSprite = sprite; let phase = 0; effectTick = (delta) => { @@ -235,6 +301,21 @@ }; app.ticker.add(effectTick); +} + +export const updateEffect = (sprite) => { + if (!sprite || sprite !== selectedSprite || !effectRectangle || !effectHalfCircle) { + return + } + const { width, height } = sprite; + const scale = sprite.scale.x; + const sideLen = (Math.max(width, height) + 10) * scale; + const scaledWidth = sideLen * (1 / scale); + const scaledHeight = sideLen * (1 / scale); + + effectRectangle.position.set(sprite.x - scaledWidth / 2, sprite.y - scaledHeight / 2); + + effectHalfCircle.position.set(sprite.x, sprite.y); } export const removeSelectedEffect = () => { @@ -249,17 +330,21 @@ mapContainer.removeChild(effectRectangle); effectRectangle = null; } + selectedSprite = null; } export const copySprite = (sprite) => { - const copiedSprite = new PIXI.Sprite(sprite.texture); + // const copiedSprite = new PIXI.Sprite(sprite.texture); + const copiedSprite = generateSprite(sprite.data.type) 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(); - showSheflType(copiedSprite); + if (copiedSprite.data.type === SENSOR_TYPE.SHELF) { + showSheflType(copiedSprite); + } return copiedSprite; } @@ -315,6 +400,12 @@ label: intl.formatMessage({ id: 'map.sensor.type.shelf', defaultMessage: '璐ф灦' }) }) break; + case SENSOR_TYPE.SHUTTLE: + options.push({ + value: value, + label: intl.formatMessage({ id: 'map.sensor.type.shuttle', defaultMessage: '绌挎杞�' }) + }) + break; case SENSOR_TYPE.AGV: options.push({ value: value, @@ -335,25 +426,21 @@ return options; } +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', { floor: curFloor }, (res) => { const mapItemList = eval(res.data); 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; - case SENSOR_TYPE.POINT: - sprite = PIXI.Sprite.from(point); - break; - default: - break; - } + const sprite = generateSprite(item.type); if (sprite) { initSprite(sprite, item.type); // data @@ -376,7 +463,6 @@ }).catch((error) => { console.error(error); }) - } export const saveMapData = async (intl, floor) => { @@ -462,8 +548,8 @@ .to(targetPos, 500).start(); } -export const mapNotify = (msg) => { - notify.open({ +export const mapNotify = (msg, type = NOTIFY_TYPE.OPEN) => { + notify[type]({ description: msg, duration: 1.5, style: { width: 300 }, @@ -509,4 +595,72 @@ } else { return false; } +} + +export const parseLocNo = (locNo) => { + if (!locNo || typeof locNo !== 'string') { + return null; + } + const locParseArr = locNo.split('-'); + return { + row: locParseArr?.[0], + bay: locParseArr?.[1], + lev: locParseArr?.[2], + } +} + +export const generateLocNo = (row, bay, lev) => { + return row + '-' + bay + '-' + lev; +} + +export const updateMapStatusInRealTime = (data) => { + const mapVo = JSON.parse(data); + // shuttle + for (const shuttleVo of mapVo.shuttleVos) { + + const shuttle = querySprite(SENSOR_TYPE.SHUTTLE, shuttleVo.shuttleNo); + if (!shuttle && !shuttleVo.curLocNo) { continue; } + const { row, bay, lev } = parseLocNo(shuttleVo.curLocNo); + const shelf = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); + if (!shelf) { continue; } + + drawPreTravelPath(shuttleVo.preTravelPath) + + new TWEEDLE.Tween(shuttle?.position).easing(TWEEDLE.Easing.Linear.None).to({ + x: shelf.position.x, + y: shelf.position.y + }, 1000).onUpdate(() => { + updateEffect(shuttle); + }).start(); + } +} + + +export const drawPreTravelPath = (path) => { + if (!mapContainer) { + return; + } + + let graphics = mapContainer.getChildByName('preTravelPath'); + if (graphics) mapContainer.removeChild(graphics); + + graphics = new PIXI.Graphics(); + graphics.name = 'preTravelPath'; + graphics.lineStyle(3 * (1 / mapContainer.scale.x), 0x3498db, 1); + graphics.zIndex = 9999; + for (let i = 0; i < path.length; i++) { + const { row, bay, lev } = parseLocNo(path[i]); + const shelf = querySprite(SENSOR_TYPE.SHELF, row + '-' + bay); + + if (!shelf) continue; + let position = shelf.position; + let x = position.x; + let y = position.y; + if (i === 0) { + graphics.moveTo(x, y); + } else { + graphics.lineTo(x, y); + } + } + mapContainer.addChild(graphics); } \ No newline at end of file -- Gitblit v1.9.1