Refactor multiple components: streamline action handling in ActionsList, RoboticArmMechanics, and Trigger; update vehicle and robotic arm data management in Products and Vehicles; unify action naming in loadInitialFloorItems, copyPasteControls, and duplicationControls; enhance ArmBotUI with selected event sphere integration.
This commit is contained in:
@@ -36,7 +36,7 @@ const ActionsList: React.FC<ActionsListProps> = ({
|
|||||||
const handleRenameAction = (newName: string) => {
|
const handleRenameAction = (newName: string) => {
|
||||||
if (!selectedAction.actionId) return;
|
if (!selectedAction.actionId) return;
|
||||||
const event = renameAction(selectedProduct.productId, selectedAction.actionId, newName);
|
const event = renameAction(selectedProduct.productId, selectedAction.actionId, newName);
|
||||||
|
setSelectedAction(selectedAction.actionId, newName);
|
||||||
if (event) {
|
if (event) {
|
||||||
upsertProductOrEventApi({
|
upsertProductOrEventApi({
|
||||||
productName: selectedProduct.productName,
|
productName: selectedProduct.productName,
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ function RoboticArmMechanics() {
|
|||||||
const [activeOption, setActiveOption] = useState<"default" | "pickAndPlace">("default");
|
const [activeOption, setActiveOption] = useState<"default" | "pickAndPlace">("default");
|
||||||
const [selectedPointData, setSelectedPointData] = useState<RoboticArmPointSchema | undefined>();
|
const [selectedPointData, setSelectedPointData] = useState<RoboticArmPointSchema | undefined>();
|
||||||
const { selectedEventData } = useSelectedEventData();
|
const { selectedEventData } = useSelectedEventData();
|
||||||
const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction, addAction, removeAction } = useProductStore();
|
const { getPointByUuid, getEventByModelUuid, getActionByUuid, updateEvent, updateAction, addAction, removeAction } = useProductStore();
|
||||||
const { selectedProduct } = useSelectedProduct();
|
const { selectedProduct } = useSelectedProduct();
|
||||||
const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction();
|
const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction();
|
||||||
|
|
||||||
@@ -28,20 +28,28 @@ function RoboticArmMechanics() {
|
|||||||
selectedEventData.data.modelUuid,
|
selectedEventData.data.modelUuid,
|
||||||
selectedEventData.selectedPoint
|
selectedEventData.selectedPoint
|
||||||
) as RoboticArmPointSchema | undefined;
|
) as RoboticArmPointSchema | undefined;
|
||||||
if (point?.actions) {
|
const action = getActionByUuid(selectedProduct.productId, selectedAction.actionId) as RoboticArmPointSchema["actions"][0] | undefined;
|
||||||
setSelectedPointData(point);
|
if (action) {
|
||||||
setActiveOption(point.actions[0].actionType as "default" | "pickAndPlace");
|
if (point?.actions) {
|
||||||
if (point.actions.length > 0 && !selectedAction.actionId) {
|
setSelectedPointData(point);
|
||||||
setSelectedAction(
|
if (point.actions.length > 0 && action) {
|
||||||
point.actions[0].actionUuid,
|
setActiveOption(action.actionType as "default" | "pickAndPlace");
|
||||||
point.actions[0].actionName
|
setSelectedAction(selectedAction.actionId, selectedAction.actionName);
|
||||||
);
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (point?.actions) {
|
||||||
|
setSelectedPointData(point);
|
||||||
|
if (point.actions.length > 0) {
|
||||||
|
setActiveOption(point.actions[0].actionType as "default" | "pickAndPlace");
|
||||||
|
setSelectedAction(point.actions[0].actionUuid, point.actions[0].actionName);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
clearSelectedAction();
|
clearSelectedAction();
|
||||||
}
|
}
|
||||||
}, [clearSelectedAction, getPointByUuid, selectedAction.actionId, selectedEventData, selectedProduct, setSelectedAction,]);
|
}, [selectedAction, selectedEventData, selectedProduct]);
|
||||||
|
|
||||||
const updateBackend = (
|
const updateBackend = (
|
||||||
productName: string,
|
productName: string,
|
||||||
@@ -280,7 +288,7 @@ function RoboticArmMechanics() {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="tirgger">
|
<div className="tirgger">
|
||||||
<Trigger selectedPointData={selectedPointData as any} type= {'RoboticArm'} />
|
<Trigger selectedPointData={selectedPointData as any} type={'RoboticArm'} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ type TriggerProps = {
|
|||||||
const Trigger = ({ selectedPointData, type }: TriggerProps) => {
|
const Trigger = ({ selectedPointData, type }: TriggerProps) => {
|
||||||
const [currentAction, setCurrentAction] = useState<string | undefined>();
|
const [currentAction, setCurrentAction] = useState<string | undefined>();
|
||||||
const { selectedProduct } = useSelectedProduct();
|
const { selectedProduct } = useSelectedProduct();
|
||||||
const { getActionByUuid, addTrigger, removeTrigger, updateTrigger, renameTrigger, getProductById } = useProductStore();
|
const { getActionByUuid, getEventByModelUuid, getPointByUuid, addTrigger, removeTrigger, updateTrigger, renameTrigger, getProductById } = useProductStore();
|
||||||
const [triggers, setTriggers] = useState<TriggerSchema[]>([]);
|
const [triggers, setTriggers] = useState<TriggerSchema[]>([]);
|
||||||
const [selectedTrigger, setSelectedTrigger] = useState<TriggerSchema | undefined>();
|
const [selectedTrigger, setSelectedTrigger] = useState<TriggerSchema | undefined>();
|
||||||
const [activeOption, setActiveOption] = useState<"onComplete" | "onStart" | "onStop" | "delay" | "onError">("onComplete");
|
const [activeOption, setActiveOption] = useState<"onComplete" | "onStart" | "onStop" | "delay" | "onError">("onComplete");
|
||||||
@@ -107,14 +107,14 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
const triggeredModel = selectedTrigger?.triggeredAsset?.triggeredModel || { modelName: "Select Model", modelUuid: "" };
|
const triggeredModel = getEventByModelUuid(selectedProduct.productId, selectedTrigger?.triggeredAsset?.triggeredModel?.modelUuid || "");
|
||||||
const triggeredPoint = selectedTrigger?.triggeredAsset?.triggeredPoint || { pointName: "Select Point", pointUuid: "" };
|
const triggeredPoint = getPointByUuid(selectedProduct.productId, triggeredModel?.modelUuid || '', selectedTrigger?.triggeredAsset?.triggeredPoint?.pointUuid || "");
|
||||||
const triggeredAction = selectedTrigger?.triggeredAsset?.triggeredAction || { actionName: "Select Action", actionUuid: "" };
|
const triggeredAction = getActionByUuid(selectedProduct.productId, selectedTrigger?.triggeredAsset?.triggeredAction?.actionUuid || '');
|
||||||
|
|
||||||
const modelOptions = getProductById(selectedProduct.productId)?.eventDatas || [];
|
const modelOptions = getProductById(selectedProduct.productId)?.eventDatas || [];
|
||||||
|
|
||||||
const pointOptions: PointsScheme[] = useMemo(() => {
|
const pointOptions: PointsScheme[] = useMemo(() => {
|
||||||
if (!triggeredModel.modelUuid) return [];
|
if (!triggeredModel) return [];
|
||||||
|
|
||||||
const model = modelOptions.find(m => m.modelUuid === triggeredModel.modelUuid);
|
const model = modelOptions.find(m => m.modelUuid === triggeredModel.modelUuid);
|
||||||
if (!model) return [];
|
if (!model) return [];
|
||||||
@@ -125,11 +125,11 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
|
|||||||
return [(model as VehicleEventSchema | RoboticArmEventSchema | MachineEventSchema | StorageEventSchema).point];
|
return [(model as VehicleEventSchema | RoboticArmEventSchema | MachineEventSchema | StorageEventSchema).point];
|
||||||
}
|
}
|
||||||
return [];
|
return [];
|
||||||
}, [triggeredModel.modelUuid, modelOptions]);
|
}, [triggeredModel, modelOptions]);
|
||||||
|
|
||||||
const actionOptions: any = useMemo(() => {
|
const actionOptions: any = useMemo(() => {
|
||||||
if (!triggeredPoint.pointUuid) return [];
|
if (!triggeredPoint) return [];
|
||||||
const point = pointOptions.find((p) => p.uuid === triggeredPoint.pointUuid);
|
const point = pointOptions.find((p) => p.uuid === triggeredPoint.uuid);
|
||||||
if (!point) return [];
|
if (!point) return [];
|
||||||
|
|
||||||
if ('action' in point) {
|
if ('action' in point) {
|
||||||
@@ -140,7 +140,7 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
|
|||||||
return typedPoint.actions;
|
return typedPoint.actions;
|
||||||
}
|
}
|
||||||
return [];
|
return [];
|
||||||
}, [triggeredPoint.pointUuid, pointOptions]);
|
}, [triggeredPoint, pointOptions]);
|
||||||
|
|
||||||
const handleModelSelect = (option: string, triggerUuid: string) => {
|
const handleModelSelect = (option: string, triggerUuid: string) => {
|
||||||
if (!selectedProduct) return;
|
if (!selectedProduct) return;
|
||||||
@@ -296,19 +296,19 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
|
|||||||
<div className="trigger-options">
|
<div className="trigger-options">
|
||||||
<LabledDropdown
|
<LabledDropdown
|
||||||
label="Triggered Object"
|
label="Triggered Object"
|
||||||
defaultOption={triggeredModel.modelName}
|
defaultOption={triggeredModel?.modelName || ""}
|
||||||
options={[...modelOptions.map((option) => (option.modelName))]}
|
options={[...modelOptions.map((option) => (option.modelName))]}
|
||||||
onSelect={(option) => { handleModelSelect(option, selectedTrigger.triggerUuid) }}
|
onSelect={(option) => { handleModelSelect(option, selectedTrigger.triggerUuid) }}
|
||||||
/>
|
/>
|
||||||
<LabledDropdown
|
<LabledDropdown
|
||||||
label="Triggered Point"
|
label="Triggered Point"
|
||||||
defaultOption={triggeredPoint.pointName}
|
defaultOption={`Point ${triggeredPoint?.uuid.slice(0, 4)}`}
|
||||||
options={[...pointOptions.map((option) => (`Point ${option.uuid.slice(0, 5)}`))]}
|
options={[...pointOptions.map((option) => (`Point ${option.uuid.slice(0, 4)}`))]}
|
||||||
onSelect={(option) => { handlePointSelect(option, selectedTrigger.triggerUuid) }}
|
onSelect={(option) => { handlePointSelect(option, selectedTrigger.triggerUuid) }}
|
||||||
/>
|
/>
|
||||||
<LabledDropdown
|
<LabledDropdown
|
||||||
label="Triggered Action"
|
label="Triggered Action"
|
||||||
defaultOption={triggeredAction.actionName}
|
defaultOption={triggeredAction?.actionName || ''}
|
||||||
options={[...actionOptions.map((option: any) => (option.actionName))]}
|
options={[...actionOptions.map((option: any) => (option.actionName))]}
|
||||||
onSelect={(option) => { handleActionSelect(option, selectedTrigger.triggerUuid) }}
|
onSelect={(option) => { handleActionSelect(option, selectedTrigger.triggerUuid) }}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -228,7 +228,7 @@ function processLoadedModel(
|
|||||||
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
|
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
|
||||||
action: {
|
action: {
|
||||||
actionUuid: THREE.MathUtils.generateUUID(),
|
actionUuid: THREE.MathUtils.generateUUID(),
|
||||||
actionName: `Action ${index + 1}`,
|
actionName: `Action 1`,
|
||||||
actionType: 'default',
|
actionType: 'default',
|
||||||
material: 'Default material',
|
material: 'Default material',
|
||||||
delay: 0,
|
delay: 0,
|
||||||
|
|||||||
@@ -173,7 +173,7 @@ const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pas
|
|||||||
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
|
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
|
||||||
action: {
|
action: {
|
||||||
actionUuid: THREE.MathUtils.generateUUID(),
|
actionUuid: THREE.MathUtils.generateUUID(),
|
||||||
actionName: `Action ${index}`,
|
actionName: `Action 1`,
|
||||||
actionType: 'default',
|
actionType: 'default',
|
||||||
material: 'Default Material',
|
material: 'Default Material',
|
||||||
delay: 0,
|
delay: 0,
|
||||||
|
|||||||
@@ -151,7 +151,7 @@ const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedOb
|
|||||||
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
|
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
|
||||||
action: {
|
action: {
|
||||||
actionUuid: THREE.MathUtils.generateUUID(),
|
actionUuid: THREE.MathUtils.generateUUID(),
|
||||||
actionName: `Action ${index}`,
|
actionName: `Action 1`,
|
||||||
actionType: 'default',
|
actionType: 'default',
|
||||||
material: 'Default Material',
|
material: 'Default Material',
|
||||||
delay: 0,
|
delay: 0,
|
||||||
|
|||||||
@@ -19,7 +19,7 @@ function PointsCreator() {
|
|||||||
const [transformMode, setTransformMode] = useState<"translate" | "rotate" | null>(null);
|
const [transformMode, setTransformMode] = useState<"translate" | "rotate" | null>(null);
|
||||||
const sphereRefs = useRef<{ [key: string]: THREE.Mesh }>({});
|
const sphereRefs = useRef<{ [key: string]: THREE.Mesh }>({});
|
||||||
const { selectedEventSphere, setSelectedEventSphere, clearSelectedEventSphere, } = useSelectedEventSphere();
|
const { selectedEventSphere, setSelectedEventSphere, clearSelectedEventSphere, } = useSelectedEventSphere();
|
||||||
const { selectedEventData, setSelectedEventData, clearSelectedEventData } = useSelectedEventData();
|
const { setSelectedEventData, clearSelectedEventData } = useSelectedEventData();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (selectedEventSphere) {
|
if (selectedEventSphere) {
|
||||||
@@ -120,7 +120,8 @@ function PointsCreator() {
|
|||||||
return (
|
return (
|
||||||
<group
|
<group
|
||||||
key={i}
|
key={i}
|
||||||
position={new THREE.Vector3(...event.position)}
|
position={event.position}
|
||||||
|
rotation={event.rotation}
|
||||||
>
|
>
|
||||||
{event.points.map((point, j) => (
|
{event.points.map((point, j) => (
|
||||||
<mesh
|
<mesh
|
||||||
@@ -150,7 +151,8 @@ function PointsCreator() {
|
|||||||
return (
|
return (
|
||||||
<group
|
<group
|
||||||
key={i}
|
key={i}
|
||||||
position={new THREE.Vector3(...event.position)}
|
position={event.position}
|
||||||
|
rotation={event.rotation}
|
||||||
>
|
>
|
||||||
<mesh
|
<mesh
|
||||||
name="Event-Sphere"
|
name="Event-Sphere"
|
||||||
@@ -177,7 +179,8 @@ function PointsCreator() {
|
|||||||
return (
|
return (
|
||||||
<group
|
<group
|
||||||
key={i}
|
key={i}
|
||||||
position={new THREE.Vector3(...event.position)}
|
position={event.position}
|
||||||
|
rotation={event.rotation}
|
||||||
>
|
>
|
||||||
<mesh
|
<mesh
|
||||||
name="Event-Sphere"
|
name="Event-Sphere"
|
||||||
@@ -204,7 +207,8 @@ function PointsCreator() {
|
|||||||
return (
|
return (
|
||||||
<group
|
<group
|
||||||
key={i}
|
key={i}
|
||||||
position={new THREE.Vector3(...event.position)}
|
position={event.position}
|
||||||
|
rotation={event.rotation}
|
||||||
>
|
>
|
||||||
<mesh
|
<mesh
|
||||||
name="Event-Sphere"
|
name="Event-Sphere"
|
||||||
|
|||||||
@@ -5,10 +5,14 @@ import { useSelectedProduct } from '../../../store/simulation/useSimulationStore
|
|||||||
import AddOrRemoveEventsInProducts from './events/addOrRemoveEventsInProducts';
|
import AddOrRemoveEventsInProducts from './events/addOrRemoveEventsInProducts';
|
||||||
import { upsertProductOrEventApi } from '../../../services/simulation/UpsertProductOrEventApi';
|
import { upsertProductOrEventApi } from '../../../services/simulation/UpsertProductOrEventApi';
|
||||||
import { getAllProductsApi } from '../../../services/simulation/getallProductsApi';
|
import { getAllProductsApi } from '../../../services/simulation/getallProductsApi';
|
||||||
|
import { useVehicleStore } from '../../../store/simulation/useVehicleStore';
|
||||||
|
import { useArmBotStore } from '../../../store/simulation/useArmBotStore';
|
||||||
|
|
||||||
function Products() {
|
function Products() {
|
||||||
const { addProduct, setProducts } = useProductStore();
|
const { products, getProductById, addProduct, setProducts } = useProductStore();
|
||||||
const { setSelectedProduct } = useSelectedProduct();
|
const { selectedProduct, setSelectedProduct } = useSelectedProduct();
|
||||||
|
const { addVehicle, clearvehicles } = useVehicleStore();
|
||||||
|
const { addArmBot, clearArmBots } = useArmBotStore();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const email = localStorage.getItem('email')
|
const email = localStorage.getItem('email')
|
||||||
@@ -27,6 +31,34 @@ function Products() {
|
|||||||
})
|
})
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (selectedProduct.productId) {
|
||||||
|
const product = getProductById(selectedProduct.productId);
|
||||||
|
if (product) {
|
||||||
|
clearvehicles();
|
||||||
|
product.eventDatas.forEach(events => {
|
||||||
|
if (events.type === 'vehicle') {
|
||||||
|
addVehicle(selectedProduct.productId, events);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, [selectedProduct, products]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (selectedProduct.productId) {
|
||||||
|
const product = getProductById(selectedProduct.productId);
|
||||||
|
if (product) {
|
||||||
|
clearArmBots();
|
||||||
|
product.eventDatas.forEach(events => {
|
||||||
|
if (events.type === 'roboticArm') {
|
||||||
|
addArmBot(selectedProduct.productId, events);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, [selectedProduct, products]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
||||||
|
|||||||
@@ -1,46 +1,27 @@
|
|||||||
import { useEffect } from "react";
|
import { useEffect } from "react";
|
||||||
import RoboticArmInstances from "./instances/roboticArmInstances";
|
import RoboticArmInstances from "./instances/roboticArmInstances";
|
||||||
import { useArmBotStore } from "../../../store/simulation/useArmBotStore";
|
import { useArmBotStore } from "../../../store/simulation/useArmBotStore";
|
||||||
import { useSelectedEventData, useSelectedEventSphere, useSelectedProduct } from "../../../store/simulation/useSimulationStore";
|
import { useSelectedEventData, useSelectedEventSphere } from "../../../store/simulation/useSimulationStore";
|
||||||
import { useProductStore } from "../../../store/simulation/useProductStore";
|
|
||||||
import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
|
|
||||||
import ArmBotUI from "../ui/arm/armBotUI";
|
import ArmBotUI from "../ui/arm/armBotUI";
|
||||||
|
|
||||||
function RoboticArm() {
|
function RoboticArm() {
|
||||||
const { armBots, addArmBot, clearArmBots } = useArmBotStore();
|
const { armBots } = useArmBotStore();
|
||||||
const { products, getProductById } = useProductStore();
|
|
||||||
const { selectedProduct } = useSelectedProduct();
|
|
||||||
const { selectedEventSphere } = useSelectedEventSphere();
|
const { selectedEventSphere } = useSelectedEventSphere();
|
||||||
const { selectedEventData } = useSelectedEventData();
|
const { selectedEventData } = useSelectedEventData();
|
||||||
const { isPlaying } = usePlayButtonStore();
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (selectedProduct.productId) {
|
|
||||||
const product = getProductById(selectedProduct.productId);
|
|
||||||
if (product) {
|
|
||||||
clearArmBots();
|
|
||||||
product.eventDatas.forEach(events => {
|
|
||||||
if (events.type === 'roboticArm') {
|
|
||||||
addArmBot(selectedProduct.productId, events);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, [selectedProduct, products]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
// console.log('armBots: ', armBots);
|
||||||
}, [armBots])
|
}, [armBots])
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
|
|
||||||
}, [selectedEventData, selectedEventSphere, isPlaying]);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
||||||
<RoboticArmInstances />
|
<RoboticArmInstances />
|
||||||
|
|
||||||
{selectedEventSphere && selectedEventData?.data.type === "roboticArm" &&
|
{selectedEventSphere && selectedEventData?.data.type === "roboticArm" &&
|
||||||
< ArmBotUI />
|
< ArmBotUI />
|
||||||
}
|
}
|
||||||
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React, { useEffect, useState } from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import { useSelectedAction, useSelectedEventData, useSelectedProduct } from '../../../../store/simulation/useSimulationStore';
|
import { useSelectedAction, useSelectedEventData, useSelectedEventSphere, useSelectedProduct } from '../../../../store/simulation/useSimulationStore';
|
||||||
import { useGLTF } from '@react-three/drei';
|
import { useGLTF } from '@react-three/drei';
|
||||||
import { useThree } from '@react-three/fiber';
|
import { useThree } from '@react-three/fiber';
|
||||||
import { useProductStore } from '../../../../store/simulation/useProductStore';
|
import { useProductStore } from '../../../../store/simulation/useProductStore';
|
||||||
@@ -19,7 +19,7 @@ type Positions = {
|
|||||||
|
|
||||||
const ArmBotUI = () => {
|
const ArmBotUI = () => {
|
||||||
const { getEventByModelUuid, updateAction, getActionByUuid } = useProductStore();
|
const { getEventByModelUuid, updateAction, getActionByUuid } = useProductStore();
|
||||||
const { selectedEventData } = useSelectedEventData();
|
const { selectedEventSphere } = useSelectedEventSphere();
|
||||||
const { selectedProduct } = useSelectedProduct();
|
const { selectedProduct } = useSelectedProduct();
|
||||||
const { scene } = useThree();
|
const { scene } = useThree();
|
||||||
const { selectedAction } = useSelectedAction();
|
const { selectedAction } = useSelectedAction();
|
||||||
@@ -50,14 +50,14 @@ const ArmBotUI = () => {
|
|||||||
|
|
||||||
// Fetch and setup selected ArmBot data
|
// Fetch and setup selected ArmBot data
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (selectedEventData?.data.type === "roboticArm") {
|
if (selectedEventSphere) {
|
||||||
const selectedArmBot = getEventByModelUuid(selectedProduct.productId, selectedEventData.data.modelUuid);
|
const selectedArmBot = getEventByModelUuid(selectedProduct.productId, selectedEventSphere.userData.modelUuid);
|
||||||
|
|
||||||
if (selectedArmBot?.type === "roboticArm") {
|
if (selectedArmBot?.type === "roboticArm") {
|
||||||
setSelectedArmBotData(selectedArmBot);
|
setSelectedArmBotData(selectedArmBot);
|
||||||
const defaultPositions = getDefaultPositions(selectedArmBot.modelUuid);
|
const defaultPositions = getDefaultPositions(selectedArmBot.modelUuid);
|
||||||
const matchingAction = getActionByUuid(selectedProduct.productId, selectedAction.actionId);
|
const matchingAction = getActionByUuid(selectedProduct.productId, selectedAction.actionId);
|
||||||
if (matchingAction) {
|
if (matchingAction && (matchingAction as RoboticArmPointSchema["actions"][0]).process) {
|
||||||
const startPoint = (matchingAction as RoboticArmPointSchema["actions"][0]).process.startPoint;
|
const startPoint = (matchingAction as RoboticArmPointSchema["actions"][0]).process.startPoint;
|
||||||
const pickPosition = (!startPoint || (Array.isArray(startPoint) && startPoint.every(v => v === 0)))
|
const pickPosition = (!startPoint || (Array.isArray(startPoint) && startPoint.every(v => v === 0)))
|
||||||
? defaultPositions.pick
|
? defaultPositions.pick
|
||||||
@@ -73,8 +73,7 @@ const ArmBotUI = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, [selectedEventData, selectedProduct, getEventByModelUuid, selectedAction]);
|
}, [selectedEventSphere, selectedProduct, getEventByModelUuid, selectedAction]);
|
||||||
|
|
||||||
|
|
||||||
function getDefaultPositions(modelUuid: string): Positions {
|
function getDefaultPositions(modelUuid: string): Positions {
|
||||||
const modelData = getEventByModelUuid(selectedProduct.productId, modelUuid);
|
const modelData = getEventByModelUuid(selectedProduct.productId, modelUuid);
|
||||||
@@ -117,8 +116,8 @@ const ArmBotUI = () => {
|
|||||||
obj.getWorldPosition(newPosition);
|
obj.getWorldPosition(newPosition);
|
||||||
const worldPositionArray = newPosition.toArray() as [number, number, number];
|
const worldPositionArray = newPosition.toArray() as [number, number, number];
|
||||||
|
|
||||||
if (selectedEventData?.data.type === "roboticArm") {
|
if (selectedEventSphere) {
|
||||||
const selectedArmBot = getEventByModelUuid(selectedProduct.productId, selectedEventData.data.modelUuid);
|
const selectedArmBot = getEventByModelUuid(selectedProduct.productId, selectedEventSphere.userData.modelUuid);
|
||||||
|
|
||||||
const armBot = selectedArmBot?.modelUuid === modelUuid ? selectedArmBot : null;
|
const armBot = selectedArmBot?.modelUuid === modelUuid ? selectedArmBot : null;
|
||||||
if (!armBot) return;
|
if (!armBot) return;
|
||||||
|
|||||||
@@ -15,7 +15,7 @@ interface VehicleAnimatorProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function VehicleAnimator({ path, handleCallBack, currentPhase, agvUuid, agvDetail, reset }: VehicleAnimatorProps) {
|
function VehicleAnimator({ path, handleCallBack, currentPhase, agvUuid, agvDetail, reset }: VehicleAnimatorProps) {
|
||||||
const { decrementVehicleLoad } = useVehicleStore();
|
const { decrementVehicleLoad, getVehicleById } = useVehicleStore();
|
||||||
const { isPaused } = usePauseButtonStore();
|
const { isPaused } = usePauseButtonStore();
|
||||||
const { isPlaying } = usePlayButtonStore();
|
const { isPlaying } = usePlayButtonStore();
|
||||||
const { speed } = useAnimationPlaySpeed();
|
const { speed } = useAnimationPlaySpeed();
|
||||||
@@ -34,7 +34,6 @@ function VehicleAnimator({ path, handleCallBack, currentPhase, agvUuid, agvDetai
|
|||||||
let coveredDistance = progressRef.current;
|
let coveredDistance = progressRef.current;
|
||||||
let objectRotation = (agvDetail.point?.action?.pickUpPoint?.rotation || { x: 0, y: 0, z: 0 }) as { x: number; y: number; z: number } | undefined;
|
let objectRotation = (agvDetail.point?.action?.pickUpPoint?.rotation || { x: 0, y: 0, z: 0 }) as { x: number; y: number; z: number } | undefined;
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (currentPhase === 'stationed-pickup' && path.length > 0) {
|
if (currentPhase === 'stationed-pickup' && path.length > 0) {
|
||||||
setCurrentPath(path);
|
setCurrentPath(path);
|
||||||
@@ -69,9 +68,10 @@ function VehicleAnimator({ path, handleCallBack, currentPhase, agvUuid, agvDetai
|
|||||||
isPausedRef.current = false;
|
isPausedRef.current = false;
|
||||||
pauseTimeRef.current = 0;
|
pauseTimeRef.current = 0;
|
||||||
const object = scene.getObjectByProperty('uuid', agvUuid);
|
const object = scene.getObjectByProperty('uuid', agvUuid);
|
||||||
if (object) {
|
const vehicle = getVehicleById(agvDetail.modelUuid);
|
||||||
object.position.set(agvDetail.position[0], agvDetail.position[1], agvDetail.position[2]);
|
if (object && vehicle) {
|
||||||
object.rotation.set(agvDetail.rotation[0], agvDetail.rotation[1], agvDetail.rotation[2]);
|
object.position.set(vehicle.position[0], vehicle.position[1], vehicle.position[2]);
|
||||||
|
object.rotation.set(vehicle.rotation[0], vehicle.rotation[1], vehicle.rotation[2]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, [isReset, isPlaying])
|
}, [isReset, isPlaying])
|
||||||
|
|||||||
@@ -1,35 +1,18 @@
|
|||||||
import React, { useEffect } from "react";
|
import { useEffect } from "react";
|
||||||
import VehicleInstances from "./instances/vehicleInstances";
|
import VehicleInstances from "./instances/vehicleInstances";
|
||||||
import { useVehicleStore } from "../../../store/simulation/useVehicleStore";
|
import { useVehicleStore } from "../../../store/simulation/useVehicleStore";
|
||||||
import { useSelectedEventData, useSelectedEventSphere, useSelectedProduct } from "../../../store/simulation/useSimulationStore";
|
import { useSelectedEventData, useSelectedEventSphere } from "../../../store/simulation/useSimulationStore";
|
||||||
import VehicleUI from "../ui/vehicle/vehicleUI";
|
import VehicleUI from "../ui/vehicle/vehicleUI";
|
||||||
import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
|
import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
|
||||||
import { useProductStore } from "../../../store/simulation/useProductStore";
|
|
||||||
|
|
||||||
function Vehicles() {
|
function Vehicles() {
|
||||||
const { products, getProductById } = useProductStore();
|
const { vehicles } = useVehicleStore();
|
||||||
const { selectedProduct } = useSelectedProduct();
|
|
||||||
const { vehicles, addVehicle, clearvehicles } = useVehicleStore();
|
|
||||||
const { selectedEventSphere } = useSelectedEventSphere();
|
const { selectedEventSphere } = useSelectedEventSphere();
|
||||||
const { selectedEventData } = useSelectedEventData();
|
const { selectedEventData } = useSelectedEventData();
|
||||||
const { isPlaying } = usePlayButtonStore();
|
const { isPlaying } = usePlayButtonStore();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (selectedProduct.productId) {
|
// console.log('vehicles: ', vehicles);
|
||||||
const product = getProductById(selectedProduct.productId);
|
|
||||||
if (product) {
|
|
||||||
clearvehicles();
|
|
||||||
product.eventDatas.forEach(events => {
|
|
||||||
if (events.type === 'vehicle') {
|
|
||||||
addVehicle(selectedProduct.productId, events);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, [selectedProduct, products]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
//
|
|
||||||
}, [vehicles])
|
}, [vehicles])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
Reference in New Issue
Block a user