From b1a6ae4f052409d0c4c3a846bfad1a9b24a2c696 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期二, 23 四月 2024 13:30:31 +0800 Subject: [PATCH] # --- src/components/agv.jsx | 101 ++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 88 insertions(+), 13 deletions(-) diff --git a/src/components/agv.jsx b/src/components/agv.jsx index 61e75e4..dfd5ea8 100644 --- a/src/components/agv.jsx +++ b/src/components/agv.jsx @@ -3,24 +3,93 @@ import { useFBX, useAnimations } from '@react-three/drei'; import * as THREE from 'three'; import Box from './box'; -import * as Common from '../utils/common' - -let lastData = {}; +import * as Common from '../utils/common'; +import * as TWEEN from "@tweenjs/tween.js"; +import { INTERVAL_TIME, MODEL_AGV_SCALE } from '@/config/setting' const Agv = (props) => { - const { position, theta } = props; + const { position, theta, height, loaderTheta, forkLength, trayList, hasBox } = props; + + const [groupPos, setGroupPos] = useState({ x: 0, y: 0, z: 0 }); + const [groupTheta, setGroupTheta] = useState(0); + const [loaderHeight, setLoaderHeight] = useState(0); + const [forkDis, setForkDis] = useState(0); useEffect(() => { - console.log(position); - console.log(theta); + if (!props || Object.keys(props).length === 0) { + return; + } + // group position + const pos = { + x: position?.[0], + y: position?.[1], + z: position?.[2], + } + if (!Common.deepEqual(groupPos, pos)) { + 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) { + const minTheta = Common.minDiffTheta(groupTheta, theta); + new TWEEN.Tween({ value: groupTheta }) + .to({ value: minTheta }, INTERVAL_TIME) + .easing(TWEEN.Easing.Linear.None) + .onUpdate((e) => { + setGroupTheta(e.value) + }) + .onComplete((e) => { + setGroupTheta(e.value) + }).start(); + } + + // loader height + if (loaderHeight !== height) { + 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(); + } + + // fork lenght + if (forkDis !== forkLength) { + new TWEEN.Tween({ value: forkDis }) + .to({ value: forkLength }, INTERVAL_TIME) + .easing(TWEEN.Easing.Linear.None) + .onUpdate((e) => { + setForkDis(e.value) + }) + .onComplete((e) => { + setForkDis(e.value) + console.log(e.value); + }).start(); + } }, [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, MODEL_AGV_SCALE); return fbx.clone(); }, []) @@ -29,6 +98,7 @@ if (!fbx.castShadow) { Common.setShadow(fbx); } + fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE); return fbx.clone(); }, []) @@ -37,19 +107,24 @@ if (!fbx.castShadow) { Common.setShadow(fbx); } + fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE); return fbx.clone(); }, []) - useEffect(() => { - }, []); - return ( <> - <group rotation-y={Common.rotationParseNum(theta)} scale={0.5} position={position}> + <group + rotation-y={Common.rotationParseNum(groupTheta)} + position={[groupPos.x, groupPos.y, groupPos.z]} + > <primitive object={bodyModel} castShadow /> - <primitive object={loaderModel} castShadow position={[0, 100, 0]} /> - <primitive object={forkModel} castShadow position={[0, 120, 0]} /> - <Box position={[100, 100, 300]} /> + <group position-y={loaderHeight}> + <primitive object={loaderModel} castShadow position={[0, 30, 0]} /> + <group position-z={forkDis}> + <primitive object={forkModel} castShadow position={[0, 35, 0]} /> + {hasBox && <Box position={[0, 34, 0]} />} + </group> + </group> </group> </> ) -- Gitblit v1.9.1