PY wages/sales as sub-labels not separate cards
Show PY value + % change as a subtitle line under the period card, same pattern as the original PY sales sub-label. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
1d7cb229e4
commit
dc1a14a070
2 changed files with 18 additions and 29 deletions
|
|
@ -131,7 +131,12 @@ export default function Monthly() {
|
|||
const pctBudget = budget != null && budget > 0 ? (totalForecast / budget) * 100 : null
|
||||
const pctSales = netSales > 0 ? (totalActual / netSales) * 100 : null
|
||||
const variance = budget != null ? totalForecast - budget : null
|
||||
const pyWagesDiff = pyWages != null && totalActual > 0 ? totalActual - pyWages : null
|
||||
|
||||
function pyPct(current: number, py: number): string {
|
||||
if (py <= 0 || current <= 0) return ''
|
||||
const p = ((current - py) / py) * 100
|
||||
return ` (${p >= 0 ? '+' : ''}${p.toFixed(1)}%)`
|
||||
}
|
||||
|
||||
// Build chart data with per-dept costs per week so Bar dataKey works
|
||||
type WeekEntry = { label: string; isPast: boolean; [dept: string]: number | boolean | string }
|
||||
|
|
@ -187,15 +192,7 @@ export default function Monthly() {
|
|||
<div className="summary-card">
|
||||
<div className="label">{isCurrentMonth ? 'Actual MTD' : 'Actual'}</div>
|
||||
<div className="value">{fmtMoney(totalActual)}</div>
|
||||
</div>
|
||||
<div className="summary-card">
|
||||
<div className="label">{isCurrentMonth ? 'PY Wages MTD' : 'PY Wages'}</div>
|
||||
<div className="value">{pyWages != null ? fmtMoney(pyWages) : '—'}</div>
|
||||
{pyWagesDiff != null && (
|
||||
<div className={`sub ${pyWagesDiff > 0 ? 'variance-over' : 'variance-under'}`}>
|
||||
{pyWagesDiff > 0 ? '+' : ''}{fmtMoney(pyWagesDiff)} vs PY
|
||||
</div>
|
||||
)}
|
||||
{pyWages != null && <div className="sub">PY {fmtMoney(pyWages)}{pyPct(totalActual, pyWages)}</div>}
|
||||
</div>
|
||||
{isCurrentMonth && (
|
||||
<div className="summary-card">
|
||||
|
|
@ -224,10 +221,7 @@ export default function Monthly() {
|
|||
<div className="summary-card">
|
||||
<div className="label">{isCurrentMonth ? 'Net Sales MTD' : 'Net Sales'}</div>
|
||||
<div className="value">{fmtMoney(netSales)}</div>
|
||||
</div>
|
||||
<div className="summary-card">
|
||||
<div className="label">{isCurrentMonth ? 'PY Net Sales MTD' : 'PY Net Sales'}</div>
|
||||
<div className="value">{pySales > 0 ? fmtMoney(pySales) : '—'}</div>
|
||||
{pySales > 0 && <div className="sub">PY {fmtMoney(pySales)}{pyPct(netSales, pySales)}</div>}
|
||||
</div>
|
||||
<div className="summary-card">
|
||||
<div className="label">% Net Sales</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue