From f97ee12c96d96e2f529e4248695d643245ec4243 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期二, 20 八月 2024 15:21:56 +0800
Subject: [PATCH] #

---
 src/core/warehouse.jsx |   99 +++++++++++++++++++++++++++++++++++++++----------
 1 files changed, 79 insertions(+), 20 deletions(-)

diff --git a/src/core/warehouse.jsx b/src/core/warehouse.jsx
index 035b9f3..b8af939 100644
--- a/src/core/warehouse.jsx
+++ b/src/core/warehouse.jsx
@@ -1,40 +1,84 @@
 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';
 import Box from '../components/box';
 import Agv from '../components/agv';
+import Path from '../components/path'
 
 import tunnelData from '@/assets/data/tunnel';
+import areaData from '@/assets/data/area';
 import shelfData from '@/assets/data/shelf';
 import agvRealDataList from '@/assets/data/agv';
+import { getBoxData } from '../api/box';
+import { getAgvData } from '../api/agv';
 import { INTERVAL_TIME } from '@/config/setting'
 
 let index = 0;
 
 const Warehouse = (props) => {
 
-    const [agvData, setAgvData] = useState([
-        {}
-        ,
-        {}
-    ]);
-    const [boxData, setBoxData] = useState([
-        {}
-    ])
+    const [agv1Data, setAgv1Data] = useState({});
+    const [agv2Data, setAgv2Data] = useState({});
+    const [boxData, setBoxData] = useState([]);
+    const [path1Data, setPath1Data] = useState([]);
 
     useEffect(() => {
-        const timer = setInterval(() => {
-            const agvRealData = agvRealDataList[index];
-            if (agvRealData) {
-                setAgvData(agvRealData);
+        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;
+                }
             }
-            index++;
-        }, INTERVAL_TIME * 1.1);
+            if (data.type === 'path') {
+                switch (data.no) {
+                    case "1":
+                        setPath1Data(data.obj);
+                        break;
+                    case "2":
+                        break;
+                    default:
+                        break;
+                }
+            }
+        }
+
+        const timer = setInterval(() => {
+            getBoxData().then(res => {
+                // res.push({
+                //     locNo: "A100301001",
+                //     row: 3,
+                //     bay: 1,
+                //     lev: 1,
+                //     locSts: "STOCK",
+                // })
+                // console.log(res);
+                setBoxData(res);
+            })
+        }, INTERVAL_TIME);
 
         return () => {
-            clearInterval(timer);
+            if (timer) {
+                clearInterval(timer);
+            }
+
+            if (websocket) {
+                websocket.onMessage = (data) => { }
+                websocket.close();
+            }
         }
     }, [])
 
@@ -42,17 +86,29 @@
         return tunnelData.map((data, index) => <Tunnel key={index} {...data} />)
     }, []);
 
+    const areaEl = useMemo(() => {
+        return areaData.map((area, index) => <Area key={index} {...area} />)
+    }, []);
+
     const shelfEl = useMemo(() => {
         return shelfData.map((data, index) => <Shelf key={index} {...data} />)
     }, []);
 
-    const agvEl = useMemo(() => {
-        return agvData.map((data, idx) => <Agv key={idx} {...data} />)
-    }, [agvData]);
-
     const boxEl = useMemo(() => {
         return boxData.map((data, idx) => <Box key={idx} {...data} />)
     }, [boxData]);
+
+    const agv1El = useMemo(() => {
+        return <Agv key={1} {...agv1Data} />
+    }, [agv1Data]);
+
+    const agv2El = useMemo(() => {
+        return <Agv key={2} {...agv2Data} />
+    }, [agv2Data]);
+
+    const path1El = useMemo(() => {
+        return <Path list={path1Data} />
+    }, [path1Data])
 
     useFrame((state, delta) => {
 
@@ -62,9 +118,12 @@
         <>
             <group>
                 {tunnelEl}
+                {areaEl}
                 {shelfEl}
-                {agvEl}
+                {agv1El}
+                {agv2El}
                 {boxEl}
+                {path1El}
             </group>
         </>
     )

--
Gitblit v1.9.1