diff --git a/src/pages/nearle/dispatch/ActiveSection.js b/src/pages/nearle/dispatch/ActiveSection.js index 51669cd..7d50c78 100644 --- a/src/pages/nearle/dispatch/ActiveSection.js +++ b/src/pages/nearle/dispatch/ActiveSection.js @@ -26,9 +26,7 @@ const ActiveSection = ({ }) => { // Sort by live distance ascending (closest drop-off first; null/unknown last) const activeDeliveries = visibleRiders - .map((r) => getActiveOrder(r.orders)) - .filter(Boolean) - .filter((o) => String(o.orderstatus || '').toLowerCase() === 'active') + .flatMap((r) => (r.orders || []).filter((o) => String(o.orderstatus || '').toLowerCase() === 'active')) .sort((a, b) => { const mA = calculateEstMeters(a.rider_id || a.userid, a) ?? Infinity; const mB = calculateEstMeters(b.rider_id || b.userid, b) ?? Infinity; diff --git a/src/pages/nearle/dispatch/Dispatch.js b/src/pages/nearle/dispatch/Dispatch.js index 00b5995..791f9ec 100644 --- a/src/pages/nearle/dispatch/Dispatch.js +++ b/src/pages/nearle/dispatch/Dispatch.js @@ -1304,7 +1304,7 @@ const Dispatch = ({ hasNextPage: liveHasNextPage, isFetchingNextPage: liveIsFetchingNextPage } = useInfiniteQuery({ - queryKey: ['dispatchDeliveries', selectedAppLocationId, liveUserid, 'all', selectedDate, selectedDate, 50, '', 0, 0, 0], + queryKey: ['dispatchDeliveries', selectedAppLocationId, liveUserid, 'all', selectedDate, selectedDate, 1000, '', 0, 0, 0], queryFn: fetchDeliveries, getNextPageParam: (lastPage) => lastPage.nextPage ?? undefined, enabled: shouldFetchLive, @@ -1578,10 +1578,8 @@ const Dispatch = ({ // excluded here. Every other view (By Location / By Zone / By Rider) is // unchanged. const isAllActiveView = viewMode === 'all'; - // Orders belonging to GPS-active riders — the candidate pool for this view's - // list, drop set and auto-fit. Narrowed to in-progress orders below. const allViewOrders = useMemo( - () => (isAllActiveView ? allOrders.filter((o) => activeRiderIdSet.has(String(o.rider_id))) : allOrders), + () => (isAllActiveView ? allOrders.filter((o) => activeRiderIdSet.has(String(o.rider_id || o.userid || ''))) : allOrders), [isAllActiveView, allOrders, activeRiderIdSet] ); // The single gate for the whole Active view: rider ids that are GPS-active AND @@ -1592,8 +1590,8 @@ const Dispatch = ({ () => new Set( (isAllActiveView ? allViewOrders : []) - .filter(isActiveDelivery) - .map((o) => String(o.rider_id)) + .filter((o) => String(o?.orderstatus || '').toLowerCase() === 'active') + .map((o) => String(o.rider_id || o.userid || '')) ), [isAllActiveView, allViewOrders] ); @@ -2305,8 +2303,12 @@ const Dispatch = ({ if (focusedRider && focusedRider.id !== r.id) return; if (focusedKitchen && !focusedKitchen.riders.has(r.id)) return; + const activeOrder = isAllActiveView ? getActiveOrder(r.orders) : null; + const isActiveAndShown = activeOrder && String(activeOrder.orderstatus || '').toLowerCase() === 'active'; + const rOrders = isAllActiveView ? (isActiveAndShown ? [activeOrder] : []) : r.orders; + const trips = {}; - r.orders.forEach(o => { + rOrders.forEach(o => { const t = o.trip_number || 1; if (!trips[t]) trips[t] = []; trips[t].push(o); @@ -2320,12 +2322,27 @@ const Dispatch = ({ if (filteredTOrders.length === 0) return; - const cacheKey = `${r.id}-${tNum}`; + const cacheKey = isAllActiveView ? `${r.id}-active-${filteredTOrders[0].orderid}` : `${r.id}-${tNum}`; const roadPath = osrmRoutes[cacheKey]; const sorted = [...filteredTOrders].sort((a, b) => (a.step || 0) - (b.step || 0)); - // Aerial fallback — NaN-safe build - const aerialPath = buildTripPoints(sorted); + // Aerial fallback + let activeStraightLeg = null; + if (isAllActiveView && filteredTOrders[0]) { + const o = filteredTOrders[0]; + const lp = liveRiderLocations.find((l) => String(l.id) === String(r.id)); + const start = (lp && Number.isFinite(lp.lat) && Number.isFinite(lp.lon)) + ? [lp.lat, lp.lon] + : (hasValidPickup(o) + ? [toNum(pickupLat(o)), toNum(pickupLon(o))] + : null); + const dLat = toNum(o.droplat || o.deliverylat); + const dLon = toNum(o.droplon || o.deliverylong); + if (start && Number.isFinite(dLat) && Number.isFinite(dLon)) { + activeStraightLeg = [start, [dLat, dLon]]; + } + } + const aerialPath = isAllActiveView ? (activeStraightLeg || []) : buildTripPoints(sorted); const isKitchenAerial = (viewMode === 'kitchens' || focusedKitchen); const path = roadPath || aerialPath; @@ -3997,177 +4014,177 @@ const Dispatch = ({ }) : tOrders; return ( -
-
- Trip {tNum} - - {tOrders.length} stops - {tOrders.reduce((s, o) => s + parseFloat(o.actualkms || o.kms || 0), 0).toFixed(1)} km - - {/* iOS-style segmented control: Planned (dispatched step +
+
+ Trip {tNum} + + {tOrders.length} stops + {tOrders.reduce((s, o) => s + parseFloat(o.actualkms || o.kms || 0), 0).toFixed(1)} km + + {/* iOS-style segmented control: Planned (dispatched step order) vs By time (completion order). The active item is a white "thumb"; the rider color stays on the Trip badge so the pills don't compete with it. */} -
- - + + +
+
+
+ {displayOrders.map((o, idx) => { + const kitchenKey = (o.kitchen_key || o.pickupcustomer || 'Unknown').toLowerCase().trim(); + const showTransition = prevKitchenKey !== null && kitchenKey !== prevKitchenKey; + prevKitchenKey = kitchenKey; + const isStopActive = focusedStop && focusedStop.orderid === o.orderid; + const isGoingOn = activeOrderId && o.orderid === activeOrderId; + const lat = parseFloat(o.droplat || o.deliverylat); + const lon = parseFloat(o.droplon || o.deliverylong); + const canFocus = Number.isFinite(lat) && Number.isFinite(lon); + const statusStyle = getStatusStyle(o.orderstatus); + const estMeters = calculateEstMeters(focusedRider.id, o); + // In "By time" mode, stops with no actual delivery time + // were sunk to the bottom — dim them so it's obvious + // they're not yet delivered without reading the status. + const isUndeliveredInTimeMode = isTimeMode && !o.deliverytime; + + return ( + + {showTransition && ( +
Switch to {o.pickupcustomer}
+ )} +
setFocusedStop(isStopActive ? null : { orderid: o.orderid, lat, lon }) : undefined} + onKeyDown={canFocus ? (e) => { + if (e.key === 'Enter' || e.key === ' ') { + e.preventDefault(); + setFocusedStop(isStopActive ? null : { orderid: o.orderid, lat, lon }); + } + } : undefined} + title={canFocus ? (isStopActive ? 'Click to show full trip' : `Show ${o.deliverycustomer || `order #${o.orderid}`} on map`) : undefined} + > +
+
{o.step || idx + 1}
+
+
Order #{o.orderid}
+
+ {(() => { + // Stack the status pill and delivery time vertically on + // the right of the header so the operator sees the order + // outcome and the wall-clock time it landed at a glance. + const actual = formatTimeOnly(o.deliverytime); + const expected = formatTimeOnly(o.expecteddeliverytime); + const isDelivered = FINAL_STATUSES.has(String(o.orderstatus || '').toLowerCase()); + const showEstDrop = !isDelivered && estMeters !== null; + if (!o.orderstatus && !actual && !expected && !showEstDrop) return null; + return ( +
+ {o.orderstatus && ( + + {statusStyle.label} + + )} + {(actual || expected) && ( + + {actual || expected} + + )} + {showEstDrop && ( + + {formatMeters(estMeters)} + + )} +
+ ); + })()} + {onChangeRider && ( + + )} +
+ +
+ {o.deliverycustomer || '—'} +
+ + {o.pickupcustomer && ( +
+ {o.pickupcustomer} +
+ )} + {(o.deliverysuburb || o.deliveryaddress) && ( +
+ {o.deliverysuburb || extractArea(o.deliveryaddress)} +
+ )} + {o.ordernotes && ( +
+ {o.ordernotes} +
+ )} + +
+ + {o.actualkms || o.kms || 0} km + + {o.ordertype && ( + + {o.ordertype} + + )} + + T{o.trip_number || tNum} · S{o.step || idx + 1} + +
+
+ + ); + })}
-
- {displayOrders.map((o, idx) => { - const kitchenKey = (o.kitchen_key || o.pickupcustomer || 'Unknown').toLowerCase().trim(); - const showTransition = prevKitchenKey !== null && kitchenKey !== prevKitchenKey; - prevKitchenKey = kitchenKey; - const isStopActive = focusedStop && focusedStop.orderid === o.orderid; - const isGoingOn = activeOrderId && o.orderid === activeOrderId; - const lat = parseFloat(o.droplat || o.deliverylat); - const lon = parseFloat(o.droplon || o.deliverylong); - const canFocus = Number.isFinite(lat) && Number.isFinite(lon); - const statusStyle = getStatusStyle(o.orderstatus); - const estMeters = calculateEstMeters(focusedRider.id, o); - // In "By time" mode, stops with no actual delivery time - // were sunk to the bottom — dim them so it's obvious - // they're not yet delivered without reading the status. - const isUndeliveredInTimeMode = isTimeMode && !o.deliverytime; - - return ( - - {showTransition && ( -
Switch to {o.pickupcustomer}
- )} -
setFocusedStop(isStopActive ? null : { orderid: o.orderid, lat, lon }) : undefined} - onKeyDown={canFocus ? (e) => { - if (e.key === 'Enter' || e.key === ' ') { - e.preventDefault(); - setFocusedStop(isStopActive ? null : { orderid: o.orderid, lat, lon }); - } - } : undefined} - title={canFocus ? (isStopActive ? 'Click to show full trip' : `Show ${o.deliverycustomer || `order #${o.orderid}`} on map`) : undefined} - > -
-
{o.step || idx + 1}
-
-
Order #{o.orderid}
-
- {(() => { - // Stack the status pill and delivery time vertically on - // the right of the header so the operator sees the order - // outcome and the wall-clock time it landed at a glance. - const actual = formatTimeOnly(o.deliverytime); - const expected = formatTimeOnly(o.expecteddeliverytime); - const isDelivered = FINAL_STATUSES.has(String(o.orderstatus || '').toLowerCase()); - const showEstDrop = !isDelivered && estMeters !== null; - if (!o.orderstatus && !actual && !expected && !showEstDrop) return null; - return ( -
- {o.orderstatus && ( - - {statusStyle.label} - - )} - {(actual || expected) && ( - - {actual || expected} - - )} - {showEstDrop && ( - - {formatMeters(estMeters)} - - )} -
- ); - })()} - {onChangeRider && ( - - )} -
- -
- {o.deliverycustomer || '—'} -
- - {o.pickupcustomer && ( -
- {o.pickupcustomer} -
- )} - {(o.deliverysuburb || o.deliveryaddress) && ( -
- {o.deliverysuburb || extractArea(o.deliveryaddress)} -
- )} - {o.ordernotes && ( -
- {o.ordernotes} -
- )} - -
- - {o.actualkms || o.kms || 0} km - - {o.ordertype && ( - - {o.ordertype} - - )} - - T{o.trip_number || tNum} · S{o.step || idx + 1} - -
-
- - ); - })} -
-
); }); })()}