Checkpoint: Ajout d'un bord rouge sur les champs vides du formulaire d'édition.

Modifications apportées :
- Les champs vides (non remplis par l'extraction IA) affichent maintenant un bord rouge de 2px en mode édition
- Identification visuelle immédiate des données manquantes : fournisseur, numéro de facture, date, bon de livraison, numéro de commande, montant total
- Le bord rouge disparaît automatiquement dès que l'utilisateur remplit le champ
- Amélioration de l'UX pour faciliter la saisie manuelle des données manquantes

client/src/pages/InvoiceDetail.tsx

@@ -228,6 +228,7 @@ export default function InvoiceDetail() {
                       value={formData.supplierName}
                       onChange={(e) => setFormData({ ...formData, supplierName: e.target.value })}
                       placeholder="Nom du fournisseur"
+                      className={!formData.supplierName ? "border-red-500 border-2" : ""}
                     />
                   ) : (
                     <div className="text-sm mt-1">{invoice.supplierName || "-"}</div>
@@ -242,6 +243,7 @@ export default function InvoiceDetail() {
                       value={formData.invoiceNumber}
                       onChange={(e) => setFormData({ ...formData, invoiceNumber: e.target.value })}
                       placeholder="N° de facture"
+                      className={!formData.invoiceNumber ? "border-red-500 border-2" : ""}
                     />
                   ) : (
                     <div className="text-sm mt-1">{invoice.invoiceNumber || "-"}</div>
@@ -256,6 +258,7 @@ export default function InvoiceDetail() {
                       type="date"
                       value={formData.invoiceDate}
                       onChange={(e) => setFormData({ ...formData, invoiceDate: e.target.value })}
+                      className={!formData.invoiceDate ? "border-red-500 border-2" : ""}
                     />
                   ) : (
                     <div className="text-sm mt-1">
@@ -274,6 +277,7 @@ export default function InvoiceDetail() {
                       value={formData.deliveryNoteNumber}
                       onChange={(e) => setFormData({ ...formData, deliveryNoteNumber: e.target.value })}
                       placeholder="N° de bon de livraison"
+                      className={!formData.deliveryNoteNumber ? "border-red-500 border-2" : ""}
                     />
                   ) : (
                     <div className="text-sm mt-1">{invoice.deliveryNoteNumber || "-"}</div>
@@ -288,6 +292,7 @@ export default function InvoiceDetail() {
                       value={formData.orderNumber}
                       onChange={(e) => setFormData({ ...formData, orderNumber: e.target.value })}
                       placeholder="N° de commande"
+                      className={!formData.orderNumber ? "border-red-500 border-2" : ""}
                     />
                   ) : (
                     <div className="text-sm mt-1">{invoice.orderNumber || "-"}</div>
@@ -304,6 +309,7 @@ export default function InvoiceDetail() {
                       value={formData.totalAmount}
                       onChange={(e) => setFormData({ ...formData, totalAmount: e.target.value })}
                       placeholder="Montant en €"
+                      className={!formData.totalAmount ? "border-red-500 border-2" : ""}
                     />
                   ) : (
                     <div className="text-sm mt-1">

todo.md

@@ -125,3 +125,7 @@
 ## Correction formulaire d'édition
 - [x] Pré-remplir les valeurs existantes dans le formulaire d'édition de facture
 - [x] Utiliser useEffect pour initialiser les valeurs du formulaire
+
+## Amélioration visuelle formulaire d'édition
+- [x] Ajouter un bord rouge sur les champs vides du formulaire d'édition
+- [x] Identifier visuellement les données manquantes non extraites par l'IA