Suivi des devis
Site de suivi des devis par événement : besoins, propositions des fournisseurs (concurrence et versions V1, V2…), étapes à cocher, paiement et mémoire des prix. Chaque ligne prend la couleur de son statut ; quand tout est coché (paiement validé et envoyé, sans stand-by), elle est barrée « Terminé ».
- Page :
public/index.html
- Serveur :
api/ (fonctions Vercel, sans dépendance à installer)
- Données et PDF : Supabase (gratuit)
- Accès : un mot de passe d'équipe, vérifié par le serveur. Chaque navigateur le retient ensuite pendant un an.
Mise en ligne
1. Supabase (5 minutes)
-
Crée un compte sur supabase.com, puis New project. Choisis la région Paris (eu-west-3).
-
Va dans SQL Editor → New query, colle tout le contenu de supabase/setup.sql, puis Run. Recommence avec supabase/migration-2.sql.
-
Va dans Project Settings → API Keys et récupère :
- l'URL du projet (
https://xxxx.supabase.co) ;
- la clé secrète (
sb_secret_…), ou à défaut la clé service_role de l'onglet « Legacy ».
Cette clé donne accès à tout : ne la colle que dans Vercel, nulle part ailleurs.
2. Vercel
- Add New → Project → importe ce dépôt GitHub. Aucun réglage de build n'est à changer.
- Avant de lancer le déploiement, ouvre Environment Variables et ajoute :
| Nom | Valeur |
|---|
APP_PASSWORD | LGS |
SUPABASE_URL | l'URL du projet Supabase |
SUPABASE_SERVICE_KEY | la clé secrète Supabase |
- Deploy. Le site est en ligne à l'adresse donnée par Vercel.
Pour changer le mot de passe plus tard, il suffit de modifier APP_PASSWORD dans Vercel puis de redéployer. Tout le monde devra alors retaper le nouveau mot de passe.
Mises à jour de la base
- 29/10/2026 :
supabase/migration-2.sql (fiches événement, numéros de besoin attribués par la base). À exécuter une fois dans SQL Editor. Sans elle, le site fonctionne mais sans dates, lieu ni notes d'événement.
Les deux parties
- Location Événementielle : les locations, rangées par événement. Étapes : À envoyer → Envoyé → Signé → Payé, puis Paiement (SB = stand-by, Validé, Envoyé).
- Achat DTSE : les achats, rangés par catégorie (Consommables, Outillage…) ou par événement. Étapes : Devis demandé → Commandé → Payé → Livré, puis Paiement (SB, Validé, Envoyé). Livraison : une date et une heure, sans reprise.
- Le type se choisit dans la fenêtre « Nouveau besoin » (réglé par défaut sur la partie ouverte) ; changer le type fait passer le besoin dans l'autre partie.
- Communs aux deux : calendrier (filtre Tout / Locations / Livraisons), mémoire des prix (Tout / Locations / Achats), corbeille, export, sauvegarde.
- Liens directs :
/#locations et /#achats.
Organisation du code
public/index.html : la structure de la pagepublic/styles.css : l'apparence (style tableur, clair et sombre, iPhone)public/app.js : le fonctionnement de la pageapi/ : le serveur (mot de passe, données, fichiers, nettoyage quotidien)tests/ : les tests automatiques
Tests automatiques
Ils tournent tout seuls sur GitHub à chaque mise à jour (onglet Actions du dépôt : ✓ vert = tout va bien).
Ils utilisent un faux Supabase local : aucune donnée réelle n'est touchée.
- Serveur : mot de passe, en-têtes de sécurité, numéros uniques (20 créations simultanées), corbeille, plus de 1 000 lignes, nettoyage à 30 jours, envoi et ouverture de PDF, demandes invalides.
- Navigateur (ordinateur et iPhone) : connexion, cases, création d'un besoin et d'une proposition, saisie protégée, fiches événement, corbeille et annulation, export Excel, clavier (fiches et onglets), dépliage des propositions, calendrier, affichage iPhone.
Pour les lancer sur un ordinateur (Node 22+) : cd tests && npm install && npx playwright install chromium && npm test.
Comment ça marche
- Les changements des autres apparaissent tout seuls, avec un rafraîchissement toutes les 15 secondes.
- Les PDF sont rangés dans un dossier privé de Supabase. Le site ne les ouvre qu'aux personnes connectées.
- Fichiers acceptés : PDF, PNG, JPEG, WebP, jusqu'à 20 Mo.
- Corbeille : un besoin, une proposition ou un événement supprimé y reste 30 jours, puis est effacé avec ses PDF.
- Tâche quotidienne (
/api/daily, 5h17 UTC) : vide la corbeille et garde le projet Supabase actif (le plan gratuit se met en pause après 7 jours sans activité).
- Lire le devis : dans une proposition, après avoir choisi un PDF (ou sur une proposition qui en a déjà un), le bouton « Lire le devis et pré-remplir » remplit « Ce qui est loué », le montant HT, le n° de devis et le fournisseur, et aussi (dans « Plus d'infos du devis ») le TTC, le transport, la remise, le paiement et la validité. Il garde le prix de chaque ligne (cherchable dans la mémoire des prix), propose de mettre les dates de livraison / reprise sur le besoin et reconnaît une nouvelle version d'un devis déjà enregistré (même n° de devis). La lecture se fait dans le navigateur avec pdf.js (
public/vendor/pdfjs, public/devis-reader.js) : rien n'est envoyé ailleurs. Ne marche que sur les PDF qui contiennent du texte (pas sur les scans). Devis d'essai : tests/fixtures.
- Calendrier en PDF : dans l'onglet Calendrier, « Exporter le mois en PDF » crée un PDF A4 paysage du mois affiché (grille + détail), selon le filtre Tout / Locations / Livraisons. Fabriqué dans le navigateur avec jsPDF (
public/vendor/jspdf, public/cal-pdf.js).
- Export : en bas de page, « Exporter pour Excel » (une ligne par proposition) et « Sauvegarde complète » (tout le contenu, en JSON). Pense à faire une sauvegarde de temps en temps.
