pt/pf_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Mark the ledger row the edit is measured from

Browse Source 
Forecast and Total selected differed only in weight, and the Total line's
running figure was bold either way, so neither read as the target. The
basis row is now tinted and tagged, and clicking either row selects it.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Paul Trowbridge 2026-09-25 13:09:24 -04:00
parent b8b5220583
commit 6b2ecbbcd6
1 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
ui/src/components/OperationPanel.jsx
View File

@ -886,6 +886,17 @@ function ScaleLedger({ currentTotals, scaleInputs, setScaleInputs, scalePlug, se
const numCell = 'text-right font-mono tabular-nums whitespace-nowrap px-2'
const rule = <td className="p-0"><div className="border-t border-gray-300 my-1" /></td>
// The line the edit rows are measured from. It used to be marked by weight
// alone, and the Total line's running figure was bold whichever basis was
// chosen, so either way one of the two rows had bold in it and neither read
// as the target. Tinted, tagged, and clickable -- the Target toggle sits in
// the other column, away from the rows it chooses between.
const basisRow = (hot) => (hot
? 'bg-blue-50 text-blue-700 font-semibold'
: 'text-gray-500') + (hasExcl ? ' cursor-pointer' : '')
const targetTag = (
<span className="ml-1.5 text-[9px] font-semibold uppercase tracking-wider text-blue-600">target</span>
)
return (
<div className="min-w-0">
@ -982,9 +993,12 @@ function ScaleLedger({ currentTotals, scaleInputs, setScaleInputs, scalePlug, se
<tr>{rule}{measures.map(m => <td key={m.key} className="p-0 px-2"><div className="border-t border-gray-300 my-1" /></td>)}{showRunning && <td className="p-0 px-2"><div className="border-t border-gray-300 my-1" /></td>}</tr>
<tr className={onTotal ? 'text-gray-600' : 'font-semibold text-gray-700'}>
<tr className={hasExcl ? basisRow(!onTotal) : 'font-semibold text-gray-700'}
onClick={hasExcl ? () => setTargetBasis('adjustable') : undefined}
title={hasExcl ? 'Type your number as the forecast alone' : undefined}>
<td className="pr-3 whitespace-nowrap">
{hasExcl ? 'Forecast' : 'Current'}{perSlice ? ' (all)' : ''}
{hasExcl && !onTotal && targetTag}
</td>
{measures.map(m => (
<td key={m.key} className={numCell}>{fmtNum(m.current, m.dp)}</td>
@ -994,8 +1008,10 @@ function ScaleLedger({ currentTotals, scaleInputs, setScaleInputs, scalePlug, se
{hasExcl && (
<tr className={onTotal ? 'font-semibold text-gray-700' : 'text-gray-600'}>
<td className="pr-3 whitespace-nowrap">Total selected</td>
<tr className={basisRow(onTotal)}
onClick={() => setTargetBasis('selected')}
title="Type your number as everything selected">
<td className="pr-3 whitespace-nowrap">Total selected{onTotal && targetTag}</td>
{measures.map(m => (
<td key={m.key} className={numCell}>
{m.key === 'price'
@ -1004,7 +1020,7 @@ function ScaleLedger({ currentTotals, scaleInputs, setScaleInputs, scalePlug, se
</td>
))}
{showRunning && (
<td className={`${numCell} font-semibold text-gray-700`}>{fmtNum(grand.value, 0)}</td>
<td className={numCell}>{fmtNum(grand.value, 0)}</td>
)}
</tr>
)}