Fix: Implement missing per-day lines in charts
The per-day lines were missing from the charts. This commit ensures that all charts display both cumulative and per-day data as requested.
This commit is contained in:
@@ -356,44 +356,37 @@ const TransactionChart: React.FC<TransactionChartProps> = ({
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Profit chart - entire job view
|
if (type === 'profit') {
|
||||||
return (
|
return (
|
||||||
<AreaChart data={data} margin={{ top: 20, right: 80, left: 80, bottom: 5 }}>
|
<AreaChart data={data} margin={{ top: 20, right: 80, left: 80, bottom: 5 }}>
|
||||||
<CartesianGrid strokeDasharray="3 3" stroke="#374151" />
|
<CartesianGrid strokeDasharray="3 3" stroke="#374151" />
|
||||||
<XAxis dataKey="formattedDate" stroke="#9CA3AF" />
|
<XAxis dataKey="formattedDate" stroke="#9CA3AF" />
|
||||||
<YAxis stroke="#9CA3AF" tickFormatter={formatTooltipValue} width={70} />
|
<YAxis stroke="#9CA3AF" tickFormatter={formatTooltipValue} width={70} />
|
||||||
<Tooltip
|
<Tooltip
|
||||||
formatter={formatTooltipValue}
|
formatter={formatTooltipValue}
|
||||||
labelStyle={{ color: '#F3F4F6' }}
|
labelStyle={{ color: '#F3F4F6' }}
|
||||||
contentStyle={{ backgroundColor: '#1F2937', border: '1px solid #374151' }}
|
contentStyle={{ backgroundColor: '#1F2937', border: '1px solid #374151' }}
|
||||||
/>
|
/>
|
||||||
<Legend />
|
<Legend />
|
||||||
<Area
|
<Area
|
||||||
type="monotone"
|
type="monotone"
|
||||||
dataKey="cumulativeCosts"
|
dataKey="cumulativeProfit"
|
||||||
stroke="#EF4444"
|
stroke="#3B82F6"
|
||||||
fill="#EF4444"
|
fill="#3B82F6"
|
||||||
fillOpacity={0.3}
|
fillOpacity={0.3}
|
||||||
name="Cumulative Costs"
|
name="Cumulative Profit"
|
||||||
/>
|
/>
|
||||||
<Area
|
<Line
|
||||||
type="monotone"
|
type="monotone"
|
||||||
dataKey="cumulativeRevenue"
|
dataKey="profit"
|
||||||
stroke="#10B981"
|
stroke="#1E40AF"
|
||||||
fill="#10B981"
|
strokeWidth={2}
|
||||||
fillOpacity={0.3}
|
name="Profit per Day"
|
||||||
name="Cumulative Revenue"
|
dot={false}
|
||||||
/>
|
/>
|
||||||
<Line
|
</AreaChart>
|
||||||
type="monotone"
|
);
|
||||||
dataKey="profit"
|
}
|
||||||
stroke="#3B82F6"
|
|
||||||
strokeWidth={2}
|
|
||||||
name="Profit per Day"
|
|
||||||
dot={false}
|
|
||||||
/>
|
|
||||||
</AreaChart>
|
|
||||||
);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -429,4 +422,4 @@ const TransactionChart: React.FC<TransactionChartProps> = ({
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default TransactionChart;
|
export default TransactionChart;
|
||||||
|
Reference in New Issue
Block a user