feat: Enhance EventProperties and mechanics components with new mechanics; refactor action handling and improve state management for various actions
This commit is contained in:
@@ -25,6 +25,8 @@ import { useProductStore } from "../../../../../store/simulation/useProductStore
|
||||
import ConveyorMechanics from "./mechanics/conveyorMechanics";
|
||||
import VehicleMechanics from "./mechanics/vehicleMechanics";
|
||||
import RoboticArmMechanics from "./mechanics/roboticArmMechanics";
|
||||
import MachineMechanics from "./mechanics/machineMechanics";
|
||||
import StorageMechanics from "./mechanics/storageMechanics";
|
||||
|
||||
const EventProperties: React.FC = () => {
|
||||
const actionsContainerRef = useRef<HTMLDivElement>(null);
|
||||
@@ -170,17 +172,6 @@ const EventProperties: React.FC = () => {
|
||||
return "0.5";
|
||||
};
|
||||
|
||||
const handleActionToggle = (actionUuid: string) => {
|
||||
const selected = actions.find(action => action.uuid === actionUuid);
|
||||
if (selected) {
|
||||
setSelectedItem({ item: selected });
|
||||
}
|
||||
};
|
||||
|
||||
const handleDeleteAction = (actionUuid: string) => {
|
||||
// Implementation for delete action
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="event-proprties-wrapper">
|
||||
@@ -189,112 +180,11 @@ const EventProperties: React.FC = () => {
|
||||
<div className="header">
|
||||
<div className="header-value">{selectedEventData?.data.modelName}</div>
|
||||
</div>
|
||||
<div className="global-props">
|
||||
<div className="property-list-container">
|
||||
<div className="property-item">
|
||||
<InputWithDropDown
|
||||
label="Speed"
|
||||
value="0.5"
|
||||
min={0}
|
||||
step={0.1}
|
||||
defaultValue={speed}
|
||||
max={10}
|
||||
activeOption="s"
|
||||
onClick={() => { }}
|
||||
onChange={(value) => console.log(value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="property-item">
|
||||
<InputWithDropDown
|
||||
label="Delay"
|
||||
value="0.5"
|
||||
min={0}
|
||||
step={0.1}
|
||||
defaultValue="0.5"
|
||||
max={10}
|
||||
activeOption="s"
|
||||
onClick={() => { }}
|
||||
onChange={(value) => console.log(value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{assetType === 'roboticArm' &&
|
||||
<div className="actions-list-container">
|
||||
<div className="actions">
|
||||
<div className="header">
|
||||
<div className="header-value">Actions</div>
|
||||
<div className="add-button" onClick={() => { }}>
|
||||
<AddIcon /> Add
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="lists-main-container"
|
||||
ref={actionsContainerRef}
|
||||
style={{ height: "120px" }}
|
||||
>
|
||||
<div className="list-container">
|
||||
{actions.map((action) => (
|
||||
<div
|
||||
key={action.uuid}
|
||||
className={`list-item ${selectedItem.item?.uuid === action.uuid ? "active" : ""}`}
|
||||
>
|
||||
<div
|
||||
className="value"
|
||||
onClick={() => handleActionToggle(action.uuid)}
|
||||
>
|
||||
<RenameInput value={action.name} />
|
||||
</div>
|
||||
{actions.length > 1 && (
|
||||
<div
|
||||
className="remove-button"
|
||||
onClick={() => handleDeleteAction(action.uuid)}
|
||||
>
|
||||
<RemoveIcon />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div
|
||||
className="resize-icon"
|
||||
id="action-resize"
|
||||
onMouseDown={(e) => handleResize(e, actionsContainerRef)}
|
||||
>
|
||||
<ResizeHeightIcon />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<div className="selected-actions-details">
|
||||
<div className="selected-actions-header">
|
||||
<RenameInput value="Action Name" />
|
||||
</div>
|
||||
<div className="selected-actions-list">
|
||||
<LabledDropdown
|
||||
defaultOption={availableActions.defaultOption}
|
||||
options={availableActions.options}
|
||||
onSelect={(option) => setActiveOption(option)}
|
||||
/>
|
||||
{activeOption === "default" && <DefaultAction />}
|
||||
{activeOption === "spawn" && <SpawnAction />}
|
||||
{activeOption === "swap" && <SwapAction />}
|
||||
{activeOption === "despawn" && <DespawnAction />}
|
||||
{activeOption === "travel" && <TravelAction />}
|
||||
{activeOption === "pickAndPlace" && <PickAndPlaceAction />}
|
||||
{activeOption === "process" && <ProcessAction />}
|
||||
{activeOption === "store" && <StorageAction />}
|
||||
</div>
|
||||
</div>
|
||||
<div className="tirgger">
|
||||
<Trigger />
|
||||
</div>
|
||||
|
||||
{/* {assetType === 'conveyor' && <ConveyorMechanics />}
|
||||
{assetType === 'conveyor' && <ConveyorMechanics />}
|
||||
{assetType === 'vehicle' && <VehicleMechanics />}
|
||||
{assetType === 'roboticArm' && <RoboticArmMechanics />} */}
|
||||
{assetType === 'roboticArm' && <RoboticArmMechanics />}
|
||||
{assetType === 'machine' && <MachineMechanics />}
|
||||
{assetType === 'storageUnit' && <StorageMechanics />}
|
||||
</>
|
||||
}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user