v2-ui #83

Merged
Vishnu merged 31 commits from v2-ui into main 2025-05-08 14:20:43 +00:00
2 changed files with 7 additions and 22 deletions
Showing only changes of commit c3b18aff78 - Show all commits

View File

@ -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>
</> </>
)} )}
</> </>

View File

@ -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;
} }