← Back to Home

Step‑by‑Step Tutorial

Learn how customers, riders, and vendors use TabOrder — from USSD shopping to delivery proof and vendor analytics.

1

Vendor: Access Dashboard

Open the vendor portal and manage orders, riders, and earnings.

GET /portal → serves build/index.html
  • Live orders table with OTP status
  • Delivery Proof thumbnails via media proxy
  • Earnings and commission breakdown
GET /api/vendor/products POST /api/vendor/products PUT /api/vendor/products/<product_id> GET /api/ussd/code?vendor=2025&code=25 POST /api/ussd/bundles
  • Inventory loads on dashboard init via GET /api/vendor/products to populate the list.
  • Adding a product sends POST /api/vendor/products; the response ID is appended locally and the list re-renders.
  • Editing a product uses PUT /api/vendor/products/<product_id> and updates the item in-place without a full reload.
  • When the Inventory tab is active, successful loads trigger a UI refresh to reflect current products.
  • If no products are returned, the UI prompts the vendor to add their first product.
  • Low-stock alerts are derived from quantity vs min_stock_alert per product.
OTP (Delivery Proof) via Modal/Table
  • On order confirmation (from USSD checkout or dashboard actions), the backend generates a 6‑digit OTP and timestamps it.
  • The Delivery Proof UI loads current OTPs and POD info: GET /api/delivery-proof/feed.
  • TTL/attempt limits for display come from: GET /api/config (e.g., OTP_TTL_MINUTES, OTP_MAX_ATTEMPTS).
  • Verify from the modal/table: POST /api/delivery/verify-otp {"order_number":"TO-...","otp":"123456"}.
  • Resend a new OTP from the modal/table: POST /api/delivery/resend-otp {"order_number":"TO-..."}.
  • After resend, the UI refreshes the feed to show the latest OTP and TTL countdown.
  • POD thumbnails shown in the modal/table are proxied for auth safety: GET /api/media/proxy?url=....
GET /api/delivery-proof/feed GET /api/config POST /api/delivery/verify-otp POST /api/delivery/resend-otp GET /api/media/proxy?url=...
2

Customer: Start USSD

Dial the network code sequence with your vendor prefix and bundle suffix, then press Call.

Pattern: *Network*CPaaS*Platform*Vendor*Product#

Example: *120*2477*77*2025*25# where 2025 is the vendor prefix and 25 is the bundle code. The backend parses prefix/suffix from the dialed string; country code is not used for routing when a suffix is present.

POST /ussd Content-Type: application/x-www-form-urlencoded sessionId=abc123 phoneNumber=+27123456789 text=*120*2477*77*2025*25#
  • Main menu → Browse combos
  • Add items to cart → Confirm → Choose payment method
  • Receive invoice via WhatsApp/SMS
3

Rider: Delivery Proof

At handover, ask for OTP and upload POD photos on WhatsApp by replying with order number.

POST /api/delivery/verify-otp • GET /api/media/proxy?url=...
  • OTP TTL and attempt limits enforced
  • POD photos auto‑linked to the last referenced order
  • Success updates dashboard status
4

Admin/Vendor: Analytics

View dashboard stats and ledgers with resilient DB/file fallbacks.

GET /api/dashboard/stats • GET /api/earnings/aggregated
  • Handles DB errors with file‑backed fallback
  • Commission vault and rider payouts visible

Key API Endpoints

AreaEndpointDescription
USSDPOST /ussdSuffix‑aware flow — parses vendor prefix and bundle code from text
HealthGET /healthService health & metrics
OTPPOST /api/delivery/verify-otpVerify delivery OTP
MediaGET /api/media/proxyProxy WA/Twilio images to dashboard
OrdersGET /api/ordersList orders
DashboardGET /api/dashboard/statsVendor dashboard stats
Rider Self‑OrderPOST /api/rider/self-orderRider‑initiated orders
Products GET /api/vendor/products
POST /api/vendor/products
PUT /api/vendor/products/<product_id>
DELETE /api/vendor/products/<product_id> 		Manage inventory and combos exposed to USSD; secured via API key

Note: Core APIs (USSD, Orders, Delivery, Products) are prepared for publication on API marketplaces with clear specs, auth, and SLAs.

Need help? Contact us.