|  |  | 
 |  |  |     useEffect(() => { | 
 |  |  |         const timer = setInterval(() => { | 
 |  |  |             getBoxData().then(res => { | 
 |  |  |                 // res.push({ | 
 |  |  |                 //     locNo: "A100301001", | 
 |  |  |                 //     row: 3, | 
 |  |  |                 //     bay: 1, | 
 |  |  |                 //     lev: 1, | 
 |  |  |                 //     locSts: "STOCK", | 
 |  |  |                 // }) | 
 |  |  |                 // console.log(res); | 
 |  |  |                 setBoxData(res); | 
 |  |  |             }) | 
 |  |  |  | 
 |  |  |             getAgvData().then(res => { | 
 |  |  |                 // setAgvData(res); | 
 |  |  |                 // console.log(JSON.stringify(res)) | 
 |  |  |                 if (res && res.length > 0) { | 
 |  |  |                     setAgvData(res); | 
 |  |  |                 } | 
 |  |  |             }) | 
 |  |  |  | 
 |  |  |             const agvRealData = agvRealDataList[index]; | 
 |  |  |             if (agvRealData) { | 
 |  |  |                 setAgvData(agvRealData); | 
 |  |  |                 // setAgvData(agvRealData); | 
 |  |  |             } | 
 |  |  |             index++; | 
 |  |  |         }, INTERVAL_TIME * 1.1); | 
 |  |  |         }, INTERVAL_TIME); | 
 |  |  |  | 
 |  |  |         return () => { | 
 |  |  |             clearInterval(timer); | 
 |  |  | 
 |  |  |         return shelfData.map((data, index) => <Shelf key={index} {...data} />) | 
 |  |  |     }, []); | 
 |  |  |  | 
 |  |  |     const shelfEl1 = useMemo(() => { | 
 |  |  |         return shelfData.slice(0, 1).map((data, index) => <Shelf key={index} {...data} />) | 
 |  |  |     }, []); | 
 |  |  |  | 
 |  |  |     const boxEl = useMemo(() => { | 
 |  |  |         return boxData.map((data, idx) => <Box key={idx} {...data} />) | 
 |  |  |     }, [boxData]); | 
 |  |  |      | 
 |  |  |  | 
 |  |  |     const agvEl = useMemo(() => { | 
 |  |  |         return agvData.map((data, idx) => <Agv key={idx} {...data} />) | 
 |  |  |     }, [agvData]); | 
 |  |  | 
 |  |  |                 {tunnelEl} | 
 |  |  |                 {areaEl} | 
 |  |  |                 {shelfEl} | 
 |  |  |                 {/* {shelfEl1} */} | 
 |  |  |                 {/* {agvEl} */} | 
 |  |  |                 {agvEl} | 
 |  |  |                 {boxEl} | 
 |  |  |             </group> | 
 |  |  |         </> |