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

Move booking delta ticker above occupied count in Rooms cell

Browse source 
▲/▼ indicators relate to occupied rooms, not D/S/A breakdown,
so move them to the top of the Rooms cell in both CatRows and TotalRows.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
jtricerolph 2026-07-02 15:04:55 +00:00
parent 97e99735ce
commit 087553054e
1 changed files with 13 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

26
frontend/src/pages/Planner.tsx
View file

@ -531,13 +531,19 @@ function CatRows({ cat, dates, pickup, onPickupChange, isLast }: {
return ( return (
<> <>
{/* Left cell: Rooms / vac / pickup controls */} {/* Left cell: delta ticker + Rooms / vac / pickup controls */}
<td key={date + '-r'} style={{ <td key={date + '-r'} style={{
textAlign: 'center', verticalAlign: 'middle', borderBottom: bbStyle, textAlign: 'center', verticalAlign: 'middle', borderBottom: bbStyle,
padding: '0.4rem 0.3rem', padding: '0.4rem 0.3rem',
borderLeft: '2px solid var(--card-border)', borderLeft: '2px solid var(--card-border)',
...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}), ...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}),
}}> }}>
{(dNew > 0 || dCanc > 0) && (
<div style={{ marginBottom: '2px', fontSize: '0.72rem' }}>
{dNew > 0 && <span className="delta-new">▲{dNew}</span>}
{dCanc > 0 && <span className="delta-canc"> ▼{dCanc}</span>}
</div>
)}
<div style={{ fontWeight: 700, fontSize: '1.1rem' }} title={occTooltip}> <div style={{ fontWeight: 700, fontSize: '1.1rem' }} title={occTooltip}>
{occupied}{pu > 0 && <span className="pickup-tag"> +{pu}</span>} {occupied}{pu > 0 && <span className="pickup-tag"> +{pu}</span>}
</div> </div>
@ -558,12 +564,6 @@ function CatRows({ cat, dates, pickup, onPickupChange, isLast }: {
borderBottom: bbStyle, padding: '0.4rem 0.5rem 0.4rem 0.4rem', textAlign: 'right', borderBottom: bbStyle, padding: '0.4rem 0.5rem 0.4rem 0.4rem', textAlign: 'right',
...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}), ...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}),
}}> }}>
{(dNew > 0 || dCanc > 0) && (
<div style={{ marginBottom: '3px' }}>
{dNew > 0 && <span className="delta-new">▲{dNew}</span>}
{dCanc > 0 && <span className="delta-canc"> ▼{dCanc}</span>}
</div>
)}
<div style={{ fontSize: '0.8rem', color: '#c2502e', fontWeight: 600 }}> <div style={{ fontSize: '0.8rem', color: '#c2502e', fontWeight: 600 }}>
{d.departs}d{prevPu > 0 && <span className="pickup-tag"> +{prevPu}</span>} {d.departs}d{prevPu > 0 && <span className="pickup-tag"> +{prevPu}</span>}
</div> </div>
@ -613,6 +613,12 @@ function TotalRows({ dates, cats, pickup }: {
borderLeft: '2px solid var(--card-border)', borderLeft: '2px solid var(--card-border)',
...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}), ...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}),
}}> }}>
{(dNew > 0 || dCanc > 0) && (
<div style={{ marginBottom: '2px', fontSize: '0.72rem' }}>
{dNew > 0 && <span className="delta-new">▲{dNew}</span>}
{dCanc > 0 && <span className="delta-canc"> ▼{dCanc}</span>}
</div>
)}
<div style={{ fontWeight: 700, fontSize: '1.1rem' }}> <div style={{ fontWeight: 700, fontSize: '1.1rem' }}>
{occupied}{pu > 0 && <span className="pickup-tag"> +{pu}</span>} {occupied}{pu > 0 && <span className="pickup-tag"> +{pu}</span>}
</div> </div>
@ -625,12 +631,6 @@ function TotalRows({ dates, cats, pickup }: {
padding: '0.4rem 0.5rem 0.4rem 0.4rem', textAlign: 'right', padding: '0.4rem 0.5rem 0.4rem 0.4rem', textAlign: 'right',
...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}), ...(wknd ? { background: 'rgba(100,120,160,0.07)' } : {}),
}}> }}>
{(dNew > 0 || dCanc > 0) && (
<div style={{ marginBottom: '3px' }}>
{dNew > 0 && <span className="delta-new">▲{dNew}</span>}
{dCanc > 0 && <span className="delta-canc"> ▼{dCanc}</span>}
</div>
)}
<div style={{ fontSize: '0.8rem', color: '#c2502e', fontWeight: 600 }}> <div style={{ fontSize: '0.8rem', color: '#c2502e', fontWeight: 600 }}>
{departs}d{prevPu > 0 && <span className="pickup-tag"> +{prevPu}</span>} {departs}d{prevPu > 0 && <span className="pickup-tag"> +{prevPu}</span>}
</div> </div>