From 1e400eaffd9de4dc13c6b45cf6b805a3b26da3c0 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期三, 11 十二月 2024 16:47:50 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/tool.js | 93 +++++++++++++++++++++++++++------------------- 1 files changed, 54 insertions(+), 39 deletions(-) diff --git a/zy-acs-flow/src/map/tool.js b/zy-acs-flow/src/map/tool.js index 7afefdb..bdd7690 100644 --- a/zy-acs-flow/src/map/tool.js +++ b/zy-acs-flow/src/map/tool.js @@ -1,14 +1,15 @@ import * as PIXI from 'pixi.js'; import * as TWEEDLE from 'tweedle.js'; import { + MAP_DEFAULT_ROTATION, DEVICE_TYPE, DEVICE_Z_INDEX, AGV_STATUS_MODE, DEVICE_SPRITE_TINT, + DEVICE_SPRITE_TINT_DARK, DEVICE_SELECTED_EFFECT_PADDING, DEVICE_SELECTED_EFFECT_COLOR, POINT_ROUTE_DIRECTION, - DEVICE_SPRITE_TINT_DARK, ANIMATE_DURING_TIME, } from './constants'; import { getRouteList } from './http'; @@ -54,29 +55,25 @@ export function setThemeMode(param) { themeMode = param; if (mapContainer) { - // mapContainer.children.forEach(child => { - // const deviceType = child.data?.type; - // if (deviceType) { - // if (themeMode === 'dark') { - // const tint = DEVICE_SPRITE_TINT_DARK[deviceType] - // if (tint) { - // child.tint = tint; - // } - // } else { - // DEVICE_SPRITE_TINT[deviceType] != null && (child.tint = DEVICE_SPRITE_TINT[deviceType]); - // } - // } - // }) + mapContainer.children.forEach(child => { + const deviceType = child.data?.type; + if (deviceType) { + if (themeMode === 'dark') { + DEVICE_SPRITE_TINT_DARK[deviceType] != null && (child.tint = DEVICE_SPRITE_TINT_DARK[deviceType]); + } else { + DEVICE_SPRITE_TINT[deviceType] != null && (child.tint = DEVICE_SPRITE_TINT[deviceType]); + } + } + }) } } export const getRealPosition = (x, y) => { - const rect = app.view.getBoundingClientRect(); - return { - mapX: (x - rect.left) / mapContainer.scale.x - mapContainer.x / mapContainer.scale.x, - mapY: (y - rect.top) / mapContainer.scale.y - mapContainer.y / mapContainer.scale.y - } + const globalPoint = new PIXI.Point(); + app.renderer.plugins.interaction.mapPositionToPoint(globalPoint, x, y); + const mapPoint = mapContainer.toLocal(globalPoint); + return { mapX: mapPoint.x, mapY: mapPoint.y }; } export const generateSprite = (deviceType, texture) => { @@ -492,22 +489,30 @@ effectCircle.position.set(selectedSprite.x, selectedSprite.y); }; -export const showRoutes = (curZone, setShowRoutes) => { - setShowRoutes(true); - getRouteList(curZone, (routeList) => { - routeList.forEach(route => { - const startPoint = querySprite(DEVICE_TYPE.POINT, route.startCodeStr); - const endPoint = querySprite(DEVICE_TYPE.POINT, route.endCodeStr); - const pointRoute = new PointRoute(POINT_ROUTE_DIRECTION[route.direction]); - pointRoute.setPoint(startPoint, endPoint); - pointRoute.clear(); - pointRoute.lineStyle(Math.max(7, 2 * (1 / mapContainer.scale.x)), themeMode === 'light' ? '#ced6e0' : '#535c68'); - pointRoute.moveTo(startPoint.position.x, startPoint.position.y); - pointRoute.lineTo(endPoint.position.x, endPoint.position.y); - pointRoute.alpha = 1; - mapContainer.addChild(pointRoute); - }) - }) +export const showRoutes = (curZone, setShowRoutes, setLoading) => { + setLoading(true); + getRouteList( + curZone, + (routeList) => { + routeList.forEach(route => { + const startPoint = querySprite(DEVICE_TYPE.POINT, route.startCodeStr); + const endPoint = querySprite(DEVICE_TYPE.POINT, route.endCodeStr); + const pointRoute = new PointRoute(POINT_ROUTE_DIRECTION[route.direction]); + pointRoute.setPoint(startPoint, endPoint); + pointRoute.clear(); + pointRoute.lineStyle(Math.max(7, 2 * (1 / mapContainer.scale.x)), themeMode === 'light' ? '#ced6e0' : '#535c68'); + pointRoute.moveTo(startPoint.position.x, startPoint.position.y); + pointRoute.lineTo(endPoint.position.x, endPoint.position.y); + pointRoute.alpha = 1; + mapContainer.addChild(pointRoute); + }) + setLoading(false); + setShowRoutes(true); + }, + () => { + setLoading(false); + }, + ) }; export const hideRoutes = (curZone, setShowRoutes) => { @@ -661,7 +666,7 @@ const agvRotationOffset = rotationParseNum(agvRotationOffsetDegrees); const showAgvSprite = (curZone, agvVo, setCurSprite) => { - const { agvNo, code, direction, battery, backpack } = agvVo; + const { agvNo, code, direction, battery, backpack, error } = agvVo; if (!code) { return; } const codeSprite = querySprite(DEVICE_TYPE.POINT, code); if (!codeSprite) { return; } @@ -691,12 +696,12 @@ fill: 0x000000, }); agvText.anchor.set(0.5, 0.5); - agvText.position.set(0, 5); + agvText.position.set(0, 8); agvSprite.addChild(agvText); agvSprite.updateTextRotation = () => { if (agvText && agvSprite) { - agvText.rotation = -agvSprite.rotation; + agvText.rotation = -agvSprite.rotation - rotationParseNum(MAP_DEFAULT_ROTATION); } }; agvSprite.updateTextRotation(); @@ -715,6 +720,14 @@ } animateRotation(agvSprite, targetRotation + agvRotationOffset, agvRotationOffset); + } + + if (error) { + agvSprite.tint = 0xff3f34; + } else { + agvSprite.tint = themeMode === 'dark' + ? DEVICE_SPRITE_TINT_DARK[DEVICE_TYPE.AGV] + : DEVICE_SPRITE_TINT[DEVICE_TYPE.AGV]; } beInsight(agvSprite, setCurSprite); @@ -741,7 +754,9 @@ } agvPath = new PIXI.Graphics(); agvPath.name = agvPathName; - agvPath.lineStyle(Math.max(20, 4 * (1 / mapContainer?.scale.x || 1)), 0x2f68ac, 0.8); + agvPath.lineStyle(Math.max(20, 4 * (1 / mapContainer?.scale.x || 1)) + , themeMode === 'dark' ? 0x40739e : 0x2f68ac + , 0.8); agvPath.zIndex = DEVICE_Z_INDEX.DYNAMIC_ROUTE; // agvPath.blendMode = PIXI.BLEND_MODES.NORMAL; -- Gitblit v1.9.1