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

Merge branch 'v2' into simulation-armbot-v2

This commit is contained in:
Gomathi 2025-04-30 16:50:54 +05:30
parent fb1995acdb a704be77d3
commit 764e235a5f
11 changed files with 1004 additions and 512 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

293
app/src/components/layout/sidebarRight/properties/eventProperties/components/ActionsList.tsx
View File

@ -1,202 +1,149 @@
import React, { useRef } from "react"; import React, { useRef } from "react";
import { import {
AddIcon, AddIcon,
RemoveIcon, RemoveIcon,
ResizeHeightIcon, ResizeHeightIcon,
} from "../../../../../icons/ExportCommonIcons"; } from "../../../../../icons/ExportCommonIcons";
import RenameInput from "../../../../../ui/inputs/RenameInput"; import RenameInput from "../../../../../ui/inputs/RenameInput";
import { handleResize } from "../../../../../../functions/handleResizePannel"; import { handleResize } from "../../../../../../functions/handleResizePannel";
import { import { useSelectedAction, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore";
useSelectedAction,
useSelectedEventData,
useSelectedProduct,
} from "../../../../../../store/simulation/useSimulationStore";
import { MathUtils } from "three";
import { useProductStore } from "../../../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../../../store/simulation/useProductStore";
import { upsertProductOrEventApi } from "../../../../../../services/simulation/UpsertProductOrEventApi";
interface ActionsListProps { interface ActionsListProps {
setSelectedPointData: (data: any) => void; // You can replace `any` with a more specific type if you have one selectedPointData: any;
selectedPointData: any; // You can replace `any` with a more specific type if you have one multipleAction?: boolean;
// ui control props handleAddAction?: () => void;
multipleAction?: boolean; handleDeleteAction?: (actionUuid: string) => void;
} }
const ActionsList: React.FC<ActionsListProps> = ({ const ActionsList: React.FC<ActionsListProps> = ({
setSelectedPointData, selectedPointData,
selectedPointData, multipleAction = false,
multipleAction = false, handleAddAction,
handleDeleteAction,
}) => { }) => {
const actionsContainerRef = useRef<HTMLDivElement>(null); const actionsContainerRef = useRef<HTMLDivElement>(null);
// store const email = localStorage.getItem('email')
const { selectedEventData } = useSelectedEventData(); const organization = (email!.split("@")[1]).split(".")[0];
const { updateAction, addAction, removeAction } = useProductStore();
const { selectedProduct } = useSelectedProduct();
const { selectedAction, setSelectedAction, clearSelectedAction } =
useSelectedAction();
const handleAddAction = () => { // store
if (!selectedEventData || !selectedPointData) return; const { renameAction } = useProductStore();
const { selectedProduct } = useSelectedProduct();
const { selectedAction, setSelectedAction } = useSelectedAction();
const newAction = { const handleRenameAction = (newName: string) => {
actionUuid: MathUtils.generateUUID(), if (!selectedAction.actionId) return;
actionName: `Action ${selectedPointData.actions.length + 1}`, const event = renameAction(selectedAction.actionId, newName);
actionType: "pickAndPlace" as const,
process: { if (event) {
startPoint: null, upsertProductOrEventApi({
endPoint: null, productName: selectedProduct.productName,
}, productId: selectedProduct.productId,
triggers: [] as TriggerSchema[], organization: organization,
eventDatas: event
})
}
}; };
addAction( const handleActionSelect = (actionUuid: string, actionName: string) => {
selectedProduct.productId, setSelectedAction(actionUuid, actionName);
selectedEventData.data.modelUuid,
selectedEventData.selectedPoint,
newAction
);
const updatedPoint = {
...selectedPointData,
actions: [...selectedPointData.actions, newAction],
}; };
setSelectedPointData(updatedPoint);
setSelectedAction(newAction.actionUuid, newAction.actionName);
};
const handleDeleteAction = (actionUuid: string) => { return (
if (!selectedPointData) return; <div className="actions-list-container">
<div className="actions">
<div className="header">
<div className="header-value">Actions</div>
removeAction(actionUuid);
const newActions = selectedPointData.actions.filter(
(a: any) => a.actionUuid !== actionUuid
);
const updatedPoint = {
...selectedPointData,
actions: newActions,
};
setSelectedPointData(updatedPoint);
if (selectedAction.actionId === actionUuid) {
if (newActions.length > 0) {
setSelectedAction(newActions[0].actionUuid, newActions[0].actionName);
} else {
clearSelectedAction();
}
}
};
const handleRenameAction = (newName: string) => {
if (!selectedAction.actionId) return;
updateAction(selectedAction.actionId, { actionName: newName });
if (selectedPointData?.actions) {
const updatedActions = selectedPointData.actions.map((action: any) =>
action.actionUuid === selectedAction.actionId
? { ...action, actionName: newName }
: action
);
setSelectedPointData({
...selectedPointData,
actions: updatedActions,
});
} else {
// write logic for single action
return;
}
};
const handleActionSelect = (actionUuid: string, actionName: string) => {
setSelectedAction(actionUuid, actionName);
};
return (
<div className="actions-list-container">
<div className="actions">
<div className="header">
<div className="header-value">Actions</div>
<button
className="add-button"
onClick={() => handleAddAction()}
disabled={!multipleAction}
>
<AddIcon /> Add
</button>
</div>
<div
className="lists-main-container"
ref={actionsContainerRef}
style={{ height: "120px" }}
>
<div className="list-container">
{multipleAction &&
selectedPointData.actions.map((action: any) => (
<div
key={action.actionUuid}
className={`list-item ${
selectedAction.actionId === action.actionUuid
? "active"
: ""
}`}
>
<button
className="value"
onClick={() =>
handleActionSelect(action.actionUuid, action.actionName)
}
>
<RenameInput
value={action.actionName}
onRename={handleRenameAction}
/>
</button>
{selectedPointData.actions.length > 1 && (
<button <button
className="remove-button" className="add-button"
onClick={() => handleDeleteAction(action.actionUuid)} onClick={() => {
if (handleAddAction) {
handleAddAction();
}
}}
disabled={!multipleAction}
> >
<RemoveIcon /> <AddIcon /> Add
</button> </button>
)}
</div> </div>
))} <div
{!multipleAction && selectedPointData && ( className="lists-main-container"
<div ref={actionsContainerRef}
key={selectedPointData.action.actionUuid} style={{ height: "120px" }}
className={`list-item active`}
>
<button
className="value"
onClick={() =>
handleActionSelect(
selectedPointData.action.actionUuid,
selectedPointData.action.actionName
)
}
> >
<RenameInput <div className="list-container">
value={selectedPointData.action.actionName} {multipleAction && selectedPointData &&
onRename={handleRenameAction} selectedPointData.actions.map((action: any) => (
/> <div
</button> key={action.actionUuid}
</div> className={`list-item ${selectedAction.actionId === action.actionUuid
)} ? "active"
</div> : ""
{multipleAction && ( }`}
<button >
className="resize-icon" <button
id="action-resize" className="value"
onMouseDown={(e: any) => handleResize(e, actionsContainerRef)} onClick={() =>
> handleActionSelect(action.actionUuid, action.actionName)
<ResizeHeightIcon /> }
</button> >
)} <RenameInput
value={action.actionName}
onRename={(value) => handleRenameAction(value)}
/>
</button>
{selectedPointData.actions.length > 1 && (
<button
className="remove-button"
onClick={() => {
if (handleDeleteAction) {
handleDeleteAction(action.actionUuid);
}
}}
>
<RemoveIcon />
</button>
)}
</div>
))}
{!multipleAction && selectedPointData && (
<div
key={selectedPointData.action.actionUuid}
className={`list-item active`}
>
<button
className="value"
onClick={() =>
handleActionSelect(
selectedPointData.action.actionUuid,
selectedPointData.action.actionName
)
}
>
<RenameInput
value={selectedPointData.action.actionName}
onRename={handleRenameAction}
/>
</button>
</div>
)}
</div>
{multipleAction && (
<button
className="resize-icon"
id="action-resize"
onMouseDown={(e: any) => handleResize(e, actionsContainerRef)}
>
<ResizeHeightIcon />
</button>
)}
</div>
</div>
</div> </div>
</div> );
</div>
);
}; };
export default ActionsList; export default ActionsList;

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

@ -11,14 +11,18 @@ import Trigger from "../trigger/Trigger";
import { useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore"; import { useSelectedEventData, useSelectedProduct } from "../../../../../../store/simulation/useSimulationStore";
import { useProductStore } from "../../../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../../../store/simulation/useProductStore";
import ActionsList from "../components/ActionsList"; import ActionsList from "../components/ActionsList";
import { upsertProductOrEventApi } from "../../../../../../services/simulation/UpsertProductOrEventApi";
function ConveyorMechanics() { function ConveyorMechanics() {
const [activeOption, setActiveOption] = useState<"default" | "spawn" | "swap" | "delay" | "despawn">("default"); const [activeOption, setActiveOption] = useState<"default" | "spawn" | "swap" | "delay" | "despawn">("default");
const [selectedPointData, setSelectedPointData] = useState<ConveyorPointSchema | undefined>(); const [selectedPointData, setSelectedPointData] = useState<ConveyorPointSchema | undefined>();
const { selectedEventData } = useSelectedEventData(); const { selectedEventData } = useSelectedEventData();
const { getPointByUuid, updateEvent, updateAction } = useProductStore(); const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = useProductStore();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const email = localStorage.getItem('email')
const organization = (email!.split("@")[1]).split(".")[0];
useEffect(() => { useEffect(() => {
if (selectedEventData) { if (selectedEventData) {
const point = getPointByUuid( const point = getPointByUuid(
@ -33,11 +37,34 @@ function ConveyorMechanics() {
} }
}, [selectedProduct, selectedEventData, getPointByUuid]); }, [selectedProduct, selectedEventData, getPointByUuid]);
const updateBackend = (
productName: string,
productId: string,
organization: string,
eventData: EventsSchema
) => {
upsertProductOrEventApi({
productName: productName,
productId: productId,
organization: organization,
eventDatas: eventData
})
}
const handleSpeedChange = (value: string) => { const handleSpeedChange = (value: string) => {
if (!selectedEventData) return; if (!selectedEventData) return;
updateEvent(selectedProduct.productId, selectedEventData.data.modelUuid, { const event = updateEvent(selectedProduct.productId, selectedEventData.data.modelUuid, {
speed: parseFloat(value), speed: parseFloat(value),
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handleActionTypeChange = (option: string) => { const handleActionTypeChange = (option: string) => {
@ -45,40 +72,94 @@ function ConveyorMechanics() {
const validOption = option as | "default" | "spawn" | "swap" | "delay" | "despawn"; const validOption = option as | "default" | "spawn" | "swap" | "delay" | "despawn";
setActiveOption(validOption); setActiveOption(validOption);
updateAction(selectedPointData.action.actionUuid, { const event = updateAction(selectedPointData.action.actionUuid, {
actionType: validOption, actionType: validOption,
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handleRenameAction = (newName: string) => { const handleRenameAction = (newName: string) => {
if (!selectedPointData) return; if (!selectedEventData || !selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { actionName: newName }); const event = updateAction(selectedPointData.action.actionUuid, { actionName: newName });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handleSpawnCountChange = (value: string) => { const handleSpawnCountChange = (value: string) => {
if (!selectedPointData) return; if (!selectedEventData || !selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { const event = updateAction(selectedPointData.action.actionUuid, {
spawnCount: value === "inherit" ? "inherit" : parseFloat(value), spawnCount: value === "inherit" ? "inherit" : parseFloat(value),
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handleSpawnIntervalChange = (value: string) => { const handleSpawnIntervalChange = (value: string) => {
if (!selectedPointData) return; if (!selectedEventData || !selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { const event = updateAction(selectedPointData.action.actionUuid, {
spawnInterval: value === "inherit" ? "inherit" : parseFloat(value), spawnInterval: value === "inherit" ? "inherit" : parseFloat(value),
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handleMaterialSelect = (material: string) => { const handleMaterialSelect = (material: string) => {
if (!selectedPointData) return; if (!selectedEventData || !selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { material }); const event = updateAction(selectedPointData.action.actionUuid, { material });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handleDelayChange = (value: string) => { const handleDelayChange = (value: string) => {
if (!selectedPointData) return; if (!selectedEventData || !selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { const event = updateAction(selectedPointData.action.actionUuid, {
delay: value === "inherit" ? "inherit" : parseFloat(value), delay: value === "inherit" ? "inherit" : parseFloat(value),
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const availableActions = { const availableActions = {
@ -87,9 +168,9 @@ function ConveyorMechanics() {
}; };
// Get current values from store // Get current values from store
const currentSpeed = selectedEventData?.data.type === "transfer" const currentSpeed = (getEventByModelUuid(
? selectedEventData.data.speed.toString() selectedProduct.productId, selectedEventData?.data.modelUuid || ""
: "0.5"; ) as ConveyorEventSchema | undefined)?.speed?.toString() || "0.5";
const currentActionName = selectedPointData const currentActionName = selectedPointData
? selectedPointData.action.actionName ? selectedPointData.action.actionName
@ -132,7 +213,6 @@ function ConveyorMechanics() {
</div> </div>
<section> <section>
<ActionsList <ActionsList
setSelectedPointData={setSelectedPointData}
selectedPointData={selectedPointData} selectedPointData={selectedPointData}
/> />

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

@ -87,7 +87,6 @@ function MachineMechanics() {
/> />
</div> </div>
<ActionsList <ActionsList
setSelectedPointData={setSelectedPointData}
selectedPointData={selectedPointData} selectedPointData={selectedPointData}
/> />
<div className="selected-actions-list"> <div className="selected-actions-list">

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

@ -1,4 +1,5 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { MathUtils } from "three";
import InputWithDropDown from "../../../../../ui/inputs/InputWithDropDown"; import InputWithDropDown from "../../../../../ui/inputs/InputWithDropDown";
import RenameInput from "../../../../../ui/inputs/RenameInput"; import RenameInput from "../../../../../ui/inputs/RenameInput";
import LabledDropdown from "../../../../../ui/inputs/LabledDropdown"; import LabledDropdown from "../../../../../ui/inputs/LabledDropdown";
@ -7,15 +8,19 @@ import { useSelectedEventData, useSelectedProduct, useSelectedAction } from "../
import { useProductStore } from "../../../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../../../store/simulation/useProductStore";
import PickAndPlaceAction from "../actions/PickAndPlaceAction"; import PickAndPlaceAction from "../actions/PickAndPlaceAction";
import ActionsList from "../components/ActionsList"; import ActionsList from "../components/ActionsList";
import { upsertProductOrEventApi } from "../../../../../../services/simulation/UpsertProductOrEventApi";
function RoboticArmMechanics() { 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, updateEvent, updateAction } = useProductStore(); const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction, addAction, removeAction } = useProductStore();
const { selectedProduct } = useSelectedProduct(); const { selectedProduct } = useSelectedProduct();
const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction(); const { selectedAction, setSelectedAction, clearSelectedAction } = useSelectedAction();
const email = localStorage.getItem('email')
const organization = (email!.split("@")[1]).split(".")[0];
useEffect(() => { useEffect(() => {
if (selectedEventData) { if (selectedEventData) {
const point = getPointByUuid( const point = getPointByUuid(
@ -38,9 +43,23 @@ function RoboticArmMechanics() {
} }
}, [clearSelectedAction, getPointByUuid, selectedAction.actionId, selectedEventData, selectedProduct, setSelectedAction,]); }, [clearSelectedAction, getPointByUuid, selectedAction.actionId, selectedEventData, selectedProduct, setSelectedAction,]);
const updateBackend = (
productName: string,
productId: string,
organization: string,
eventData: EventsSchema
) => {
upsertProductOrEventApi({
productName: productName,
productId: productId,
organization: organization,
eventDatas: eventData
})
}
const handleRenameAction = (newName: string) => { const handleRenameAction = (newName: string) => {
if (!selectedAction.actionId) return; if (!selectedAction.actionId) return;
updateAction(selectedAction.actionId, { actionName: newName }); const event = updateAction(selectedAction.actionId, { actionName: newName });
if (selectedPointData) { if (selectedPointData) {
const updatedActions = selectedPointData.actions.map((action) => const updatedActions = selectedPointData.actions.map((action) =>
@ -51,37 +70,145 @@ function RoboticArmMechanics() {
actions: updatedActions, actions: updatedActions,
}); });
} }
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handleSpeedChange = (value: string) => { const handleSpeedChange = (value: string) => {
if (!selectedEventData) return; if (!selectedEventData) return;
updateEvent(selectedProduct.productId, selectedEventData.data.modelUuid, { const event = updateEvent(selectedProduct.productId, selectedEventData.data.modelUuid, {
speed: parseFloat(value), speed: parseFloat(value),
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handlePickPointChange = (value: string) => { const handlePickPointChange = (value: string) => {
if (!selectedAction.actionId || !selectedPointData) return; if (!selectedAction.actionId || !selectedPointData) return;
const [x, y, z] = value.split(",").map(Number); const [x, y, z] = value.split(",").map(Number);
updateAction(selectedAction.actionId, { const event = updateAction(selectedAction.actionId, {
process: { process: {
startPoint: [x, y, z] as [number, number, number], startPoint: [x, y, z] as [number, number, number],
endPoint: selectedPointData.actions.find((a) => a.actionUuid === selectedAction.actionId)?.process.endPoint || null, endPoint: selectedPointData.actions.find((a) => a.actionUuid === selectedAction.actionId)?.process.endPoint || null,
}, },
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
}; };
const handlePlacePointChange = (value: string) => { const handlePlacePointChange = (value: string) => {
if (!selectedAction.actionId || !selectedPointData) return; if (!selectedAction.actionId || !selectedPointData) return;
const [x, y, z] = value.split(",").map(Number); const [x, y, z] = value.split(",").map(Number);
updateAction(selectedAction.actionId, { const event = updateAction(selectedAction.actionId, {
process: { process: {
startPoint: selectedPointData.actions.find((a) => a.actionUuid === selectedAction.actionId)?.process.startPoint || null, startPoint: selectedPointData.actions.find((a) => a.actionUuid === selectedAction.actionId)?.process.startPoint || null,
endPoint: [x, y, z] as [number, number, number], endPoint: [x, y, z] as [number, number, number],
}, },
}); });
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
};
const handleAddAction = () => {
if (!selectedEventData || !selectedPointData) return;
const newAction = {
actionUuid: MathUtils.generateUUID(),
actionName: `Action ${selectedPointData.actions.length + 1}`,
actionType: "pickAndPlace" as const,
process: {
startPoint: null,
endPoint: null,
},
triggers: [] as TriggerSchema[],
};
const event = addAction(
selectedProduct.productId,
selectedEventData.data.modelUuid,
selectedEventData.selectedPoint,
newAction
);
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
const updatedPoint = {
...selectedPointData,
actions: [...selectedPointData.actions, newAction],
};
setSelectedPointData(updatedPoint);
setSelectedAction(newAction.actionUuid, newAction.actionName);
};
const handleDeleteAction = (actionUuid: string) => {
if (!selectedPointData) return;
const event = removeAction(actionUuid);
if (event) {
updateBackend(
selectedProduct.productName,
selectedProduct.productId,
organization,
event
);
}
const newActions = selectedPointData.actions.filter(
(a: any) => a.actionUuid !== actionUuid
);
const updatedPoint = {
...selectedPointData,
actions: newActions,
};
setSelectedPointData(updatedPoint);
if (selectedAction.actionId === actionUuid) {
if (newActions.length > 0) {
setSelectedAction(newActions[0].actionUuid, newActions[0].actionName);
} else {
clearSelectedAction();
}
}
}; };
const availableActions = { const availableActions = {
@ -89,9 +216,9 @@ function RoboticArmMechanics() {
options: ["pickAndPlace"], options: ["pickAndPlace"],
}; };
const currentSpeed = selectedEventData?.data.type === "roboticArm" const currentSpeed = (getEventByModelUuid(
? selectedEventData.data.speed.toString() selectedProduct.productId, selectedEventData?.data.modelUuid || ""
: "0.5"; ) as RoboticArmEventSchema | undefined)?.speed?.toString() || "0.5";
const currentAction = selectedPointData?.actions.find((a) => a.actionUuid === selectedAction.actionId); const currentAction = selectedPointData?.actions.find((a) => a.actionUuid === selectedAction.actionId);
@ -122,10 +249,12 @@ function RoboticArmMechanics() {
</div> </div>
</div> </div>
<section> <section>
<ActionsList <ActionsList
setSelectedPointData={setSelectedPointData}
selectedPointData={selectedPointData} selectedPointData={selectedPointData}
multipleAction multipleAction
handleAddAction={handleAddAction}
handleDeleteAction={handleDeleteAction}
/> />
{selectedAction.actionId && currentAction && ( {selectedAction.actionId && currentAction && (

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

@ -69,7 +69,6 @@ function StorageMechanics() {
{selectedEventData && ( {selectedEventData && (
<section> <section>
<ActionsList <ActionsList
setSelectedPointData={setSelectedPointData}
selectedPointData={selectedPointData} selectedPointData={selectedPointData}
/> />
<div className="selected-actions-details"> <div className="selected-actions-details">

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

@ -4,186 +4,181 @@ import RenameInput from "../../../../../ui/inputs/RenameInput";
import LabledDropdown from "../../../../../ui/inputs/LabledDropdown"; import LabledDropdown from "../../../../../ui/inputs/LabledDropdown";
import Trigger from "../trigger/Trigger"; import Trigger from "../trigger/Trigger";
import { import {
useSelectedEventData, useSelectedEventData,
useSelectedProduct, useSelectedProduct,
} from "../../../../../../store/simulation/useSimulationStore"; } from "../../../../../../store/simulation/useSimulationStore";
import { useProductStore } from "../../../../../../store/simulation/useProductStore"; import { useProductStore } from "../../../../../../store/simulation/useProductStore";
import TravelAction from "../actions/TravelAction"; import TravelAction from "../actions/TravelAction";
import ActionsList from "../components/ActionsList"; import ActionsList from "../components/ActionsList";
function VehicleMechanics() { function VehicleMechanics() {
const [activeOption, setActiveOption] = useState<"default" | "travel">( const [activeOption, setActiveOption] = useState<"default" | "travel">("default");
"default" const [selectedPointData, setSelectedPointData] = useState<VehiclePointSchema | undefined>();
); const { selectedEventData } = useSelectedEventData();
const [selectedPointData, setSelectedPointData] = useState< const { getPointByUuid, getEventByModelUuid, updateEvent, updateAction } = useProductStore();
VehiclePointSchema | undefined const { selectedProduct } = useSelectedProduct();
>();
const { selectedEventData } = useSelectedEventData();
const { getPointByUuid, updateEvent, updateAction } = useProductStore();
const { selectedProduct } = useSelectedProduct();
useEffect(() => { useEffect(() => {
if (selectedEventData) { if (selectedEventData) {
const point = getPointByUuid( const point = getPointByUuid(
selectedProduct.productId, selectedProduct.productId,
selectedEventData.data.modelUuid, selectedEventData.data.modelUuid,
selectedEventData.selectedPoint selectedEventData.selectedPoint
) as VehiclePointSchema | undefined; ) as VehiclePointSchema | undefined;
if (point) { if (point) {
setSelectedPointData(point); setSelectedPointData(point);
setActiveOption(point.action.actionType as "travel"); setActiveOption(point.action.actionType as "travel");
} }
} }
}, [selectedProduct, selectedEventData, getPointByUuid]); }, [selectedProduct, selectedEventData, getPointByUuid]);
const handleSpeedChange = (value: string) => { const handleSpeedChange = (value: string) => {
if (!selectedEventData) return; if (!selectedEventData) return;
updateEvent(selectedProduct.productId, selectedEventData.data.modelUuid, { updateEvent(selectedProduct.productId, selectedEventData.data.modelUuid, {
speed: parseFloat(value), speed: parseFloat(value),
}); });
}; };
const handleActionTypeChange = (option: string) => { const handleActionTypeChange = (option: string) => {
if (!selectedEventData || !selectedPointData) return; if (!selectedEventData || !selectedPointData) return;
const validOption = option as "travel"; const validOption = option as "travel";
setActiveOption(validOption); setActiveOption(validOption);
updateAction(selectedPointData.action.actionUuid, { updateAction(selectedPointData.action.actionUuid, {
actionType: validOption, actionType: validOption,
}); });
}; };
const handleRenameAction = (newName: string) => { const handleRenameAction = (newName: string) => {
if (!selectedPointData) return; if (!selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { actionName: newName }); updateAction(selectedPointData.action.actionUuid, { actionName: newName });
}; };
const handleLoadCapacityChange = (value: string) => { const handleLoadCapacityChange = (value: string) => {
if (!selectedPointData) return; if (!selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { updateAction(selectedPointData.action.actionUuid, {
loadCapacity: parseFloat(value), loadCapacity: parseFloat(value),
}); });
}; };
const handleUnloadDurationChange = (value: string) => { const handleUnloadDurationChange = (value: string) => {
if (!selectedPointData) return; if (!selectedPointData) return;
updateAction(selectedPointData.action.actionUuid, { updateAction(selectedPointData.action.actionUuid, {
unLoadDuration: parseFloat(value), unLoadDuration: parseFloat(value),
}); });
}; };
const handlePickPointChange = (value: string) => { const handlePickPointChange = (value: string) => {
if (!selectedPointData) return; if (!selectedPointData) return;
}; };
const handleUnloadPointChange = (value: string) => { const handleUnloadPointChange = (value: string) => {
if (!selectedPointData) return; if (!selectedPointData) return;
}; };
// Get current values from store // Get current values from store
const currentSpeed =
selectedEventData?.data.type === "vehicle"
? selectedEventData.data.speed.toString()
: "0.5";
const currentActionName = selectedPointData const currentSpeed = (getEventByModelUuid(
? selectedPointData.action.actionName selectedProduct.productId, selectedEventData?.data.modelUuid || ""
: "Action Name"; ) as VehicleEventSchema | undefined)?.speed?.toString() || "0.5";
const currentLoadCapacity = selectedPointData const currentActionName = selectedPointData
? selectedPointData.action.loadCapacity.toString() ? selectedPointData.action.actionName
: "1"; : "Action Name";
const currentUnloadDuration = selectedPointData const currentLoadCapacity = selectedPointData
? selectedPointData.action.unLoadDuration.toString() ? selectedPointData.action.loadCapacity.toString()
: "1"; : "1";
const currentPickPoint = selectedPointData?.action.pickUpPoint; const currentUnloadDuration = selectedPointData
? selectedPointData.action.unLoadDuration.toString()
: "1";
const currentUnloadPoint = selectedPointData?.action.unLoadPoint; const currentPickPoint = selectedPointData?.action.pickUpPoint;
const availableActions = { const currentUnloadPoint = selectedPointData?.action.unLoadPoint;
defaultOption: "travel",
options: ["travel"],
};
return ( const availableActions = {
<> defaultOption: "travel",
{selectedEventData && ( options: ["travel"],
};
return (
<> <>
<div className="global-props section"> {selectedEventData && (
<div className="property-list-container"> <>
<div className="property-item"> <div className="global-props section">
<InputWithDropDown <div className="property-list-container">
label="Speed" <div className="property-item">
value={currentSpeed} <InputWithDropDown
min={0} label="Speed"
step={0.1} value={currentSpeed}
defaultValue={"0.5"} min={0}
max={10} step={0.1}
activeOption="m/s" defaultValue={"0.5"}
onClick={() => {}} max={10}
onChange={handleSpeedChange} activeOption="m/s"
/> onClick={() => { }}
</div> onChange={handleSpeedChange}
</div> />
</div> </div>
<section> </div>
<ActionsList </div>
setSelectedPointData={setSelectedPointData} <section>
selectedPointData={selectedPointData} <ActionsList
/> selectedPointData={selectedPointData}
<div className="selected-actions-details"> />
<div className="selected-actions-header"> <div className="selected-actions-details">
<RenameInput <div className="selected-actions-header">
value={currentActionName} <RenameInput
onRename={handleRenameAction} value={currentActionName}
/> onRename={handleRenameAction}
</div> />
<div className="selected-actions-list"> </div>
<LabledDropdown <div className="selected-actions-list">
defaultOption="travel" <LabledDropdown
options={availableActions.options} defaultOption="travel"
onSelect={handleActionTypeChange} options={availableActions.options}
/> onSelect={handleActionTypeChange}
/>
{activeOption === "travel" && ( {activeOption === "travel" && (
<TravelAction <TravelAction
loadCapacity={{ loadCapacity={{
value: currentLoadCapacity, value: currentLoadCapacity,
min: 1, min: 1,
max: 100, max: 100,
defaultValue: "1", defaultValue: "1",
onChange: handleLoadCapacityChange, onChange: handleLoadCapacityChange,
}} }}
unloadDuration={{ unloadDuration={{
value: currentUnloadDuration, value: currentUnloadDuration,
min: 1, min: 1,
max: 60, max: 60,
defaultValue: "1", defaultValue: "1",
onChange: handleUnloadDurationChange, onChange: handleUnloadDurationChange,
}} }}
// pickPoint={{ // pickPoint={{
// value: currentPickPoint, // value: currentPickPoint,
// onChange: handlePickPointChange, // onChange: handlePickPointChange,
// }} // }}
// unloadPoint={{ // unloadPoint={{
// value: currentUnloadPoint, // value: currentUnloadPoint,
// onChange: handleUnloadPointChange, // onChange: handleUnloadPointChange,
// }} // }}
/> />
)} )}
</div> </div>
</div> </div>
<div className="tirgger"> <div className="tirgger">
<Trigger /> <Trigger />
</div> </div>
</section> </section>
</>
)}
</> </>
)} );
</>
);
} }
export default VehicleMechanics; export default VehicleMechanics;

1
app/src/modules/builder/geomentries/assets/addAssetModel.ts
View File

@ -270,7 +270,6 @@ async function handleModelLoad(
} }
}; };
addEvent(roboticArmEvent); addEvent(roboticArmEvent);
console.log('roboticArmEvent: ', roboticArmEvent);
eventData.point = { eventData.point = {
uuid: roboticArmEvent.point.uuid, uuid: roboticArmEvent.point.uuid,
position: roboticArmEvent.point.position, position: roboticArmEvent.point.position,

305
app/src/modules/scene/controls/selectionControls/copyPasteControls.tsx
View File

@ -6,6 +6,7 @@ import { toast } from "react-toastify";
// import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi'; // import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
import * as Types from "../../../../types/world/worldTypes"; import * as Types from "../../../../types/world/worldTypes";
import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys"; import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
import { useEventsStore } from "../../../../store/simulation/useEventsStore";
const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pastedObjects, setpastedObjects, selectionGroup, setDuplicatedObjects, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects, boundingBoxRef }: any) => { const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pastedObjects, setpastedObjects, selectionGroup, setDuplicatedObjects, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects, boundingBoxRef }: any) => {
const { camera, controls, gl, scene, pointer, raycaster } = useThree(); const { camera, controls, gl, scene, pointer, raycaster } = useThree();
@ -13,7 +14,8 @@ const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pas
const { selectedAssets, setSelectedAssets } = useSelectedAssets(); const { selectedAssets, setSelectedAssets } = useSelectedAssets();
const plane = useMemo(() => new THREE.Plane(new THREE.Vector3(0, 1, 0), 0), []); const plane = useMemo(() => new THREE.Plane(new THREE.Vector3(0, 1, 0), 0), []);
const { floorItems, setFloorItems } = useFloorItems(); const { floorItems, setFloorItems } = useFloorItems();
const { socket } = useSocketStore() const { socket } = useSocketStore();
const { addEvent } = useEventsStore();
useEffect(() => { useEffect(() => {
if (!camera || !scene || toggleView) return; if (!camera || !scene || toggleView) return;
@ -137,38 +139,6 @@ const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pas
if (itemsGroupRef.current) { if (itemsGroupRef.current) {
let updatedEventData = null;
if (obj.userData.eventData) {
updatedEventData = JSON.parse(JSON.stringify(obj.userData.eventData));
updatedEventData.modelUuid = THREE.MathUtils.generateUUID();
if (updatedEventData.type === "Conveyor" && updatedEventData.points) {
updatedEventData.points = updatedEventData.points.map((point: any) => ({
...point,
uuid: THREE.MathUtils.generateUUID()
}));
}
else if (updatedEventData.type === "Vehicle" && updatedEventData.point) {
updatedEventData.point = {
...updatedEventData.point,
uuid: THREE.MathUtils.generateUUID()
};
}
else if (updatedEventData.type === "ArmBot" && updatedEventData.point) {
updatedEventData.point = {
...updatedEventData.point,
uuid: THREE.MathUtils.generateUUID()
};
}
else if (updatedEventData.type === "StaticMachine" && updatedEventData.point) {
updatedEventData.point = {
...updatedEventData.point,
uuid: THREE.MathUtils.generateUUID()
};
}
}
const newFloorItem: Types.FloorItemType = { const newFloorItem: Types.FloorItemType = {
modelUuid: obj.uuid, modelUuid: obj.uuid,
modelName: obj.userData.name, modelName: obj.userData.name,
@ -177,56 +147,245 @@ const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pas
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, },
isLocked: false, isLocked: false,
isVisible: true, isVisible: true,
eventData: updatedEventData
}; };
setFloorItems((prevItems: Types.FloorItems) => { let updatedEventData = null;
const updatedItems = [...(prevItems || []), newFloorItem]; if (obj.userData.eventData) {
localStorage.setItem("FloorItems", JSON.stringify(updatedItems)); updatedEventData = JSON.parse(JSON.stringify(obj.userData.eventData));
return updatedItems; updatedEventData.modelUuid = newFloorItem.modelUuid;
});
const email = localStorage.getItem("email"); const eventData: any = {
const organization = email ? email.split("@")[1].split(".")[0] : "default"; type: obj.userData.eventData.type,
};
//REST if (obj.userData.eventData.type === "Conveyor") {
const ConveyorEvent: ConveyorEventSchema = {
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
position: newFloorItem.position,
rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
state: "idle",
type: 'transfer',
speed: 1,
points: updatedEventData.points.map((point: any, index: number) => ({
uuid: THREE.MathUtils.generateUUID(),
position: [point.position[0], point.position[1], point.position[2]],
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
action: {
actionUuid: THREE.MathUtils.generateUUID(),
actionName: `Action ${index}`,
actionType: 'default',
material: 'Default Material',
delay: 0,
spawnInterval: 5,
spawnCount: 1,
triggers: []
}
}))
};
addEvent(ConveyorEvent);
eventData.points = ConveyorEvent.points.map(point => ({
uuid: point.uuid,
position: point.position,
rotation: point.rotation
}));
// await setFloorItemApi( } else if (obj.userData.eventData.type === "Vehicle") {
// organization, const vehicleEvent: VehicleEventSchema = {
// obj.uuid, modelUuid: newFloorItem.modelUuid,
// obj.userData.name, modelName: newFloorItem.modelName,
// [worldPosition.x, worldPosition.y, worldPosition.z], position: newFloorItem.position,
// { "x": obj.rotation.x, "y": obj.rotation.y, "z": obj.rotation.z }, rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
// obj.userData.modelId, state: "idle",
// false, type: "vehicle",
// true, speed: 1,
// ); point: {
uuid: THREE.MathUtils.generateUUID(),
position: [updatedEventData.point.position[0], updatedEventData.point.position[1], updatedEventData.point.position[2]],
rotation: [updatedEventData.point.rotation[0], updatedEventData.point.rotation[1], updatedEventData.point.rotation[2]],
action: {
actionUuid: THREE.MathUtils.generateUUID(),
actionName: "Action 1",
actionType: "travel",
unLoadDuration: 5,
loadCapacity: 10,
steeringAngle: 0,
pickUpPoint: null,
unLoadPoint: null,
triggers: []
}
}
};
addEvent(vehicleEvent);
eventData.point = {
uuid: vehicleEvent.point.uuid,
position: vehicleEvent.point.position,
rotation: vehicleEvent.point.rotation
};
//SOCKET } else if (obj.userData.eventData.type === "ArmBot") {
const roboticArmEvent: RoboticArmEventSchema = {
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
position: newFloorItem.position,
rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
state: "idle",
type: "roboticArm",
speed: 1,
point: {
uuid: THREE.MathUtils.generateUUID(),
position: [updatedEventData.point.position[0], updatedEventData.point.position[1], updatedEventData.point.position[2]],
rotation: [updatedEventData.point.rotation[0], updatedEventData.point.rotation[1], updatedEventData.point.rotation[2]],
actions: [
{
actionUuid: THREE.MathUtils.generateUUID(),
actionName: "Action 1",
actionType: "pickAndPlace",
process: {
startPoint: null,
endPoint: null
},
triggers: []
}
]
}
};
addEvent(roboticArmEvent);
eventData.point = {
uuid: roboticArmEvent.point.uuid,
position: roboticArmEvent.point.position,
rotation: roboticArmEvent.point.rotation
};
const data = { } else if (obj.userData.eventData.type === "StaticMachine") {
organization, const machineEvent: MachineEventSchema = {
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, position: newFloorItem.position,
position: newFloorItem.position, rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, state: "idle",
isLocked: false, type: "machine",
isVisible: true, point: {
socketId: socket.id, uuid: THREE.MathUtils.generateUUID(),
eventData: updatedEventData position: [updatedEventData.point.position[0], updatedEventData.point.position[1], updatedEventData.point.position[2]],
}; rotation: [updatedEventData.point.rotation[0], updatedEventData.point.rotation[1], updatedEventData.point.rotation[2]],
action: {
actionUuid: THREE.MathUtils.generateUUID(),
actionName: "Action 1",
actionType: "process",
processTime: 10,
swapMaterial: "Default Material",
triggers: []
}
}
};
addEvent(machineEvent);
eventData.point = {
uuid: machineEvent.point.uuid,
position: machineEvent.point.position,
rotation: machineEvent.point.rotation
};
}
socket.emit("v2:model-asset:add", data); obj.userData.eventData = eventData;
obj.userData = { newFloorItem.eventData = eventData;
name: newFloorItem.modelName,
modelId: newFloorItem.modelfileID,
modelUuid: newFloorItem.modelUuid,
eventData: updatedEventData
};
itemsGroupRef.current.add(obj);
setFloorItems((prevItems: Types.FloorItems) => {
const updatedItems = [...(prevItems || []), newFloorItem];
localStorage.setItem("FloorItems", JSON.stringify(updatedItems));
return updatedItems;
});
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "default";
//REST
// await setFloorItemApi(
// organization,
// obj.uuid,
// obj.userData.name,
// [worldPosition.x, worldPosition.y, worldPosition.z],
// { "x": obj.rotation.x, "y": obj.rotation.y, "z": obj.rotation.z },
// obj.userData.modelId,
// false,
// true,
// );
//SOCKET
const data = {
organization,
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID,
position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false,
isVisible: true,
socketId: socket.id,
eventData: eventData,
};
socket.emit("v2:model-asset:add", data);
obj.userData = {
name: newFloorItem.modelName,
modelId: newFloorItem.modelfileID,
modelUuid: newFloorItem.modelUuid,
};
itemsGroupRef.current.add(obj);
} else {
setFloorItems((prevItems: Types.FloorItems) => {
const updatedItems = [...(prevItems || []), newFloorItem];
localStorage.setItem("FloorItems", JSON.stringify(updatedItems));
return updatedItems;
});
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "default";
//REST
// await setFloorItemApi(
// organization,
// obj.uuid,
// obj.userData.name,
// [worldPosition.x, worldPosition.y, worldPosition.z],
// { "x": obj.rotation.x, "y": obj.rotation.y, "z": obj.rotation.z },
// obj.userData.modelId,
// false,
// true,
// );
//SOCKET
const data = {
organization,
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID,
position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false,
isVisible: true,
socketId: socket.id,
};
socket.emit("v2:model-asset:add", data);
obj.userData = {
name: newFloorItem.modelName,
modelId: newFloorItem.modelfileID,
modelUuid: newFloorItem.modelUuid,
};
itemsGroupRef.current.add(obj);
}
} }
}); });

303
app/src/modules/scene/controls/selectionControls/duplicationControls.tsx
View File

@ -7,6 +7,7 @@ import { toast } from "react-toastify";
import * as Types from "../../../../types/world/worldTypes"; import * as Types from "../../../../types/world/worldTypes";
import { setFloorItemApi } from "../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi"; import { setFloorItemApi } from "../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi";
import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys"; import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
import { useEventsStore } from "../../../../store/simulation/useEventsStore";
const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedObjects, setpastedObjects, selectionGroup, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects, boundingBoxRef }: any) => { const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedObjects, setpastedObjects, selectionGroup, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects, boundingBoxRef }: any) => {
const { camera, controls, gl, scene, pointer, raycaster } = useThree(); const { camera, controls, gl, scene, pointer, raycaster } = useThree();
@ -15,6 +16,7 @@ const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedOb
const plane = useMemo(() => new THREE.Plane(new THREE.Vector3(0, 1, 0), 0), []); const plane = useMemo(() => new THREE.Plane(new THREE.Vector3(0, 1, 0), 0), []);
const { floorItems, setFloorItems } = useFloorItems(); const { floorItems, setFloorItems } = useFloorItems();
const { socket } = useSocketStore(); const { socket } = useSocketStore();
const { addEvent } = useEventsStore();
useEffect(() => { useEffect(() => {
if (!camera || !scene || toggleView) return; if (!camera || !scene || toggleView) return;
@ -115,38 +117,6 @@ const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedOb
if (itemsGroupRef.current) { if (itemsGroupRef.current) {
let updatedEventData = null;
if (obj.userData.eventData) {
updatedEventData = JSON.parse(JSON.stringify(obj.userData.eventData));
updatedEventData.modelUuid = THREE.MathUtils.generateUUID();
if (updatedEventData.type === "Conveyor" && updatedEventData.points) {
updatedEventData.points = updatedEventData.points.map((point: any) => ({
...point,
uuid: THREE.MathUtils.generateUUID()
}));
}
else if (updatedEventData.type === "Vehicle" && updatedEventData.point) {
updatedEventData.point = {
...updatedEventData.point,
uuid: THREE.MathUtils.generateUUID()
};
}
else if (updatedEventData.type === "ArmBot" && updatedEventData.point) {
updatedEventData.point = {
...updatedEventData.point,
uuid: THREE.MathUtils.generateUUID()
};
}
else if (updatedEventData.type === "StaticMachine" && updatedEventData.point) {
updatedEventData.point = {
...updatedEventData.point,
uuid: THREE.MathUtils.generateUUID()
};
}
}
const newFloorItem: Types.FloorItemType = { const newFloorItem: Types.FloorItemType = {
modelUuid: obj.uuid, modelUuid: obj.uuid,
modelName: obj.userData.name, modelName: obj.userData.name,
@ -155,56 +125,245 @@ const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedOb
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, }, rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z, },
isLocked: false, isLocked: false,
isVisible: true, isVisible: true,
eventData: updatedEventData
}; };
setFloorItems((prevItems: Types.FloorItems) => { let updatedEventData = null;
const updatedItems = [...(prevItems || []), newFloorItem]; if (obj.userData.eventData) {
localStorage.setItem("FloorItems", JSON.stringify(updatedItems)); updatedEventData = JSON.parse(JSON.stringify(obj.userData.eventData));
return updatedItems; updatedEventData.modelUuid = newFloorItem.modelUuid;
});
const email = localStorage.getItem("email"); const eventData: any = {
const organization = email ? email.split("@")[1].split(".")[0] : "default"; type: obj.userData.eventData.type,
};
//REST if (obj.userData.eventData.type === "Conveyor") {
const ConveyorEvent: ConveyorEventSchema = {
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
position: newFloorItem.position,
rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
state: "idle",
type: 'transfer',
speed: 1,
points: updatedEventData.points.map((point: any, index: number) => ({
uuid: THREE.MathUtils.generateUUID(),
position: [point.position[0], point.position[1], point.position[2]],
rotation: [point.rotation[0], point.rotation[1], point.rotation[2]],
action: {
actionUuid: THREE.MathUtils.generateUUID(),
actionName: `Action ${index}`,
actionType: 'default',
material: 'Default Material',
delay: 0,
spawnInterval: 5,
spawnCount: 1,
triggers: []
}
}))
};
addEvent(ConveyorEvent);
eventData.points = ConveyorEvent.points.map(point => ({
uuid: point.uuid,
position: point.position,
rotation: point.rotation
}));
// await setFloorItemApi( } else if (obj.userData.eventData.type === "Vehicle") {
// organization, const vehicleEvent: VehicleEventSchema = {
// obj.uuid, modelUuid: newFloorItem.modelUuid,
// obj.userData.name, modelName: newFloorItem.modelName,
// [worldPosition.x, worldPosition.y, worldPosition.z], position: newFloorItem.position,
// { "x": obj.rotation.x, "y": obj.rotation.y, "z": obj.rotation.z }, rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
// obj.userData.modelId, state: "idle",
// false, type: "vehicle",
// true, speed: 1,
// ); point: {
uuid: THREE.MathUtils.generateUUID(),
position: [updatedEventData.point.position[0], updatedEventData.point.position[1], updatedEventData.point.position[2]],
rotation: [updatedEventData.point.rotation[0], updatedEventData.point.rotation[1], updatedEventData.point.rotation[2]],
action: {
actionUuid: THREE.MathUtils.generateUUID(),
actionName: "Action 1",
actionType: "travel",
unLoadDuration: 5,
loadCapacity: 10,
steeringAngle: 0,
pickUpPoint: null,
unLoadPoint: null,
triggers: []
}
}
};
addEvent(vehicleEvent);
eventData.point = {
uuid: vehicleEvent.point.uuid,
position: vehicleEvent.point.position,
rotation: vehicleEvent.point.rotation
};
//SOCKET } else if (obj.userData.eventData.type === "ArmBot") {
const roboticArmEvent: RoboticArmEventSchema = {
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
position: newFloorItem.position,
rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
state: "idle",
type: "roboticArm",
speed: 1,
point: {
uuid: THREE.MathUtils.generateUUID(),
position: [updatedEventData.point.position[0], updatedEventData.point.position[1], updatedEventData.point.position[2]],
rotation: [updatedEventData.point.rotation[0], updatedEventData.point.rotation[1], updatedEventData.point.rotation[2]],
actions: [
{
actionUuid: THREE.MathUtils.generateUUID(),
actionName: "Action 1",
actionType: "pickAndPlace",
process: {
startPoint: null,
endPoint: null
},
triggers: []
}
]
}
};
addEvent(roboticArmEvent);
eventData.point = {
uuid: roboticArmEvent.point.uuid,
position: roboticArmEvent.point.position,
rotation: roboticArmEvent.point.rotation
};
const data = { } else if (obj.userData.eventData.type === "StaticMachine") {
organization, const machineEvent: MachineEventSchema = {
modelUuid: newFloorItem.modelUuid, modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName, modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID, position: newFloorItem.position,
position: newFloorItem.position, rotation: [newFloorItem.rotation.x, newFloorItem.rotation.y, newFloorItem.rotation.z],
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z }, state: "idle",
isLocked: false, type: "machine",
isVisible: true, point: {
socketId: socket.id, uuid: THREE.MathUtils.generateUUID(),
eventData: updatedEventData position: [updatedEventData.point.position[0], updatedEventData.point.position[1], updatedEventData.point.position[2]],
}; rotation: [updatedEventData.point.rotation[0], updatedEventData.point.rotation[1], updatedEventData.point.rotation[2]],
action: {
actionUuid: THREE.MathUtils.generateUUID(),
actionName: "Action 1",
actionType: "process",
processTime: 10,
swapMaterial: "Default Material",
triggers: []
}
}
};
addEvent(machineEvent);
eventData.point = {
uuid: machineEvent.point.uuid,
position: machineEvent.point.position,
rotation: machineEvent.point.rotation
};
}
socket.emit("v2:model-asset:add", data); obj.userData.eventData = eventData;
obj.userData = { newFloorItem.eventData = eventData;
name: newFloorItem.modelName,
modelId: newFloorItem.modelfileID,
modelUuid: newFloorItem.modelUuid,
eventData: updatedEventData
};
itemsGroupRef.current.add(obj);
setFloorItems((prevItems: Types.FloorItems) => {
const updatedItems = [...(prevItems || []), newFloorItem];
localStorage.setItem("FloorItems", JSON.stringify(updatedItems));
return updatedItems;
});
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "default";
//REST
// await setFloorItemApi(
// organization,
// obj.uuid,
// obj.userData.name,
// [worldPosition.x, worldPosition.y, worldPosition.z],
// { "x": obj.rotation.x, "y": obj.rotation.y, "z": obj.rotation.z },
// obj.userData.modelId,
// false,
// true,
// );
//SOCKET
const data = {
organization,
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID,
position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false,
isVisible: true,
socketId: socket.id,
eventData: eventData,
};
socket.emit("v2:model-asset:add", data);
obj.userData = {
name: newFloorItem.modelName,
modelId: newFloorItem.modelfileID,
modelUuid: newFloorItem.modelUuid,
};
itemsGroupRef.current.add(obj);
} else {
setFloorItems((prevItems: Types.FloorItems) => {
const updatedItems = [...(prevItems || []), newFloorItem];
localStorage.setItem("FloorItems", JSON.stringify(updatedItems));
return updatedItems;
});
const email = localStorage.getItem("email");
const organization = email ? email.split("@")[1].split(".")[0] : "default";
//REST
// await setFloorItemApi(
// organization,
// obj.uuid,
// obj.userData.name,
// [worldPosition.x, worldPosition.y, worldPosition.z],
// { "x": obj.rotation.x, "y": obj.rotation.y, "z": obj.rotation.z },
// obj.userData.modelId,
// false,
// true,
// );
//SOCKET
const data = {
organization,
modelUuid: newFloorItem.modelUuid,
modelName: newFloorItem.modelName,
modelfileID: newFloorItem.modelfileID,
position: newFloorItem.position,
rotation: { x: obj.rotation.x, y: obj.rotation.y, z: obj.rotation.z },
isLocked: false,
isVisible: true,
socketId: socket.id,
};
socket.emit("v2:model-asset:add", data);
obj.userData = {
name: newFloorItem.modelName,
modelId: newFloorItem.modelfileID,
modelUuid: newFloorItem.modelUuid,
};
itemsGroupRef.current.add(obj);
}
} }
}); });

8
app/src/modules/simulation/events/points/creator/pointsCreator.tsx
View File

@ -94,7 +94,7 @@ function PointsCreator() {
}} }}
onPointerMissed={() => { onPointerMissed={() => {
if (selectedEventData?.data.type !== 'vehicle') { if (selectedEventData?.data.type !== 'vehicle') {
// clearSelectedEventSphere(); clearSelectedEventSphere();
} }
setTransformMode(null); setTransformMode(null);
}} }}
@ -123,7 +123,7 @@ function PointsCreator() {
); );
}} }}
onPointerMissed={() => { onPointerMissed={() => {
// clearSelectedEventSphere(); clearSelectedEventSphere();
setTransformMode(null); setTransformMode(null);
}} }}
position={new THREE.Vector3(...event.point.position)} position={new THREE.Vector3(...event.point.position)}
@ -149,7 +149,7 @@ function PointsCreator() {
); );
}} }}
onPointerMissed={() => { onPointerMissed={() => {
// clearSelectedEventSphere(); clearSelectedEventSphere();
setTransformMode(null); setTransformMode(null);
}} }}
position={new THREE.Vector3(...event.point.position)} position={new THREE.Vector3(...event.point.position)}
@ -175,7 +175,7 @@ function PointsCreator() {
); );
}} }}
onPointerMissed={() => { onPointerMissed={() => {
// clearSelectedEventSphere(); clearSelectedEventSphere();
setTransformMode(null); setTransformMode(null);
}} }}
position={new THREE.Vector3(...event.point.position)} position={new THREE.Vector3(...event.point.position)}

42
app/src/store/simulation/useProductStore.ts
View File

@ -14,7 +14,7 @@ type ProductsStore = {
addEvent: (productId: string, event: EventsSchema) => void; addEvent: (productId: string, event: EventsSchema) => void;
removeEvent: (productId: string, modelUuid: string) => void; removeEvent: (productId: string, modelUuid: string) => void;
deleteEvent: (modelUuid: string) => void; deleteEvent: (modelUuid: string) => void;
updateEvent: (productId: string, modelUuid: string, updates: Partial<EventsSchema>) => void; updateEvent: (productId: string, modelUuid: string, updates: Partial<EventsSchema>) => EventsSchema | undefined;
// Point-level actions // Point-level actions
addPoint: (productId: string, modelUuid: string, point: ConveyorPointSchema | VehiclePointSchema | RoboticArmPointSchema | MachinePointSchema | StoragePointSchema) => void; addPoint: (productId: string, modelUuid: string, point: ConveyorPointSchema | VehiclePointSchema | RoboticArmPointSchema | MachinePointSchema | StoragePointSchema) => void;
@ -32,12 +32,12 @@ type ProductsStore = {
modelUuid: string, modelUuid: string,
pointUuid: string, pointUuid: string,
action: ConveyorPointSchema['action'] | VehiclePointSchema['action'] | RoboticArmPointSchema['actions'][0] | MachinePointSchema['action'] | StoragePointSchema['action'] action: ConveyorPointSchema['action'] | VehiclePointSchema['action'] | RoboticArmPointSchema['actions'][0] | MachinePointSchema['action'] | StoragePointSchema['action']
) => void; ) => EventsSchema | undefined;
removeAction: (actionUuid: string) => void; removeAction: (actionUuid: string) => EventsSchema | undefined;
updateAction: ( updateAction: (
actionUuid: string, actionUuid: string,
updates: Partial<ConveyorPointSchema['action'] | VehiclePointSchema['action'] | RoboticArmPointSchema['actions'][0] | MachinePointSchema['action'] | StoragePointSchema['action']> updates: Partial<ConveyorPointSchema['action'] | VehiclePointSchema['action'] | RoboticArmPointSchema['actions'][0] | MachinePointSchema['action'] | StoragePointSchema['action']>
) => void; ) => EventsSchema | undefined;
// Trigger-level actions // Trigger-level actions
addTrigger: ( addTrigger: (
@ -52,7 +52,7 @@ type ProductsStore = {
// Renaming functions // Renaming functions
renameProduct: (productId: string, newName: string) => void; renameProduct: (productId: string, newName: string) => void;
renameAction: (actionUuid: string, newName: string) => void; renameAction: (actionUuid: string, newName: string) => EventsSchema | undefined;
renameTrigger: (triggerUuid: string, newName: string) => void; renameTrigger: (triggerUuid: string, newName: string) => void;
// Helper functions // Helper functions
@ -129,15 +129,18 @@ export const useProductStore = create<ProductsStore>()(
}, },
updateEvent: (productId, modelUuid, updates) => { updateEvent: (productId, modelUuid, updates) => {
let updatedEvent: EventsSchema | undefined;
set((state) => { set((state) => {
const product = state.products.find(p => p.productId === productId); const product = state.products.find(p => p.productId === productId);
if (product) { if (product) {
const event = product.eventDatas.find(e => 'modelUuid' in e && e.modelUuid === modelUuid); const event = product.eventDatas.find(e => 'modelUuid' in e && e.modelUuid === modelUuid);
if (event) { if (event) {
Object.assign(event, updates); Object.assign(event, updates);
updatedEvent = JSON.parse(JSON.stringify(event));
} }
} }
}); });
return updatedEvent;
}, },
// Point-level actions // Point-level actions
@ -188,6 +191,7 @@ export const useProductStore = create<ProductsStore>()(
// Action-level actions // Action-level actions
addAction: (productId, modelUuid, pointUuid, action) => { addAction: (productId, modelUuid, pointUuid, action) => {
let updatedEvent: EventsSchema | undefined;
set((state) => { set((state) => {
const product = state.products.find(p => p.productId === productId); const product = state.products.find(p => p.productId === productId);
if (product) { if (product) {
@ -196,19 +200,24 @@ export const useProductStore = create<ProductsStore>()(
const point = (event as ConveyorEventSchema).points.find(p => p.uuid === pointUuid); const point = (event as ConveyorEventSchema).points.find(p => p.uuid === pointUuid);
if (point) { if (point) {
point.action = action as any; point.action = action as any;
updatedEvent = JSON.parse(JSON.stringify(event));
} }
} else if (event && 'point' in event && (event as any).point.uuid === pointUuid) { } else if (event && 'point' in event && (event as any).point.uuid === pointUuid) {
if ('action' in (event as any).point) { if ('action' in (event as any).point) {
(event as any).point.action = action; (event as any).point.action = action;
updatedEvent = JSON.parse(JSON.stringify(event));
} else if ('actions' in (event as any).point) { } else if ('actions' in (event as any).point) {
(event as any).point.actions.push(action); (event as any).point.actions.push(action);
updatedEvent = JSON.parse(JSON.stringify(event));
} }
} }
} }
}); });
return updatedEvent;
}, },
removeAction: (actionUuid: string) => { removeAction: (actionUuid: string) => {
let updatedEvent: EventsSchema | undefined;
set((state) => { set((state) => {
for (const product of state.products) { for (const product of state.products) {
for (const event of product.eventDatas) { for (const event of product.eventDatas) {
@ -219,20 +228,28 @@ export const useProductStore = create<ProductsStore>()(
} else if ('point' in event) { } else if ('point' in event) {
const point = (event as any).point; const point = (event as any).point;
if (event.type === "roboticArm") { if (event.type === "roboticArm") {
// Handle RoboticArmEventSchema
if ('actions' in point) { if ('actions' in point) {
point.actions = point.actions.filter((a: any) => a.actionUuid !== actionUuid); const index = point.actions.findIndex((a: any) => a.actionUuid === actionUuid);
if (index !== -1) {
point.actions.splice(index, 1);
updatedEvent = JSON.parse(JSON.stringify(event));
return;
}
} }
} else if ('action' in point && point.action?.actionUuid === actionUuid) { } else if ('action' in point && point.action?.actionUuid === actionUuid) {
// For other schemas with a single 'action' point.action = undefined;
updatedEvent = JSON.parse(JSON.stringify(event));
return;
} }
} }
} }
} }
}); });
return updatedEvent;
}, },
updateAction: (actionUuid, updates) => { updateAction: (actionUuid, updates) => {
let updatedEvent: EventsSchema | undefined;
set((state) => { set((state) => {
for (const product of state.products) { for (const product of state.products) {
for (const event of product.eventDatas) { for (const event of product.eventDatas) {
@ -240,6 +257,7 @@ export const useProductStore = create<ProductsStore>()(
for (const point of (event as ConveyorEventSchema).points) { for (const point of (event as ConveyorEventSchema).points) {
if (point.action && point.action.actionUuid === actionUuid) { if (point.action && point.action.actionUuid === actionUuid) {
Object.assign(point.action, updates); Object.assign(point.action, updates);
updatedEvent = JSON.parse(JSON.stringify(event));
return; return;
} }
} }
@ -247,11 +265,13 @@ export const useProductStore = create<ProductsStore>()(
const point = (event as any).point; const point = (event as any).point;
if ('action' in point && point.action.actionUuid === actionUuid) { if ('action' in point && point.action.actionUuid === actionUuid) {
Object.assign(point.action, updates); Object.assign(point.action, updates);
updatedEvent = JSON.parse(JSON.stringify(event));
return; return;
} else if ('actions' in point) { } else if ('actions' in point) {
const action = point.actions.find((a: any) => a.actionUuid === actionUuid); const action = point.actions.find((a: any) => a.actionUuid === actionUuid);
if (action) { if (action) {
Object.assign(action, updates); Object.assign(action, updates);
updatedEvent = JSON.parse(JSON.stringify(event));
return; return;
} }
} }
@ -259,6 +279,7 @@ export const useProductStore = create<ProductsStore>()(
} }
} }
}); });
return updatedEvent;
}, },
// Trigger-level actions // Trigger-level actions
@ -368,6 +389,7 @@ export const useProductStore = create<ProductsStore>()(
}, },
renameAction: (actionUuid, newName) => { renameAction: (actionUuid, newName) => {
let updatedEvent: EventsSchema | undefined;
set((state) => { set((state) => {
for (const product of state.products) { for (const product of state.products) {
for (const event of product.eventDatas) { for (const event of product.eventDatas) {
@ -375,6 +397,7 @@ export const useProductStore = create<ProductsStore>()(
for (const point of (event as ConveyorEventSchema).points) { for (const point of (event as ConveyorEventSchema).points) {
if (point.action && point.action.actionUuid === actionUuid) { if (point.action && point.action.actionUuid === actionUuid) {
point.action.actionName = newName; point.action.actionName = newName;
updatedEvent = JSON.parse(JSON.stringify(event));
return; return;
} }
} }
@ -382,11 +405,13 @@ export const useProductStore = create<ProductsStore>()(
const point = (event as any).point; const point = (event as any).point;
if ('action' in point && point.action.actionUuid === actionUuid) { if ('action' in point && point.action.actionUuid === actionUuid) {
point.action.actionName = newName; point.action.actionName = newName;
updatedEvent = JSON.parse(JSON.stringify(event));
return; return;
} else if ('actions' in point) { } else if ('actions' in point) {
const action = point.actions.find((a: any) => a.actionUuid === actionUuid); const action = point.actions.find((a: any) => a.actionUuid === actionUuid);
if (action) { if (action) {
action.actionName = newName; action.actionName = newName;
updatedEvent = JSON.parse(JSON.stringify(event));
return; return;
} }
} }
@ -394,6 +419,7 @@ export const useProductStore = create<ProductsStore>()(
} }
} }
}); });
return updatedEvent;
}, },
renameTrigger: (triggerUuid, newName) => { renameTrigger: (triggerUuid, newName) => {