hotel-manage-stack/wages
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Show budget % as delta (+/-) from 100% across all views

Browse source
This commit is contained in:
jtricerolph 2026-07-23 11:48:38 +00:00
parent bbc9a23da0
commit 92400dbcec
4 changed files with 15 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

10
frontend/src/pages/Weekly.tsx
View file

@ -41,6 +41,10 @@ function pctClass(pct: number | null): string {
if (pct <= 110) return 'pct-amber'
return 'pct-red'
}
function fmtDelta(pct: number): string {
const d = pct - 100
return `${d >= 0 ? '+' : ''}${d.toFixed(1)}%`
}
export default function Weekly() {
const [fromStr, setFromStr] = useState<string>(() => mondayOf(new Date()))
@ -195,7 +199,7 @@ export default function Weekly() {
<div className="label">% vs Budget</div>
<div className="value">
{pctBudget != null
? <span className={`pct-badge ${pctClass(pctBudget)}`}>{pctBudget.toFixed(1)}%</span>
? <span className={`pct-badge ${pctClass(pctBudget)}`}>{fmtDelta(pctBudget)}</span>
: '—'}
</div>
</div>
@ -247,7 +251,7 @@ export default function Weekly() {
<td className="right">{depBudg != null ? fmtMoney(depBudg) : '—'}</td>
<td className="right">
{depPct != null
? <span className={`pct-badge ${pctClass(depPct)}`}>{depPct.toFixed(1)}%</span>
? <span className={`pct-badge ${pctClass(depPct)}`}>{fmtDelta(depPct)}</span>
: '—'}
</td>
<td className="right">{depSPct != null ? `${depSPct.toFixed(1)}%` : '—'}</td>
@ -261,7 +265,7 @@ export default function Weekly() {
<td className="right">{budget != null ? fmtMoney(budget) : '—'}</td>
<td className="right">
{pctBudget != null
? <span className={`pct-badge ${pctClass(pctBudget)}`}>{pctBudget.toFixed(1)}%</span>
? <span className={`pct-badge ${pctClass(pctBudget)}`}>{fmtDelta(pctBudget)}</span>
: '—'}
</td>
<td className="right">{pctSales != null ? `${pctSales.toFixed(1)}%` : '—'}</td>