guide complet d utilisation

2026-04-26 02:40:11 +02:00
parent 1c3f51d67b
commit 9237b8efa2
+282
@@ -0,0 +1,282 @@
# Guide d'utilisation
Ce guide couvre toutes les fonctionnalités de l'extension **Planification** au fur et à mesure de leur découverte naturelle.
## Sommaire
- [Premier lancement](#premier-lancement)
- [La topbar (vue classique)](#la-topbar-vue-classique)
- [Les cartes des techniciens](#les-cartes-des-techniciens)
- [La timeline](#la-timeline)
- [Les popups d'intervention](#les-popups-dintervention)
- [Les deux modes d'affichage](#les-deux-modes-daffichage)
- [Le badge utilisateur (initiales)](#le-badge-utilisateur-initiales)
- [La gestion de session EasyVista](#la-gestion-de-session-easyvista)
- [Les paramètres](#les-paramètres)
- [Cas particuliers](#cas-particuliers)
---
## Premier lancement
À l'ouverture de l'extension, la fenêtre Planification affiche le **planning du jour** des 8 techniciens DGNSI configurés. Si une session EasyVista est ouverte dans un autre onglet, les données arrivent en quelques secondes.
Si aucune session n'est détectée :
- Un message **"Session EasyVista expirée"** apparaît
- Cliquer sur **Ouvrir EasyVista** ouvre l'onglet de connexion
- Une fois connecté, retourner sur l'onglet Planification — la session est détectée automatiquement
Si EasyVista est inaccessible (panne, maintenance) :
- L'extension affiche les **données du cache local** avec une bannière d'avertissement
- Cliquer **Réessayer** une fois EV rétabli
---
## La topbar (vue classique)
De gauche à droite :
| Élément | Rôle |
|---|---|
| **Pastille initiales** (RQ) | Votre user EasyVista. Cliquer ouvre un popup avec accès aux paramètres et au mode d'affichage |
| **Planification** | Titre de l'app |
| **◀ ▶** | Naviguer jour précédent / suivant |
| **Date custom** (📅) | Affiche le jour sélectionné. Cliquer ouvre un sélecteur de date |
| **Auj.** | Revient au jour courant |
| **Synchronisé à HH:MM** | Heure du dernier rafraîchissement |
| **Date + heure courantes** | Centrées dans la topbar |
| **Compteur session** | Apparaît à moins de 5 min restantes EV (avec bouton "Prolonger") |
| **Absence** | Créer une absence pour un ou plusieurs techs |
| **Douchette** | Envoyer le planning sur la douchette des techs |
| **Actualiser** | Re-fetch rapide (pas les fiches déjà connues) |
| **Tout recharger** | Re-fetch complet (planning + fiches) |
| **Vider cache** | Supprime le cache du jour affiché |
| **🌙 / ☀️** | Toggle thème clair / sombre |
---
## Les cartes des techniciens
Chaque technicien a une carte qui contient :
### Header
- **Nom** de la personne
- **Badge** d'absence si applicable :
- 🔴 **Pompier** (rouge) — l'icône reste visible même en vue horizontale
- 🟠 **Maladie / Accident** (indigo)
- 🔵 **Congé / Congés** (cyan, suffixe "s" si plusieurs jours)
### Body
- **Note de statut** : "En pompier du XX au YY", "Absent toute la journée — Maladie/Accident", etc.
- **Timeline horaire** : représentation visuelle des occupations sur la journée (8h-18h par défaut)
- **Stats** : nombre total d'interventions, répartition matin / après-midi
- **Liste des interventions** : référence, heure, lieu, contact, catégorie, statut
- **Séparateur "MATIN" / "APRÈS-MIDI"** pour distinguer visuellement les périodes
### Tri des cartes
Par défaut :
1. Pompiers en premier (ils ont la priorité visuelle)
2. Techs actifs ensuite (ordre alphabétique nom de famille)
3. Absents en dernier
---
## La timeline
La timeline représente la journée du tech sur une barre horizontale entre 8h et 18h (configurable).
### Lecture
- **Segment coloré** : intervention ou réservation, la couleur indique la catégorie (livraison, récup, remplacement, incident, rollout, autre)
- **Bande hachurée grise** : créneau libre
- **Trait vertical à 12h** : sépare matin et après-midi (visible aussi en vue horizontale)
- **Cercle vert ✓** sur un segment : intervention clôturée
- **Outline coloré** : intervention en conflit avec une autre (chevauchement)
### Interactions
- **Survol d'un segment** (vue classique) : petite popup qui suit la souris avec les infos clés
- **Clic simple sur un segment** : grande popup persistante (épinglée) avec tout le détail
- **Double-clic / Ctrl+clic** : ouvre la fiche EasyVista dans un nouvel onglet
- **Clic sur un trou (bande hachurée)** : popup avec la durée libre (utile pour caser une nouvelle intervention)
En **vue horizontale**, le comportement change :
- **Survol** = directement la grande popup (pas de petite popup intermédiaire)
- **Clic** = ouvre la fiche EV (raccourci direct)
---
## Les popups d'intervention
Au survol d'une ligne d'intervention dans la liste, ou d'un segment timeline, un popup détaillé apparaît avec :
| Section | Contenu |
|---|---|
| Référence | `S260424_00042` ou `I260424_00042` |
| Heure | Début → Fin |
| Lieu | Ville + adresse |
| Contact | Nom + téléphone (cliquable) |
| Action | Description complète (chargée à la demande) |
| Catégorie | Badge coloré |
| Statut | "En cours", "Clôturé", "Résolu", etc. |
### Boutons
- **📌 Épingler** : le popup reste ouvert même si on bouge la souris. Permet de comparer plusieurs popups épinglés côte à côte.
- **📌 Copier la référence** : copie la ref (ex: `S260424_00042`) dans le presse-papiers
- **↻ Recharger** : re-fetch les données de cette intervention seule (utile pour voir l'évolution du statut sans re-télécharger toute la journée)
- **Ouvrir** : ouvre la fiche EV dans un nouvel onglet
### Drag-and-drop
Un popup épinglé peut être **déplacé à la souris**. Plusieurs popups peuvent être empilés et organisés à l'écran selon le besoin du moment (par exemple, comparer 3 interventions).
### Désépinglage
- **Clic en dehors** d'un popup épinglé : le ferme proprement
- **Clic 📌** : ré-épingle si désépinglé (mode "soft unpin")
- **Échap** : ferme tous les popups non-épinglés
---
## Les deux modes d'affichage
L'extension propose deux dispositions pour s'adapter au contexte d'usage :
### Vue classique (cards)
- Layout en **grille** : 4 colonnes sur écran 24" (compact mode), 3 colonnes sur écran HD
- Idéale pour avoir le **détail complet** de chaque tech
- Toutes les interventions listées, popups au survol
### Vue horizontale (rangées)
- Chaque tech est sur **une seule ligne** : header + timeline pleine largeur
- Sidebar verticale à gauche (200 px) avec topbar repositionnée
- Idéale pour avoir une **vue d'ensemble** de l'équipe sur un grand écran (planning de la journée d'un coup d'œil)
- Les détails des interventions sont accessibles via **survol direct du segment timeline**
### Comment basculer
1. Clic sur la **pastille des initiales** (en haut à gauche)
2. Cliquer **"Passer en vue Horizontale"** (ou "Classique" selon le mode actuel)
Le mode est **persisté entre les sessions** (localStorage `view_mode`).
---
## Le badge utilisateur (initiales)
La pastille en haut à gauche affiche les **initiales** de l'utilisateur EasyVista connecté, avec une couleur dérivée du nom (chaque user a sa couleur stable).
### Cliquer dessus ouvre un popup contenant :
- **Nom complet** de l'utilisateur
- **Compteur de session** (MM:SS restantes avant expiration EV) avec bouton **🔄 Prolonger**
- **⊞ Vue** : bascule entre les 2 modes d'affichage
- **⚙ Paramètres** : ouvre le panel d'administration
- **"Développé par Quentin Rouiller"** (signature)
### Si la détection user échoue
Une pastille **grise avec "?"** apparaît. Possible si :
- Pas connecté à EasyVista
- EV inaccessible
- Page intermédiaire SSO en cours
L'extension retente automatiquement toutes les 60 secondes (max 10 essais).
---
## La gestion de session EasyVista
EasyVista expire la session après **30 minutes d'inactivité**. L'extension surveille ce timer en arrière-plan pour vous prévenir.
### Affichage du temps restant
- **Visible** dans le compteur de session topbar à partir de **5 min** restantes
- Couleur évoluant : vert → jaune → rouge selon le seuil
- Aussi visible dans le popup user-badge
### Alertes proactives
- **À 5 min** : alerte "glissante" douce en haut à gauche (peut être reportée à plus tard)
- **À 2 min** : alerte urgente bloquante avec bouton **Prolonger**
- **À 0** : popup "Session expirée — reconnectez-vous"
### Prolonger la session
- Bouton **🔄 Prolonger** (popup user-badge ou alerte) : envoie un keep-alive et remet le compteur à 30 min
- Toute action sur EasyVista (visite d'une page, fetch) prolonge automatiquement
### Reconnexion automatique
Si la session expire et que l'utilisateur se reconnecte sur un autre onglet, l'extension détecte la nouvelle session et **reprend automatiquement** sans rien demander.
---
## Les paramètres
Accès via le bouton **⚙ Paramètres** dans le popup user-badge (clic sur les initiales).
Le panel est divisé en 6 sections :
### 1. Apparence
- **Thème** : Auto (selon l'OS) / Clair / Sombre
- **Durée du cache** : combien de jours conserver les anciennes données (défaut 7). Au survol du champ, l'emplacement physique du cache sur le disque s'affiche en infobulle (varie selon Chrome / Firefox + Mac / Windows / Linux)
- **Taille du texte** : slider 5 paliers (70%, 85%, 100%, 110%, 120%) — le zoom s'applique quand on relâche le curseur (pas pendant le drag, pour éviter l'effet yo-yo)
- **Heures de la journée** : plage horaire affichée sur la timeline (défaut 8h - 18h)
### 2. Équipe
Liste des 8 techniciens hardcodés (ID EV + nom). Permet d'exclure temporairement un tech si nécessaire.
### 3. EasyVista
- Liste des origines (`itsma.etat-de-vaud.ch`, `itsma.vd.ch`)
- Group ID
- Configuration des absences récurrentes (ex: Pillonel le vendredi)
### 4. Statuts
Mots-clés pour identifier les tickets clos / résolus / annulés (ex: "Clôturé", "Terminé", "Résolu").
### 5. Diagnostics
- Version de l'extension
- Date courante / Aujourd'hui
- État de la session EV
- Nombre de popups épinglés
- **Logs verbeux (debug)** : toggle pour afficher dans la console (F12) toutes les étapes détaillées (utile pour reporter un bug)
- **Réinitialiser la configuration** : remet tout aux valeurs par défaut
### 6. À propos
Version, auteur, affiliation, licence MIT, lien vers le code source (pour les personnes ayant accès).
---
## Cas particuliers
### Pillonel Olivier — absent le vendredi
Le tech Pillonel Olivier (ID 40944) est configuré comme **absent récurrent tous les vendredis**. Sa carte affiche "Absent le vendredi" avec un badge **cyan** (différent du rouge pompier).
### Tickets fantômes (disparus du planning)
Quand un ticket disparaît entre deux rafraîchissements (clôturé, déplacé, etc.), l'extension affiche son statut final :
- ✓ vert simple : clôturé proprement
- ✓✓ vert double : terminé + déplacé
- pas d'icône : retiré sans trace claire
### Conflits d'horaire
Si un tech a 2 interventions au **même créneau** (chevauchement d'heures), un **outline rouge** apparaît sur les segments timeline concernés et un avertissement ⚠ sur les rows.
### Réservations
Une réservation (créneau bloqué sans intervention concrète) apparaît avec :
- Couleur **orange clair** sur la timeline
- Mention "Créé par : `nom_créateur`" dans le détail
### Absences partielles (demi-journée)
Si un tech est absent **08-12** (matin uniquement), le bloc absence apparaît dans la liste des interventions à sa place chronologique, avec un libellé adapté.
### Mode debug
Activez **Logs verbeux** dans Diagnostics pour voir dans la console (F12) :
- Chaque chargement de date avec timing
- Chaque fetch fiche
- Étapes de bascule de vue
- Tentatives de retry sur fetch user
Format : `[HH:MM:SS.mmm][vX.Y.Z][module/prefix][LEVEL] message {context}`
---
## Raccourcis utiles
| Action | Raccourci |
|---|---|
| Fermer un popup non-épinglé | Échap |
| Ouvrir une fiche EV en arrière-plan | Ctrl + clic sur la référence |
| Ouvrir une fiche EV nouvel onglet | Double-clic sur l'intervention |
| Bascule de vue | Pastille initiales → ⊞ Vue |
| Ouvrir paramètres | Pastille initiales → ⚙ Paramètres |
| Activer le mode debug | Paramètres → Diagnostics → Logs verbeux |