118 lines
3.9 KiB
Markdown
118 lines
3.9 KiB
Markdown
# Composants Admin
|
|
|
|
Cette section contient tous les composants liés à l'administration de l'application.
|
|
|
|
## Structure des dossiers
|
|
|
|
### 📁 `overview/`
|
|
|
|
Composants pour la vue d'ensemble de l'administration :
|
|
|
|
- **`AdminClientWrapper`** : Wrapper principal pour la vue d'ensemble
|
|
- **`AdminContentTabs`** : Onglets "Vue par Direction" et "Vue par Équipe"
|
|
- **`AdminOverviewCards`** : Cartes de statistiques générales
|
|
- **`DirectionOverview`** : Vue détaillée par direction
|
|
|
|
### 📁 `layout/`
|
|
|
|
Composants de layout et navigation pour la gestion :
|
|
|
|
- **`ManageAdminClientWrapper`** : Wrapper principal pour les pages de gestion
|
|
- **`ManageContentTabs`** : Onglets "Gestion des Skills" et "Gestion des Teams"
|
|
|
|
### 📁 `management/`
|
|
|
|
Composants pour la gestion des entités :
|
|
|
|
#### `management/pages/`
|
|
|
|
Pages de gestion spécifiques :
|
|
|
|
- **`SkillsManagement`** : Gestion des skills avec vue arborescente
|
|
- **`TeamsManagement`** : Gestion des teams avec vue arborescente
|
|
|
|
#### `management/` (composants réutilisables)
|
|
|
|
Composants génériques pour la vue arborescente :
|
|
|
|
- **`TreeViewContainer`** : Conteneur principal avec états de chargement
|
|
- **`TreeCategoryHeader`** : Header des catégories avec actions
|
|
- **`TreeItemRow`** : Ligne d'item générique avec actions
|
|
- **`TreeSearchControls`** : Contrôles de recherche et expansion
|
|
- **`TeamMetrics`** : Affichage des métriques des équipes
|
|
|
|
### 📁 `team-detail/`
|
|
|
|
Composants pour le détail des équipes :
|
|
|
|
- **`TeamDetailClientWrapper`** : Wrapper pour les pages de détail
|
|
- **`TeamDetailHeader`** : Header avec informations de l'équipe
|
|
- **`TeamDetailTabs`** : Onglets de détail (Overview, Skills, Members, Insights)
|
|
- **`TeamDetailModal`** : Modal de détail de l'équipe
|
|
- **`TeamOverviewTab`** : Onglet de vue d'ensemble
|
|
- **`TeamSkillsTab`** : Onglet des skills de l'équipe
|
|
- **`TeamMembersTab`** : Onglet des membres de l'équipe
|
|
- **`TeamInsightsTab`** : Onglet des insights de l'équipe
|
|
- **`TeamMemberModal`** : Modal de gestion des membres
|
|
- **`TeamMetricsCards`** : Cartes de métriques de l'équipe
|
|
- **`TeamStatsCard`** : Carte de statistiques de l'équipe
|
|
|
|
### 📁 `utils/`
|
|
|
|
Composants utilitaires réutilisables :
|
|
|
|
- **`AdminHeader`** : Header avec navigation entre "Vue d'ensemble" et "Gestion"
|
|
- **`AdminFilters`** : Filtres génériques pour l'administration
|
|
- **`MultiSelectFilter`** : Filtre multi-sélection
|
|
|
|
## Utilisation
|
|
|
|
### Import des composants
|
|
|
|
```typescript
|
|
// Import depuis l'index principal
|
|
import {
|
|
SkillsManagement,
|
|
TeamsManagement,
|
|
TreeViewContainer,
|
|
AdminHeader,
|
|
} from "@/components/admin";
|
|
|
|
// Import direct depuis un dossier spécifique
|
|
import { SkillsManagement } from "@/components/admin/management/pages";
|
|
import { TreeViewContainer } from "@/components/admin/management";
|
|
```
|
|
|
|
### Hiérarchie des composants
|
|
|
|
```
|
|
AdminClientWrapper (overview)
|
|
├── AdminContentTabs
|
|
│ ├── DirectionOverview
|
|
│ └── TeamDetailClientWrapper (team-detail)
|
|
│ └── TeamDetailTabs
|
|
│ ├── TeamOverviewTab
|
|
│ ├── TeamSkillsTab
|
|
│ ├── TeamMembersTab
|
|
│ └── TeamInsightsTab
|
|
|
|
ManageAdminClientWrapper (layout)
|
|
├── ManageContentTabs
|
|
│ ├── SkillsManagement (management/pages)
|
|
│ │ └── TreeViewContainer (management)
|
|
│ │ ├── TreeCategoryHeader
|
|
│ │ └── TreeItemRow
|
|
│ └── TeamsManagement (management/pages)
|
|
│ └── TreeViewContainer (management)
|
|
│ ├── TreeCategoryHeader
|
|
│ └── TreeItemRow
|
|
```
|
|
|
|
## Avantages de cette structure
|
|
|
|
1. **Organisation logique** : Séparation claire des responsabilités
|
|
2. **Réutilisabilité** : Composants génériques dans `management/`
|
|
3. **Maintenabilité** : Fichiers regroupés par fonctionnalité
|
|
4. **Scalabilité** : Facile d'ajouter de nouveaux composants
|
|
5. **Import simplifié** : Un seul point d'entrée via l'index principal
|