# PANZAÏ — Démo plateforme de commande

Démo fonctionnelle réalisée par **KNRWebsite** pour PANZAÏ — Jungle Street Food (Thonon-les-Bains).

- **Site client** (`/`) : accueil, carte, personnalisation des plats, panier, paiement (simulé), suivi de commande en direct.
- **Dashboard gérant** (`/admin`) : commandes en temps réel (kanban + son), gestion du menu (prix, ruptures), statistiques, horaires et réglages de livraison.

Le site et le dashboard sont **reliés** : une commande passée sur le téléphone apparaît dans le dashboard en 2 secondes, et le suivi côté client avance quand le gérant clique.

## Lancer la démo

Prérequis : [Node.js](https://nodejs.org) 20 ou plus.

```bash
npm install
npm run dev
```

Puis ouvre :

- Site client : http://localhost:3000
- Dashboard gérant : http://localhost:3000/admin

### Démo sur téléphone + tablette (recommandé pour le rendez-vous)

`npm run dev` écoute sur le réseau local. Le terminal affiche une adresse du type `http://192.168.1.42:3000`.
Avec le Mac, le téléphone et la tablette sur **le même Wi-Fi** :

- sur le **téléphone** : `http://<IP-du-Mac>:3000` → passer une commande ;
- sur la **tablette** (ou le Mac) : `http://<IP-du-Mac>:3000/admin` → cliquer sur **Activer le son**, puis accepter la commande.

### Version optimisée (plus rapide)

```bash
npm run build
npm start
```

## Scénario de démo conseillé (2 minutes)

1. Montrer l'accueil sur le téléphone (hero, toucan, best-sellers, bouton Commander toujours visible).
2. Ajouter un Crousty XL (sauce chili thaï) + un Pad Thaï, aller au panier, choisir Livraison, payer.
3. Sur la tablette : la commande arrive avec un son et pulse → **Accepter 20 min**.
4. Sur le téléphone : le suivi passe à « Ça chauffe au wok 🔥 ».
5. Tablette : **Marquer prête** → **Remise au livreur**. Le suivi client suit.
6. Dans **Menu** : mettre le Pad Thaï en **Rupture** → il est grisé sur le site client (≈10 s).
7. Dans **Statistiques** : montrer la commission économisée vs Uber Eats.
8. Dans **Horaires & réglages** : interrupteur « Commandes en pause » visible côté client.

Bouton **Remettre la démo à zéro** en bas de « Horaires & réglages ».

## Ce qui est simulé dans cette démo

| Élément | Démo | Production |
|---|---|---|
| Base de données | en mémoire (remise à zéro au redémarrage) | Supabase / Postgres |
| Paiement | simulé (1,4 s) | Stripe (carte, Apple Pay, Google Pay) |
| Temps réel | rafraîchissement toutes les 2 s | Supabase Realtime |
| Connexion gérant | aucune | compte sécurisé |
| SMS client | texte seulement | Brevo / Twilio |
| Avis Google, carte Maps | emplacements | API Google |
| Historique stats | chiffres de démo + jour en direct | calculé depuis la base |
| Logo | toucan provisoire | logo officiel PANZAÏ |

À compléter avec le restaurant : prix du Veggie, boissons, desserts, suppléments, horaires, zone et frais de livraison, photos HD.

## Structure

```
pages/            index, menu, panier, commande/[id], admin/*
components/       header, footer, cartes plats, fenêtre de personnalisation…
composables/      panier, données du resto, actions du dashboard
server/api/       API (menu, commandes, réglages)
server/utils/     store.ts — données de démo (carte, commandes, horaires)
assets/main.css   design system (couleurs, typo, boutons)
public/img/       photos des plats
```

Stack : Nuxt 3 (Vue 3), sans dépendance externe. Polices : Shojumaru (titres) et Manrope (texte) via Google Fonts.