feat: update simulation data structure and improve performance metrics display
This commit is contained in:
parent
b350bc6d9e
commit
064de39eac
|
@ -31,27 +31,29 @@ function ComparisonScene() {
|
|||
// useEffect(() => {
|
||||
// setCompareProductsData([
|
||||
// {
|
||||
// productUuid: "15193386-ec58-4ec6-8a92-e665a39eebf1",
|
||||
// productName: "Product 1",
|
||||
// simulationData: {
|
||||
// roiPercentage: 65.54,
|
||||
// netProfit: 499037750,
|
||||
// machineIdleTime: 1024,
|
||||
// machineActiveTime: 235,
|
||||
// productionCapacity: 1000,
|
||||
// throughputData: 62.42
|
||||
// "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: 169.99,
|
||||
// netProfit: 1282397750,
|
||||
// machineIdleTime: 1897,
|
||||
// machineActiveTime: 653,
|
||||
// productionCapacity: 2000,
|
||||
// throughputData: 157.03
|
||||
// "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
|
||||
// }
|
||||
// }
|
||||
// ])
|
||||
|
|
|
@ -99,9 +99,9 @@ const ROISummary = ({
|
|||
|
||||
function getPaybackDateFromYears(yearsToAdd: number) {
|
||||
const now = new Date();
|
||||
console.log('yearsToAdd: ', yearsToAdd);
|
||||
|
||||
const totalMonths = Math.round(yearsToAdd * 12);
|
||||
console.log('totalMonths: ', totalMonths);
|
||||
|
||||
const paybackDate = new Date(now.getFullYear(), now.getMonth() + totalMonths, now.getDate());
|
||||
const month = paybackDate.toLocaleString("en-GB", { month: "long" });
|
||||
const year = paybackDate.getFullYear();
|
||||
|
|
|
@ -55,7 +55,7 @@ const ProductionCapacity = ({
|
|||
<>
|
||||
<div className="process-container">
|
||||
<div className="throughput-value">
|
||||
<span className="value">{(Units_per_hour).toFixed(2)}</span> Units/hour
|
||||
<span className="value">{(Units_per_hour).toFixed(2) === "Infinity"? 0 : (Units_per_hour).toFixed(2) }</span> Units/hour
|
||||
</div>
|
||||
|
||||
{/* Dynamic Progress Bar */}
|
||||
|
|
|
@ -32,7 +32,7 @@ const ComparisonResult = () => {
|
|||
|
||||
useEffect(() => {
|
||||
if (comparedProducts.length === 2) {
|
||||
console.log(comparedProducts);
|
||||
|
||||
}
|
||||
}, [comparedProducts]);
|
||||
|
||||
|
@ -234,7 +234,7 @@ const ComparisonResult = () => {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<PerformanceResult />
|
||||
{ comparedProducts.length === 2 &&<PerformanceResult comparedProducts={comparedProducts}/>}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
@ -5,7 +5,8 @@ import {
|
|||
TickIcon,
|
||||
} from "../../../icons/ExportCommonIcons";
|
||||
|
||||
const PerformanceResult = () => {
|
||||
const PerformanceResult = ({ comparedProducts }: any) => {
|
||||
const ProfitProduct = comparedProducts[0].simulationData.netProfit > comparedProducts[1].simulationData.netProfit ? comparedProducts[0] : comparedProducts[1];
|
||||
return (
|
||||
<div className="performanceResult-wrapper comparisionCard">
|
||||
<div className="header">
|
||||
|
@ -26,30 +27,30 @@ const PerformanceResult = () => {
|
|||
</div>
|
||||
<div className="metric-value">98%</div>
|
||||
</div>
|
||||
<div className="label">Environmental impact</div>
|
||||
<div className="label">Net Profit</div>
|
||||
</div>
|
||||
|
||||
<div className="metrics-right">
|
||||
<div className="metric-wrapper">
|
||||
<div className="metric-label">Waste generation</div>
|
||||
<div className="metric-label">ROI Percentage</div>
|
||||
<div className="metric">
|
||||
<div className="metric-icon">I</div>
|
||||
<div className="metric-value">0.5%</div>
|
||||
<div className="metric-icon"></div>
|
||||
<div className="metric-value">{ProfitProduct.simulationData.roiPercentage.toFixed(2)}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="metric-wrapper">
|
||||
<div className="metric-label">Risk
management</div>
|
||||
<div className="metric-label">Payback Period</div>
|
||||
<div className="metric">
|
||||
<div className="metric-icon">I</div>
|
||||
<div className="metric-value">0.1%</div>
|
||||
<div className="metric-icon"></div>
|
||||
<div className="metric-value">{ProfitProduct.simulationData.netProfit}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="metric-wrapper">
|
||||
<div className="metric">
|
||||
<div className="metric-icon">I</div>
|
||||
<div className="metric-value">0.5%</div>
|
||||
<div className="metric-icon"></div>
|
||||
<div className="metric-value">{parseFloat(ProfitProduct.simulationData.paybackPeriod.toFixed(2))}years</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -49,7 +49,7 @@ export default function ROIData() {
|
|||
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) {
|
||||
console.log('productionCapacityData: ', productionCapacityData);
|
||||
|
||||
|
||||
// const totalHoursPerYear = shiftLength * shiftsPerDay * workingDaysPerYear;
|
||||
// const annualProductionUnits = productionCapacityData * totalHoursPerYear;
|
||||
|
@ -158,6 +158,7 @@ export default function ROIData() {
|
|||
// shiftLength: shiftLength,
|
||||
// shiftsPerDay: shiftsPerDay,
|
||||
roiPercentage: ROI,
|
||||
paybackPeriod: Payback_period_years,
|
||||
// paybackPeriod: paybackPeriod,
|
||||
// totalCost: totalAnnualCost,
|
||||
// revenueGenerated: annualRevenue,
|
||||
|
@ -186,7 +187,7 @@ export default function ROIData() {
|
|||
}, [inputValues, productionCapacityData, throughputData, isPlaying]);
|
||||
|
||||
useEffect(() => {
|
||||
console.log('compareProductsData: ', compareProductsData);
|
||||
|
||||
}, [compareProductsData])
|
||||
|
||||
return null;
|
||||
|
|
|
@ -13,7 +13,7 @@ export default function ProductionCapacityData() {
|
|||
|
||||
useEffect(() => {
|
||||
if (!isPlaying) {
|
||||
console.log('isPlaying: ', isPlaying);
|
||||
|
||||
setProductionCapacityData(0);
|
||||
}
|
||||
}, [isPlaying]);
|
||||
|
@ -25,8 +25,8 @@ export default function ProductionCapacityData() {
|
|||
if (!isNaN(workingDaysPerYear) && throughputData > 0) {
|
||||
const Monthly_working_days = workingDaysPerYear / 12;
|
||||
const Production_capacity_per_month = throughputData * Monthly_working_days;
|
||||
console.log('Production_capacity_per_month: ', Production_capacity_per_month);
|
||||
console.log('throughputData: ', throughputData);
|
||||
|
||||
|
||||
|
||||
setProductionCapacityData(Number(Production_capacity_per_month.toFixed(2)));
|
||||
}
|
||||
|
|
|
@ -180,7 +180,7 @@ export default function ThroughPutData() {
|
|||
}
|
||||
|
||||
const allInactive = !anyArmActive && !anyVehicleActive && !anyMachineActive;
|
||||
if (allInactive && materials.length === 0 && materialHistory.length > 0) {
|
||||
if (materials.length >= 0 && materialHistory.length > 0) {
|
||||
|
||||
let totalCycleTimeSum = 0;
|
||||
let cycleCount = 0;
|
||||
|
|
|
@ -43,7 +43,7 @@ const UserAuth: React.FC = () => {
|
|||
const organization = email.split("@")[1].split(".")[0];
|
||||
try {
|
||||
const res = await signInApi(email, password, organization, fingerprint);
|
||||
console.log('res: ', res);
|
||||
// console.log('res: ', res);
|
||||
if (res.message.message === "login successfull") {
|
||||
setError("");
|
||||
setOrganization(organization);
|
||||
|
@ -56,10 +56,10 @@ const UserAuth: React.FC = () => {
|
|||
localStorage.setItem("refreshToken", res.message.refreshToken);
|
||||
|
||||
try {
|
||||
console.log('res.message.userId: ', res.message.userId);
|
||||
console.log('organization: ', organization);
|
||||
// console.log('res.message.userId: ', res.message.userId);
|
||||
// console.log('organization: ', organization);
|
||||
const projects = await recentlyViewed(organization, res.message.userId);
|
||||
console.log('projects: ', projects);
|
||||
// console.log('projects: ', projects);
|
||||
|
||||
if (res.message.isShare) {
|
||||
if (Object.values(projects.RecentlyViewed).length > 0) {
|
||||
|
|
|
@ -727,6 +727,7 @@ export interface CompareProduct {
|
|||
// revenueGenerated: number;
|
||||
netProfit: number;
|
||||
productionCapacity: number;
|
||||
paybackPeriod: number;
|
||||
// netLoss: number;
|
||||
machineIdleTime: number;
|
||||
machineActiveTime: number;
|
||||
|
|
Loading…
Reference in New Issue