The seatmap is powered by React-Konva for canvas rendering. Admins design the floor in the editor; staff see live status in the POS.
- —Drag-and-drop visual editor with grid snapping
- —Real-time occupancy from sessions and queue tickets
- —Decorative floor elements (walls, plants, bars, doors)
Tables support full CRUD with these properties:
Table properties
- —Name (unique per tenant), capacity, zone
- —Shape: rectangle, circle, or square with rotation
- —Status: available, occupied, reserved, cleaning
The editor allows admins to place and resize tables, add decorative floor elements, and organize everything by zone.
Editor features
- —Drag-and-drop table placement
- —Grid snapping for precise alignment
- —Zoom controls and fit-to-view
- —Zone coloring with auto-palette
Decorative elements give context to your floor plan. Each element type has its own color and can be labeled:
- —Wall — structural boundaries
- —Plant, Bar, Kitchen — functional zones
- —Door, Window — entry points and openings
Floor elements are rendered in both the admin editor and the POS cashier seatmap view.
Each floor has independent dimensions, an optional background image, and its own set of tables and elements. Floor tabs let staff switch between levels quickly.
- —Per-floor dimensions and background image
- —Floor tab navigation in both editor and POS
Session lifecycle
- —Per-seat occupancy tracking (lazy-initialized seat records)
- —Session QR for in-seat ordering
- —Session close releases seats, marks queue ticket complete, frees table
- —POS table detail dialog groups orders by session