import { useState, useMemo, useRef, useEffect } from 'react';
|
import { useFrame } from '@react-three/fiber';
|
import { useFBX, useAnimations } from '@react-three/drei';
|
import * as THREE from 'three';
|
import { MODEL_BOX_SCALE } from '@/config/setting'
|
import * as Common from '../utils/common';
|
import { useStore } from '@/store';
|
|
const getShelfRow = (row) => {
|
return row;
|
}
|
|
const getShelfBay = (bay) => {
|
return bay - (bay - 1) % 3;
|
}
|
|
const getShelfLev = (lev) => {
|
return 1;
|
}
|
|
const getShelfNo = (row, bay, lev) => {
|
return getShelfRow(row) + '-' + getShelfBay(bay) + '-' + getShelfLev(lev);
|
}
|
|
const Box = (props) => {
|
const { row, bay, lev, position = [0, 300, 0], rotationY = 0 } = props;
|
const state = useStore();
|
|
const [pos, setPos] = useState([]);
|
|
const boxModel = useMemo(() => {
|
const fbx = useFBX('/models/box/box.fbx');
|
if (!fbx.castShadow) {
|
Common.setShadow(fbx);
|
}
|
fbx.scale.set(MODEL_BOX_SCALE, MODEL_BOX_SCALE, MODEL_BOX_SCALE);
|
return fbx.clone();
|
}, [])
|
|
useEffect(() => {
|
if (row && bay && lev) {
|
// from shelf
|
const shelfNo = getShelfNo(row, bay, lev);
|
const shelfPos = state.shelfList[shelfNo];
|
setPos(shelfPos);
|
} else {
|
// from agv
|
setPos(position);
|
}
|
}, [props]);
|
|
return (
|
<>
|
<group rotation-y={rotationY} position={pos}>
|
<primitive object={boxModel} castShadow />
|
</group>
|
</>
|
)
|
}
|
|
export default Box;
|