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

Fix: JobCardMetrics layout and performance indicator

Browse Source 
- Moved progress percentages below ISK values in JobCardMetrics.
- Corrected performance calculation in JobCardMetrics to accurately reflect progress.
This commit is contained in:
gpt-engineer-app[bot]
2025-07-08 10:31:09 +00:00
committed by PhatPhuckDave
parent 8b2a44e1ea
commit 7a61a3d62a
1 changed files with 13 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/components/JobCardMetrics.tsx
View File

@@ -1,4 +1,3 @@
import { useState } from 'react'; import { useState } from 'react';
import { formatISK, parseISKAmount } from '@/utils/priceUtils'; import { formatISK, parseISKAmount } from '@/utils/priceUtils';
import { IndJob } from '@/lib/types'; import { IndJob } from '@/lib/types';
@@ -29,15 +28,13 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
const profit = totalIncome - totalExpenditure; const profit = totalIncome - totalExpenditure;
const margin = totalIncome > 0 ? ((profit / totalIncome) * 100) : 0; const margin = totalIncome > 0 ? ((profit / totalIncome) * 100) : 0;
// Calculate performance metrics // Calculate performance metrics - Fixed logic
const itemsSold = sortedIncome.reduce((sum, tx) => sum + tx.quantity, 0); const itemsSold = sortedIncome.reduce((sum, tx) => sum + tx.quantity, 0);
const expectedRevenuePerItem = job.projectedRevenue && job.outputQuantity > 0 ? job.projectedRevenue / job.outputQuantity : 0; const revenuePerformanceRatio = job.projectedRevenue > 0 ? (totalIncome / job.projectedRevenue) : 0;
const actualRevenuePerItem = itemsSold > 0 ? totalIncome / itemsSold : 0; const revenuePerformancePercentage = revenuePerformanceRatio * 100;
const performanceRatio = expectedRevenuePerItem > 0 ? (actualRevenuePerItem / expectedRevenuePerItem) : 0;
const performancePercentage = performanceRatio * 100;
// Show performance indicator only if we have the necessary data // Show performance indicator only if we have the necessary data and have sold items
const showPerformanceIndicator = job.projectedRevenue > 0 && job.outputQuantity > 0 && itemsSold > 0; const showPerformanceIndicator = job.projectedRevenue > 0 && itemsSold > 0;
const handleFieldClick = (fieldName: string, currentValue: number, e: React.MouseEvent) => { const handleFieldClick = (fieldName: string, currentValue: number, e: React.MouseEvent) => {
e.stopPropagation(); e.stopPropagation();
@@ -85,7 +82,7 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
</JobTransactionPopover> </JobTransactionPopover>
{job.projectedCost > 0 && ( {job.projectedCost > 0 && (
<div className="text-xs text-gray-400 space-y-1"> <div className="text-xs text-gray-400 space-y-1">
vs {editingField === 'projectedCost' ? ( <div>vs {editingField === 'projectedCost' ? (
<Input <Input
value={tempValues.projectedCost || ''} value={tempValues.projectedCost || ''}
onChange={(e) => setTempValues({ ...tempValues, projectedCost: e.target.value })} onChange={(e) => setTempValues({ ...tempValues, projectedCost: e.target.value })}
@@ -104,7 +101,7 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
> >
{formatISK(job.projectedCost)} {formatISK(job.projectedCost)}
</span> </span>
)} )}</div>
<div <div
className={`text-xs font-medium px-2 py-0.5 rounded-full inline-block ${ className={`text-xs font-medium px-2 py-0.5 rounded-full inline-block ${
totalExpenditure <= job.projectedCost totalExpenditure <= job.projectedCost
@@ -127,7 +124,7 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
</JobTransactionPopover> </JobTransactionPopover>
{job.projectedRevenue > 0 && ( {job.projectedRevenue > 0 && (
<div className="text-xs text-gray-400 space-y-1"> <div className="text-xs text-gray-400 space-y-1">
vs {editingField === 'projectedRevenue' ? ( <div>vs {editingField === 'projectedRevenue' ? (
<Input <Input
value={tempValues.projectedRevenue || ''} value={tempValues.projectedRevenue || ''}
onChange={(e) => setTempValues({ ...tempValues, projectedRevenue: e.target.value })} onChange={(e) => setTempValues({ ...tempValues, projectedRevenue: e.target.value })}
@@ -146,7 +143,7 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
> >
{formatISK(job.projectedRevenue)} {formatISK(job.projectedRevenue)}
</span> </span>
)} )}</div>
<div className="flex justify-center gap-2"> <div className="flex justify-center gap-2">
<div <div
className={`text-xs font-medium px-2 py-0.5 rounded-full inline-block ${ className={`text-xs font-medium px-2 py-0.5 rounded-full inline-block ${
@@ -161,15 +158,15 @@ const JobCardMetrics: React.FC<JobCardMetricsProps> = ({ job }) => {
{showPerformanceIndicator && ( {showPerformanceIndicator && (
<div <div
className={`text-xs font-medium px-2 py-0.5 rounded-full inline-block ${ className={`text-xs font-medium px-2 py-0.5 rounded-full inline-block ${
performancePercentage >= 100 revenuePerformancePercentage >= 100
? 'bg-green-900/50 text-green-400' ? 'bg-green-900/50 text-green-400'
: performancePercentage >= 90 : revenuePerformancePercentage >= 90
? 'bg-yellow-900/50 text-yellow-400' ? 'bg-yellow-900/50 text-yellow-400'
: 'bg-red-900/50 text-red-400' : 'bg-red-900/50 text-red-400'
}`} }`}
title={`Performance: ${formatISK(actualRevenuePerItem)}/item vs ${formatISK(expectedRevenuePerItem)}/item expected (${performancePercentage.toFixed(1)}%)`} title={`Performance: ${formatISK(totalIncome)} actual vs ${formatISK(job.projectedRevenue)} expected (${revenuePerformancePercentage.toFixed(1)}%)`}
> >
{performancePercentage >= 100 ? '📈' : performancePercentage >= 90 ? '⚠️' : '📉'} {performancePercentage.toFixed(0)}% {revenuePerformancePercentage >= 100 ? '📈' : revenuePerformancePercentage >= 90 ? '⚠️' : '📉'} {revenuePerformancePercentage.toFixed(0)}%
</div> </div>
)} )}
</div> </div>