Dwinzo-Beta/Dwinzo_Demo
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

human to conveyor, conveyor to human multiple actions completed

Browse Source
This commit is contained in:
Jerald-Golden-B
2025-07-17 09:44:08 +05:30
parent e9053ccd1b
commit fe09c3df56
47 changed files with 1155 additions and 1008 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/src/components/layout/sidebarRight/properties/ZoneProperties.tsx
View File

@@ -1,11 +1,10 @@
import React, { useEffect, useState } from "react";
import React, { useEffect } from "react";
import RenameInput from "../../../ui/inputs/RenameInput";
import Vector3Input from "../customInput/Vector3Input";
import { useSelectedZoneStore } from "../../../../store/visualization/useZoneStore";
import {
useEditPosition,
usezonePosition,
useZones,
usezoneTarget,
} from "../../../../store/builder/store";
import { zoneCameraUpdate } from "../../../../services/visulization/zone/zoneCameraUpdation";
@@ -19,12 +18,11 @@ const ZoneProperties: React.FC = () => {
const { selectedZone, setSelectedZone } = useSelectedZoneStore();
const { zonePosition, setZonePosition } = usezonePosition();
const { zoneTarget, setZoneTarget } = usezoneTarget();
// const { zones, setZones } = useZones();
const { assetStore, zoneStore } = useSceneContext();
const { zoneStore } = useSceneContext();
const { zones, setZoneName } = zoneStore()
const { projectId } = useParams();
const { userName, userId, organization, email } = getUserData();
const { organization } = getUserData();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();

15
app/src/components/layout/sidebarRight/properties/eventProperties/actions/assemblyAction.tsx
View File

@@ -13,6 +13,7 @@ interface AssemblyActionProps {
swapOptions: string[];
swapDefaultOption: string;
onSwapSelect: (value: string) => void;
clearPoints: () => void;
}
const AssemblyAction: React.FC<AssemblyActionProps> = ({
@@ -20,6 +21,7 @@ const AssemblyAction: React.FC<AssemblyActionProps> = ({
swapOptions,
swapDefaultOption,
onSwapSelect,
clearPoints
}) => {
return (
<>
@@ -37,6 +39,19 @@ const AssemblyAction: React.FC<AssemblyActionProps> = ({
defaultOption={swapDefaultOption}
onSelect={onSwapSelect}
/>
<div className="selected-actions-list">
<div className="value-field-container">
<div className="label">Reset Points</div>
<button
id="reset-button"
type="button"
className="regularDropdown-container"
onClick={clearPoints}
>
Clear
</button>
</div>
</div>
</>
);
};

45
app/src/components/layout/sidebarRight/properties/eventProperties/actions/workerAction.tsx
View File

@@ -8,18 +8,29 @@ interface WorkerActionProps {
max: number;
step: number;
defaultValue: string;
disabled?: boolean,
disabled?: boolean;
onChange: (value: string) => void;
};
loadCount?: {
value: number;
min: number;
max: number;
step: number;
defaultValue: string,
disabled: false,
onChange: (value: number) => void;
};
clearPoints: () => void;
}
const WorkerAction: React.FC<WorkerActionProps> = ({
loadCapacity,
loadCount,
clearPoints,
}) => {
return (
<>
<div className="worker-action-container">
{/* Load Capacity Input */}
<InputWithDropDown
label="Load Capacity"
value={loadCapacity.value}
@@ -32,23 +43,39 @@ const WorkerAction: React.FC<WorkerActionProps> = ({
onClick={() => { }}
onChange={loadCapacity.onChange}
/>
{/* Load Count Input */}
{loadCount && (
<InputWithDropDown
label="Load Count"
value={loadCount.value.toString()}
min={loadCount.min}
max={loadCount.max}
disabled={loadCount.disabled}
defaultValue={loadCount.defaultValue}
step={loadCount.step}
activeOption="unit"
onClick={() => { }}
onChange={(value) => loadCount.onChange(parseInt(value))}
/>
)}
{/* Clear Points Button */}
<div className="selected-actions-list">
<div className="value-field-container">
<div className="label">Reset</div>
<div className="label">Reset Points</div>
<button
id="rest-button"
id="reset-button"
type="button"
className="regularDropdown-container"
onClick={() => {
clearPoints();
}}
onClick={clearPoints}
>
Clear
</button>
</div>
</div>
</>
</div>
);
};
export default WorkerAction;
export default WorkerAction;

185
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/conveyorMechanics.tsx
View File

@@ -18,10 +18,17 @@ import { useSceneContext } from "../../../../../../modules/scene/sceneContext";
function ConveyorMechanics() {
const [activeOption, setActiveOption] = useState<"default" | "spawn" | "swap" | "delay" | "despawn">("default");
const [speed, setSpeed] = useState("0.5");
const [actionName, setActionName] = useState("Action Name");
const [material, setMaterial] = useState("Default material");
const [spawnCount, setSpawnCount] = useState("1");
const [spawnInterval, setSpawnInterval] = useState("1");
const [delay, setDelay] = useState("0");
const [selectedPointData, setSelectedPointData] = useState<ConveyorPointSchema | undefined>();
const { selectedEventData } = useSelectedEventData();
const { productStore } = useSceneContext();
const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = productStore();
const { getPointByUuid, updateEvent, updateAction, getEventByModelUuid } = productStore();
const { selectedProductStore } = useProductContext();
const { selectedProduct } = selectedProductStore();
const { setSelectedAction, clearSelectedAction } = useSelectedAction();
@@ -36,9 +43,21 @@ function ConveyorMechanics() {
selectedEventData?.data.modelUuid,
selectedEventData?.selectedPoint
) as ConveyorPointSchema | undefined;
if (point && "action" in point) {
const event = getEventByModelUuid(
selectedProduct.productUuid,
selectedEventData?.data.modelUuid
) as ConveyorEventSchema | undefined;
if (point && "action" in point && event) {
setSelectedPointData(point);
setActiveOption(point.action.actionType as | "default" | "spawn" | "swap" | "delay" | "despawn");
setActiveOption(point.action.actionType);
setActionName(point.action.actionName);
setSpeed(event.speed?.toString() || "0.5");
setMaterial(point.action.material || "Default material");
setSpawnCount(point.action.spawnCount?.toString() || "1");
setSpawnInterval(point.action.spawnInterval?.toString() || "1");
setDelay(point.action.delay?.toString() || "0");
setSelectedAction(point.action.actionUuid, point.action.actionName);
}
} else {
@@ -53,19 +72,25 @@ function ConveyorMechanics() {
eventData: EventsSchema
) => {
upsertProductOrEventApi({
productName: productName,
productUuid: productUuid,
projectId: projectId,
productName,
productUuid,
projectId,
eventDatas: eventData,
versionId: selectedVersion?.versionId || '',
})
}
versionId: selectedVersion?.versionId || "",
});
};
const handleSpeedChange = (value: string) => {
if (!selectedEventData) return;
const event = updateEvent(selectedProduct.productUuid, selectedEventData.data.modelUuid, {
speed: parseFloat(value),
});
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
const event = updateEvent(
selectedProduct.productUuid,
selectedEventData.data.modelUuid,
{ speed: numericValue }
);
if (event) {
updateBackend(
@@ -75,16 +100,20 @@ function ConveyorMechanics() {
event
);
}
setSpeed(value);
};
const handleActionTypeChange = (option: string) => {
if (!selectedEventData || !selectedPointData) return;
const validOption = option as | "default" | "spawn" | "swap" | "delay" | "despawn";
if (!selectedPointData) return;
const validOption = option as "default" | "spawn" | "swap" | "delay" | "despawn";
setActiveOption(validOption);
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, {
actionType: validOption,
});
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ actionType: validOption }
);
if (event) {
updateBackend(
@@ -97,8 +126,14 @@ function ConveyorMechanics() {
};
const handleRenameAction = (newName: string) => {
if (!selectedEventData || !selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, { actionName: newName });
if (!selectedPointData) return;
setActionName(newName);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ actionName: newName }
);
if (event) {
updateBackend(
@@ -111,10 +146,17 @@ function ConveyorMechanics() {
};
const handleSpawnCountChange = (value: string) => {
if (!selectedEventData || !selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, {
spawnCount: parseFloat(value),
});
if (!selectedPointData) return;
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setSpawnCount(value);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ spawnCount: numericValue }
);
if (event) {
updateBackend(
@@ -127,10 +169,17 @@ function ConveyorMechanics() {
};
const handleSpawnIntervalChange = (value: string) => {
if (!selectedEventData || !selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, {
spawnInterval: parseFloat(value),
});
if (!selectedPointData) return;
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setSpawnInterval(value);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ spawnInterval: numericValue }
);
if (event) {
updateBackend(
@@ -142,9 +191,15 @@ function ConveyorMechanics() {
}
};
const handleMaterialSelect = (material: string) => {
if (!selectedEventData || !selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, { material });
const handleMaterialSelect = (selectedMaterial: string) => {
if (!selectedPointData) return;
setMaterial(selectedMaterial);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ material: selectedMaterial }
);
if (event) {
updateBackend(
@@ -157,10 +212,17 @@ function ConveyorMechanics() {
};
const handleDelayChange = (value: string) => {
if (!selectedEventData || !selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, {
delay: parseFloat(value),
});
if (!selectedPointData) return;
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setDelay(value);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ delay: numericValue }
);
if (event) {
updateBackend(
@@ -177,31 +239,6 @@ function ConveyorMechanics() {
options: ["default", "spawn", "swap", "delay", "despawn"],
};
// Get current values from store
const currentSpeed = (getEventByModelUuid(
selectedProduct.productUuid, selectedEventData?.data.modelUuid || ""
) as ConveyorEventSchema | undefined)?.speed?.toString() || "0.5";
const currentActionName = selectedPointData
? selectedPointData.action.actionName
: "Action Name";
const currentMaterial = selectedPointData
? selectedPointData.action.material
: "Default material";
const currentSpawnCount = selectedPointData
? selectedPointData.action.spawnCount?.toString() || "1"
: "1";
const currentSpawnInterval = selectedPointData
? selectedPointData.action.spawnInterval?.toString() || "1"
: "1";
const currentDelay = selectedPointData
? selectedPointData.action.delay?.toString() || "0"
: "0";
return (
<>
<div key={selectedPointData?.uuid} className="global-props section">
@@ -209,10 +246,10 @@ function ConveyorMechanics() {
<div className="property-item">
<InputWithDropDown
label="Speed"
value={currentSpeed}
value={speed}
min={0}
step={0.1}
defaultValue={"0.5"}
defaultValue="0.5"
max={10}
activeOption="m/s"
onClick={() => { }}
@@ -222,24 +259,18 @@ function ConveyorMechanics() {
</div>
</div>
<section>
<ActionsList
selectedPointData={selectedPointData}
/>
<ActionsList selectedPointData={selectedPointData} />
<div className="selected-actions-details">
<div className="selected-actions-header">
<RenameInput
value={currentActionName}
onRename={handleRenameAction}
value={actionName}
canEdit={false}
/>
</div>
<div className="selected-actions-list">
<LabledDropdown
defaultOption={
selectedPointData
? selectedPointData.action.actionType
: "default"
}
defaultOption={activeOption}
options={availableActions.options}
onSelect={handleActionTypeChange}
/>
@@ -248,11 +279,11 @@ function ConveyorMechanics() {
<SpawnAction
onChangeCount={handleSpawnCountChange}
options={["Default material", "Material 1", "Material 2", "Material 3"]}
defaultOption={currentMaterial}
defaultOption={material}
onSelect={handleMaterialSelect}
onChangeInterval={handleSpawnIntervalChange}
intervalValue={currentSpawnInterval}
countValue={currentSpawnCount}
intervalValue={spawnInterval}
countValue={spawnCount}
intervalMin={1}
intervalMax={60}
intervalDefaultValue="1"
@@ -264,14 +295,14 @@ function ConveyorMechanics() {
{activeOption === "swap" && (
<SwapAction
options={["Default material", "Material 1", "Material 2", "Material 3"]}
defaultOption={currentMaterial}
defaultOption={material}
onSelect={handleMaterialSelect}
/>
)}
{activeOption === "despawn" && <DespawnAction />}
{activeOption === "delay" && (
<DelayAction
value={currentDelay}
value={delay}
defaultValue="0"
min={0}
max={60}
@@ -288,4 +319,4 @@ function ConveyorMechanics() {
);
}
export default ConveyorMechanics;
export default ConveyorMechanics;

168
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/humanMechanics.tsx
View File

@@ -1,22 +1,25 @@
import { useEffect, useState } from "react";
import { MathUtils } from "three";
import InputWithDropDown from "../../../../../ui/inputs/InputWithDropDown";
import RenameInput from "../../../../../ui/inputs/RenameInput";
import LabledDropdown from "../../../../../ui/inputs/LabledDropdown";
import Trigger from "../trigger/Trigger";
import ActionsList from "../components/ActionsList";
import WorkerAction from "../actions/workerAction";
import AssemblyAction from "../actions/assemblyAction";
import { useSelectedEventData, useSelectedAction } from "../../../../../../store/simulation/useSimulationStore";
import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi";
import { useProductContext } from "../../../../../../modules/simulation/products/productContext";
import { useVersionContext } from "../../../../../../modules/builder/version/versionContext";
import { useSceneContext } from "../../../../../../modules/scene/sceneContext";
import { useParams } from "react-router-dom";
import WorkerAction from "../actions/workerAction";
import AssemblyAction from "../actions/assemblyAction";
function HumanMechanics() {
const [activeOption, setActiveOption] = useState<"worker" | "assembly">("worker");
const [speed, setSpeed] = useState("0.5");
const [loadCount, setLoadCount] = useState(0);
const [loadCapacity, setLoadCapacity] = useState("1");
const [processTime, setProcessTime] = useState(10);
const [swappedMaterial, setSwappedMaterial] = useState("Default material");
@@ -24,7 +27,7 @@ function HumanMechanics() {
const [selectedPointData, setSelectedPointData] = useState<HumanPointSchema | undefined>();
const { selectedEventData } = useSelectedEventData();
const { productStore } = useSceneContext();
const { getPointByUuid, updateEvent, updateAction, addAction, removeAction, getEventByModelUuid } = productStore();
const { getPointByUuid, updateEvent, updateAction, addAction, removeAction, getEventByModelUuid, getActionByUuid } = productStore();
const { selectedProductStore } = useProductContext();
const { selectedProduct } = selectedProductStore();
const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction();
@@ -40,19 +43,21 @@ function HumanMechanics() {
selectedEventData.selectedPoint
) as HumanPointSchema | undefined;
if (point?.action) {
if (point?.actions?.length) {
setSelectedPointData(point);
setCurrentAction(point.action);
setSelectedAction(point.action.actionUuid, point.action.actionName);
const firstAction = point.actions[0];
setCurrentAction(firstAction);
setSpeed((
getEventByModelUuid(
selectedProduct.productUuid,
selectedEventData?.data.modelUuid || ""
) as HumanEventSchema | undefined
)?.speed?.toString() || "1");
setLoadCapacity(point.action.loadCapacity.toString());
setProcessTime(point.action.processTime || 10);
setSwappedMaterial(point.action.swapMaterial || "Default material");
setLoadCapacity(firstAction.loadCapacity.toString());
setActiveOption(firstAction.actionType);
setLoadCount(firstAction.loadCount || 0);
setProcessTime(firstAction.processTime || 10);
setSwappedMaterial(firstAction.swapMaterial || "Default material");
}
} else {
clearSelectedAction();
@@ -60,26 +65,36 @@ function HumanMechanics() {
}, [selectedEventData, selectedProduct]);
useEffect(() => {
if (selectedEventData && selectedProduct.productUuid) {
if (selectedEventData && selectedEventData.data.type === "human") {
const point = getPointByUuid(
selectedProduct.productUuid,
selectedEventData.data.modelUuid,
selectedEventData.selectedPoint
) as HumanPointSchema | undefined;
if (point?.action) {
setSelectedPointData(point);
setCurrentAction(point.action);
setActiveOption(point.action.actionType);
setSelectedAction(point.action.actionUuid, point.action.actionName);
const actionUuid = selectedAction.actionId || point?.actions[0].actionUuid || '';
const newCurrentAction = getActionByUuid(selectedProduct.productUuid, actionUuid);
if (newCurrentAction && (newCurrentAction.actionType === 'assembly' || newCurrentAction?.actionType === 'worker')) {
if (!selectedAction.actionId) {
setSelectedAction(newCurrentAction.actionUuid, newCurrentAction.actionName);
}
setCurrentAction(newCurrentAction);
setActiveOption(newCurrentAction.actionType);
setLoadCapacity(newCurrentAction.loadCapacity.toString());
setLoadCount(newCurrentAction.loadCount || 0);
if (newCurrentAction.actionType === 'assembly') {
setProcessTime(newCurrentAction.processTime || 10);
setSwappedMaterial(newCurrentAction.swapMaterial || "Default material");
}
} else {
clearSelectedAction();
setCurrentAction(undefined);
}
} else {
clearSelectedAction();
setCurrentAction(undefined);
setSpeed("0.5");
setLoadCapacity("1");
}
}, [selectedEventData, selectedProduct, selectedAction]);
}, [selectedAction, selectedProduct, selectedEventData]);
const updateBackend = (
productName: string,
@@ -99,8 +114,9 @@ function HumanMechanics() {
const handleSelectActionType = (actionType: string) => {
if (!selectedAction.actionId || !currentAction || !selectedPointData) return;
const updatedAction = { ...currentAction, actionType: actionType as "worker" };
const updatedPoint = { ...selectedPointData, action: updatedAction };
const updatedAction = { ...currentAction, actionType: actionType as "worker" | "assembly" };
const updatedActions = selectedPointData.actions.map(action => action.actionUuid === updatedAction.actionUuid ? updatedAction : action);
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = updateAction(
selectedProduct.productUuid,
@@ -143,10 +159,9 @@ function HumanMechanics() {
const handleLoadCapacityChange = (value: string) => {
if (!currentAction || !selectedPointData || !selectedAction.actionId) return;
const updatedAction = { ...currentAction };
updatedAction.loadCapacity = parseInt(value)
const updatedPoint = { ...selectedPointData, action: updatedAction };
const updatedAction = { ...currentAction, loadCapacity: parseInt(value) };
const updatedActions = selectedPointData.actions.map(action => action.actionUuid === updatedAction.actionUuid ? updatedAction : action);
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = updateAction(
selectedProduct.productUuid,
@@ -163,13 +178,34 @@ function HumanMechanics() {
setLoadCapacity(value);
};
const handleLoadCountChange = (value: number) => {
if (!currentAction || !selectedPointData || !selectedAction.actionId) return;
const updatedAction = { ...currentAction, loadCount: value };
const updatedActions = selectedPointData.actions.map(action => action.actionUuid === updatedAction.actionUuid ? updatedAction : action);
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = updateAction(
selectedProduct.productUuid,
selectedAction.actionId,
updatedAction
);
if (event) {
updateBackend(selectedProduct.productName, selectedProduct.productUuid, projectId || '', event);
}
setCurrentAction(updatedAction);
setSelectedPointData(updatedPoint);
setLoadCount(value);
};
const handleProcessTimeChange = (value: number) => {
if (!currentAction || !selectedPointData || !selectedAction.actionId) return;
const updatedAction = { ...currentAction };
updatedAction.processTime = value
const updatedPoint = { ...selectedPointData, action: updatedAction };
const updatedAction = { ...currentAction, processTime: value };
const updatedActions = selectedPointData.actions.map(action => action.actionUuid === updatedAction.actionUuid ? updatedAction : action);
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = updateAction(
selectedProduct.productUuid,
@@ -189,10 +225,9 @@ function HumanMechanics() {
const handleMaterialChange = (value: string) => {
if (!currentAction || !selectedPointData || !selectedAction.actionId) return;
const updatedAction = { ...currentAction };
updatedAction.swapMaterial = value
const updatedPoint = { ...selectedPointData, action: updatedAction };
const updatedAction = { ...currentAction, swapMaterial: value };
const updatedActions = selectedPointData.actions.map(action => action.actionUuid === updatedAction.actionUuid ? updatedAction : action);
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = updateAction(
selectedProduct.productUuid,
@@ -212,11 +247,17 @@ function HumanMechanics() {
const handleClearPoints = () => {
if (!currentAction || !selectedPointData || !selectedAction.actionId) return;
const updatedAction = { ...currentAction };
delete updatedAction.pickUpPoint;
delete updatedAction.dropPoint;
const updatedAction: HumanAction = JSON.parse(JSON.stringify(currentAction));
const updatedPoint = { ...selectedPointData, action: updatedAction };
if (updatedAction.actionType === 'assembly') {
updatedAction.assemblyPoint = { position: null, rotation: null, }
} else {
updatedAction.pickUpPoint = { position: null, rotation: null, };
updatedAction.dropPoint = { position: null, rotation: null, }
}
const updatedActions = selectedPointData.actions.map(action => action.actionUuid === updatedAction.actionUuid ? updatedAction : action);
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = updateAction(
selectedProduct.productUuid,
@@ -237,12 +278,17 @@ function HumanMechanics() {
const newAction: HumanAction = {
actionUuid: MathUtils.generateUUID(),
actionName: `Action`,
actionName: `Action ${selectedPointData.actions.length + 1}`,
actionType: "worker",
loadCount: 1,
loadCapacity: 1,
processTime: 10,
triggers: [],
};
const updatedActions = [...(selectedPointData.actions || []), newAction];
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = addAction(
selectedProduct.productUuid,
selectedEventData.data.modelUuid,
@@ -254,27 +300,39 @@ function HumanMechanics() {
updateBackend(selectedProduct.productName, selectedProduct.productUuid, projectId || '', event);
}
const updatedPoint = { ...selectedPointData, action: newAction };
setSelectedPointData(updatedPoint);
setSelectedAction(newAction.actionUuid, newAction.actionName);
};
const handleDeleteAction = () => {
if (!selectedPointData) return;
if (!selectedPointData || !selectedAction.actionId) return;
const updatedActions = selectedPointData.actions.filter(action => action.actionUuid !== selectedAction.actionId);
const updatedPoint = { ...selectedPointData, actions: updatedActions };
const event = removeAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid
selectedAction.actionId
);
if (event) {
updateBackend(selectedProduct.productName, selectedProduct.productUuid, projectId || '', event);
}
const updatedPoint = { ...selectedPointData, action: undefined as any };
setSelectedPointData(updatedPoint);
clearSelectedAction();
setCurrentAction(undefined);
const index = selectedPointData.actions.findIndex((a) => a.actionUuid === selectedAction.actionId);
const nextAction = updatedPoint.actions[index] || updatedPoint.actions[index - 1];
if (nextAction) {
setSelectedAction(nextAction.actionUuid, nextAction.actionName);
const action = getActionByUuid(selectedProduct.productUuid, nextAction.actionUuid);
if (action) {
setCurrentAction(action as HumanAction);
}
} else {
clearSelectedAction();
setCurrentAction(undefined);
}
};
return (
@@ -299,7 +357,7 @@ function HumanMechanics() {
<section>
<ActionsList
selectedPointData={selectedPointData}
multipleAction={false}
multipleAction={true}
handleAddAction={handleAddAction}
handleDeleteAction={handleDeleteAction}
/>
@@ -315,7 +373,7 @@ function HumanMechanics() {
defaultOption={activeOption}
options={["worker", "assembly"]}
onSelect={handleSelectActionType}
disabled={true}
disabled={false}
/>
</div>
{currentAction.actionType === 'worker' &&
@@ -323,12 +381,21 @@ function HumanMechanics() {
loadCapacity={{
value: loadCapacity,
min: 1,
max: 5,
max: 20,
step: 1,
defaultValue: "10",
defaultValue: "1",
disabled: true,
onChange: handleLoadCapacityChange,
}}
loadCount={{
value: loadCount,
min: 0,
max: 20,
step: 1,
defaultValue: "1",
disabled: false,
onChange: handleLoadCountChange,
}}
clearPoints={handleClearPoints}
/>
}
@@ -343,6 +410,7 @@ function HumanMechanics() {
swapOptions={["Default material", "Material 1", "Material 2", "Material 3"]}
swapDefaultOption={swappedMaterial}
onSwapSelect={handleMaterialChange}
clearPoints={handleClearPoints}
/>
}
<div className="tirgger">

95
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/machineMechanics.tsx
View File

@@ -12,8 +12,12 @@ import { useVersionContext } from "../../../../../../modules/builder/version/ver
import { useSceneContext } from "../../../../../../modules/scene/sceneContext";
function MachineMechanics() {
const [activeOption, setActiveOption] = useState<"default" | "process">("default");
const [activeOption, setActiveOption] = useState<"process">("process");
const [actionName, setActionName] = useState("Action Name");
const [processTime, setProcessTime] = useState("1");
const [material, setMaterial] = useState("Default material");
const [selectedPointData, setSelectedPointData] = useState<MachinePointSchema | undefined>();
const { selectedEventData } = useSelectedEventData();
const { productStore } = useSceneContext();
const { getPointByUuid, updateAction } = productStore();
@@ -31,9 +35,13 @@ function MachineMechanics() {
selectedEventData?.data.modelUuid,
selectedEventData?.selectedPoint
) as MachinePointSchema | undefined;
if (point && "action" in point) {
setSelectedPointData(point);
setActiveOption(point.action.actionType as "process");
setActionName(point.action.actionName);
setProcessTime(point.action.processTime?.toString() || "1");
setMaterial(point.action.swapMaterial || "Default material");
setSelectedAction(point.action.actionUuid, point.action.actionName);
}
} else {
@@ -48,22 +56,25 @@ function MachineMechanics() {
eventData: EventsSchema
) => {
upsertProductOrEventApi({
productName: productName,
productUuid: productUuid,
projectId: projectId,
productName,
productUuid,
projectId,
eventDatas: eventData,
versionId: selectedVersion?.versionId || '',
})
}
versionId: selectedVersion?.versionId || "",
});
};
const handleActionTypeChange = (option: string) => {
if (!selectedEventData || !selectedPointData) return;
if (!selectedPointData) return;
const validOption = option as "process";
setActiveOption(validOption);
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, {
actionType: validOption,
});
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ actionType: validOption }
);
if (event) {
updateBackend(
@@ -77,7 +88,13 @@ function MachineMechanics() {
const handleRenameAction = (newName: string) => {
if (!selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, { actionName: newName });
setActionName(newName);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ actionName: newName }
);
if (event) {
updateBackend(
@@ -91,9 +108,16 @@ function MachineMechanics() {
const handleProcessTimeChange = (value: string) => {
if (!selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, {
processTime: parseFloat(value),
});
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setProcessTime(value);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ processTime: numericValue }
);
if (event) {
updateBackend(
@@ -105,11 +129,15 @@ function MachineMechanics() {
}
};
const handleMaterialSelect = (material: string) => {
const handleMaterialSelect = (selectedMaterial: string) => {
if (!selectedPointData) return;
const event = updateAction(selectedProduct.productUuid, selectedPointData.action.actionUuid, {
swapMaterial: material,
});
setMaterial(selectedMaterial);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{ swapMaterial: selectedMaterial }
);
if (event) {
updateBackend(
@@ -121,19 +149,6 @@ function MachineMechanics() {
}
};
// Get current values from store
const currentActionName = selectedPointData
? selectedPointData.action.actionName
: "Action Name";
const currentProcessTime = selectedPointData
? selectedPointData.action.processTime.toString()
: "1";
const currentMaterial = selectedPointData
? selectedPointData.action.swapMaterial
: "Default material";
const availableActions = {
defaultOption: "process",
options: ["process"],
@@ -146,28 +161,26 @@ function MachineMechanics() {
<div className="selected-actions-details">
<div className="selected-actions-header">
<RenameInput
value={currentActionName}
onRename={handleRenameAction}
value={actionName}
canEdit={false}
/>
</div>
<ActionsList
selectedPointData={selectedPointData}
/>
<ActionsList selectedPointData={selectedPointData} />
<div className="selected-actions-list">
<LabledDropdown
defaultOption="process"
defaultOption={activeOption}
options={availableActions.options}
onSelect={handleActionTypeChange}
/>
{activeOption === "process" && (
<ProcessAction
value={currentProcessTime}
value={processTime}
min={0.1}
max={60}
defaultValue="1"
onChange={handleProcessTimeChange}
swapOptions={["Default material", "Material 1", "Material 2", "Material 3"]}
swapDefaultOption={currentMaterial}
swapDefaultOption={material}
onSwapSelect={handleMaterialSelect}
/>
)}
@@ -182,4 +195,4 @@ function MachineMechanics() {
);
}
export default MachineMechanics;
export default MachineMechanics;

103
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/roboticArmMechanics.tsx
View File

@@ -14,11 +14,13 @@ import { useVersionContext } from "../../../../../../modules/builder/version/ver
import { useSceneContext } from "../../../../../../modules/scene/sceneContext";
function RoboticArmMechanics() {
const [activeOption, setActiveOption] = useState<"default" | "pickAndPlace">("default");
const [activeOption, setActiveOption] = useState<"pickAndPlace">("pickAndPlace");
const [speed, setSpeed] = useState("0.5");
const [selectedPointData, setSelectedPointData] = useState<RoboticArmPointSchema | undefined>();
const { selectedEventData } = useSelectedEventData();
const { productStore } = useSceneContext();
const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction, addAction, removeAction, } = productStore();
const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction, addAction, removeAction } = productStore();
const { selectedProductStore } = useProductContext();
const { selectedProduct } = selectedProductStore();
const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction();
@@ -33,16 +35,20 @@ function RoboticArmMechanics() {
selectedEventData.data.modelUuid,
selectedEventData.selectedPoint
) as RoboticArmPointSchema | undefined;
if (point?.actions) {
setSelectedPointData(point);
setSpeed(
(getEventByModelUuid(
selectedProduct.productUuid,
selectedEventData.data.modelUuid
) as RoboticArmEventSchema | undefined)?.speed?.toString() || "0.5"
);
if (point.actions.length > 0) {
setActiveOption(
point.actions[0].actionType as "default" | "pickAndPlace"
);
setSelectedAction(
point.actions[0].actionUuid,
point.actions[0].actionName
);
const firstAction = point.actions[0];
setActiveOption(firstAction.actionType);
setSelectedAction(firstAction.actionUuid, firstAction.actionName);
}
}
} else {
@@ -57,33 +63,33 @@ function RoboticArmMechanics() {
eventData: EventsSchema
) => {
upsertProductOrEventApi({
productName: productName,
productUuid: productUuid,
projectId: projectId,
productName,
productUuid,
projectId,
eventDatas: eventData,
versionId: selectedVersion?.versionId || '',
versionId: selectedVersion?.versionId || "",
});
};
const handleRenameAction = (newName: string) => {
if (!selectedAction.actionId) return;
if (!selectedAction.actionId || !selectedPointData) return;
const event = updateAction(
selectedProduct.productUuid,
selectedAction.actionId,
{ actionName: newName }
);
if (selectedPointData) {
const updatedActions = selectedPointData.actions.map((action) =>
action.actionUuid === selectedAction.actionId
? { ...action, actionName: newName }
: action
);
setSelectedPointData({
...selectedPointData,
actions: updatedActions,
});
}
const updatedActions = selectedPointData.actions.map(action =>
action.actionUuid === selectedAction.actionId
? { ...action, actionName: newName }
: action
);
setSelectedPointData({
...selectedPointData,
actions: updatedActions,
});
if (event) {
updateBackend(
@@ -97,10 +103,15 @@ function RoboticArmMechanics() {
const handleSpeedChange = (value: string) => {
if (!selectedEventData) return;
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setSpeed(value);
const event = updateEvent(
selectedProduct.productUuid,
selectedEventData.data.modelUuid,
{ speed: parseFloat(value), }
{ speed: numericValue }
);
if (event) {
@@ -112,6 +123,7 @@ function RoboticArmMechanics() {
);
}
};
const handleClearPoints = () => {
if (!selectedAction.actionId || !selectedPointData) return;
@@ -166,15 +178,20 @@ function RoboticArmMechanics() {
);
}
const updatedPoint = { ...selectedPointData, actions: [...selectedPointData.actions, newAction], };
setSelectedPointData(updatedPoint);
setSelectedPointData({
...selectedPointData,
actions: [...selectedPointData.actions, newAction],
});
setSelectedAction(newAction.actionUuid, newAction.actionName);
};
const handleDeleteAction = (actionUuid: string) => {
if (!selectedPointData) return;
const event = removeAction(selectedProduct.productUuid, actionUuid);
const event = removeAction(
selectedProduct.productUuid,
actionUuid
);
if (event) {
updateBackend(
@@ -185,14 +202,13 @@ function RoboticArmMechanics() {
);
}
const index = selectedPointData.actions.findIndex((a) => a.actionUuid === actionUuid);
const newActions = selectedPointData.actions.filter((a) => a.actionUuid !== actionUuid);
const index = selectedPointData.actions.findIndex(a => a.actionUuid === actionUuid);
const newActions = selectedPointData.actions.filter(a => a.actionUuid !== actionUuid);
const updatedPoint = {
setSelectedPointData({
...selectedPointData,
actions: newActions,
};
setSelectedPointData(updatedPoint);
});
if (selectedAction.actionId === actionUuid) {
const nextAction = newActions[index] || newActions[index - 1];
@@ -209,16 +225,7 @@ function RoboticArmMechanics() {
options: ["pickAndPlace"],
};
const currentSpeed = (getEventByModelUuid(selectedProduct.productUuid, selectedEventData?.data.modelUuid || "") as RoboticArmEventSchema | undefined)?.speed?.toString() || "0.5";
const currentAction = selectedPointData?.actions.find((a) => a.actionUuid === selectedAction.actionId);
const currentPickPoint = currentAction?.process.startPoint
? `${currentAction.process.startPoint[0]},${currentAction.process.startPoint[1]},${currentAction.process.startPoint[2]}`
: "";
const currentPlacePoint = currentAction?.process.endPoint
? `${currentAction.process.endPoint[0]},${currentAction.process.endPoint[1]},${currentAction.process.endPoint[2]}`
: "";
const currentAction = selectedPointData?.actions.find(a => a.actionUuid === selectedAction.actionId);
return (
<>
@@ -227,10 +234,10 @@ function RoboticArmMechanics() {
<div className="property-item">
<InputWithDropDown
label="Speed"
value={currentSpeed}
value={speed}
min={0}
step={0.1}
defaultValue={"0.5"}
defaultValue="0.5"
max={10}
activeOption="m/s"
onClick={() => { }}
@@ -252,7 +259,7 @@ function RoboticArmMechanics() {
<div className="selected-actions-header">
<RenameInput
value={selectedAction.actionName || ""}
onRename={handleRenameAction}
canEdit={false}
/>
</div>
<div className="selected-actions-list">
@@ -277,4 +284,4 @@ function RoboticArmMechanics() {
);
}
export default RoboticArmMechanics;
export default RoboticArmMechanics;

2
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/storageMechanics.tsx
View File

@@ -192,7 +192,7 @@ function StorageMechanics() {
<div className="selected-actions-header">
<RenameInput
value={currentActionName}
onRename={handleRenameAction}
canEdit={false}
/>
</div>
<div className="selected-actions-list">

195
app/src/components/layout/sidebarRight/properties/eventProperties/mechanics/vehicleMechanics.tsx
View File

@@ -3,10 +3,7 @@ import InputWithDropDown from "../../../../../ui/inputs/InputWithDropDown";
import RenameInput from "../../../../../ui/inputs/RenameInput";
import LabledDropdown from "../../../../../ui/inputs/LabledDropdown";
import Trigger from "../trigger/Trigger";
import {
useSelectedAction,
useSelectedEventData,
} from "../../../../../../store/simulation/useSimulationStore";
import { useSelectedAction, useSelectedEventData } from "../../../../../../store/simulation/useSimulationStore";
import TravelAction from "../actions/TravelAction";
import ActionsList from "../components/ActionsList";
import { upsertProductOrEventApi } from "../../../../../../services/simulation/products/UpsertProductOrEventApi";
@@ -17,18 +14,23 @@ import { useSceneContext } from "../../../../../../modules/scene/sceneContext";
import { useSelectedPath } from "../../../../../../store/builder/store";
function VehicleMechanics() {
const [activeOption, setActiveOption] = useState<"default" | "travel">("default");
const [activeOption, setActiveOption] = useState<"travel">("travel");
const [speed, setSpeed] = useState("0.5");
const [actionName, setActionName] = useState("Action Name");
const [loadCapacity, setLoadCapacity] = useState("1");
const [unloadDuration, setUnloadDuration] = useState("1");
const [selectedPointData, setSelectedPointData] = useState<VehiclePointSchema | undefined>();
const { selectedEventData } = useSelectedEventData();
const { productStore } = useSceneContext();
const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = productStore();
const { getPointByUuid, updateEvent, updateAction, getEventByModelUuid } = productStore();
const { selectedProductStore } = useProductContext();
const { selectedProduct } = selectedProductStore();
const { setSelectedAction, clearSelectedAction } = useSelectedAction();
const { selectedVersionStore } = useVersionContext();
const { selectedVersion } = selectedVersionStore();
const { projectId } = useParams();
const { selectedPath, setSelectedPath } = useSelectedPath();
const { setSelectedPath } = useSelectedPath();
useEffect(() => {
if (selectedEventData && selectedEventData.data.type === "vehicle") {
@@ -41,6 +43,15 @@ function VehicleMechanics() {
if (point) {
setSelectedPointData(point);
setActiveOption(point.action.actionType as "travel");
setActionName(point.action.actionName);
setSpeed(
(getEventByModelUuid(
selectedProduct.productUuid,
selectedEventData.data.modelUuid
) as VehicleEventSchema | undefined)?.speed?.toString() || "0.5"
);
setLoadCapacity(point.action.loadCapacity?.toString() || "1");
setUnloadDuration(point.action.unLoadDuration?.toString() || "1");
setSelectedAction(point.action.actionUuid, point.action.actionName);
}
} else {
@@ -55,22 +66,25 @@ function VehicleMechanics() {
eventData: EventsSchema
) => {
upsertProductOrEventApi({
productName: productName,
productUuid: productUuid,
projectId: projectId,
productName,
productUuid,
projectId,
eventDatas: eventData,
versionId: selectedVersion?.versionId || '',
versionId: selectedVersion?.versionId || "",
});
};
const handleSpeedChange = (value: string) => {
if (!selectedEventData) return;
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setSpeed(value);
const event = updateEvent(
selectedProduct.productUuid,
selectedEventData.data.modelUuid,
{
speed: parseFloat(value),
}
{ speed: numericValue }
);
if (event) {
@@ -84,16 +98,15 @@ function VehicleMechanics() {
};
const handleActionTypeChange = (option: string) => {
if (!selectedEventData || !selectedPointData) return;
if (!selectedPointData) return;
const validOption = option as "travel";
setActiveOption(validOption);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{
actionType: validOption,
}
{ actionType: validOption }
);
if (event) {
@@ -108,6 +121,8 @@ function VehicleMechanics() {
const handleRenameAction = (newName: string) => {
if (!selectedPointData) return;
setActionName(newName);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
@@ -126,12 +141,15 @@ function VehicleMechanics() {
const handleLoadCapacityChange = (value: string) => {
if (!selectedPointData) return;
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setLoadCapacity(value);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{
loadCapacity: parseFloat(value),
}
{ loadCapacity: numericValue }
);
if (event) {
@@ -146,12 +164,15 @@ function VehicleMechanics() {
const handleUnloadDurationChange = (value: string) => {
if (!selectedPointData) return;
const numericValue = parseFloat(value);
if (isNaN(numericValue)) return;
setUnloadDuration(value);
const event = updateAction(
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{
unLoadDuration: parseFloat(value),
}
{ unLoadDuration: numericValue }
);
if (event) {
@@ -164,46 +185,18 @@ function VehicleMechanics() {
}
};
const handlePickPointChange = (value: string) => {
const handleClearPoints = () => {
if (!selectedPointData) return;
};
const handleUnloadPointChange = (value: string) => {
if (!selectedPointData) return;
};
// Get current values from store
const currentSpeed =
(
getEventByModelUuid(
selectedProduct.productUuid,
selectedEventData?.data.modelUuid || ""
) as VehicleEventSchema | undefined
)?.speed?.toString() || "0.5";
const currentActionName = selectedPointData
? selectedPointData.action.actionName
: "Action Name";
const currentLoadCapacity = selectedPointData
? selectedPointData.action.loadCapacity.toString()
: "1";
const currentUnloadDuration = selectedPointData
? selectedPointData.action.unLoadDuration.toString()
: "1";
function handleClearPoints() {
if (!selectedEventData || !selectedPointData?.action.actionUuid) return;
const event = updateAction(
selectedProduct.productUuid, selectedPointData.action.actionUuid, {
pickUpPoint: null,
unLoadPoint: null,
steeringAngle: 0,
})
selectedProduct.productUuid,
selectedPointData.action.actionUuid,
{
pickUpPoint: null,
unLoadPoint: null,
steeringAngle: 0,
}
);
if (event) {
updateBackend(
@@ -213,7 +206,7 @@ function VehicleMechanics() {
event
);
}
}
};
const availableActions = {
defaultOption: "travel",
@@ -229,10 +222,10 @@ function VehicleMechanics() {
<div className="property-item">
<InputWithDropDown
label="Speed"
value={currentSpeed}
value={speed}
min={0}
step={0.1}
defaultValue={"0.5"}
defaultValue="0.5"
max={10}
activeOption="m/s"
onClick={() => { }}
@@ -246,13 +239,13 @@ function VehicleMechanics() {
<div className="selected-actions-details">
<div className="selected-actions-header">
<RenameInput
value={currentActionName}
onRename={handleRenameAction}
value={actionName}
canEdit={false}
/>
</div>
<div className="selected-actions-list">
<LabledDropdown
defaultOption="travel"
defaultOption={activeOption}
options={availableActions.options}
onSelect={handleActionTypeChange}
/>
@@ -260,14 +253,14 @@ function VehicleMechanics() {
{activeOption === "travel" && (
<TravelAction
loadCapacity={{
value: currentLoadCapacity,
value: loadCapacity,
min: 1,
max: 100,
defaultValue: "1",
onChange: handleLoadCapacityChange,
}}
unloadDuration={{
value: currentUnloadDuration,
value: unloadDuration,
min: 1,
max: 60,
defaultValue: "1",
@@ -284,36 +277,48 @@ function VehicleMechanics() {
type={"Vehicle"}
/>
</div>
<div style={{ display: "flex", gap: "10px", flexDirection: "column", alignItems: "center" }}>
<button style={{
backgroundColor: "#6f42c1",
color: "#f3f3fd",
borderRadius: "15px",
height: "30px",
width: "150px",
border: "none",
cursor: "pointer",
padding: "0 5px",
}} onClick={() => setSelectedPath("auto")}>Auto Generate Path</button>
<button style={{
backgroundColor: "#6f42c1",
color: "#f3f3fd",
borderRadius: "15px",
height: "30px",
width: "150px",
border: "none",
cursor: "pointer",
padding: "0 5px",
}} onClick={() => setSelectedPath("manual")}>Create Path</button>
<div style={{
display: "flex",
gap: "10px",
flexDirection: "column",
alignItems: "center"
}}>
<button
style={{
backgroundColor: "#6f42c1",
color: "#f3f3fd",
borderRadius: "15px",
height: "30px",
width: "150px",
border: "none",
cursor: "pointer",
padding: "0 5px",
}}
onClick={() => setSelectedPath("auto")}
>
Auto Generate Path
</button>
<button
style={{
backgroundColor: "#6f42c1",
color: "#f3f3fd",
borderRadius: "15px",
height: "30px",
width: "150px",
border: "none",
cursor: "pointer",
padding: "0 5px",
}}
onClick={() => setSelectedPath("manual")}
>
Create Path
</button>
</div>
</section>
</>
)
}
)}
</>
);
}
export default VehicleMechanics;
export default VehicleMechanics;

5
app/src/components/layout/sidebarRight/properties/eventProperties/trigger/Trigger.tsx
View File

@@ -65,8 +65,11 @@ const Trigger = ({ selectedPointData, type }: TriggerProps) => {
const action = getActionByUuid(selectedProduct.productUuid, currentAction);
const actionTriggers = action?.triggers || [];
setTriggers(actionTriggers);
if (actionTriggers.length === 0) {
setSelectedTrigger(undefined);
}
setSelectedTrigger(actionTriggers[0]);
}, [currentAction, selectedProduct]);
}, [currentAction, selectedProduct, selectedTrigger, selectedPointData]);
const triggeredModel = useMemo(() => {
if (!selectedProduct || !selectedTrigger?.triggeredAsset?.triggeredModel?.modelUuid)