feat: add ComparisonResult and EnergyUsage components with performance metrics and energy usage charts

This commit is contained in:
Nalvazhuthi
2025-05-27 18:16:11 +05:30
parent 640505a7f7
commit d3048d7ef1
14 changed files with 733 additions and 44 deletions

View File

@@ -0,0 +1,63 @@
import React from "react";
import {
GreenTickIcon,
PerformanceIcon,
TickIcon,
} from "../../../icons/ExportCommonIcons";
const PerformanceResult = () => {
return (
<div className="performanceResult-wrapper comparisionCard">
<div className="header">
<div className="icon">
<PerformanceIcon />
</div>
<div className="head">Performance result</div>
</div>
<div className="metrics-container">
<div className="metrics-left">
<div className="metric">
<div className="metric-label">
Success rate{" "}
<span>
<GreenTickIcon />
</span>
</div>
<div className="metric-value">98%</div>
</div>
<div className="label">Environmental impact</div>
</div>
<div className="metrics-right">
<div className="metric-wrapper">
<div className="metric-label">Waste generation</div>
<div className="metric">
<div className="metric-icon">I</div>
<div className="metric-value">0.5%</div>
</div>
</div>
<div className="metric-wrapper">
<div className="metric-label">Risk management</div>
<div className="metric">
<div className="metric-icon">I</div>
<div className="metric-value">0.1%</div>
</div>
</div>
<div className="metric-wrapper">
<div className="metric">
<div className="metric-icon">I</div>
<div className="metric-value">0.5%</div>
</div>
</div>
</div>
</div>
<div className="simulation-tag">Simulation 1</div>
</div>
);
};
export default PerformanceResult;