Skip to content

System Overview

Architecture

┌─────────────────────────────────────────────────────────────────────────┐
│                              MERCHANT                                    │
│                         (Backoffice User)                               │
└─────────────────────────────────┬───────────────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────┐
│                           BACKOFFICE                                     │
│                    (Vue 3 Admin Dashboard)                              │
│  ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐       │
│  │  Settings   │ │    Menus    │ │  Marketing  │ │   Devices   │       │
│  │ - Locations │ │ - Items     │ │ - Loyalty   │ │ - Kiosk     │       │
│  │ - Hours     │ │ - Modifiers │ │ - Offers    │ │ - KDS       │       │
│  │ - Payments  │ │ - Categories│ │ - Customers │ │ - Printers  │       │
│  │ - Team      │ │ - Menus     │ │ - Gift Cards│ │ - Profiles  │       │
│  └─────────────┘ └─────────────┘ └─────────────┘ └─────────────┘       │
│  ┌─────────────┐ ┌─────────────┐ ┌─────────────┐                       │
│  │  Channels   │ │ Integrations│ │  Inventory  │                       │
│  │ - Online    │ │ - Deliveroo │ │ - Stock     │                       │
│  │ - In-House  │ │ - Uber Eats │ │ - Alerts    │                       │
│  │ - QR Order  │ │ - Square    │ │             │                       │
│  └─────────────┘ └─────────────┘ └─────────────┘                       │
└─────────────────────────────────┬───────────────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────┐
│                            BACKEND API                                   │
│                         (Laravel PHP)                                    │
│  ┌─────────────────────────────────────────────────────────────────┐   │
│  │                        Core Services                             │   │
│  │  - OrderCapacityService    - MenuService                        │   │
│  │  - LocationService         - PaymentService                     │   │
│  │  - TransactionService      - LoyaltyService                     │   │
│  │  - CustomerService         - IntegrationService                 │   │
│  └─────────────────────────────────────────────────────────────────┘   │
│  ┌─────────────────────────────────────────────────────────────────┐   │
│  │                         Database                                 │   │
│  │                      (MongoDB Atlas)                            │   │
│  └─────────────────────────────────────────────────────────────────┘   │
└────────────┬────────────────────┬────────────────────┬──────────────────┘
             │                    │                    │
             ▼                    ▼                    ▼
┌────────────────────┐ ┌────────────────────┐ ┌────────────────────┐
│  ONLINE ORDERING   │ │       KIOSK        │ │        KDS         │
│   (Vue 3 Web)      │ │    (Vue 3 App)     │ │   (Flutter App)    │
│                    │ │                    │ │                    │
│ Customer-facing    │ │ Self-service       │ │ Kitchen display    │
│ ordering website   │ │ ordering terminal  │ │ for order prep     │
└────────────────────┘ └────────────────────┘ └────────────────────┘

Data Flow

1. Configuration Flow (Backoffice → Systems)

Merchant configures in Backoffice


    Backend API saves to MongoDB

         ├──────────────────────────────────────┐
         │                                      │
         ▼                                      ▼
    Online Ordering                          Kiosk
    reads settings                      reads settings
         │                                      │
         ▼                                      ▼
    Customer sees                        Customer sees
    configured options                   configured options

2. Order Flow

Customer places order (Online/Kiosk)


    Backend validates order
    - Check business hours
    - Check capacity limits
    - Check inventory
    - Apply offers/loyalty


    Order created in MongoDB

         ├──────────────────────────────────────┐
         │                                      │
         ▼                                      ▼
    KDS receives order                   Transaction logged
    for preparation                      in Backoffice

Key Concepts

Locations

A merchant can have multiple locations. Each location has:

  • Its own address and contact info
  • Its own business hours
  • Its own menu assignments
  • Its own capacity settings
  • Its own device assignments

Menus contain categories, which contain items. A menu can be:

  • Assigned to specific locations
  • Scheduled for specific times (lunch menu, dinner menu)
  • Used for specific channels (online, kiosk, in-house)

Channels

Different ways customers can order:

  • Online Ordering: Web-based ordering for pickup/delivery
  • Kiosk: Self-service terminals in-store
  • In-House/QR: Table ordering via QR code
  • Third-party: Deliveroo, Uber Eats, etc.

Capacity Management

Controls how many orders/items can be processed:

  • Per time slot (e.g., 15-minute windows)
  • Per category (e.g., max 5 pizzas per slot)
  • With time-specific rules (e.g., reduced capacity during lunch rush)

Emily's Role

Emily is the merchant assistant. She helps merchants by:

  1. Explaining how features work
  2. Guiding through configuration steps
  3. Troubleshooting issues
  4. Answering questions about any field or setting

Emily needs to understand:

  • What each field does
  • How fields relate to each other
  • How backoffice settings affect customer-facing systems
  • Common problems and solutions