| | |
| | | import { useState, useEffect, useRef, useMemo } from 'react'; |
| | | import { useFrame } from '@react-three/fiber'; |
| | | import * as THREE from 'three'; |
| | | import Agv from '../components/agv'; |
| | | import Box from '../components/box'; |
| | | import tunnelData from '../assets/data/tunnel'; |
| | | import Tunnel from '../components/tunnel'; |
| | | import Shelf from '../components/shelf'; |
| | | import Box from '../components/box'; |
| | | import Agv from '../components/agv'; |
| | | |
| | | import tunnelData from '@/assets/data/tunnel'; |
| | | import shelfData from '@/assets/data/shelf'; |
| | | import agvRealDataList from '@/assets/data/agv'; |
| | | import { INTERVAL_TIME } from '@/config/setting' |
| | | |
| | | let index = 0; |
| | | |
| | | const Warehouse = (props) => { |
| | | |
| | | const [agvData, setAgvData] = useState([ |
| | | {} |
| | | , |
| | | {} |
| | | ]); |
| | | |
| | | const [boxData, setBoxData] = useState([ |
| | | {} |
| | | ]) |
| | | |
| | | useEffect(() => { |
| | | const timer = setInterval(() => { |
| | | const agvRealData = agvRealDataList[index]; |
| | | if (agvRealData) { |
| | | setAgvData(agvRealData); |
| | | } |
| | | index++; |
| | | }, INTERVAL_TIME * 1.1); |
| | | |
| | | return () => { |
| | | clearInterval(timer); |
| | | } |
| | | }, []) |
| | | |
| | | const tunnelEl = useMemo(() => { |
| | | return tunnelData.map((tunnel, index) => <Tunnel key={index} {...tunnel} />) |
| | | return tunnelData.map((data, index) => <Tunnel key={index} {...data} />) |
| | | }, []); |
| | | |
| | | const agvEl = agvData.map((data, idx) => <Agv key={idx} {...data} />) |
| | | const shelfEl = useMemo(() => { |
| | | return shelfData.map((data, index) => <Shelf key={index} {...data} />) |
| | | }, []); |
| | | |
| | | const boxEl = boxData.map((data, idx) => <Box key={idx} {...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]); |
| | | |
| | | useFrame((state, delta) => { |
| | | // setAgvData(); |
| | | // setBoxData(); |
| | | |
| | | }) |
| | | |
| | | return ( |
| | | <> |
| | | <group> |
| | | {tunnelEl} |
| | | {shelfEl} |
| | | {agvEl} |
| | | {boxEl} |
| | | </group> |