dave/eve-industrializer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor performance indicator display

Browse Source 
Reduced verbosity and improved the layout of the performance indicator in `JobCardMetrics.tsx` for a more compact and accurate display.
This commit is contained in:
gpt-engineer-app[bot]
2025-07-08 10:24:57 +00:00
committed by PhatPhuckDave
parent 037328f0c9
commit 460049a1a2
1 changed files with 14 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/JobCardMetrics.tsx
View File

@@ -30,14 +30,14 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
const margin = totalIncome > 0 ? ((profit / totalIncome) * 100) : 0;
// Calculate performance metrics
const soldQuantity = job.produced || 0;
const itemsSold = sortedIncome.reduce((sum, tx) => sum + tx.quantity, 0);
const expectedRevenuePerItem = job.projectedRevenue && job.outputQuantity > 0 ? job.projectedRevenue / job.outputQuantity : 0;
const actualRevenuePerItem = soldQuantity > 0 ? totalIncome / soldQuantity : 0;
const actualRevenuePerItem = itemsSold > 0 ? totalIncome / itemsSold : 0;
const performanceRatio = expectedRevenuePerItem > 0 ? (actualRevenuePerItem / expectedRevenuePerItem) : 0;
const performancePercentage = performanceRatio * 100;
// Show performance indicator only if we have the necessary data
const showPerformanceIndicator = job.projectedRevenue > 0 && job.outputQuantity > 0 && soldQuantity > 0;
const showPerformanceIndicator = job.projectedRevenue > 0 && job.outputQuantity > 0 && itemsSold > 0;
const handleFieldClick = (fieldName: string, currentValue: number, e: React.MouseEvent) => {
e.stopPropagation();
@@ -146,22 +146,17 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
</div>
)}
{showPerformanceIndicator && (
<div className="text-xs space-y-1">
<div className="text-gray-400">
{formatISK(actualRevenuePerItem)}/item vs {formatISK(expectedRevenuePerItem)}/item
</div>
<div
className={`text-xs font-medium px-2 py-1 rounded-full ${
performancePercentage >= 100
? 'bg-green-900/50 text-green-400'
: performancePercentage >= 90
? 'bg-yellow-900/50 text-yellow-400'
: 'bg-red-900/50 text-red-400'
}`}
title={`Performance: ${performancePercentage.toFixed(1)}% of expected revenue per item`}
>
{performancePercentage >= 100 ? '📈' : performancePercentage >= 90 ? '⚠️' : '📉'} {performancePercentage.toFixed(0)}%
</div>
<div
className={`text-xs font-medium px-2 py-0.5 rounded-full inline-block ${
performancePercentage >= 100
? 'bg-green-900/50 text-green-400'
: performancePercentage >= 90
? 'bg-yellow-900/50 text-yellow-400'
: 'bg-red-900/50 text-red-400'
}`}
title={`Performance: ${formatISK(actualRevenuePerItem)}/item vs ${formatISK(expectedRevenuePerItem)}/item expected (${performancePercentage.toFixed(1)}%)`}
>
{performancePercentage >= 100 ? '📈' : performancePercentage >= 90 ? '⚠️' : '📉'} {performancePercentage.toFixed(0)}%
</div>
)}
</div>