Aller au contenu

M-Sites - Mes sites de suivi

Type : vue principale (point d'entrée de l'application). Persona principal : Marie, partagée avec Karim. Samuel bascule rapidement sur M-MultiSite pour sa volumétrie. Parcours couverts : P1 - Déclarer un site de suivi. Stories couvertes : E1.S1 - Saisir un site, E1.S4 - Vue des sites déclarés.

C'est le premier écran que l'utilisateur voit en démarrant l'application. Tous ses sites de suivi déclarés y sont listés sous forme de cartes, avec pour chacun : le n° de carré, le nom convivial, le nombre de points d'écoute, le nombre de passages enregistrés cette saison, et la date du dernier passage importé. Un bouton primary + Nouveau site est toujours visible en haut à droite. Le clic sur une carte ouvre M-Site-detail.

Wireframe principal - utilisateur avec plusieurs sites déclarés

🦇 VigieChiro PR Companion — ☐ ☓ 🏠 Mes sites 📥 Importer une nuit 📊 Vue tabulaire ⚙ Paramètres 👤 Local Mes sites de suivi 3 sites déclarés · 12 passages enregistrés en 2026 + Nouveau site Carré 640380 📍 Étang de la Tuilière (Aix-en-Provence) ✓ Dernier passage : il y a 2 j 3 points d'écoute A1 · B2 · C3 7 passages en 2026 dont 1 à vérifier ⚠ 📥 Importer une nuit ✏ Modifier · 🗑 Supprimer › Carré 752204 📍 ZAC Nord (Marseille) ⏱ Dernier passage : il y a 8 j 2 points d'écoute A1 · B2 3 passages en 2026 tous vérifiés 📥 Importer une nuit ✏ Modifier · 🗑 Supprimer › Carré 013570 📍 Carré de test (sans coordonnées GPS) – Aucun passage 1 point d'écoute A1 0 passages en 2026 jamais utilisé 📥 Importer une nuit ✏ Modifier · 🗑 Supprimer › 💾 Base locale : ~/VigieChiroCompanion/companion.db · ✓ Schéma à jour v0.1.0-SAE2.01

Annotations

  • Carte 1 (Carré 640380) : c'est le site en cours d'utilisation, affiché en surbrillance bleue (.card-hover) car le pointeur de souris le survole. Le badge vert « il y a 2 j » + l'indicateur « 1 à vérifier ⚠ » incitent à enchaîner sur l'import ou la vérification.
  • Carte 2 (Carré 752204) : site secondaire, dernier passage il y a une semaine (badge orange). Pas de passage urgent à traiter.
  • Carte 3 (Carré 013570) : site déclaré mais jamais utilisé. Badge gris neutre. Idéal pour montrer qu'on peut préparer un site avant la première nuit.

Interactions clés

Élément Action
Clic sur la carte Ouvre M-Site-detail avec le site sélectionné
Bouton + Nouveau site (en haut à droite) Ouvre le formulaire de création d'un site (E1.S1)
Bouton 📥 Importer une nuit Ouvre M-Import avec le site et le point pré-sélectionnés (E2.S2)
✏ Modifier Ouvre le formulaire d'édition (mêmes champs que création, valeurs pré-remplies)
🗑 Supprimer Confirmation forte si des passages sont rattachés au site (E1.S2)
Onglet Vue tabulaire (top nav) Bascule vers M-MultiSite (vue multi-sites pour Karim/Samuel)

Variante - état vide (premier lancement)

À la toute première ouverture de l'application, aucun site n'est encore déclaré. Plutôt que d'afficher une vue vide, on guide explicitement l'utilisateur vers la création de son premier site.

🦇 VigieChiro PR Companion — ☐ ☓ 🏠 Mes sites 📥 Importer une nuit 📊 Vue tabulaire ⚙ Paramètres 👤 Local Mes sites de suivi 🌐 Bienvenue ! Commencez par déclarer votre premier site. Un site = un carré Vigie-Chiro (6 chiffres) avec un ou plusieurs points d'écoute. Vous ne pouvez pas importer une nuit tant qu'aucun site n'est déclaré. + Ajouter mon premier site de suivi 💡 Vous n'avez pas encore créé votre site sur Vigie-Chiro ? Le carré et les points doivent d'abord être déclarés sur le portail web vigiechiro.herokuapp.com - récupérez ensuite le n° de carré (6 chiffres) et les codes points (ex. A1, B2) pour les saisir ici. 🔗 https://vigiechiro.herokuapp.com (s'ouvre dans le navigateur) 💾 Base locale : ~/VigieChiroCompanion/companion.db · ✓ Schéma initialisé v0.1.0-SAE2.01

Notes sur l'état vide

  • Le bouton + Ajouter mon premier site est dimensionné explicitement plus grand que le bouton normal pour le marquer comme l'unique action disponible.
  • Le rappel pédagogique dans l'encart jaune est volontaire : Marie (persona débutante) peut ne pas savoir que les sites doivent d'abord être créés sur le portail web. Mieux vaut le dire ici qu'attendre un message d'erreur cryptique.
  • Une fois le premier site créé, la vue bascule immédiatement vers le wireframe principal (une carte présente).

Notes pour l'implémentation

  • Cette vue se base entièrement sur la story E1.S4 pour la logique d'agrégation (compteurs de passages, date du dernier passage).
  • Le survol d'une carte (.card-hover) doit être implémenté via un effet CSS / pseudo-class JavaFX, pas via une carte différente dans le DOM.
  • Les badges colorés de fraîcheur sont calculés à partir de la date du dernier passage :
    • vert .badge-fresh si dernier passage < 7 jours
    • orange .badge-stale si dernier passage entre 7 et 30 jours
    • gris .badge-cold si > 30 jours ou aucun passage
  • Le bouton 📥 Importer une nuit par carte est un raccourci ergonomique pour Karim/Samuel : il pré-sélectionne le site + propose la liste des points dans la modale d'import suivante.