# PDF Form Editor - Application de Gestion de Formulaires PDF Application Angular permettant aux administrateurs de créer et gérer des templates de formulaires PDF personnalisés, et aux utilisateurs de remplir ces formulaires en ligne. ## 🚀 Fonctionnalités ### Mode Administration - ✅ Création et gestion de templates de formulaires PDF - ✅ Édition visuelle des champs sur le PDF - ✅ Configuration des validations (required, min/max, pattern, etc.) - ✅ Gestion des catégories (Bancaire, RH, Administratif, etc.) - ✅ Recherche et filtrage des templates - ✅ Duplication de templates ### Mode Utilisateur - ✅ Liste des formulaires disponibles - ✅ Remplissage de formulaires en ligne - ✅ Validation en temps réel - ✅ Aperçu PDF en direct - ✅ Sauvegarde de brouillons - ✅ Téléchargement du PDF final ### Types de Champs Supportés - Texte libre - Champs texte (input) - Zones de texte (textarea) - Cases à cocher - Dates - Nombres - Emails - Images (upload) - Signatures (canvas) ## 📦 Installation ```bash # Installer les dépendances npm install # Lancer le serveur de développement ng serve # L'application sera accessible sur http://localhost:4200 ``` ## 🎯 Utilisation ### Créer un Template (Admin) 1. Accéder à `/admin` 2. Cliquer sur "Nouveau Template" 3. Saisir les informations du template 4. Créer un PDF vierge ou charger un PDF existant 5. Ajouter des champs en cliquant sur le PDF 6. Configurer les propriétés et validations de chaque champ 7. Sauvegarder le template ### Remplir un Formulaire (User) 1. Accéder à `/forms` 2. Sélectionner un formulaire 3. Remplir les champs 4. Vérifier l'aperçu PDF 5. Soumettre ou sauvegarder en brouillon 6. Le PDF final est automatiquement téléchargé ## 📁 Structure du Projet ``` src/app/ ├── components/ │ ├── admin/ # Composants d'administration │ │ ├── admin.component.ts │ │ └── template-editor/ │ ├── forms/ # Composants de remplissage │ │ ├── forms-list/ │ │ └── form-filler/ │ └── pdf-viewer/ # Visualiseur PDF ├── models/ │ ├── pdf.model.ts # Modèles PDF de base │ └── template.model.ts # Modèles de templates ├── services/ │ ├── pdf.service.ts # Service PDF │ └── template.service.ts # Service de gestion des templates └── app.routes.ts # Configuration du routing ``` ## 🔧 Technologies - **Angular 17** : Framework frontend - **pdf-lib** : Manipulation de PDFs - **pdfjs-dist** : Affichage de PDFs - **file-saver** : Téléchargement de fichiers - **signature_pad** : Gestion des signatures ## 📝 Stockage Les données sont stockées dans le **localStorage** du navigateur : - Templates de formulaires - Soumissions de formulaires - Catégories ## 🛣️ Routes - `/` → Redirige vers `/admin` - `/admin` → Gestion des templates - `/admin/template/:id` → Éditeur de template - `/forms` → Liste des formulaires - `/forms/fill/:id` → Remplissage de formulaire - `/editor` → Éditeur PDF original ## 📚 Documentation Voir [ARCHITECTURE.md](./ARCHITECTURE.md) pour plus de détails sur l'architecture de l'application. ## 🚧 Améliorations Futures - [ ] Backend avec base de données (PostgreSQL) - [ ] Authentification et autorisation - [ ] Types de champs supplémentaires (select, radio, etc.) - [ ] Workflow d'approbation - [ ] Notifications par email - [ ] Tableaux de bord et statistiques - [ ] Export de données (CSV, Excel) ## 📄 Licence Ce projet est un projet personnel/démonstration. # pdfeditor