From b871578ccca402c88b8b207ea53f45124b06f2b6 Mon Sep 17 00:00:00 2001 From: gilles Date: Sat, 21 Feb 2026 20:51:46 +0100 Subject: [PATCH] docs: ajout du design document webapp jardin MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Architecture validée : FastAPI + Vue 3 + SQLite + Docker Compose + Tailwind CSS (thème Gruvbox Dark). Co-Authored-By: Claude Sonnet 4.6 --- docs/plans/2026-02-21-jardin-webapp-design.md | 137 ++++++++++++++++++ 1 file changed, 137 insertions(+) create mode 100644 docs/plans/2026-02-21-jardin-webapp-design.md diff --git a/docs/plans/2026-02-21-jardin-webapp-design.md b/docs/plans/2026-02-21-jardin-webapp-design.md new file mode 100644 index 0000000..33de815 --- /dev/null +++ b/docs/plans/2026-02-21-jardin-webapp-design.md @@ -0,0 +1,137 @@ +# Design — Webapp Gestion Jardin + +**Date :** 2026-02-21 +**Stack :** FastAPI + Vue 3 + SQLite + Docker Compose + Tailwind CSS +**Langue :** Français +**Thème :** Gruvbox Dark Seventies + +--- + +## Architecture globale + +Monorepo avec deux services distincts orchestrés par Docker Compose : +- `backend/` : API FastAPI (Python), SQLite, gestion des uploads +- `frontend/` : SPA Vue 3/Vite, servie par Nginx en production +- `data/` : volume persistant (SQLite + images uploadées) + +``` +jardin/ +├── backend/ +│ ├── app/ +│ │ ├── main.py +│ │ ├── database.py +│ │ ├── models/ +│ │ └── routers/ +│ ├── tests/ +│ ├── seed.py +│ ├── requirements.txt +│ └── Dockerfile +├── frontend/ +│ ├── src/ +│ │ ├── views/ +│ │ ├── components/ +│ │ ├── router/ +│ │ ├── stores/ +│ │ └── api/ +│ ├── tailwind.config.js +│ ├── package.json +│ └── Dockerfile +├── data/ +├── docker-compose.yml +└── README.md +``` + +--- + +## Backend FastAPI + +### Modèles SQLModel + +| Fichier | Tables | +|---|---| +| `models/garden.py` | `Garden`, `GardenCell`, `GardenImage`, `Measurement` | +| `models/plant.py` | `PlantVariety`, `PlantImage` | +| `models/planting.py` | `Planting`, `PlantingEvent` | +| `models/task.py` | `Task` | +| `models/settings.py` | `UserSettings`, `LunarCalendarEntry` | + +### Routers API (préfixe `/api`) + +| Router | Endpoints | +|---|---| +| `gardens.py` | CRUD `/gardens`, `/gardens/{id}/cells`, `/gardens/{id}/measurements` | +| `varieties.py` | CRUD `/varieties` | +| `plantings.py` | CRUD `/plantings`, `/plantings/{id}/events` | +| `tasks.py` | CRUD `/tasks` | +| `settings.py` | GET/PUT `/settings`, GET `/lunar?month=YYYY-MM` | +| `media.py` | POST `/upload`, DELETE `/upload/{filename}` | + +### Choix techniques + +- SQLModel synchrone (pas d'async DB, compatible SQLite sans friction) +- `lifespan` FastAPI : création des tables au démarrage, seed si DB vide +- CORS ouvert (`*`) configurable via `.env` +- Validation Pydantic native via SQLModel +- Sans authentification pour le MVP (module prévu, non implémenté) + +--- + +## Frontend Vue 3 + +### Stack + +Vue 3 + Vite + TypeScript + Pinia + Vue Router + Tailwind CSS + +### Routes + +| Route | Vue | Rôle | +|---|---|---| +| `/` | `DashboardView` | Tâches du jour, mesures récentes, plantations actives | +| `/jardins` | `JardinsView` | Liste des jardins + création | +| `/jardins/:id` | `JardinDetailView` | Fiche jardin + grille 2D | +| `/varietes` | `VarietesView` | Catalogue des variétés | +| `/plantations` | `PlantationsView` | Liste filtrable des plantations | +| `/planning` | `PlanningView` | Calendrier mois/semaine | +| `/taches` | `TachesView` | Liste / Kanban des tâches | +| `/lunaire` | `LunaireView` | Calendrier lunaire | +| `/reglages` | `ReglagesView` | Paramètres, export/import | + +### Layout + +- `AppHeader.vue` — navigation fixe, liens actifs, icônes +- `AppDrawer.vue` — menu burger slide-in sur mobile +- Toutes les vues dans le layout principal `App.vue` + +### Thème Tailwind Gruvbox + +```js +// tailwind.config.js +colors: { + bg: '#282828', + 'bg-soft': '#3c3836', + text: '#ebdbb2', + 'text-muted': '#a89984', + green: '#b8bb26', + yellow: '#fabd2f', + blue: '#83a598', + orange: '#fe8019', + red: '#fb4934', +} +``` + +### Stores Pinia + +Un store par domaine (`useGardensStore`, `useVarietesStore`, `usePlantationsStore`, `useTasksStore`). +Les appels API sont centralisés dans `src/api/` (un fichier par ressource). + +--- + +## Périmètre de la session + +Livrable : scaffold complet + étape 1 fonctionnelle + +- [x] `docker-compose.yml` + Dockerfiles +- [x] Backend FastAPI : structure + modèles + CRUD complet (jardins, variétés, plantations, tâches) +- [x] Seed de démo (1 jardin, variétés, plantations, tâches) +- [x] Frontend Vue 3 : structure + navigation + pages (squelettes avec appels API réels) +- [x] README d'installation