Function CreateEmployeForm

Name

CreateEmployeForm

Ce composant fournit une interface modale complète pour la création de nouveaux employés avec validation en temps réel, gestion des erreurs et feedback utilisateur. Il gère tous les champs requis pour créer un compte employé avec ses informations personnelles et professionnelles, incluant la génération sécurisée du mot de passe.

Fonctionnalités réellement implémentées

Formulaire complet d'employé

• Champs personnels : Prénom, Nom (obligatoires)
• Champs compte : Email, Mot de passe (obligatoires)
• Champs professionnels : Matricule, Identifiant téléphone (obligatoires)
• Placeholders informatifs : Guidance utilisateur sur chaque champ

Gestion sécurisée du mot de passe

• Toggle visibilité : Bouton œil pour afficher/masquer mot de passe
• Validation robuste : Minimum 8 caractères obligatoires
• Icônes SVG : Œil ouvert/fermé selon état showPassword
• Input type dynamique : password/text selon showPassword

Validation en temps réel

• Validation côté client : Contrôles immédiats avant soumission
• Effacement erreurs : Nettoyage automatique lors modification
• Regex email : Validation format email standard
• Champs requis : Vérification présence et trim() des espaces

Validation et gestion d'erreur

Règles de validation

• Email : Présence + format regex /^[^\s@]+@[^\s@]+\.[^\s@]+$/
• Mot de passe : Présence + minimum 8 caractères
• Nom/Prénom : Présence après trim()
• Matricule : Présence après trim()
• Téléphone : Présence après trim()

Interactions et soumission

Callbacks externes

• onSubmit : Promise pour async avec retour success
• onCancel : void pour fermeture modal
• isLoading : boolean externe pour état loading

⌨Interactions utilisateur

• handleChange : Input onChange avec effacement erreur
• Toggle password : Click pour showPassword
• Submit : Enter ou click bouton
• Cancel : Click X ou bouton Annuler