feat: Enhance vehicle simulation with draggable path points and interactive controls

2025-09-06 16:03:45 +05:30
parent 3b8bdd3684 5fd1c3bb89
commit 71484cba18
226 changed files with 13644 additions and 17458 deletions
--- a/app/src/modules/simulation/analysis/ROI/roiData.tsx
+++ b/app/src/modules/simulation/analysis/ROI/roiData.tsx
@@ -1,20 +1,17 @@
 import React, { useEffect } from 'react'
 import { CompareProduct, comparsionMaterialData, useCompareProductDataStore, useInputValues, useMachineDowntime, useMachineUptime, useProductionCapacityData, useROISummaryData, useThroughPutData } from '../../../../store/builder/store';
-import { usePlayButtonStore } from '../../../../store/usePlayButtonStore';
-import { useProductContext } from '../../products/productContext';
 import { useSceneContext } from '../../../scene/sceneContext';
 import { saveSimulationData } from '../../../../components/layout/scenes/functions/simulationStorage';
 import { set } from 'immer/dist/internal';
+import { usePlayButtonStore } from '../../../../store/ui/usePlayButtonStore';

 export default function ROIData() {
-    const { selectedProductStore } = useProductContext();
    const { inputValues } = useInputValues();
-    const { productionCapacityData } = useProductionCapacityData()
-    const { selectedProduct } = selectedProductStore();
+    const { productionCapacityData } = useProductionCapacityData();
    const { isPlaying } = usePlayButtonStore();
    const { setRoiSummaryData } = useROISummaryData();
    const { productStore } = useSceneContext();
-    const { getProductById } = productStore();
+    const { getProductById, selectedProduct } = productStore();
    const { compareProductsData, setCompareProductsData } = useCompareProductDataStore();
    const { machineActiveTime } = useMachineUptime();
    const { machineIdleTime } = useMachineDowntime();
@@ -50,10 +47,7 @@ export default function ROIData() {
        const shiftsPerDay = parseFloat(inputValues["Shifts / day"]);
        const workingDaysPerYear = parseFloat(inputValues["Working days / year"]);

-        if (!isNaN(electricityCost) && !isNaN(fixedCost) && !isNaN(laborCost) && !isNaN(maintenanceCost) &&
-            !isNaN(materialCost) && !isNaN(productionPeriod) && !isNaN(salvageValue) && !isNaN(sellingPrice) &&
-            !isNaN(shiftLength) && !isNaN(shiftsPerDay) && !isNaN(workingDaysPerYear) && productionCapacityData > 0) {
-
+        if (!isNaN(electricityCost) && !isNaN(fixedCost) && !isNaN(laborCost) && !isNaN(maintenanceCost) && !isNaN(materialCost) && !isNaN(productionPeriod) && !isNaN(salvageValue) && !isNaN(sellingPrice) && !isNaN(shiftLength) && !isNaN(shiftsPerDay) && !isNaN(workingDaysPerYear) && productionCapacityData > 0) {
            // const totalHoursPerYear = shiftLength * shiftsPerDay * workingDaysPerYear;
            // const annualProductionUnits = productionCapacityData * totalHoursPerYear;
            // const annualRevenue = annualProductionUnits * sellingPrice;
@@ -123,20 +117,20 @@ export default function ROIData() {
            //     setCompareProductsData([...prev, newData]);
            // }

-            const Annual_units = throughputData * workingDaysPerYear
-            const Total_units = Annual_units * productionPeriod
+            const Annual_units = throughputData * workingDaysPerYear;
+            const Total_units = Annual_units * productionPeriod;

-            const Total_revenue = Total_units * sellingPrice
-            const Total_variable_cost = Total_units * (materialCost + (laborCost))
+            const Total_revenue = Total_units * sellingPrice;
+            const Total_variable_cost = Total_units * (materialCost + laborCost);

-            const Total_fixed_cost = (maintenanceCost + electricityCost + fixedCost) * workingDaysPerYear * productionPeriod
-            const Total_cost = Total_variable_cost + Total_fixed_cost
+            const Total_fixed_cost = (maintenanceCost + electricityCost + fixedCost) * workingDaysPerYear * productionPeriod;
+            const Total_cost = Total_variable_cost + Total_fixed_cost;

-            const Net_profit = Total_revenue - Total_cost + (salvageValue * workingDaysPerYear * productionPeriod)
+            const Net_profit = Total_revenue - Total_cost + salvageValue * workingDaysPerYear * productionPeriod;

-            const ROI = (Net_profit / initialInvestment) * 100
+            const ROI = (Net_profit / initialInvestment) * 100;

-            const Annual_net_profit = (Annual_units * (sellingPrice - materialCost - laborCost)) - (maintenanceCost + electricityCost + fixedCost) * workingDaysPerYear + (salvageValue * workingDaysPerYear)
+            const Annual_net_profit = Annual_units * (sellingPrice - materialCost - laborCost) - (maintenanceCost + electricityCost + fixedCost) * workingDaysPerYear + salvageValue * workingDaysPerYear;
            const Payback_period_years = initialInvestment / Annual_net_profit;
            const data = {
                productName: selectedProduct.productName,
@@ -162,15 +156,14 @@ export default function ROIData() {
                totalCost: Total_cost,
                revenueGenerated: Total_revenue,
                netProfit: Net_profit > 0 ? Net_profit : 0,
-                netLoss: Net_profit < 0 ? -Net_profit : 0
+                netLoss: Net_profit < 0 ? -Net_profit : 0,
            });

-
            const productData = getProductById(selectedProduct.productUuid);
            const prev = useCompareProductDataStore.getState().compareProductsData;
            const newData: CompareProduct = {
-                productUuid: productData?.productUuid ?? '',
-                productName: productData?.productName ?? '',
+                productUuid: productData?.productUuid ?? "",
+                productName: productData?.productName ?? "",
                simulationData: {
                    // costPerUnit: costPerUnit,
                    // workingDaysPerYear: workingDaysPerYear,
@@ -187,12 +180,10 @@ export default function ROIData() {
                    machineIdleTime: machineIdleTime,
                    machineActiveTime: machineActiveTime,
                    throughputData: throughputData,
-                }
+                },
            };

-            const existingIndex = prev.findIndex((item: CompareProduct) =>
-                item.productUuid === productData?.productUuid
-            );
+            const existingIndex = prev.findIndex((item: CompareProduct) => item.productUuid === productData?.productUuid);

            if (existingIndex !== -1) {
                const updated = [...prev];
@@ -202,12 +193,9 @@ export default function ROIData() {
                setCompareProductsData([...prev, newData]);
            }
        }
-
    }, [inputValues, productionCapacityData, throughputData, isPlaying]);

-    useEffect(() => {
-
-    }, [compareProductsData])
+    useEffect(() => {}, [compareProductsData]);

    return null;
 }
--- a/app/src/modules/simulation/analysis/productionCapacity/productionCapacityData.tsx
+++ b/app/src/modules/simulation/analysis/productionCapacity/productionCapacityData.tsx
@@ -1,11 +1,12 @@
 import { useEffect } from 'react'
 import { comparsionMaterialData, useInputValues, useProductionCapacityData, useThroughPutData } from '../../../../store/builder/store'
-import { usePlayButtonStore } from '../../../../store/usePlayButtonStore';
+
 import { saveSimulationData } from '../../../../components/layout/scenes/functions/simulationStorage';
+import { usePlayButtonStore } from '../../../../store/ui/usePlayButtonStore';

 export default function ProductionCapacityData() {
-    const { throughputData } = useThroughPutData()
-    const { setProductionCapacityData } = useProductionCapacityData()
+    const { throughputData } = useThroughPutData();
+    const { setProductionCapacityData } = useProductionCapacityData();
    const { inputValues } = useInputValues();
    const { isPlaying } = usePlayButtonStore();
    const { materialData, setMaterialData } = comparsionMaterialData()
@@ -31,9 +32,5 @@ export default function ProductionCapacityData() {
        }
    }, [throughputData, inputValues, isPlaying, materialData]);

-    return (
-        <></>
-    )
+    return <></>;
 }
