M Marsad ← saadm.dev
Demo · Last-mile fleet ops

Dispatch the city, on one screen.

A live dispatcher console for a Dubai last-mile courier — 16 drivers, 12 vans + 4 bikes, 96 in-flight orders across 6 zones. Vehicle pins tick on a live map, the alarm queue surfaces SLA breaches before they happen, and the AI copilot explains delays, reroutes drivers, and batch-assigns the pending queue.

Al Quoz Industrial 4 hub · Marina, JLT, Downtown, Business Bay, Deira, Sharjah Al Nahda · live tick every 4s
🛰
96 orders · 14 drivers on route
Pending12
In flight52
Delivered today28
SLA breaches2 ⚠
✦ AI: Both breaches in Sharjah Al Nahda · same driver · fuel at 18%. Reassign one to Karim Khan (idle at hub).

What's inside

Not a static dashboard — a working dispatcher with a real-time simulator behind it.

🗺

Live Leaflet map

Real Dubai coordinates · vehicles tick every 4 seconds · hub + zones + delivery pins coloured by status. Click any vehicle/order/driver to focus the map.

📦

Order queue + SLA tracking

Pending / assigned / in-transit / breach. Per-zone SLAs (Marina 90 min · Sharjah 150 min). Audio chime on breach.

🚐

Driver + vehicle live state

16 drivers across 3 shifts · 12 vans + 4 bikes · live speed, fuel, last-ping. Click → focus on the map.

AI dispatcher copilot

Explain delay · Suggest reroute · Batch-assign pending · Dispatcher chat. Live Claude when a Worker is configured; deterministic mock otherwise.

📱

Driver-side view

Simplified mobile-shaped UI for the driver: current job, route, COD pill, complete / handover buttons, today's earnings.

9-section admin SPA

Dashboard · Orders · Drivers · Vehicles · Zones · Integrations · AI Console · Settings · Audit log.

Two-minute walkthrough

  1. Open the dispatcher console. Map loads with vehicles + orders + hub.
  2. Within ~10 seconds you'll see vehicle pins move. Within ~60 seconds a delivery completes (pin flips green) — chime plays.
  3. Click ⚠ on the filter chip row to filter to SLA breaches. Click the ✦ button on any order → AI explains the delay and proposes a next action.
  4. Click ✦ AI batch-assign top right → AI proposes assignments for the pending queue.
  5. Click the chat icon → conversational dispatcher copilot grounded in the live state. Try "any breaches?", "who has spare capacity?", "fuel below 25%?"
  6. Open driver.html to see the same world from a driver's POV — switch drivers via the top-right picker.
  7. Open admin.html to browse the SPA — dashboard, orders, drivers, vehicles, zones, integrations, AI console, settings, audit.