Création de 2 écrans professionnels pour le module Devis:
1. devis/nouveau.xhtml:
- 4 sections: Informations générales, Détail du devis, Montants, Conditions
- Numéro auto-généré avec icône
- Statut avec 5 valeurs (BROUILLON, ATTENTE, ACCEPTE, REFUSE, EXPIRE)
- Dates d'émission et validité avec calendriers
- Client et objet du devis requis
- Placeholder pour lignes de devis (future développement)
- Calcul automatique TVA 18% et TTC
- Récapitulatif visuel HT/TVA/TTC avec composant monétaire
- Conditions de paiement et remarques (section collapsible)
- 3 boutons: Annuler, Brouillon, Envoyer
2. devis/details.xhtml:
- En-tête: numéro, statut, client, objet, dates
- Actions: Retour, Convertir en chantier, PDF, Modifier
- 4 KPI cards: Montant HT, TVA, TTC, Statut
- 6 onglets professionnels:
* Vue d'ensemble: infos + récap financier + actions rapides
* Détail des lignes: table lignes (placeholder)
* Conditions: paiement, délais, garanties
* Documents: GED associée (placeholder)
* Suivi: timeline actions
* Historique: modifications (placeholder)
Corrections:
- Fix navigation /factures/nouvelle -> /factures/nouveau (factures.xhtml)
- Fix menu /factures/nouvelle -> /factures/nouveau (menu.xhtml)
Tous les composants réutilisables utilisés (status-badge, monetary-display).
Validation complète côté client et serveur.
UI/UX professionnel adapté au métier BTP.
7.5 KiB
🔐 Configuration Keycloak pour BTPXpress Client (JSF)
✅ Configuration effectuée
1. Activation OIDC
- ✅ OIDC activé en mode dev et prod dans
application.properties - ✅ Serveur Keycloak:
https://security.lions.dev - ✅ Realm:
btpxpress - ✅ Client ID:
btpxpress-frontend(client public)
2. Configuration des redirections
- ✅ Redirect après connexion:
/dashboard.xhtml - ✅ Logout path:
/logout - ✅ Post-logout redirect:
/index.xhtml
3. Permissions d'accès
- ✅ Ressources publiques: CSS, JS, images, fonts
- ✅ Pages publiques:
/,/index.xhtml,/login.xhtml,/error.xhtml,/access-denied.xhtml - ✅ Pages protégées: Toutes les autres pages nécessitent une authentification
4. Pages créées
- ✅
access-denied.xhtml- Page d'accès refusé
🚀 Étapes de configuration Keycloak
Étape 1: Exécuter le script de configuration
Le script PowerShell configure-keycloak-jsf.ps1 va :
- Se connecter à Keycloak avec les credentials admin
- Mettre à jour les redirect URIs du client
btpxpress-frontend - Ajouter les URIs pour le port 8081 (JSF)
- Créer un utilisateur de test
Exécution du script:
cd C:\Users\dadyo\PersonalProjects\lions-workspace\btpxpress\btpxpress-client
.\configure-keycloak-jsf.ps1
Credentials admin Keycloak:
- Username:
admin - Password:
KeycloakAdmin2025!
Étape 2: Vérifier la configuration dans Keycloak
-
Accéder à l'admin console: https://security.lions.dev/admin
-
Se connecter avec admin / KeycloakAdmin2025!
-
Sélectionner le realm
btpxpress -
Aller dans Clients → btpxpress-frontend
-
Vérifier que les Valid redirect URIs incluent:
http://localhost:8081/*http://localhost:8081/dashboard.xhtmlhttps://btpxpress.lions.dev/*
-
Vérifier que les Web Origins incluent:
http://localhost:8081https://btpxpress.lions.dev
-
Vérifier les paramètres:
- ✅ Access Type: public
- ✅ Standard Flow Enabled: ON
- ✅ Direct Access Grants Enabled: ON
- ✅ PKCE Code Challenge Method: S256
Étape 3: Créer un utilisateur de test (si le script ne l'a pas créé)
Si l'utilisateur de test n'a pas été créé automatiquement:
- Dans Keycloak, aller dans Users → Add user
- Remplir:
- Username:
test@btpxpress.com - Email:
test@btpxpress.com - First Name:
Test - Last Name:
BTPXpress - Email Verified: ✅ ON
- Username:
- Sauvegarder
- Aller dans l'onglet Credentials
- Définir le mot de passe:
Test123! - Temporary: ❌ OFF
- Aller dans l'onglet Role Mappings
- Assigner le rôle
btpxpress_userouadmin
🧪 Test de l'authentification
Démarrage de l'application
cd C:\Users\dadyo\PersonalProjects\lions-workspace\btpxpress\btpxpress-client
mvn quarkus:dev
Scénario de test
-
Accès à l'application
- Ouvrir: http://localhost:8081
- ➡️ Vous devriez être redirigé vers la page de connexion Keycloak
-
Connexion
- Username:
test@btpxpress.com - Password:
Test123! - Cliquer sur "Sign In"
- Username:
-
Redirection après connexion
- ➡️ Vous devriez être redirigé vers http://localhost:8081/dashboard.xhtml
- ✅ Vous êtes maintenant authentifié!
-
Vérification de la session
- Naviguer vers d'autres pages (Chantiers, Clients, etc.)
- ✅ Les pages doivent s'afficher sans redemander de connexion
-
Test de déconnexion
- Accéder à http://localhost:8081/logout
- ➡️ Vous devriez être déconnecté et redirigé vers
/index.xhtml - ➡️ Puis redirigé vers Keycloak pour vous reconnecter
-
Test d'accès protégé
- Se déconnecter complètement
- Essayer d'accéder directement à http://localhost:8081/chantiers.xhtml
- ➡️ Vous devriez être redirigé vers Keycloak pour vous authentifier
🔍 Vérifications des logs
Dans les logs de l'application, vous devriez voir:
INFO [io.quarkus.oidc] (main) OIDC enabled
INFO [io.quarkus.oidc] (main) Discovered OIDC endpoints from https://security.lions.dev/realms/btpxpress/.well-known/openid-configuration
Lors de la connexion:
DEBUG [io.quarkus.oidc] (executor-thread-X) Authenticating user...
DEBUG [io.quarkus.oidc] (executor-thread-X) Successfully authenticated user: test@btpxpress.com
🔐 Informations de sécurité
Client Frontend (btpxpress-frontend)
- Type: Public (pas de client secret)
- PKCE: S256 (obligatoire pour clients publics)
- Flow: Authorization Code avec PKCE
Client Backend (btpxpress-backend)
- Type: Confidential
- Client Secret:
fCSqFPsnyrUUljAAGY8ailGKp1u6mutv - PKCE: S256
- Service Accounts: Activés
📋 Roles disponibles dans Keycloak
super_admin- Super Administrateur - Accès totaladmin- Administrateur - Gestion complètedirecteur- Directeur - Vision globalemanager- Manager - Gestion opérationnellechef_chantier- Chef de Chantierconducteur_travaux- Conducteur de Travauxchef_equipe- Chef d'Équipeemploye- Employé - Accès standardouvrier- Ouvrier - Accès limitéclient_entreprise- Client Entrepriseclient_particulier- Client Particuliercomptable- Comptablecommercial- Commerciallogisticien- Logisticienviewer- Visualiseur - Lecture seuleguest- Invité - Accès minimal
Roles composites
btpxpress_user- Rôle de base (hérite deoffline_access,uma_authorization)btpxpress_admin- Rôle admin (hérite debtpxpress_user,admin,super_admin)btpxpress_manager- Rôle manager (hérite debtpxpress_user,manager)
🛠️ Dépannage
Problème: "Invalid redirect uri"
Solution: Vérifier que les redirect URIs sont bien configurés dans Keycloak pour le port 8081
Problème: "CORS error"
Solution: Vérifier que http://localhost:8081 est dans les Web Origins
Problème: "Token validation failed"
Solution:
- Vérifier que l'issuer est correct:
https://security.lions.dev/realms/btpxpress - Vérifier que la découverte OIDC est activée
Problème: Boucle de redirection infinie
Solution:
- Vérifier que
/index.xhtmlest dans les pages publiques - Vérifier que le redirect-path est correct
Problème: Erreur SSL/TLS
Solution: En développement, vous pouvez désactiver la vérification TLS (NON RECOMMANDÉ EN PRODUCTION):
%dev.quarkus.oidc.tls.verification=none
📝 Notes importantes
- En développement: OIDC est maintenant activé (avant il était désactivé)
- Session timeout: 30 minutes d'inactivité
- Token lifetime: 5 minutes (refresh automatique)
- Cookie path:
/(toute l'application) - Cookie security: En production, les cookies sont sécurisés (HTTPS only)
🎯 Prochaines étapes
- ✅ Configurer Keycloak avec le script PowerShell
- ✅ Tester la connexion avec l'utilisateur de test
- 📋 Créer des utilisateurs supplémentaires dans Keycloak
- 📋 Configurer les rôles et permissions spécifiques
- 📋 Implémenter l'autorisation basée sur les rôles dans l'application
- 📋 Ajouter l'affichage du nom d'utilisateur dans le menu
- 📋 Ajouter un bouton de déconnexion dans l'interface
🔗 Liens utiles
- Keycloak Admin Console: https://security.lions.dev/admin
- Realm btpxpress: https://security.lions.dev/realms/btpxpress
- OIDC Configuration: https://security.lions.dev/realms/btpxpress/.well-known/openid-configuration
- Application: http://localhost:8081