Initial commit
This commit is contained in:
227
DISKS_VISUALISÉ.txt
Normal file
227
DISKS_VISUALISÉ.txt
Normal file
@@ -0,0 +1,227 @@
|
||||
```
|
||||
╔════════════════════════════════════════════════════════════════════════════════╗
|
||||
║ NOUVELLE FONCTIONNALITÉ: GESTION DES DISQUES ET PARTITIONS ║
|
||||
╚════════════════════════════════════════════════════════════════════════════════╝
|
||||
|
||||
📋 RÉSUMÉ
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
Une interface complète pour surveiller les disques et partitions du système avec
|
||||
visualisation des taux de remplissage en barres de progression colorées.
|
||||
|
||||
🎯 OBJECTIFS ATTEINTS
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
✅ Endpoint FastAPI utilisant lsblk --json pour lister les disques
|
||||
✅ Récupération des informations d'utilisation via psutil
|
||||
✅ Interface Vue.js avec barres de progression colorées
|
||||
✅ Affichage détaillé des disques et leurs partitions
|
||||
✅ Auto-rafraîchissement des données (30s)
|
||||
✅ Authentification requise
|
||||
✅ Gestion des erreurs robuste
|
||||
|
||||
📊 ARCHITECTURE
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
BACKEND (FastAPI)
|
||||
├── app/services/system.py
|
||||
│ ├── BlockDevicePartition (Pydantic model)
|
||||
│ ├── BlockDevice (Pydantic model)
|
||||
│ ├── BlockDevicesInfo (Pydantic model)
|
||||
│ ├── format_bytes() → str
|
||||
│ └── get_block_devices() → BlockDevicesInfo
|
||||
│
|
||||
└── app/api/endpoints/system.py
|
||||
└── GET /system/disks (auth required) → BlockDevicesInfo
|
||||
|
||||
FRONTEND (Vue.js)
|
||||
├── src/views/DisksView.vue (nouvelle vue)
|
||||
├── src/router/index.js (ajout de la route)
|
||||
└── src/App.vue (ajout du lien de navigation)
|
||||
|
||||
📦 MODÈLES DE DONNÉES
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
BlockDevicePartition:
|
||||
├── name: str # "sda1"
|
||||
├── type: str # "part"
|
||||
├── size: str # "477.53 GB"
|
||||
├── used: str # "250.15 GB"
|
||||
├── available: str # "227.38 GB"
|
||||
├── percent_used: float # 52.4
|
||||
└── mountpoint: str|null # "/home"
|
||||
|
||||
BlockDevice:
|
||||
├── name: str # "sda"
|
||||
├── type: str # "disk"
|
||||
├── size: str # "477.53 GB"
|
||||
├── used: str # "250.15 GB"
|
||||
├── available: str # "227.38 GB"
|
||||
├── percent_used: float # 52.4
|
||||
├── mountpoint: str|null # null ou "/"
|
||||
└── partitions: List[BlockDevicePartition]
|
||||
|
||||
BlockDevicesInfo:
|
||||
├── devices: List[BlockDevice]
|
||||
├── total_size: str # "477.53 GB"
|
||||
├── total_used: str # "250.15 GB"
|
||||
└── total_available: str # "227.38 GB"
|
||||
|
||||
🎨 INTERFACE VISUELLE
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
┌─ Disques et Partitions ─────────────────────────────────────────────────────────┐
|
||||
│ │
|
||||
│ [Statistiques globales] │
|
||||
│ ├─ 📊 Taille Totale: 477.53 GB │
|
||||
│ ├─ 📉 Utilisé: 250.15 GB │
|
||||
│ └─ 📈 Disponible: 227.38 GB │
|
||||
│ │
|
||||
│ [Disque /dev/sda] │
|
||||
│ ├─ Type: disk │
|
||||
│ ├─ Taille: 477.53 GB │
|
||||
│ ├─ Utilisation: 52% ▓▓▓▓▓░░░░░░░░░░░░░░░░░░░░ │
|
||||
│ │ ☝ Barre avec dégradé de couleur (vert→jaune→orange→rouge) │
|
||||
│ │ │
|
||||
│ │ [Partitions] │
|
||||
│ │ ├─ /dev/sda1 │
|
||||
│ │ │ ├─ Point de montage: / │
|
||||
│ │ │ ├─ Type: ext4 │
|
||||
│ │ │ ├─ Taille: 477.53 GB │
|
||||
│ │ │ ├─ Utilisation: 52% ▓▓▓▓▓░░░░░░░░░░░░░░░░░░░░ │
|
||||
│ │ │ └─ 250.15 GB utilisé / 227.38 GB disponible │
|
||||
│ │ │ │
|
||||
│ │ └─ /dev/sda2 │
|
||||
│ │ ├─ Point de montage: /home │
|
||||
│ │ ├─ Type: ext4 │
|
||||
│ │ └─ Utilisation: 75% ▓▓▓▓▓▓▓▓░░░░░░░░░░░░░░░░░░░░ │
|
||||
│ │ ☝ Jaune (attention) │
|
||||
│ │ │
|
||||
│ └─ [Disque /dev/sdb] │
|
||||
│ │
|
||||
└──────────────────────────────────────────────────────────────────────────────────┘
|
||||
|
||||
CODES COULEUR:
|
||||
┌─────────────────┬────────────────┐
|
||||
│ Utilisation │ Couleur │
|
||||
├─────────────────┼────────────────┤
|
||||
│ < 50% │ 🟢 Vert │
|
||||
│ 50% - 75% │ 🟡 Jaune │
|
||||
│ 75% - 90% │ 🟠 Orange │
|
||||
│ ≥ 90% │ 🔴 Rouge │
|
||||
└─────────────────┴────────────────┘
|
||||
|
||||
🔧 UTILISATION
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
1. Backend:
|
||||
- La commande 'lsblk --json' est exécutée avec timeout de 10s
|
||||
- Les informations d'utilisation viennent de psutil
|
||||
- Format: lsblk --json --bytes --output NAME,TYPE,SIZE,FSTYPE,MOUNTPOINTS
|
||||
|
||||
2. Frontend:
|
||||
- Requête GET http://localhost:8000/api/system/disks
|
||||
- Bearer Token authentication
|
||||
- Auto-rafraîchissement toutes les 30s
|
||||
- Gestion des erreurs (affichage d'un message d'erreur)
|
||||
|
||||
📍 NAVIGATION
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
Sidebar (à gauche):
|
||||
📊 Dashboard
|
||||
🐳 Conteneurs Docker
|
||||
💾 Disques et Partitions ← NOUVEAU
|
||||
|
||||
🛡️ SÉCURITÉ
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
✅ Authentification requise (Bearer Token)
|
||||
✅ Timeout sur l'exécution de lsblk (10s)
|
||||
✅ Gestion des exceptions (erreurs de permission, etc.)
|
||||
✅ Pas d'exposition de chemins système sensibles
|
||||
✅ Validation des données Pydantic
|
||||
|
||||
📚 FICHIERS MODIFIÉS/CRÉÉS
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
Modifiés:
|
||||
✏️ backend/app/services/system.py
|
||||
- Ajout imports (json, subprocess, Optional, Dict, Any)
|
||||
- Ajout 3 models Pydantic (BlockDevicePartition, BlockDevice, BlockDevicesInfo)
|
||||
- Ajout methods (format_bytes, get_block_devices)
|
||||
|
||||
✏️ backend/app/api/endpoints/system.py
|
||||
- Ajout import BlockDevicesInfo
|
||||
- Ajout route GET /disks
|
||||
|
||||
✏️ frontend/src/router/index.js
|
||||
- Import DisksView
|
||||
- Ajout route /disks
|
||||
|
||||
✏️ frontend/src/App.vue
|
||||
- Ajout lien de navigation dans la sidebar
|
||||
|
||||
Créés:
|
||||
✨ frontend/src/views/DisksView.vue
|
||||
✨ DISKS_FEATURE.md (documentation complète)
|
||||
✨ test_disks.sh (script de test)
|
||||
✨ DISKS_VISUALISÉ.txt (ce fichier)
|
||||
|
||||
⚙️ CONFIGURATION REQUISE
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
Backend:
|
||||
- Python 3.7+
|
||||
- psutil (existant)
|
||||
- subprocess (stdlib)
|
||||
- json (stdlib)
|
||||
- Commande 'lsblk' disponible sur le système
|
||||
|
||||
Frontend:
|
||||
- Vue 3+
|
||||
- Vue Router 4+
|
||||
- Pinia (existant)
|
||||
|
||||
🚀 DÉMARRAGE
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
1. Assurez-vous que le backend FastAPI est en cours d'exécution:
|
||||
cd backend
|
||||
python main.py
|
||||
|
||||
2. Assurez-vous que le frontend Vue est en cours d'exécution:
|
||||
cd frontend
|
||||
npm install
|
||||
npm run dev
|
||||
|
||||
3. Accédez à http://localhost:5173 (ou votre URL frontend)
|
||||
|
||||
4. Connectez-vous avec vos identifiants
|
||||
|
||||
5. Cliquez sur "💾 Disques et Partitions" dans la sidebar
|
||||
|
||||
✅ TEST RAPIDE
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
Exécutez le script de test (nécessite curl et jq):
|
||||
bash test_disks.sh
|
||||
|
||||
Résponse attendue:
|
||||
{
|
||||
"devices": [...],
|
||||
"total_size": "477.53 GB",
|
||||
"total_used": "250.15 GB",
|
||||
"total_available": "227.38 GB"
|
||||
}
|
||||
|
||||
📝 NOTES
|
||||
══════════════════════════════════════════════════════════════════════════════════
|
||||
|
||||
- La conversion en format lisible (B→KB→GB, etc.) utilise les unités décimales
|
||||
- Les barres de progression sont fluides (animation CSS de 300ms)
|
||||
- L'auto-rafraîchissement respecte la durée de vie du composant
|
||||
- Les partitions non montées n'affichent pas de taux d'utilisation
|
||||
- Les erreurs de permission sont silencieusement ignorées (fallback sur 0%)
|
||||
|
||||
```
|
||||
Reference in New Issue
Block a user