From bd6f16c7a6695606d7ebb5baa56eefe65b603cf2 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期二, 11 六月 2024 16:48:01 +0800 Subject: [PATCH] # --- src/core/warehouse.jsx | 64 ++++++++++++++++++++------------ 1 files changed, 40 insertions(+), 24 deletions(-) diff --git a/src/core/warehouse.jsx b/src/core/warehouse.jsx index 45969b1..b37c8ae 100644 --- a/src/core/warehouse.jsx +++ b/src/core/warehouse.jsx @@ -1,6 +1,7 @@ import { useState, useEffect, useRef, useMemo } from 'react'; import { useFrame } from '@react-three/fiber'; import * as THREE from 'three'; +import WebSocketClient from './websocket' import Tunnel from '../components/tunnel'; import Area from '../components/area'; import Shelf from '../components/shelf'; @@ -19,14 +20,30 @@ const Warehouse = (props) => { - const [agvData, setAgvData] = useState([ - {} - ]); - const [boxData, setBoxData] = useState([]) + const [agv1Data, setAgv1Data] = useState({}); + const [agv2Data, setAgv2Data] = useState({}); + const [boxData, setBoxData] = useState([]); useEffect(() => { + const websocket = new WebSocketClient('/ws/digitalTwin/websocket'); + websocket.connect(); + websocket.onMessage = (jsonStr) => { + const data = JSON.parse(jsonStr); + if (data.type === 'agv') { + switch (data.no) { + case "1": + setAgv1Data(data.obj); + break; + case "2": + setAgv2Data(data.obj); + break; + default: + break; + } + } + } + const timer = setInterval(() => { - console.log('do'); getBoxData().then(res => { // res.push({ // locNo: "A100301001", @@ -35,25 +52,20 @@ // lev: 1, // locSts: "STOCK", // }) + // console.log(res); setBoxData(res); }) - - getAgvData().then(res => { - // console.log(JSON.stringify(res)) - if (res && res.length > 0) { - setAgvData(res); - } - }) - - const agvRealData = agvRealDataList[index]; - if (agvRealData) { - // setAgvData(agvRealData); - } - index++; }, INTERVAL_TIME); return () => { - clearInterval(timer); + if (timer) { + clearInterval(timer); + } + + if (websocket) { + websocket.onMessage = (data) => { } + websocket.close(); + } } }, []) @@ -73,9 +85,13 @@ return boxData.map((data, idx) => <Box key={idx} {...data} />) }, [boxData]); - const agvEl = useMemo(() => { - return agvData.map((data, idx) => <Agv key={idx} {...data} />) - }, [agvData]); + const agv1El = useMemo(() => { + return <Agv key={1} {...agv1Data} /> + }, [agv1Data]); + + const agv2El = useMemo(() => { + return <Agv key={2} {...agv2Data} /> + }, [agv2Data]); useFrame((state, delta) => { @@ -88,8 +104,8 @@ {tunnelEl} {areaEl} {shelfEl} - {/* {shelfEl1} */} - {agvEl} + {agv1El} + {agv2El} {boxEl} </group> </> -- Gitblit v1.9.1