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 Box from './box';
|
import * as Common from '../utils/common';
|
import * as TWEEN from "@tweenjs/tween.js";
|
import {
|
INTERVAL_TIME,
|
MODEL_AGV_SCALE,
|
REAL_COMPARE_MAP_SCALE,
|
REAL_COMPARE_MAP_OFFSET_X,
|
REAL_COMPARE_MAP_OFFSET_Z,
|
} from '../config/setting'
|
|
const getCorrectForkDis = (loaderAngle, forkDis) => {
|
if (loaderAngle > 360 - 10 || loaderAngle < 0 + 10) {
|
return -forkDis;
|
}
|
if (loaderAngle > 180 - 10 && loaderAngle < 180 + 10) {
|
return -forkDis;
|
}
|
if (loaderAngle > 270 - 10 && loaderAngle < 270 + 10) {
|
return forkDis;
|
}
|
if (loaderAngle > 90 - 10 && loaderAngle < 90 + 10) {
|
return forkDis;
|
}
|
return forkDis;
|
}
|
|
const getLoaderHasBox = (loaderAngle, finger1, finger2, finger3, finger4) => {
|
// console.log(loaderAngle, finger1, finger2, finger3, finger4);
|
if (loaderAngle > 360 - 10 || loaderAngle < 0 + 10) {
|
return finger1 && finger2; // 取货是对的 放货是对的
|
}
|
if (loaderAngle > 180 - 10 && loaderAngle < 180 + 10) {
|
return finger3 && finger4; // 放货是对的 取货是错的
|
/**
|
* 放货 (左边)
|
* 34agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
35agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
32agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
39agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
34agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
38agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
agv.jsx:33 180 false false true true
|
36agv.jsx:33 180 false false false false
|
warehouse.jsx:29 do
|
30agv.jsx:33 180 false false false false
|
warehouse.jsx:29 do
|
37agv.jsx:33 180 false false false false
|
warehouse.jsx:29 do
|
4agv.jsx:33 180 false false false false
|
warehouse.jsx:29 do
|
36agv.jsx:33 180 false false false false
|
|
*
|
*
|
* 取货(左边)
|
* 180 false false true true
|
warehouse.jsx:29 do
|
30agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
31agv.jsx:33 180 false false true true
|
warehouse.jsx:29 do
|
4agv.jsx:33 180 false false true true
|
32agv.jsx:33 180 true true true true
|
warehouse.jsx:29 do
|
34agv.jsx:33 180 true true true true
|
warehouse.jsx:29 do
|
2agv.jsx:33 180 true true true true
|
*/
|
}
|
if (loaderAngle > 270 - 10 && loaderAngle < 270 + 10) {
|
return finger1 && finger2;
|
}
|
if (loaderAngle > 90 - 10 && loaderAngle < 90 + 10) {
|
return finger1 && finger2; // 放货是对的
|
}
|
return finger1 && finger2 && finger3 && finger4;
|
}
|
|
const Agv = (props) => {
|
const { agvNo, position, trayList, hasBox, finger1, finger2, finger3, finger4 } = props;
|
const theta = -props.theta;
|
const height = props.height * 0.0655;
|
const forkLength = props.forkLength * 0.1;
|
// console.log(props.forkLength);
|
const loaderTheta = Number(props.loaderTheta?.toFixed(1));
|
|
const [groupPos, setGroupPos] = useState({ x: 0, y: 0, z: 0 });
|
const [groupTheta, setGroupTheta] = useState(0);
|
const [loaderHeight, setLoaderHeight] = useState(0);
|
const [loaderAngle, setLoaderAngle] = useState(0);
|
const [forkDis, setForkDis] = useState(0);
|
const [realTrayList, setRealTrayList] = useState([]);
|
|
useEffect(() => {
|
if (!props || Object.keys(props).length === 0) {
|
return;
|
}
|
|
// group position
|
const pos = {
|
x: position?.[2] * REAL_COMPARE_MAP_SCALE + REAL_COMPARE_MAP_OFFSET_X,
|
y: position?.[1] * REAL_COMPARE_MAP_SCALE,
|
z: position?.[0] * REAL_COMPARE_MAP_SCALE + REAL_COMPARE_MAP_OFFSET_Z,
|
}
|
if (!Common.deepEqual(groupPos, pos) && props.position !== null) {
|
new TWEEN.Tween(groupPos)
|
.to(pos, INTERVAL_TIME)
|
.easing(TWEEN.Easing.Linear.None)
|
.onUpdate((e) => {
|
setGroupPos({ ...e });
|
})
|
.onComplete((e) => {
|
setGroupPos({ ...e });
|
}).start();
|
}
|
|
// group theta
|
if (groupTheta !== theta && props.theta !== null) {
|
const targetTheta = Common.normalizeAngle(theta - groupTheta) + groupTheta;
|
new TWEEN.Tween({ value: groupTheta })
|
.to({ value: targetTheta }, INTERVAL_TIME)
|
.easing(TWEEN.Easing.Linear.None)
|
.onUpdate((e) => {
|
setGroupTheta(e.value)
|
})
|
.onComplete((e) => {
|
setGroupTheta(e.value)
|
}).start();
|
}
|
|
// loader height
|
if (loaderHeight !== height && props.height !== null) {
|
new TWEEN.Tween({ value: loaderHeight })
|
.to({ value: height }, INTERVAL_TIME)
|
.easing(TWEEN.Easing.Linear.None)
|
.onUpdate((e) => {
|
setLoaderHeight(e.value)
|
})
|
.onComplete((e) => {
|
setLoaderHeight(e.value)
|
}).start();
|
}
|
|
// loader theta
|
const loaderTargetTheta = Common.normalizeAngle(loaderTheta + 90);
|
if (loaderAngle !== loaderTargetTheta && props.loaderTheta !== null) {
|
new TWEEN.Tween({ value: loaderAngle })
|
.to({ value: loaderTargetTheta }, INTERVAL_TIME)
|
.easing(TWEEN.Easing.Linear.None)
|
.onUpdate((e) => {
|
setLoaderAngle(e.value)
|
})
|
.onComplete((e) => {
|
setLoaderAngle(e.value)
|
}).start();
|
}
|
|
// fork lenght
|
if (forkDis !== forkLength && props.forkLength !== null) {
|
const targetForkDis = getCorrectForkDis(Common.positiveAngle(loaderTargetTheta), forkLength);
|
new TWEEN.Tween({ value: forkDis })
|
.to({ value: targetForkDis }, INTERVAL_TIME)
|
.easing(TWEEN.Easing.Linear.None)
|
.onUpdate((e) => {
|
setForkDis(e.value)
|
})
|
.onComplete((e) => {
|
setForkDis(e.value)
|
}).start();
|
}
|
|
if (trayList) {
|
setRealTrayList(trayList);
|
}
|
|
}, [props]);
|
|
useFrame((state, delta) => {
|
TWEEN.update();
|
})
|
|
const bodyModel = useMemo(() => {
|
const fbx = useFBX('/models/agv/body.fbx');
|
if (!fbx.castShadow) {
|
Common.setShadow(fbx);
|
}
|
fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE * 0.97, MODEL_AGV_SCALE);
|
return fbx.clone();
|
}, [])
|
|
const loaderModel = useMemo(() => {
|
const fbx = useFBX('/models/agv/loader.fbx');
|
if (!fbx.castShadow) {
|
Common.setShadow(fbx);
|
}
|
fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE);
|
return fbx.clone();
|
}, [])
|
|
const forkModel = useMemo(() => {
|
const fbx = useFBX('/models/agv/fork.fbx');
|
if (!fbx.castShadow) {
|
Common.setShadow(fbx);
|
}
|
fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE);
|
return fbx.clone();
|
}, [])
|
|
return (
|
<>
|
<group
|
rotation-y={Common.rotationParseNum(groupTheta)}
|
position={[groupPos.x, groupPos.y, groupPos.z]}
|
>
|
<primitive object={bodyModel} castShadow />
|
<group
|
position-y={loaderHeight}
|
rotation-y={Common.rotationParseNum(loaderAngle)}
|
>
|
<primitive object={loaderModel} castShadow position={[0, 0, 0]} />
|
<group position-z={forkDis}>
|
<primitive object={forkModel} castShadow position={[0, 6, 0]} />
|
{(hasBox || getLoaderHasBox(loaderAngle, finger1, finger2, finger3, finger4)) && <Box position={[0, 6, 0]} />}
|
</group>
|
</group>
|
<group>
|
{realTrayList?.[0]?.hasBox && <Box rotationY={Math.PI / 2} position={[-60, 34, 0]} />}
|
{realTrayList?.[1]?.hasBox && <Box rotationY={Math.PI / 2} position={[-60, 66, 0]} />}
|
{realTrayList?.[2]?.hasBox && <Box rotationY={Math.PI / 2} position={[-60, 99, 0]} />}
|
{realTrayList?.[3]?.hasBox && <Box rotationY={Math.PI / 2} position={[-60, 131, 0]} />}
|
{realTrayList?.[4]?.hasBox && <Box rotationY={Math.PI / 2} position={[-60, 163, 0]} />}
|
{realTrayList?.[5]?.hasBox && <Box rotationY={Math.PI / 2} position={[-60, 195, 0]} />}
|
</group>
|
</group>
|
</>
|
)
|
}
|
|
export default Agv;
|