-
-
--- a/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx
+++ b/app/src/modules/simulation/analysis/throughPut/throughPutData.tsx
@@ -1,16 +1,13 @@
 import { useEffect } from 'react';
 import { determineExecutionMachineSequences } from '../../simulator/functions/determineExecutionMachineSequences';
 import { comparsionMaterialData, useInputValues, useMachineCount, useMachineDowntime, useMachineUptime, useMaterialCycle, useProcessBar, useThroughPutData } from '../../../../store/builder/store';
-import { usePlayButtonStore } from '../../../../store/usePlayButtonStore';
 import { useSceneContext } from '../../../scene/sceneContext';
-import { useProductContext } from '../../products/productContext';
 import { saveSimulationData } from '../../../../components/layout/scenes/functions/simulationStorage';
+import { usePlayButtonStore } from '../../../../store/ui/usePlayButtonStore';

 export default function ThroughPutData() {
    const { materialStore, armBotStore, machineStore, conveyorStore, vehicleStore, storageUnitStore, productStore } = useSceneContext();
-    const { selectedProductStore } = useProductContext();
-    const { selectedProduct } = selectedProductStore();
-    const { products, getProductById } = productStore();
+    const { products, getProductById, selectedProduct } = productStore();
    const { armBots } = armBotStore();
    const { vehicles } = vehicleStore();
    const { machines } = machineStore();
@@ -22,7 +19,7 @@ export default function ThroughPutData() {
    const { machineIdleTime, setMachineIdleTime } = useMachineDowntime();
    const { materialCycleTime, setMaterialCycleTime } = useMaterialCycle();
    const { setProcessBar } = useProcessBar();
-    const { setThroughputData } = useThroughPutData()
+    const { setThroughputData } = useThroughPutData();
    const { isPlaying } = usePlayButtonStore();
    const { inputValues } = useInputValues();
    const { materialData, setMaterialData } = comparsionMaterialData()
@@ -30,7 +27,7 @@ export default function ThroughPutData() {
    // Setting machine count
    let totalItems = 0;
    let totalActiveTime = 0;
-    let totalIdleTime = 0
+    let totalIdleTime = 0;

    useEffect(() => {
        if (!isPlaying) {
@@ -44,7 +41,7 @@ export default function ThroughPutData() {
            setProcessBar([]);
            setThroughputData(0);
        }
-    }, [isPlaying])
+    }, [isPlaying]);

    useEffect(() => {
        if (isPlaying) {
@@ -52,15 +49,16 @@ export default function ThroughPutData() {
            const fetchProductSequenceData = async () => {
                const productData = getProductById(selectedProduct.productUuid);
                if (productData) {
-                    const productSequenceData = await determineExecutionMachineSequences([productData])
+                    const productSequenceData = await determineExecutionMachineSequences([productData]);
                    if (productSequenceData?.length > 0) {
                        productSequenceData.forEach((sequence) => {
                            sequence.forEach((item) => {
                                if (item.type === "roboticArm") {
-                                    armBots.filter(arm => arm.modelUuid === item.modelUuid)
-                                        .forEach(arm => {
+                                    armBots
+                                        .filter((arm) => arm.modelUuid === item.modelUuid)
+                                        .forEach((arm) => {
                                            if (arm.activeTime > 0) {
-                                                process.push({ modelid: arm.modelUuid, modelName: arm.modelName, activeTime: arm?.activeTime })
+                                                process.push({ modelid: arm.modelUuid, modelName: arm.modelName, activeTime: arm?.activeTime });
                                                totalActiveTime += arm.activeTime;
                                            }
                                            if (arm.idleTime > 0) {
@@ -68,10 +66,11 @@ export default function ThroughPutData() {
                                            }
                                        });
                                } else if (item.type === "vehicle") {
-                                    vehicles.filter(vehicle => vehicle.modelUuid === item.modelUuid)
-                                        .forEach(vehicle => {
+                                    vehicles
+                                        .filter((vehicle) => vehicle.modelUuid === item.modelUuid)
+                                        .forEach((vehicle) => {
                                            if (vehicle.activeTime > 0) {
-                                                process.push({ modelid: vehicle.modelUuid, modelName: vehicle.modelName, activeTime: vehicle?.activeTime })
+                                                process.push({ modelid: vehicle.modelUuid, modelName: vehicle.modelName, activeTime: vehicle?.activeTime });

                                                totalActiveTime += vehicle.activeTime;
                                            }
@@ -80,10 +79,11 @@ export default function ThroughPutData() {
                                            }
                                        });
                                } else if (item.type === "machine") {
-                                    machines.filter(machine => machine.modelUuid === item.modelUuid)
-                                        .forEach(machine => {
+                                    machines
+                                        .filter((machine) => machine.modelUuid === item.modelUuid)
+                                        .forEach((machine) => {
                                            if (machine.activeTime > 0) {
-                                                process.push({ modelid: machine.modelUuid, modelName: machine.modelName, activeTime: machine?.activeTime })
+                                                process.push({ modelid: machine.modelUuid, modelName: machine.modelName, activeTime: machine?.activeTime });
                                                totalActiveTime += machine.activeTime;
                                            }
                                            if (machine.idleTime > 0) {
@@ -91,15 +91,17 @@ export default function ThroughPutData() {
                                            }
                                        });
                                } else if (item.type === "transfer") {
-                                    conveyors.filter(conveyor => conveyor.modelUuid === item.modelUuid)
-                                        .forEach(conveyor => {
+                                    conveyors
+                                        .filter((conveyor) => conveyor.modelUuid === item.modelUuid)
+                                        .forEach((conveyor) => {
                                            if (conveyor.activeTime > 0) {
                                                // totalActiveTime += conveyor.activeTime;
                                            }
                                        });
                                } else if (item.type === "storageUnit") {
-                                    storageUnits.filter(storage => storage.modelUuid === item.modelUuid)
-                                        .forEach(storage => {
+                                    storageUnits
+                                        .filter((storage) => storage.modelUuid === item.modelUuid)
+                                        .forEach((storage) => {
                                            if (storage.activeTime > 0) {
                                                // totalActiveTime += storage.activeTime;
                                            }
@@ -110,13 +112,12 @@ export default function ThroughPutData() {
                            totalItems += sequence.length;
                        });

-
                        setMachineCount(totalItems);
                        setMachineActiveTime(totalActiveTime);
                        setMachineIdleTime(totalIdleTime);
                        let arr = process.map((item: any) => ({
                            name: item.modelName,
-                            completed: Math.round((item.activeTime / totalActiveTime) * 100)
+                            completed: Math.round((item.activeTime / totalActiveTime) * 100),
                        }));
                        setProcessBar(arr);
                    }
@@ -138,12 +139,12 @@ export default function ThroughPutData() {
            if (productData) {
                const productSequenceData = await determineExecutionMachineSequences([productData]);
                if (productSequenceData?.length > 0) {
-                    productSequenceData.forEach(sequence => {
-                        sequence.forEach(item => {
+                    productSequenceData.forEach((sequence) => {
+                        sequence.forEach((item) => {
                            if (item.type === "roboticArm") {
                                armBots
-                                    .filter(arm => arm.modelUuid === item.modelUuid)
-                                    .forEach(arm => {
+                                    .filter((arm) => arm.modelUuid === item.modelUuid)
+                                    .forEach((arm) => {
                                        if (arm.isActive) {
                                            anyArmActive = true;
                                        } else {
@@ -153,8 +154,8 @@ export default function ThroughPutData() {
                            }
                            if (item.type === "vehicle") {
                                vehicles
-                                    .filter(vehicle => vehicle.modelUuid === item.modelUuid)
-                                    .forEach(vehicle => {
+                                    .filter((vehicle) => vehicle.modelUuid === item.modelUuid)
+                                    .forEach((vehicle) => {
                                        if (vehicle.isActive) {
                                            anyVehicleActive = true;
                                        } else {
@@ -164,8 +165,8 @@ export default function ThroughPutData() {
                            }
                            if (item.type === "machine") {
                                machines
-                                    .filter(machine => machine.modelUuid === item.modelUuid)
-                                    .forEach(machine => {
+                                    .filter((machine) => machine.modelUuid === item.modelUuid)
+                                    .forEach((machine) => {
                                        if (machine.isActive) {
                                            anyMachineActive = true;
                                        } else {
@@ -180,7 +181,6 @@ export default function ThroughPutData() {

            const allInactive = !anyArmActive && !anyVehicleActive && !anyMachineActive;
            if (materialHistory.length > 0) {
-
                let totalCycleTimeSum = 0;
                let cycleCount = 0;

@@ -209,7 +209,7 @@ export default function ThroughPutData() {
        return () => {
            if (timeoutId) clearTimeout(timeoutId);
        };
-    }, [armBots, materials, materialHistory, machines, vehicles, selectedProduct?.productUuid])
+    }, [armBots, materials, materialHistory, machines, vehicles, selectedProduct?.productUuid]);

    useEffect(() => {
        const shiftLength = parseFloat(inputValues["Shift length"]);
@@ -229,8 +229,5 @@ export default function ThroughPutData() {
        }
    }, [materialCycleTime, machineCount, isPlaying, inputValues, materialData]);

-    return (
-        <>
-        </>
-    );
+    return <></>;
 }