Refactor MaterialAnimator and VehicleInstance: remove unused HTML position and rotation states, and update VehicleInstance prop type for clarity.
This commit is contained in:
parent
621e889bb3
commit
c3b18aff78
|
@ -2,7 +2,6 @@ import { useEffect, useRef, useState } from 'react';
|
||||||
import { useThree, useFrame } from '@react-three/fiber';
|
import { useThree, useFrame } from '@react-three/fiber';
|
||||||
import * as THREE from 'three';
|
import * as THREE from 'three';
|
||||||
import { MaterialModel } from '../../../materials/instances/material/materialModel';
|
import { MaterialModel } from '../../../materials/instances/material/materialModel';
|
||||||
import { Html } from '@react-three/drei';
|
|
||||||
|
|
||||||
type MaterialAnimatorProps = {
|
type MaterialAnimatorProps = {
|
||||||
agvDetail: VehicleStatus;
|
agvDetail: VehicleStatus;
|
||||||
|
@ -14,8 +13,6 @@ const MaterialAnimator = ({ agvDetail }: MaterialAnimatorProps) => {
|
||||||
const [hasLoad, setHasLoad] = useState(false);
|
const [hasLoad, setHasLoad] = useState(false);
|
||||||
const { scene } = useThree();
|
const { scene } = useThree();
|
||||||
const offset = new THREE.Vector3(0, 0.85, 0);
|
const offset = new THREE.Vector3(0, 0.85, 0);
|
||||||
const [htmlPosition, setHtmlPosition] = useState<[number, number, number]>([0, 0, 0]);
|
|
||||||
const [htmlRotation, setHtmlRotation] = useState<[number, number, number]>([0, 0, 0]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setHasLoad(agvDetail.currentLoad > 0);
|
setHasLoad(agvDetail.currentLoad > 0);
|
||||||
|
@ -28,9 +25,7 @@ const MaterialAnimator = ({ agvDetail }: MaterialAnimatorProps) => {
|
||||||
if (agvModel) {
|
if (agvModel) {
|
||||||
const worldPosition = offset.clone().applyMatrix4(agvModel.matrixWorld);
|
const worldPosition = offset.clone().applyMatrix4(agvModel.matrixWorld);
|
||||||
meshRef.current.position.copy(worldPosition);
|
meshRef.current.position.copy(worldPosition);
|
||||||
setHtmlPosition([worldPosition.x, worldPosition.y, worldPosition.z]);
|
|
||||||
meshRef.current.rotation.copy(agvModel.rotation);
|
meshRef.current.rotation.copy(agvModel.rotation);
|
||||||
setHtmlRotation([agvModel.rotation.x, agvModel.rotation.y, agvModel.rotation.z]);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -44,15 +39,6 @@ const MaterialAnimator = ({ agvDetail }: MaterialAnimatorProps) => {
|
||||||
materialType={agvDetail.currentMaterials[0].materialType || 'Default material'}
|
materialType={agvDetail.currentMaterials[0].materialType || 'Default material'}
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
|
|
||||||
<Html
|
|
||||||
position={htmlPosition}
|
|
||||||
rotation={htmlRotation}
|
|
||||||
style={{ backgroundColor: "pink", padding: "4px", borderRadius: "4px" }}
|
|
||||||
>
|
|
||||||
{agvDetail.currentLoad}
|
|
||||||
</Html>
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
|
|
|
@ -11,7 +11,7 @@ import { useSelectedProduct } from '../../../../../store/simulation/useSimulatio
|
||||||
import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler';
|
import { useTriggerHandler } from '../../../triggers/triggerHandler/useTriggerHandler';
|
||||||
import MaterialAnimator from '../animator/materialAnimator';
|
import MaterialAnimator from '../animator/materialAnimator';
|
||||||
|
|
||||||
function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
|
function VehicleInstance({ agvDetail }: Readonly<{ agvDetail: VehicleStatus }>) {
|
||||||
const { navMesh } = useNavMesh();
|
const { navMesh } = useNavMesh();
|
||||||
const { isPlaying } = usePlayButtonStore();
|
const { isPlaying } = usePlayButtonStore();
|
||||||
const { removeMaterial } = useMaterialStore();
|
const { removeMaterial } = useMaterialStore();
|
||||||
|
@ -109,6 +109,7 @@ function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
|
||||||
} else {
|
} else {
|
||||||
reset()
|
reset()
|
||||||
}
|
}
|
||||||
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||||
}, [vehicles, currentPhase, path, isPlaying]);
|
}, [vehicles, currentPhase, path, isPlaying]);
|
||||||
|
|
||||||
function handleCallBack() {
|
function handleCallBack() {
|
||||||
|
@ -146,14 +147,14 @@ function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
|
||||||
handleMaterialDropToConveyor(action);
|
handleMaterialDropToConveyor(action);
|
||||||
}
|
}
|
||||||
} else if (model.type === 'machine') {
|
} else if (model.type === 'machine') {
|
||||||
|
//
|
||||||
} else if (model.type === 'roboticArm') {
|
} else if (model.type === 'roboticArm') {
|
||||||
const action = getActionByUuid(selectedProduct.productId, agvDetail.point.action.actionUuid);
|
const action = getActionByUuid(selectedProduct.productId, agvDetail.point.action.actionUuid);
|
||||||
if (action) {
|
if (action) {
|
||||||
handleMaterialDropToArmBot(action);
|
handleMaterialDropToArmBot(action);
|
||||||
}
|
}
|
||||||
} else if (model.type === 'storageUnit') {
|
} else if (model.type === 'storageUnit') {
|
||||||
|
//
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
const droppedMaterial = agvDetail.currentLoad;
|
const droppedMaterial = agvDetail.currentLoad;
|
||||||
|
@ -169,7 +170,7 @@ function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
|
||||||
|
|
||||||
function handleMaterialDropToConveyor(action: Action) {
|
function handleMaterialDropToConveyor(action: Action) {
|
||||||
if (agvDetail.currentLoad > 1) {
|
if (agvDetail.currentLoad > 1) {
|
||||||
|
//
|
||||||
} else if (agvDetail.currentLoad === 1 && agvDetail.currentMaterials.length === 1) {
|
} else if (agvDetail.currentLoad === 1 && agvDetail.currentMaterials.length === 1) {
|
||||||
triggerPointActions(action, agvDetail.currentMaterials[0].materialId);
|
triggerPointActions(action, agvDetail.currentMaterials[0].materialId);
|
||||||
decrementVehicleLoad(agvDetail.modelUuid, 1);
|
decrementVehicleLoad(agvDetail.modelUuid, 1);
|
||||||
|
@ -179,7 +180,7 @@ function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
|
||||||
|
|
||||||
function handleMaterialDropToArmBot(action: Action) {
|
function handleMaterialDropToArmBot(action: Action) {
|
||||||
if (agvDetail.currentLoad > 1) {
|
if (agvDetail.currentLoad > 1) {
|
||||||
|
//
|
||||||
} else if (agvDetail.currentLoad === 1 && agvDetail.currentMaterials.length === 1) {
|
} else if (agvDetail.currentLoad === 1 && agvDetail.currentMaterials.length === 1) {
|
||||||
triggerPointActions(action, agvDetail.currentMaterials[0].materialId);
|
triggerPointActions(action, agvDetail.currentMaterials[0].materialId);
|
||||||
}
|
}
|
||||||
|
@ -187,9 +188,7 @@ function VehicleInstance({ agvDetail }: { agvDetail: VehicleStatus }) {
|
||||||
|
|
||||||
function handleMaterialDropByDefault(droppedMaterial: number) {
|
function handleMaterialDropByDefault(droppedMaterial: number) {
|
||||||
if (isPausedRef.current) {
|
if (isPausedRef.current) {
|
||||||
if (!pauseTimeRef.current) {
|
pauseTimeRef.current ??= performance.now();
|
||||||
pauseTimeRef.current = performance.now();
|
|
||||||
}
|
|
||||||
requestAnimationFrame(() => handleMaterialDropByDefault(droppedMaterial));
|
requestAnimationFrame(() => handleMaterialDropByDefault(droppedMaterial));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue