251 lines
8.5 KiB
Markdown
251 lines
8.5 KiB
Markdown
# Pré-remplissage complet du formulaire PCI
|
|
|
|
## Contexte
|
|
|
|
Lors de l'import de périphériques PCI, certains champs n'étaient pas pré-remplis dans le formulaire:
|
|
- Le sous-type n'était pas sélectionné (select vide)
|
|
- Le Device ID (slot PCI comme 08:00.0) n'était pas rempli
|
|
- Le fabricant de carte (pour GPU) n'était pas rempli
|
|
|
|
## Problèmes résolus
|
|
|
|
### 1. Sous-type non sélectionné
|
|
|
|
**Problème**: Le champ `type_principal` était pré-rempli avec "PCI", mais le select `sous_type` restait vide car les options n'étaient pas chargées avant de tenter de sélectionner la valeur.
|
|
|
|
**Solution**: Appeler `loadPeripheralSubtypes()` après avoir défini le `type_principal`, puis définir le `sous_type`.
|
|
|
|
```javascript
|
|
// Fill type_principal and trigger sous_type loading
|
|
if (suggested.type_principal) {
|
|
document.getElementById('type_principal').value = suggested.type_principal;
|
|
// Load subtypes for this type
|
|
await loadPeripheralSubtypes();
|
|
// Then set the sous_type value
|
|
if (suggested.sous_type) {
|
|
document.getElementById('sous_type').value = suggested.sous_type;
|
|
}
|
|
}
|
|
```
|
|
|
|
### 2. Device ID manquant
|
|
|
|
**Problème**: Le slot PCI (ex: `08:00.0`) n'était pas pré-rempli dans le champ `device_id`.
|
|
|
|
**Solution**: Ajouter le slot dans les données suggérées du backend.
|
|
|
|
#### Backend - `peripherals.py`
|
|
|
|
```python
|
|
suggested = {
|
|
"nom": nom,
|
|
"type_principal": type_principal,
|
|
"sous_type": sous_type,
|
|
"marque": brand or device_info.get("vendor_name"),
|
|
"modele": model or device_info.get("device_name"),
|
|
"device_id": device_info.get("slot"), # PCI slot (e.g., 08:00.0)
|
|
"pci_device_id": device_info.get("pci_device_id"), # vendor:device (e.g., 10de:2504)
|
|
"cli_raw": device_section,
|
|
"caracteristiques_specifiques": caracteristiques_specifiques
|
|
}
|
|
```
|
|
|
|
#### Frontend - `peripherals.js`
|
|
|
|
```javascript
|
|
// Fill Device ID (PCI slot like 08:00.0)
|
|
if (suggested.device_id) {
|
|
const deviceIdField = document.getElementById('device_id');
|
|
if (deviceIdField) deviceIdField.value = suggested.device_id;
|
|
}
|
|
```
|
|
|
|
### 3. Fabricant de carte manquant
|
|
|
|
**Problème**: Pour les cartes graphiques, le fabricant de la carte (ex: Gigabyte) extrait du subsystem n'était pas pré-rempli.
|
|
|
|
**Solution**: Le backend extrait déjà le fabricant, il suffit de le pré-remplir dans le frontend.
|
|
|
|
```javascript
|
|
// Fill fabricant if present (for GPU cards)
|
|
if (suggested.fabricant) {
|
|
const fabricantField = document.getElementById('fabricant');
|
|
if (fabricantField) fabricantField.value = suggested.fabricant;
|
|
}
|
|
```
|
|
|
|
## Champs pré-remplis automatiquement
|
|
|
|
Lors de l'import d'un périphérique PCI, le formulaire pré-remplit maintenant:
|
|
|
|
### Champs de base
|
|
- ✅ **Nom**: Construit à partir de marque + modèle (ex: `NVIDIA GeForce RTX 3060 Lite Hash Rate`)
|
|
- ✅ **Type principal**: `PCI`
|
|
- ✅ **Sous-type**: Classification automatique (ex: `Carte graphique`, `SSD NVMe`, etc.)
|
|
- ✅ **Marque**: Premier mot du vendor (ex: `NVIDIA`, `Micron`)
|
|
- ✅ **Modèle**: Nom commercial du périphérique (ex: `GeForce RTX 3060 Lite Hash Rate`)
|
|
|
|
### Champs spécifiques PCI
|
|
- ✅ **Device ID**: Slot PCI (ex: `08:00.0`)
|
|
- ✅ **PCI Device ID**: Identifiant vendor:device (ex: `10de:2504`)
|
|
- ✅ **Fabricant**: Fabricant de la carte pour GPU (ex: `Gigabyte`)
|
|
|
|
### Champs techniques
|
|
- ✅ **CLI Raw**: Sortie complète de lspci pour ce périphérique
|
|
- ✅ **Caractéristiques spécifiques**: JSON avec:
|
|
- Slot PCI
|
|
- Device class
|
|
- Vendor name
|
|
- Subsystem
|
|
- Driver
|
|
- IOMMU group
|
|
- Revision
|
|
- Modules
|
|
|
|
## Exemple complet - NVIDIA RTX 3060
|
|
|
|
### Données d'entrée
|
|
```
|
|
08:00.0 VGA compatible controller: NVIDIA Corporation GA106 [GeForce RTX 3060 Lite Hash Rate] (rev a1) (prog-if 00 [VGA controller])
|
|
Subsystem: Gigabyte Technology Co., Ltd Device 4074
|
|
Flags: bus master, fast devsel, latency 0, IRQ 84, IOMMU group 16
|
|
Kernel driver in use: nvidia
|
|
```
|
|
|
|
### Formulaire pré-rempli
|
|
|
|
| Champ | Valeur | Source |
|
|
|-------|--------|--------|
|
|
| **Nom** | `NVIDIA GeForce RTX 3060 Lite Hash Rate` | `brand + model` |
|
|
| **Type principal** | `PCI` ✅ | Classification automatique |
|
|
| **Sous-type** | `Carte graphique` ✅ | Classification automatique |
|
|
| **Marque** | `NVIDIA` | Premier mot de "NVIDIA Corporation" |
|
|
| **Modèle** | `GeForce RTX 3060 Lite Hash Rate` | Contenu des brackets `[...]` |
|
|
| **Fabricant** | `Gigabyte` ✅ | Premier mot du subsystem |
|
|
| **Device ID** | `08:00.0` ✅ | Slot PCI |
|
|
| **PCI Device ID** | `10de:2504` | Vendor:device depuis lspci -n |
|
|
|
|
### Caractéristiques spécifiques (JSON)
|
|
```json
|
|
{
|
|
"slot": "08:00.0",
|
|
"device_class": "VGA compatible controller",
|
|
"vendor_name": "NVIDIA Corporation",
|
|
"subsystem": "Gigabyte Technology Co., Ltd Device 4074",
|
|
"driver": "nvidia",
|
|
"iommu_group": "16",
|
|
"revision": "a1",
|
|
"modules": "nvidia"
|
|
}
|
|
```
|
|
|
|
## Exemple complet - Micron NVMe SSD
|
|
|
|
### Données d'entrée
|
|
```
|
|
01:00.0 Non-Volatile memory controller: Micron/Crucial Technology P2 [Nick P2] / P3 / P3 Plus NVMe PCIe SSD (DRAM-less) (rev 01)
|
|
Subsystem: Micron/Crucial Technology P2 [Nick P2] / P3 / P3 Plus NVMe PCIe SSD (DRAM-less)
|
|
Kernel driver in use: nvme
|
|
```
|
|
|
|
### Formulaire pré-rempli
|
|
|
|
| Champ | Valeur | Source |
|
|
|-------|--------|--------|
|
|
| **Nom** | `Micron P2/P3/P3 Plus NVMe PCIe SSD (DRAM-less)` | `brand + model` |
|
|
| **Type principal** | `PCI` ✅ | Classification automatique |
|
|
| **Sous-type** | `SSD NVMe` ✅ | Classification automatique |
|
|
| **Marque** | `Micron` | Premier mot de "Micron/Crucial Technology" |
|
|
| **Modèle** | `P2/P3/P3 Plus NVMe PCIe SSD (DRAM-less)` | Nettoyé des brackets |
|
|
| **Device ID** | `01:00.0` ✅ | Slot PCI |
|
|
| **PCI Device ID** | `c0a9:5407` | Vendor:device depuis lspci -n |
|
|
|
|
## Workflow de pré-remplissage
|
|
|
|
```
|
|
1. User colle lspci -v et lspci -n
|
|
2. Backend détecte les périphériques
|
|
3. User sélectionne un périphérique (ex: 08:00.0)
|
|
4. Backend extrait et parse les informations
|
|
├─ Parse vendor/device name intelligemment
|
|
├─ Classifie le périphérique (type + sous-type)
|
|
├─ Extrait marque et modèle
|
|
├─ Extrait fabricant (pour GPU)
|
|
└─ Construit les caractéristiques spécifiques
|
|
5. Frontend ouvre le formulaire d'ajout
|
|
6. Pré-remplissage séquentiel:
|
|
├─ Champs de base (nom, marque, modèle)
|
|
├─ Type principal → déclenche chargement sous-types
|
|
├─ Sous-type (une fois les options chargées) ✅
|
|
├─ Fabricant (si GPU)
|
|
├─ Device ID (slot PCI) ✅
|
|
├─ PCI Device ID (vendor:device)
|
|
└─ Caractéristiques spécifiques (JSON)
|
|
7. User valide/modifie et sauvegarde
|
|
```
|
|
|
|
## Code modifié
|
|
|
|
### Backend - `peripherals.py` (ligne 1507)
|
|
```python
|
|
"device_id": device_info.get("slot"), # Ajouté: slot PCI
|
|
```
|
|
|
|
### Frontend - `peripherals.js`
|
|
|
|
**Lignes 1822-1830**: Chargement async des sous-types
|
|
```javascript
|
|
if (suggested.type_principal) {
|
|
document.getElementById('type_principal').value = suggested.type_principal;
|
|
await loadPeripheralSubtypes(); // IMPORTANT: async
|
|
if (suggested.sous_type) {
|
|
document.getElementById('sous_type').value = suggested.sous_type;
|
|
}
|
|
}
|
|
```
|
|
|
|
**Lignes 1833-1836**: Fabricant
|
|
```javascript
|
|
if (suggested.fabricant) {
|
|
const fabricantField = document.getElementById('fabricant');
|
|
if (fabricantField) fabricantField.value = suggested.fabricant;
|
|
}
|
|
```
|
|
|
|
**Lignes 1839-1842**: Device ID (slot PCI)
|
|
```javascript
|
|
if (suggested.device_id) {
|
|
const deviceIdField = document.getElementById('device_id');
|
|
if (deviceIdField) deviceIdField.value = suggested.device_id;
|
|
}
|
|
```
|
|
|
|
## Bénéfices
|
|
|
|
✅ **Formulaire complet**: Tous les champs pertinents sont pré-remplis
|
|
✅ **Gain de temps**: L'utilisateur n'a plus qu'à valider
|
|
✅ **Moins d'erreurs**: Les types et sous-types sont correctement sélectionnés
|
|
✅ **Traçabilité**: Le slot PCI permet d'identifier précisément le périphérique
|
|
✅ **Distinction GPU**: Le fabricant de carte est séparé du fabricant du chipset
|
|
|
|
## Tests
|
|
|
|
Pour tester le pré-remplissage complet:
|
|
|
|
1. Importer un périphérique PCI (GPU ou NVMe)
|
|
2. Vérifier que le formulaire affiche:
|
|
- Type principal: `PCI` ✅
|
|
- Sous-type: Sélectionné automatiquement ✅
|
|
- Device ID: Slot PCI (ex: `08:00.0`) ✅
|
|
- Fabricant: Pour GPU uniquement ✅
|
|
- PCI Device ID: vendor:device (ex: `10de:2504`) ✅
|
|
|
|
## Fichiers modifiés
|
|
|
|
1. **backend/app/api/endpoints/peripherals.py** - Ajout du device_id (slot)
|
|
2. **frontend/js/peripherals.js** - Pré-remplissage async du sous-type + device_id + fabricant
|
|
|
|
## Conclusion
|
|
|
|
Le formulaire d'import PCI pré-remplit maintenant tous les champs disponibles, offrant une expérience utilisateur optimale avec validation minimale requise.
|