MIGRATION VERS GITEA
This commit is contained in:
mathis committed
commit
5f9d991c15
333 files changed
+108514
No files matched your search
Whitespace-only changes.
Whitespace-only changes.
@@ -0,0 +1,115 @@
|
||||
# Page Informations - Documentation des modifications
|
||||
|
||||
## Vue d'ensemble
|
||||
|
||||
La page **Informations** a été entièrement recodée pour afficher correctement tous les contenus des onglets (Info Trafic, Événements, Actualités) en utilisant la structure native des web components `wcs-tabs`.
|
||||
|
||||
## Modifications principales
|
||||
|
||||
### 1. Structure des onglets
|
||||
|
||||
**Avant :**
|
||||
- Utilisation de `headers-only` sur `wcs-tabs`
|
||||
- Gestion manuelle du contenu avec des conditions `{activeTab === 'trafic' && ...}`
|
||||
- Synchronisation complexe de l'état avec des listeners multiples
|
||||
|
||||
**Après :**
|
||||
- Utilisation complète de `wcs-tabs` avec `wcs-tab-panel`
|
||||
- Chaque onglet a son propre `wcs-tab-panel` avec le contenu approprié
|
||||
- Synchronisation simplifiée de l'état de l'onglet actif
|
||||
|
||||
### 2. Structure du code
|
||||
|
||||
```jsx
|
||||
<wcs-tabs
|
||||
selected-index={activeTab === 'trafic' ? 0 : activeTab === 'evenements' ? 1 : 2}
|
||||
onWcsTabChange={(e) => {
|
||||
const idx = e.detail?.selectedIndex;
|
||||
setActiveTab(idx === 0 ? 'trafic' : idx === 1 ? 'evenements' : 'actualites');
|
||||
}}
|
||||
>
|
||||
<wcs-tab header="Info Trafic">
|
||||
<wcs-mat-icon icon="warning" />
|
||||
</wcs-tab>
|
||||
<wcs-tab header="Événements">
|
||||
<wcs-mat-icon icon="event" />
|
||||
</wcs-tab>
|
||||
<wcs-tab header="Actualités">
|
||||
<wcs-mat-icon icon="article" />
|
||||
</wcs-tab>
|
||||
|
||||
{/* Panneau Info Trafic */}
|
||||
<wcs-tab-panel slot="panel">
|
||||
{/* Contenu... */}
|
||||
</wcs-tab-panel>
|
||||
|
||||
{/* Panneau Événements */}
|
||||
<wcs-tab-panel slot="panel">
|
||||
{/* Contenu... */}
|
||||
</wcs-tab-panel>
|
||||
|
||||
{/* Panneau Actualités */}
|
||||
<wcs-tab-panel slot="panel">
|
||||
{/* Contenu... */}
|
||||
</wcs-tab-panel>
|
||||
</wcs-tabs>
|
||||
```
|
||||
|
||||
### 3. Gestion de l'état
|
||||
|
||||
- **État simplifié** : L'état `activeTab` est maintenu pour la cohérence avec les formulaires
|
||||
- **Synchronisation** : L'événement `onWcsTabChange` met à jour l'état React
|
||||
- **Affichage** : Chaque `wcs-tab-panel` contient le contenu correspondant (loading, empty state, ou tableau)
|
||||
|
||||
### 4. Fichier CSS dédié
|
||||
|
||||
Création de `Informations.css` avec :
|
||||
- Styles pour les badges (sévérité, type, catégorie, statut)
|
||||
- Styles pour les formulaires (form-group, form-row, form-checkboxes)
|
||||
- Styles pour les modales (modal-large, modal-small, modal-header, modal-body, modal-footer)
|
||||
- Styles pour les tableaux
|
||||
- États de chargement et vides
|
||||
- Design responsive
|
||||
- Animations
|
||||
|
||||
### 5. Fonctionnalités préservées
|
||||
|
||||
Toutes les fonctionnalités existantes sont préservées :
|
||||
- Création, modification et suppression d'info trafic
|
||||
- Création, modification et suppression d'événements
|
||||
- Création, modification et suppression d'actualités
|
||||
- Filtrage par région
|
||||
- Validation des formulaires
|
||||
- Gestion des états de chargement et d'erreur
|
||||
|
||||
## Avantages de la nouvelle structure
|
||||
|
||||
1. **Meilleure compatibilité** : Utilise correctement la structure native des web components
|
||||
2. **Code plus propre** : Moins de logique conditionnelle pour l'affichage
|
||||
3. **Maintenabilité** : Structure plus claire et plus facile à modifier
|
||||
4. **Performance** : Le web component gère lui-même l'affichage/masquage des panneaux
|
||||
5. **Style cohérent** : CSS dédié pour une meilleure organisation
|
||||
|
||||
## Test de la page
|
||||
|
||||
Pour vérifier que tout fonctionne correctement :
|
||||
|
||||
1. **Onglets** : Cliquer sur chaque onglet (Info Trafic, Événements, Actualités)
|
||||
2. **Affichage** : Vérifier que le contenu de chaque onglet s'affiche correctement
|
||||
3. **Création** : Tester la création d'un nouvel élément dans chaque onglet
|
||||
4. **Modification** : Tester la modification d'un élément existant
|
||||
5. **Suppression** : Tester la suppression d'un élément
|
||||
6. **Responsive** : Vérifier l'affichage sur mobile/tablette
|
||||
|
||||
## Fichiers modifiés
|
||||
|
||||
- `src/pages/informations/Informations.js` : Composant principal recodé
|
||||
- `src/pages/informations/Informations.css` : Nouveau fichier de styles (créé)
|
||||
|
||||
## Notes techniques
|
||||
|
||||
- Les web components WCS (SNCF Design System) sont correctement utilisés
|
||||
- La synchronisation entre React et les web components est gérée via les événements natifs
|
||||
- Les formulaires continuent d'utiliser la synchronisation DOM pour garantir la fiabilité
|
||||
- Le CSS est modularisé et suit les conventions de nommage BEM
|
||||
|
||||
Whitespace-only changes.
@@ -0,0 +1,159 @@
|
||||
# Fonctionnalité de Gestion des Perturbations
|
||||
|
||||
## Vue d'ensemble
|
||||
|
||||
Cette fonctionnalité permet de créer, modifier et supprimer des perturbations affectant les horaires de trains. Elle comprend :
|
||||
|
||||
- Une page principale listant les perturbations groupées par horaire dans un accordion
|
||||
- Une page de création de perturbation en 2 étapes
|
||||
- Une page de modification de perturbation existante
|
||||
- Un aperçu visuel du parcours avec la perturbation appliquée
|
||||
|
||||
## Structure des fichiers
|
||||
|
||||
### Base de données
|
||||
- `supabase_perturbations_tables.sql` : Schéma des tables pour les perturbations
|
||||
- Table `perturbations` : Stocke les perturbations principales
|
||||
- Table `perturbations_modifications_parcours` : Détails des modifications de parcours
|
||||
|
||||
### API
|
||||
- `src/api/perturbations.js` : Fonctions pour interagir avec Supabase
|
||||
- `getAllPerturbations()` : Récupère toutes les perturbations
|
||||
- `getPerturbationsGroupedByHoraire()` : Groupe les perturbations par horaire
|
||||
- `getPerturbationById(id)` : Récupère une perturbation spécifique
|
||||
- `createPerturbation(payload, modificationsParcours)` : Crée une nouvelle perturbation
|
||||
- `updatePerturbation(id, payload, modificationsParcours)` : Met à jour une perturbation
|
||||
- `deletePerturbation(id)` : Supprime une perturbation (soft delete)
|
||||
- `getPerturbationsByHoraire(horaireId)` : Récupère les perturbations d'un horaire
|
||||
|
||||
### Pages
|
||||
- `src/pages/perturbations/Perturbations.js` : Page principale avec la liste des perturbations
|
||||
- `src/pages/perturbations/CreerPerturbation.js` : Page de création en 2 étapes
|
||||
- `src/pages/perturbations/ModifierPerturbation.js` : Page de modification
|
||||
- `src/pages/perturbations/Perturbations.css` : Styles pour toutes les pages
|
||||
|
||||
### Navigation
|
||||
- Ajout de l'item "Perturbations" dans `src/components/nav-panel/NavPanel.js`
|
||||
- Routes ajoutées dans `src/pages/router/PanelRouter.js` :
|
||||
- `/perturbations` : Liste des perturbations
|
||||
- `/perturbations/creer` : Création d'une perturbation
|
||||
- `/perturbations/modifier/:id` : Modification d'une perturbation
|
||||
|
||||
## Types de perturbations
|
||||
|
||||
1. **Retard** : Le train circule avec un retard (en minutes)
|
||||
2. **Suppression** : Le train ne circule pas
|
||||
3. **Modification de parcours** : Le parcours du train est modifié
|
||||
|
||||
## Causes disponibles
|
||||
|
||||
- Incident technique
|
||||
- Accident de personne
|
||||
- Conditions météorologiques
|
||||
- Travaux
|
||||
- Mouvement social
|
||||
- Intervention police
|
||||
- Affluence
|
||||
- Malveillance
|
||||
- Autre
|
||||
|
||||
## Processus de création d'une perturbation
|
||||
|
||||
### Étape 1 : Sélection de l'horaire
|
||||
1. Rechercher un horaire par numéro de train, gare ou ligne
|
||||
2. Sélectionner l'horaire à perturber
|
||||
3. Visualiser les détails de l'horaire
|
||||
4. Cliquer sur "Suivant"
|
||||
|
||||
### Étape 2 : Définition de la perturbation
|
||||
1. Choisir le type de perturbation (retard, suppression, modification)
|
||||
2. Renseigner les détails selon le type :
|
||||
- **Retard** : Durée en minutes
|
||||
- **Suppression/Modification** : Train de substitution (optionnel)
|
||||
3. Indiquer la cause de la perturbation
|
||||
4. Définir la période de validité
|
||||
5. Ajouter des notes internes (optionnel)
|
||||
6. Visualiser l'aperçu du parcours dans le panneau de droite
|
||||
7. Cliquer sur "Créer la perturbation"
|
||||
|
||||
## Fonctionnalités de la page principale
|
||||
|
||||
- **Recherche** : Filtrer les perturbations par numéro de train, gare ou ligne
|
||||
- **Accordion** : Perturbations groupées par horaire
|
||||
- **Actions** :
|
||||
- Modifier une perturbation
|
||||
- Supprimer une perturbation
|
||||
- **Badges de couleur** :
|
||||
- 🟡 Orange : Retard
|
||||
- 🔴 Rouge : Suppression
|
||||
- 🔵 Bleu : Modification de parcours
|
||||
|
||||
## Aperçu du parcours
|
||||
|
||||
L'aperçu du parcours affiche :
|
||||
- Toutes les gares du trajet
|
||||
- Les horaires d'arrivée et de départ
|
||||
- L'application de la perturbation :
|
||||
- Retard : Ajout du retard aux horaires (+XX')
|
||||
- Suppression : Message "Ce train sera supprimé"
|
||||
- Modification : Gares supprimées/ajoutées/modifiées avec badges de couleur
|
||||
|
||||
## Installation de la base de données
|
||||
|
||||
Exécutez le script SQL dans Supabase :
|
||||
|
||||
```bash
|
||||
# Dans le SQL Editor de Supabase
|
||||
supabase_perturbations_tables.sql
|
||||
```
|
||||
|
||||
Ce script créera :
|
||||
- La table `perturbations`
|
||||
- La table `perturbations_modifications_parcours`
|
||||
- Les index pour améliorer les performances
|
||||
- Les triggers pour la mise à jour automatique de `updated_at`
|
||||
|
||||
## Composants WCS SNCF utilisés
|
||||
|
||||
- `wcs-button` : Boutons d'action
|
||||
- `wcs-input` : Champs de saisie
|
||||
- `wcs-select` : Sélecteurs déroulants
|
||||
- `wcs-textarea` : Zones de texte
|
||||
- `wcs-checkbox` : Cases à cocher
|
||||
- `wcs-radio` : Boutons radio
|
||||
- `wcs-badge` : Badges de statut et type
|
||||
- `wcs-accordion` : Accordéon pour grouper les perturbations
|
||||
- `wcs-card` : Cartes pour afficher les détails
|
||||
- `wcs-message` : Messages d'information/erreur
|
||||
- `wcs-spinner` : Indicateurs de chargement
|
||||
- `wcs-mat-icon` : Icônes Material Design
|
||||
|
||||
## Améliorations futures possibles
|
||||
|
||||
1. **Modifications de parcours détaillées** :
|
||||
- Interface pour ajouter/supprimer des gares du parcours
|
||||
- Modification des horaires gare par gare
|
||||
|
||||
2. **Notifications** :
|
||||
- Envoi de notifications aux utilisateurs concernés
|
||||
- Intégration avec un système de messagerie
|
||||
|
||||
3. **Historique** :
|
||||
- Suivi des modifications des perturbations
|
||||
- Archivage des perturbations passées
|
||||
|
||||
4. **Statistiques** :
|
||||
- Tableau de bord des perturbations
|
||||
- Analyses par cause, type, ligne, etc.
|
||||
|
||||
5. **Import/Export** :
|
||||
- Import de perturbations depuis un fichier CSV
|
||||
- Export des perturbations pour reporting
|
||||
|
||||
6. **Récurrence** :
|
||||
- Perturbations récurrentes (ex: travaux tous les week-ends)
|
||||
- Modèles de perturbations réutilisables
|
||||
|
||||
## Support
|
||||
|
||||
Pour toute question ou problème, consultez la documentation du projet ou contactez l'équipe de développement.
|
||||
Whitespace-only changes.
@@ -0,0 +1,197 @@
|
||||
# Fonctionnalité de Gestion des Travaux
|
||||
|
||||
## Vue d'ensemble
|
||||
|
||||
La gestion des travaux permet de créer, modifier et supprimer des travaux planifiés sur les lignes, avec la possibilité de définir des horaires de substitution pour informer les voyageurs des alternatives disponibles.
|
||||
|
||||
## Structure des fichiers
|
||||
|
||||
### Pages
|
||||
- `src/pages/travaux/Travaux.js` : Page principale listant tous les travaux
|
||||
- `src/pages/travaux/CreerTravaux.js` : Page de création de travaux (multi-étapes)
|
||||
- `src/pages/travaux/Travaux.css` : Styles pour les pages travaux
|
||||
|
||||
### API
|
||||
- `src/api/travaux.js` : Fonctions pour interagir avec Supabase
|
||||
- `getAllTravaux()` : Récupère tous les travaux avec leurs substitutions
|
||||
- `getTravauxById(id)` : Récupère un travail spécifique
|
||||
- `createTravaux(payload, substitutions)` : Crée de nouveaux travaux
|
||||
- `updateTravaux(id, payload, substitutions)` : Met à jour des travaux
|
||||
- `deleteTravaux(id)` : Supprime des travaux (soft delete)
|
||||
- `getHorairesSubstitution(searchQuery)` : Récupère les horaires disponibles pour substitution
|
||||
- `getTravauxActifs(dateDebut, dateFin)` : Récupère les travaux actifs pour une période
|
||||
|
||||
### Base de données
|
||||
- `migrations/create_travaux_tables.sql` : Script de création des tables
|
||||
- Table `travaux` : Informations principales des travaux
|
||||
- Table `travaux_substitutions` : Liaison avec les horaires de substitution
|
||||
|
||||
## Structure de la base de données
|
||||
|
||||
### Table `travaux`
|
||||
|
||||
| Colonne | Type | Description |
|
||||
|---------|------|-------------|
|
||||
| id | UUID | Identifiant unique |
|
||||
| titre | TEXT | Titre des travaux (requis) |
|
||||
| description | TEXT | Description détaillée |
|
||||
| date_debut | DATE | Date de début (requis) |
|
||||
| date_fin | DATE | Date de fin (requis) |
|
||||
| jours_travaux | TEXT[] | Jours de la semaine concernés |
|
||||
| heure_debut | TIME | Heure de début (requis) |
|
||||
| heure_fin | TIME | Heure de fin (requis) |
|
||||
| actif | BOOLEAN | Statut actif/inactif |
|
||||
| created_at | TIMESTAMP | Date de création |
|
||||
| updated_at | TIMESTAMP | Date de dernière modification |
|
||||
|
||||
### Table `travaux_substitutions`
|
||||
|
||||
| Colonne | Type | Description |
|
||||
|---------|------|-------------|
|
||||
| id | UUID | Identifiant unique |
|
||||
| travaux_id | UUID | Référence vers les travaux |
|
||||
| horaire_id | UUID | Référence vers l'horaire de substitution |
|
||||
| ordre | INTEGER | Ordre d'affichage |
|
||||
| created_at | TIMESTAMP | Date de création |
|
||||
|
||||
## Processus de création (multi-étapes)
|
||||
|
||||
### Étape 1 : Informations générales
|
||||
- **Titre** : Nom descriptif des travaux (requis)
|
||||
- **Description** : Description détaillée (optionnel)
|
||||
- **Dates** : Date de début et fin (requises)
|
||||
- **Jours de travaux** : Sélection des jours de la semaine concernés (requis)
|
||||
- **Horaires** : Heure de début et fin des travaux (requis)
|
||||
- **Statut** : Actif/Inactif (par défaut actif)
|
||||
|
||||
### Étape 2 : Substitutions
|
||||
- **Activation** : Case à cocher pour activer les substitutions
|
||||
- **Recherche** : Barre de recherche pour trouver des horaires de substitution
|
||||
- Filtre automatique sur les horaires ayant `substitution_disponible = true`
|
||||
- Recherche par numéro de train, gare de départ/arrivée, ligne
|
||||
- **Sélection** : Ajout/retrait d'horaires dans la liste des substitutions
|
||||
- **Affichage** : Liste des horaires sélectionnés avec possibilité de les retirer
|
||||
|
||||
### Étape 3 : Résumé
|
||||
- Affichage de toutes les informations saisies
|
||||
- Validation avant création
|
||||
- Création en base de données
|
||||
|
||||
## Fonctionnalités
|
||||
|
||||
### Page principale
|
||||
- **Liste des travaux** : Affichage en grille avec cartes
|
||||
- **Recherche** : Filtrage par titre ou description
|
||||
- **Détails** : Chaque carte affiche :
|
||||
- Titre et description
|
||||
- Période (dates)
|
||||
- Jours concernés
|
||||
- Horaires
|
||||
- Nombre de substitutions
|
||||
- Statut (Actif/Inactif)
|
||||
- **Actions** :
|
||||
- Créer de nouveaux travaux
|
||||
- Modifier des travaux existants
|
||||
- Supprimer des travaux
|
||||
|
||||
### Validation
|
||||
|
||||
#### Contraintes base de données
|
||||
- `date_fin >= date_debut`
|
||||
- `heure_fin > heure_debut`
|
||||
- `titre` est requis
|
||||
|
||||
#### Contraintes applicatives
|
||||
- Au moins un jour de travaux doit être sélectionné
|
||||
- Tous les champs requis doivent être remplis
|
||||
- Les dates doivent être cohérentes
|
||||
|
||||
## Intégration
|
||||
|
||||
### Navigation
|
||||
- Entrée "Travaux" ajoutée dans le NavPanel avec l'icône "construction"
|
||||
- Accessible via `/travaux`
|
||||
- Page de création accessible via `/travaux/creer`
|
||||
|
||||
### Routes
|
||||
Ajoutées dans `PanelRouter.js` :
|
||||
- `/travaux` : Liste des travaux
|
||||
- `/travaux/creer` : Création de travaux
|
||||
|
||||
### Style
|
||||
- Cohérent avec le reste de l'application
|
||||
- Utilisation des composants WCS (Web Components Système)
|
||||
- Animations et transitions fluides
|
||||
- Responsive design
|
||||
|
||||
## Exemples d'utilisation
|
||||
|
||||
### Créer des travaux
|
||||
|
||||
```javascript
|
||||
import { createTravaux } from '../../api/travaux';
|
||||
|
||||
const payload = {
|
||||
titre: 'Travaux ligne Paris-Lyon',
|
||||
description: 'Rénovation des voies',
|
||||
date_debut: '2026-03-01',
|
||||
date_fin: '2026-03-31',
|
||||
jours_travaux: ['lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi'],
|
||||
heure_debut: '09:00',
|
||||
heure_fin: '17:00',
|
||||
actif: true
|
||||
};
|
||||
|
||||
const substitutions = ['uuid-horaire-1', 'uuid-horaire-2'];
|
||||
|
||||
const { data, error } = await createTravaux(payload, substitutions);
|
||||
```
|
||||
|
||||
### Récupérer les travaux actifs
|
||||
|
||||
```javascript
|
||||
import { getTravauxActifs } from '../../api/travaux';
|
||||
|
||||
const { data, error } = await getTravauxActifs('2026-03-01', '2026-03-31');
|
||||
```
|
||||
|
||||
### Rechercher des horaires de substitution
|
||||
|
||||
```javascript
|
||||
import { getHorairesSubstitution } from '../../api/travaux';
|
||||
|
||||
const { data, error } = await getHorairesSubstitution('TGV');
|
||||
```
|
||||
|
||||
## Migration
|
||||
|
||||
Pour créer les tables en base de données :
|
||||
|
||||
```sql
|
||||
-- Exécuter le fichier migrations/create_travaux_tables.sql
|
||||
psql -U postgres -d nom_base -f migrations/create_travaux_tables.sql
|
||||
```
|
||||
|
||||
Ou via Supabase Dashboard :
|
||||
1. Ouvrir SQL Editor
|
||||
2. Copier le contenu de `create_travaux_tables.sql`
|
||||
3. Exécuter
|
||||
|
||||
## Améliorations futures possibles
|
||||
|
||||
1. **Page de modification** : Créer `ModifierTravaux.js` similaire à `CreerTravaux.js`
|
||||
2. **Filtres avancés** : Ajouter des filtres par date, statut, etc.
|
||||
3. **Export** : Permettre l'export des travaux en CSV/PDF
|
||||
4. **Notifications** : Système de notifications pour les travaux à venir
|
||||
5. **Récurrence** : Support des travaux récurrents
|
||||
6. **Historique** : Journal des modifications
|
||||
7. **Permissions** : Gestion des droits par utilisateur
|
||||
8. **API publique** : Endpoint pour les applications externes
|
||||
|
||||
## Notes techniques
|
||||
|
||||
- Les substitutions sont ordonnées (`ordre` dans `travaux_substitutions`)
|
||||
- Trigger automatique pour `updated_at`
|
||||
- Index sur les dates et le statut actif pour optimiser les requêtes
|
||||
- Contraintes d'intégrité référentielle avec CASCADE sur les substitutions
|
||||
|
||||
@@ -0,0 +1,131 @@
|
||||
# Gestion des Utilisateurs - Documentation
|
||||
|
||||
## Vue d'ensemble
|
||||
|
||||
Le système de gestion des utilisateurs permet de créer, modifier et supprimer des utilisateurs qui auront accès à l'application admin Ferrovia. Cette fonctionnalité est accessible depuis la page **Paramètres** via l'onglet **Utilisateurs**.
|
||||
|
||||
## Accès
|
||||
|
||||
1. Connectez-vous à l'application admin
|
||||
2. Accédez à la page **Paramètres** via le menu de navigation
|
||||
3. Cliquez sur l'onglet **Utilisateurs**
|
||||
|
||||
## Fonctionnalités
|
||||
|
||||
### 1. Liste des utilisateurs
|
||||
|
||||
La liste des utilisateurs affiche :
|
||||
- **Nom complet** : Nom et prénom de l'utilisateur
|
||||
- **Email** : Adresse email de l'utilisateur
|
||||
- **Rôle** : Badge coloré indiquant le rôle (Administrateur, Gestionnaire, Utilisateur)
|
||||
- **Statut** : Badge indiquant si l'utilisateur est actif ou inactif
|
||||
- **Actions** : Boutons pour modifier ou supprimer l'utilisateur
|
||||
|
||||
#### Rôles disponibles
|
||||
|
||||
- **Administrateur** (rouge) : Accès complet à toutes les fonctionnalités
|
||||
- **Gestionnaire** (bleu) : Accès aux fonctionnalités de gestion
|
||||
- **Utilisateur** (gris) : Accès limité aux fonctionnalités de base
|
||||
|
||||
### 2. Créer un utilisateur
|
||||
|
||||
1. Cliquez sur le bouton **+ Ajouter un utilisateur**
|
||||
2. Remplissez le formulaire :
|
||||
- **Email*** : Adresse email de l'utilisateur (requis, unique)
|
||||
- **Nom*** : Nom de famille (requis)
|
||||
- **Prénom*** : Prénom (requis)
|
||||
- **Rôle** : Sélectionnez le rôle approprié (par défaut : Utilisateur)
|
||||
- **Utilisateur actif** : Cochez pour activer immédiatement l'utilisateur
|
||||
3. Cliquez sur **Créer**
|
||||
|
||||
### 3. Modifier un utilisateur
|
||||
|
||||
1. Dans la liste, cliquez sur le bouton **Modifier** de l'utilisateur
|
||||
2. Modifiez les champs souhaités dans le formulaire
|
||||
3. Cliquez sur **Mettre à jour**
|
||||
|
||||
### 4. Supprimer un utilisateur
|
||||
|
||||
1. Dans la liste, cliquez sur le bouton **Supprimer** de l'utilisateur
|
||||
2. Confirmez la suppression dans la boîte de dialogue
|
||||
|
||||
> **⚠️ Attention** : La suppression d'un utilisateur est définitive et ne peut pas être annulée.
|
||||
|
||||
## Validation
|
||||
|
||||
Le système effectue les validations suivantes :
|
||||
|
||||
- L'email doit être valide et unique dans le système
|
||||
- Le nom et le prénom sont obligatoires
|
||||
- L'email est automatiquement converti en minuscules
|
||||
- Les espaces en début et fin de champs sont automatiquement supprimés
|
||||
|
||||
## Stockage des données
|
||||
|
||||
Toutes les données des utilisateurs sont stockées dans la table `utilisateurs` de la base de données Supabase.
|
||||
|
||||
### Structure de la table
|
||||
|
||||
```sql
|
||||
CREATE TABLE utilisateurs (
|
||||
id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
|
||||
email VARCHAR(255) NOT NULL UNIQUE,
|
||||
nom VARCHAR(100) NOT NULL,
|
||||
prenom VARCHAR(100) NOT NULL,
|
||||
role VARCHAR(50) NOT NULL DEFAULT 'utilisateur',
|
||||
actif BOOLEAN NOT NULL DEFAULT true,
|
||||
created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
|
||||
updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()
|
||||
);
|
||||
```
|
||||
|
||||
## Installation de la table
|
||||
|
||||
Pour créer la table dans votre base de données Supabase :
|
||||
|
||||
1. Accédez à votre dashboard Supabase
|
||||
2. Allez dans **SQL Editor**
|
||||
3. Exécutez le script `supabase_utilisateurs.sql` fourni à la racine du projet
|
||||
4. Vérifiez que la table a été créée avec succès
|
||||
|
||||
## API
|
||||
|
||||
Les fonctions API sont disponibles dans `src/api/utilisateurs/index.js` :
|
||||
|
||||
- `getAllUtilisateurs()` : Récupère tous les utilisateurs
|
||||
- `createUtilisateur(userData)` : Crée un nouvel utilisateur
|
||||
- `updateUtilisateur(id, userData)` : Met à jour un utilisateur existant
|
||||
- `deleteUtilisateur(id)` : Supprime un utilisateur
|
||||
|
||||
Toutes les fonctions retournent un objet `{ data, error }` :
|
||||
- En cas de succès : `{ data: {...}, error: null }`
|
||||
- En cas d'erreur : `{ data: null, error: {...} }`
|
||||
|
||||
## Bonnes pratiques
|
||||
|
||||
1. **Emails uniques** : Chaque utilisateur doit avoir une adresse email unique
|
||||
2. **Rôles appropriés** : Assignez les rôles en fonction des responsabilités réelles
|
||||
3. **Désactivation vs Suppression** : Préférez désactiver un utilisateur plutôt que le supprimer pour conserver l'historique
|
||||
4. **Vérification régulière** : Vérifiez régulièrement la liste des utilisateurs actifs
|
||||
|
||||
## Dépannage
|
||||
|
||||
### L'onglet Utilisateurs n'apparaît pas
|
||||
- Vérifiez que vous avez bien les dernières modifications du code
|
||||
- Assurez-vous que la page Paramètres est correctement chargée
|
||||
|
||||
### Erreur lors de la création d'un utilisateur
|
||||
- Vérifiez que l'email n'est pas déjà utilisé
|
||||
- Assurez-vous que tous les champs obligatoires sont remplis
|
||||
- Vérifiez la connexion à Supabase
|
||||
|
||||
### La table utilisateurs n'existe pas
|
||||
- Exécutez le script SQL `supabase_utilisateurs.sql` dans votre base de données Supabase
|
||||
- Vérifiez les permissions de votre clé API Supabase
|
||||
|
||||
## Support
|
||||
|
||||
Pour toute question ou problème, consultez :
|
||||
- La documentation de Supabase : https://supabase.com/docs
|
||||
- Les logs de la console du navigateur pour plus de détails sur les erreurs
|
||||
|
||||
Reference in new issue
Block a user