Files

5.1 KiB

Backoffice Preventivi — Krèios

Backend + backoffice collegato al configuratore 3D. Riceve i prodotti configurati, li accumula in un preventivo (carrello lato server con token), alla conferma raccoglie i dati del cliente, genera un PDF riassuntivo e invia le email a cliente e amministratore.

Componenti

  • Laravel 13 + Filament 3 (questa cartella): API pubblica del carrello (/api/carrello/*) e pannello admin (/admin).
  • App cliente Vue 3 (cliente/): riepilogo carrello + form contatti + conferma (nessun iframe).
  • Configuratore (../src): la modifica in src/js/starter.js sostituisce il vecchio postMessage con una chiamata diretta all'API e mostra un pulsante "Vai al preventivo".

Flusso

  1. L'utente configura un prodotto nel configuratore e clicca "Aggiungi al preventivo".
  2. starter.js invia POST /api/carrello/aggiungi (con sistema, type, dimensioni, prezzo, payload, screenshot PNG). Il backend crea/aggiorna un preventivo (stato bozza) identificato da un token salvato in localStorage.
  3. Il pulsante "Vai al preventivo" apre l'app cliente passando il token: …/?token=XXX.
  4. L'app cliente mostra il carrello, l'utente compila i dati e conferma → POST /api/carrello/{token}/conferma.
  5. Il backend crea il cliente, imposta lo stato a inviato, genera il PDF e invia le email (cliente con PDF allegato + notifica admin). Il preventivo è visibile nel backoffice.

Setup

# 1. Backend Laravel (da questa cartella)
composer install
# .env già configurato: MySQL 127.0.0.1 / root / (no password) / DB kreios_preventivi
php artisan migrate --seed        # crea le tabelle + utente admin
php artisan storage:link
php artisan serve --port=8000     # API + admin su http://localhost:8000

# 2. App cliente (cartella cliente/)
cd cliente
pnpm install
pnpm dev                          # http://localhost:5199

# 3. Configuratore (root del repo)
cd ..
pnpm dev                          # http://localhost:5173

Le tre porte (8000 / 5199 / 5173) sono fisse (strictPort: true nei rispettivi vite.config.js): se una è già occupata l'avvio fallisce con un errore esplicito invece di spostarsi silenziosamente su un'altra porta — evita che il configuratore e l'app cliente finiscano per caso sulla stessa porta (successo in passato, dato che entrambi avevano 5174 come default).

Credenziali admin (seed di default)

Email in sviluppo

MAIL_MAILER=log: le email finiscono in storage/logs/laravel.log (incluso il PDF allegato in base64). In produzione configurare SMTP nel .env.

Configurazione (.env Laravel)

Variabile Descrizione
DB_* MySQL: 127.0.0.1, root, no password, kreios_preventivi
ADMIN_NOTIFY_EMAIL Email che riceve la notifica di nuovo preventivo
APP_FRONTEND_CLIENTE_URL URL dell'app cliente (per i link)
CORS_ALLOWED_ORIGINS Origini autorizzate all'API (default * in dev)

Configuratore (../src/js/starter.js)

PREVENTIVI_API_BASE è l'unico indirizzo che il configuratore deve conoscere a priori (default http://localhost:8000/api, sovrascrivibile con window.PREVENTIVI_API_BASE prima del bundle). L'URL dell'app cliente non è hardcoded: all'avvio il configuratore chiama GET /api/config e usa il frontend_cliente_url restituito da Laravel (letto da APP_FRONTEND_CLIENTE_URL nel .env) — così non c'è da tenere sincronizzati due URL se la porta Vite dell'app cliente cambia (es. per conflitto con altre porte occupate). window.APP_CLIENTE_URL resta come fallback locale se il backend non è raggiungibile.

App cliente (cliente/.env)

VITE_API_BASE — URL base dell'API Laravel (default http://localhost:8000/api).

Modello dati

  • clienti — anagrafica cliente.
  • preventivi — un preventivo/carrello: token, numero, stato (bozzainviatoin_lavorazionechiuso), totale (IVA inclusa), pdf_path.
  • preventivo_items — righe: sistema, type, nome_modello, dimensioni, quantita, prezzi, payload (JSON della configurazione), immagine_path (screenshot decodificato).

Il payload del configuratore mescola stringhe e oggetti listino: App\Support\ConfigurazioneFormatter lo normalizza in righe {label, value} con etichette italiane, usato sia dal PDF che dal backoffice.

Branding

Palette allineata al configuratore Krèios (../src/assets/style.css): teal #12373C (primario) e oro #ffd700 (call-to-action). Il logo (../src/assets/img/kreios.jpg) è copiato in public/images/kreios-logo.jpg (Laravel/Filament/PDF/email) e in cliente/public/kreios-logo.jpg (app cliente Vue).

API

Metodo Endpoint Descrizione
GET /api/config Configurazione pubblica (URL corrente dell'app cliente)
POST /api/carrello/aggiungi Aggiunge un prodotto (crea il carrello se manca il token)
GET /api/carrello/{token} Ritorna il carrello (solo stato bozza)
DELETE /api/carrello/{token}/item/{id} Rimuove una riga
POST /api/carrello/{token}/conferma Finalizza: cliente + PDF + email