How alvinshofa13/sikopi-order-web works
sikopi is a café self-ordering and cashier/POS application. Customers verify a cashier-issued token, browse the menu, build a cart, submit payment/order details, and reach a confirmation/receipt view; staff manage tokens, orders, menus, settings, and sales reporting. The frontend uses a shared API client and stores, while a FastAPI backend exposes the corresponding API and persists application data. The sampled excerpts establish frontend state/API use and backend startup/auth wiring; other router behavior is represented only at the documented subsystem level, so uncertain endpoint-level links are omitted.
Main entry points: orderStore.js Order state · AdminView.vue POS dashboard · main.py FastAPI application · database.py Database access
Components 22
Customer ordering
- Browse menu
frontend/src/views/MenuView.vue - Cart
frontend/src/views/CartView.vue - Checkout
frontend/src/views/CheckoutView.vue - Order confirmation
frontend/src/views/ConfirmationView.vue - Token verification
frontend/src/components/TokenAuthModal.vue
Cashier administration
- POS dashboard
frontend/src/views/AdminView.vue
Frontend state and services
- Order state
frontend/src/stores/orderStore.js - Admin state
frontend/src/stores/adminStore.js - API client
frontend/src/services/api.js - QRIS generation
frontend/src/utils/qris.js - Sales analytics
frontend/src/utils/salesAnalytics.js - Bluetooth receipts
frontend/src/utils/bluetoothPrinter.js
Backend API and persistence
- FastAPI application
backend/main.py - Authentication routes
backend/routers/auth.py - Menu, order, token, settings APIs
backend/routers - Admin sessions
backend/auth_dep.py - Database access
backend/database.py - Domain models
backend/models.py
Other components
- Customer
- Cashier / admin
- Application database
- Bluetooth printer
Connections 26
- Customer → Token verification: enters identity and token
- Token verification → Order state: verifies session
- Customer → Browse menu: browses
- Browse menu → Order state: reads menu
- Customer → Cart: selects items
- Cart → Order state: updates cart
- Customer → Checkout: submits order
- Checkout → Order state: creates order
- Order state → Order confirmation: provides order details
- Cashier / admin → POS dashboard: manages POS
- POS dashboard → Admin state: uses admin state
- POS dashboard → Order state: manages orders and menu
- POS dashboard → QRIS generation: generates payment QR
- POS dashboard → Sales analytics: derives sales metrics
- POS dashboard → Bluetooth receipts: prints receipts
- Order state → API client: requests application data
- Admin state → API client: requests admin data
- API client → FastAPI application: calls API
- FastAPI application → Authentication routes: dispatches auth routes
- FastAPI application → Menu, order, token, settings APIs: dispatches domain routes
- Authentication routes → Admin sessions: issues or revokes sessions
- Authentication routes → Database access: uses database session
- FastAPI application → Database access: initializes and seeds
- Database access → Domain models: maps domain records
- Database access → Application database: reads and writes
- Bluetooth receipts → Bluetooth printer: writes receipt data