Nearle/nearle_console
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updates on the dispatch page

Browse Source
This commit is contained in:
dharaneesh-r
2026-06-02 18:26:42 +05:30
parent 6c51d1dcc0
commit 3d46c07f89
2 changed files with 12 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/pages/nearle/dispatch/Dispatch.css
View File

@@ -2285,30 +2285,16 @@
color: #10b981; color: #10b981;
} }
/* Time-mode visual cues on individual order cards. Numbered badge
switches from "planned step N" to "delivered #N inside this trip"
when sort mode is `time`. Emerald (delivered family) signals
"ranked by completion," distinguishing it from the planned step. */
.dispatch-container .zone-order-num.is-time-rank {
background: #ecfdf5;
color: #047857;
box-shadow: inset 0 0 0 1.5px #6ee7b7;
}
/* Cards whose order isn't yet delivered, while time-sort is active. /* Cards whose order isn't yet delivered, while time-sort is active.
These are pushed to the end of the trip list (MAX_SAFE_INTEGER sort These are pushed to the end of the trip list (MAX_SAFE_INTEGER sort
key) — the muted styling tells the operator "not yet delivered" key) — the muted styling tells the operator "not yet delivered"
at a glance without reading every status pill. */ at a glance without reading every status pill. The numbered badge
itself stays in its planned-step styling so the dispatched identity
stays readable; only the surrounding card dims. */
.dispatch-container .zone-order-card.is-pending-time { .dispatch-container .zone-order-card.is-pending-time {
opacity: 0.72; opacity: 0.72;
} }
.dispatch-container .zone-order-card.is-pending-time .zone-order-num.is-time-rank {
background: #f8fafc;
color: #64748b;
box-shadow: inset 0 0 0 1.5px #cbd5e1;
}
.dispatch-container .step-wrap { .dispatch-container .step-wrap {
padding: 16px; padding: 16px;
} }

19
src/pages/nearle/dispatch/Dispatch.js
View File

@@ -3820,14 +3820,13 @@ const Dispatch = ({
const profit = parseFloat(o.profit || 0); const profit = parseFloat(o.profit || 0);
const isLoss = profit < 0; const isLoss = profit < 0;
const estMeters = calculateEstMeters(focusedRider.id, o); const estMeters = calculateEstMeters(focusedRider.id, o);
// Badge number: // Badge number is ALWAYS the planned step (o.step)
// planned mode → planned step (o.step), so a // — the same number regardless of sort mode. Time
// reordered list still surfaces the dispatched // mode only reorders the cards; the badge keeps
// step number on each card. // its dispatched identity so operators can still
// time mode → completion sequence inside the // map a card on screen back to "step 3 of the
// trip (1 = delivered first). Undelivered rows // planned route" without mental translation.
// sort to the end so their idx+1 is the highest. const displayNum = o.step || idx + 1;
const displayNum = isTimeMode ? idx + 1 : (o.step || idx + 1);
// "Not yet delivered" indicator for time mode — we // "Not yet delivered" indicator for time mode — we
// pushed these rows to the end via MAX_SAFE_INTEGER // pushed these rows to the end via MAX_SAFE_INTEGER
// sort key, but a visual cue makes that obvious // sort key, but a visual cue makes that obvious
@@ -3855,8 +3854,8 @@ const Dispatch = ({
> >
<div className="zone-order-card-head"> <div className="zone-order-card-head">
<div <div
className={`zone-order-num ${isTimeMode ? 'is-time-rank' : ''}`} className="zone-order-num"
title={isTimeMode ? `Delivered #${idx + 1} in this trip` : `Planned step ${o.step || idx + 1}`} title={`Planned step ${o.step || idx + 1}`}
> >
{displayNum} {displayNum}
</div> </div>