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

updated comparision

Browse Source
This commit is contained in:
Vishnu
2025-06-12 17:35:42 +05:30
parent c7cc5cf2ca
commit 2fbdf8ab61
33 changed files with 670 additions and 316 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
app/src/components/layout/scenes/ComparisonScene.tsx
View File

@@ -1,12 +1,13 @@
import { useProductContext } from '../../../modules/simulation/products/productContext'
import RegularDropDown from '../../ui/inputs/RegularDropDown';
import { useProductStore } from '../../../store/simulation/useProductStore';
import { useLoadingProgress, useSaveVersion } from '../../../store/builder/store';
import { useCompareProductDataStore, useLoadingProgress, useSaveVersion } from '../../../store/builder/store';
import useModuleStore from '../../../store/useModuleStore';
import CompareLayOut from '../../ui/compareVersion/CompareLayOut';
import ComparisonResult from '../../ui/compareVersion/ComparisonResult';
import { useComparisonProduct, useMainProduct } from '../../../store/simulation/useSimulationStore';
import { usePauseButtonStore, usePlayButtonStore } from '../../../store/usePlayButtonStore';
import { usePlayButtonStore } from '../../../store/usePlayButtonStore';
import { useEffect, useState } from 'react';
function ComparisonScene() {
const { isPlaying, setIsPlaying } = usePlayButtonStore();
@@ -17,16 +18,63 @@ function ComparisonScene() {
const { selectedProduct } = selectedProductStore();
const { comparisonProduct, setComparisonProduct } = useComparisonProduct();
const { mainProduct } = useMainProduct();
const { setIsPaused } = usePauseButtonStore();
const { loadingProgress } = useLoadingProgress();
const { compareProductsData, setCompareProductsData } = useCompareProductDataStore();
const [shouldShowComparisonResult, setShouldShowComparisonResult] = useState(false);
const handleSelectLayout = (option: string) => {
const product = products.find((product) => product.productName === option);
if (product) {
setComparisonProduct(product.productUuid, product.productName);
setIsPaused(true);
}
};
// useEffect(() => {
// setCompareProductsData([
// {
// "productUuid": "15193386-ec58-4ec6-8a92-e665a39eebf1",
// "productName": "Product 1",
// "simulationData": {
// "roiPercentage": 273.9428571428571,
// "paybackPeriod": 1.8251981643721318,
// "netProfit": 9588000,
// "productionCapacity": 4508.5,
// "machineIdleTime": 1450,
// "machineActiveTime": 430,
// "throughputData": 180.34
// }
// },
// {
// "productUuid": "f614bf50-f61d-41c5-acc0-3783fb4da6b8",
// "productName": "Product 2",
// "simulationData": {
// "roiPercentage": 281.7214285714286,
// "paybackPeriod": 1.7748028701097842,
// "netProfit": 9860250,
// "productionCapacity": 4599.25,
// "machineIdleTime": 1885,
// "machineActiveTime": 646,
// "throughputData": 183.97
// }
// }
// ])
// }, []); // ✅ Runs only once on mount
useEffect(() => {
if (mainProduct && comparisonProduct && compareProductsData.length > 1) {
// console.log('compareProductsData: ', compareProductsData);
const hasMain = compareProductsData.some(val => val.productUuid === mainProduct.productUuid);
const hasComparison = compareProductsData.some(val => val.productUuid === comparisonProduct.productUuid);
if (hasMain && hasComparison && mainProduct.productUuid !== comparisonProduct.productUuid) {
setShouldShowComparisonResult(true);
} else {
setShouldShowComparisonResult(false);
}
} else {
setShouldShowComparisonResult(false);
}
}, [compareProductsData, mainProduct, comparisonProduct]);
return (
<>
{isVersionSaved && activeModule === "simulation" && selectedProduct && (
@@ -42,7 +90,8 @@ function ComparisonScene() {
</div>
}
<CompareLayOut />
{(comparisonProduct && mainProduct && !loadingProgress) && <ComparisonResult />}
{(shouldShowComparisonResult && !loadingProgress) && <ComparisonResult />}
</>
)}
</>

19
app/src/components/layout/scenes/MainScene.tsx
View File

@@ -1,4 +1,4 @@
import React from "react";
import React, { useEffect } from "react";
import {
useLoadingProgress,
useRenameModeStore,
@@ -42,7 +42,7 @@ function MainScene() {
const { setMainProduct } = useMainProduct();
const { selectedProductStore } = useProductContext();
const { selectedProduct } = selectedProductStore();
const { isVersionSaved } = useSaveVersion();
const { isVersionSaved, setIsVersionSaved } = useSaveVersion();
const { activeModule } = useModuleStore();
const { selectedUser } = useSelectedUserStore();
const { loadingProgress } = useLoadingProgress();
@@ -52,11 +52,19 @@ function MainScene() {
const { visualizationSocket } = useSocketStore();
const { selectedZone } = useSelectedZoneStore();
const { setFloatingWidget } = useFloatingWidget();
const { comparisonProduct } = useComparisonProduct();
const { clearComparisonProduct } = useComparisonProduct();
const { selectedFloorItem, setSelectedFloorItem } = useSelectedFloorItem();
const { setName } = useAssetsStore();
const { projectId } = useParams()
const { isRenameMode, setIsRenameMode } = useRenameModeStore();
useEffect(() => {
if (activeModule !== 'simulation') {
clearComparisonProduct();
setIsVersionSaved(false);
}
}, [activeModule])
const handleSelectLayout = (option: string) => {
const product = products.find((product) => product.productName === option);
if (product) {
@@ -64,6 +72,7 @@ function MainScene() {
}
};
const handleObjectRename = async (newName: string) => {
if (!projectId) return
const email = localStorage.getItem("email") ?? "";
const organization = email?.split("@")[1]?.split(".")[0];
let response = await setFloorItemApi(
@@ -99,10 +108,10 @@ function MainScene() {
{activeModule !== "market" && !isPlaying && !isVersionSaved && (
<Tools />
)}
{(isPlaying || comparisonProduct !== null) &&
{(isPlaying) &&
activeModule === "simulation" &&
loadingProgress == 0 && <SimulationPlayer />}
{(isPlaying || comparisonProduct !== null) &&
{(isPlaying) &&
activeModule !== "simulation" && <ControlsPlayer />}
{isRenameMode && selectedFloorItem?.userData.modelName && <RenameTooltip name={selectedFloorItem?.userData.modelName} onSubmit={handleObjectRename} />}

45
app/src/components/layout/sidebarRight/analysis/Analysis.tsx
View File

@@ -1,4 +1,4 @@
import React, { useState } from "react";
import React, { useEffect, useState } from "react";
import { AIIcon } from "../../../icons/ExportCommonIcons";
import RegularDropDown from "../../../ui/inputs/RegularDropDown";
import { AnalysisPresetsType } from "../../../../types/analysis";
@@ -19,55 +19,70 @@ const Analysis: React.FC = () => {
// { type: "default", inputs: { label: "Machine uptime", activeOption: "%" } },
],
"Production capacity": [
{ type: "range", inputs: { label: "Shift length", activeOption: "hr" } },
{ type: "default", inputs: { label: "Shifts / day", activeOption: "unit" } },
{ type: "default", inputs: { label: "Working days / year", activeOption: "days" } },
{ type: "default", inputs: { label: "Yield rate", activeOption: "%" } },
{ type: "range", inputs: { label: "Shift length", activeOption: "hr", defaultValue: 1 } },
{ type: "default", inputs: { label: "Shifts / day", activeOption: "unit", defaultValue: 3 } },
{ type: "default", inputs: { label: "Working days / year", activeOption: "days", defaultValue: 300 } },
{ type: "default", inputs: { label: "Yield rate", activeOption: "%", defaultValue: 98 } },
],
ROI: [
{
type: "default",
inputs: { label: "Selling price", activeOption: "INR" },
inputs: { label: "Selling price", activeOption: "INR", defaultValue: 500 },
},
{
type: "default",
inputs: { label: "Material cost", activeOption: "INR" },
inputs: { label: "Material cost", activeOption: "INR", defaultValue: 300 },
},
{
type: "default",
inputs: { label: "Labor Cost", activeOption: "INR" },
inputs: { label: "Labor Cost", activeOption: "INR", defaultValue: 150 },
},
{
type: "default",
inputs: { label: "Maintenance cost", activeOption: "INR" },
inputs: { label: "Labor Count", activeOption: "", defaultValue: 1 },
},
{
type: "default",
inputs: { label: "Electricity cost", activeOption: "INR" },
inputs: { label: "Maintenance cost", activeOption: "INR", defaultValue: 1200 },
},
{
type: "default",
inputs: { label: "Fixed costs", activeOption: "INR" },
inputs: { label: "Electricity cost", activeOption: "INR", defaultValue: 840 },
},
{
type: "default",
inputs: { label: "Initial Investment", activeOption: "INR" },
inputs: { label: "Fixed costs", activeOption: "INR", defaultValue: 1150 },
},
{
type: "default",
inputs: { label: "Salvage value", activeOption: "Hrs" },
inputs: { label: "Initial Investment", activeOption: "INR", defaultValue: 3500000 },
},
{
type: "default",
inputs: { label: "Production period", activeOption: "yrs" },
inputs: { label: "Salvage value", activeOption: "Day", defaultValue: 565 },
},
{
type: "default",
inputs: { label: "Tax rate", activeOption: "%" },
inputs: { label: "Production period", activeOption: "yrs", defaultValue: 5 },
},
{
type: "default",
inputs: { label: "Tax rate", activeOption: "%", defaultValue: 30 },
},
],
};
useEffect(() => {
Object.values(AnalysisPresets).forEach((category) => {
category.forEach((item) => {
const { label, defaultValue } = item.inputs;
if (defaultValue !== undefined) {
updateInputValue(label, defaultValue.toString());
}
});
});
}, []);
const { inputValues, setInputValues, updateInputValue } = useInputValues();
return (

7
app/src/components/layout/sidebarRight/analysis/RenderAnalysisInputs.tsx
View File

@@ -10,7 +10,8 @@ interface InputRendererProps {
onInputChange: (label: string, value: string) => void;
}
const RenderAnalysisInputs: React.FC<InputRendererProps> = ({ keyName, presets,inputValues, onInputChange }) => {
const RenderAnalysisInputs: React.FC<InputRendererProps> = ({ keyName, presets, inputValues, onInputChange }) => {
return (
<div key={`main-${keyName}`} className="analysis-inputs">
{presets.map((preset, index) => {
@@ -19,7 +20,7 @@ const RenderAnalysisInputs: React.FC<InputRendererProps> = ({ keyName, presets,i
<InputWithDropDown
key={index}
label={preset.inputs.label}
value={inputValues[preset.inputs.label] || ""}
value={preset.inputs.defaultValue?.toString() || inputValues[preset.inputs.label] || ""}
activeOption={preset.inputs.activeOption}
onChange={(newValue) => onInputChange(preset.inputs.label, newValue)}
/>
@@ -32,7 +33,7 @@ const RenderAnalysisInputs: React.FC<InputRendererProps> = ({ keyName, presets,i
label={preset.inputs.label}
min={0}
max={8}
value={5}
value={Number(preset.inputs.defaultValue) || Number(inputValues[preset.inputs.label]) || 5}
/>
);
}

14
app/src/components/layout/sidebarRight/simulation/Simulations.tsx
View File

@@ -2,7 +2,7 @@ import React, { useEffect, useRef, useState } from "react";
import { AddIcon, ArrowIcon, RemoveIcon, ResizeHeightIcon, } from "../../../icons/ExportCommonIcons";
import RenameInput from "../../../ui/inputs/RenameInput";
import { handleResize } from "../../../../functions/handleResizePannel";
import { useSelectedAsset } from "../../../../store/simulation/useSimulationStore";
import { useMainProduct, useSelectedAsset } from "../../../../store/simulation/useSimulationStore";
import { useProductStore } from "../../../../store/simulation/useProductStore";
import { generateUUID } from "three/src/math/MathUtils";
import RenderOverlay from "../../../templates/Overlay";
@@ -48,6 +48,7 @@ const Simulations: React.FC = () => {
const [processes, setProcesses] = useState<Event[][]>();
const { setToggleUI } = useToggleStore();
const { projectId } = useParams();
const { setMainProduct } = useMainProduct();
const { comparePopUp, setComparePopUp } = useCompareStore();
const { setIsVersionSaved } = useSaveVersion();
@@ -85,8 +86,13 @@ const Simulations: React.FC = () => {
updatedProducts[newSelectedIndex].productUuid,
updatedProducts[newSelectedIndex].productName
);
setMainProduct(
updatedProducts[newSelectedIndex].productUuid,
updatedProducts[newSelectedIndex].productName
);
} else {
setSelectedProduct("", "");
setMainProduct("", "");
}
}
@@ -102,6 +108,7 @@ const Simulations: React.FC = () => {
renameProductApi({ productName: newName, productUuid, projectId: projectId || '' });
if (selectedProduct.productUuid === productUuid) {
setSelectedProduct(productUuid, newName);
setMainProduct(productUuid, newName);
}
};
@@ -172,9 +179,10 @@ const Simulations: React.FC = () => {
{/* eslint-disable-next-line */}
<div
className="value"
onClick={() =>
onClick={() => {
setSelectedProduct(product.productUuid, product.productName)
}
setMainProduct(product.productUuid, product.productName)
}}
>
<input
type="radio"