Configure Maven repository for unionflow-server-api dependency
This commit is contained in:
dahoud
@@ -0,0 +1,541 @@
|
||||
<!DOCTYPE html>
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://xmlns.jcp.org/jsf/html"
|
||||
xmlns:f="http://xmlns.jcp.org/jsf/core"
|
||||
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/templates/main-template.xhtml">
|
||||
|
||||
<ui:define name="title">Créer un Événement - UnionFlow</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<!-- En-tête -->
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<h3 class="mb-2">
|
||||
<i class="pi pi-calendar-plus text-green-500 mr-2"></i>
|
||||
Créer un Nouvel Événement
|
||||
</h3>
|
||||
<p class="text-600 m-0">Planifiez et organisez vos événements avec tous les détails nécessaires</p>
|
||||
</div>
|
||||
<div>
|
||||
<p:commandButton value="Retour à la liste"
|
||||
icon="pi pi-arrow-left"
|
||||
styleClass="ui-button-outlined ui-button-secondary"
|
||||
action="/pages/admin/evenements/liste?faces-redirect=true" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Progression -->
|
||||
<div class="card">
|
||||
<h5>Progression de création</h5>
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-2">
|
||||
<div class="text-center p-3">
|
||||
<i class="pi pi-info-circle text-2xl text-primary mb-2"></i>
|
||||
<div class="text-sm font-medium">Informations de base</div>
|
||||
<i class="pi pi-check-circle text-green-500 mt-1" style="display: #{creationEvenementBean.etapeInformationsComplete ? 'inline' : 'none'};"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-2">
|
||||
<div class="text-center p-3">
|
||||
<i class="pi pi-calendar text-2xl text-primary mb-2"></i>
|
||||
<div class="text-sm font-medium">Date et lieu</div>
|
||||
<i class="pi pi-check-circle text-green-500 mt-1" style="display: #{creationEvenementBean.etapeDateLieuComplete ? 'inline' : 'none'};"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-2">
|
||||
<div class="text-center p-3">
|
||||
<i class="pi pi-users text-2xl text-primary mb-2"></i>
|
||||
<div class="text-sm font-medium">Participants</div>
|
||||
<i class="pi pi-check-circle text-green-500 mt-1" style="display: #{creationEvenementBean.etapeParticipantsComplete ? 'inline' : 'none'};"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-2">
|
||||
<div class="text-center p-3">
|
||||
<i class="pi pi-dollar text-2xl text-primary mb-2"></i>
|
||||
<div class="text-sm font-medium">Tarification</div>
|
||||
<i class="pi pi-check-circle text-green-500 mt-1" style="display: #{creationEvenementBean.etapeTarificationComplete ? 'inline' : 'none'};"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-2">
|
||||
<div class="text-center p-3">
|
||||
<i class="pi pi-bell text-2xl text-primary mb-2"></i>
|
||||
<div class="text-sm font-medium">Notifications</div>
|
||||
<i class="pi pi-check-circle text-green-500 mt-1" style="display: #{creationEvenementBean.etapeNotificationsComplete ? 'inline' : 'none'};"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-2">
|
||||
<div class="text-center p-3">
|
||||
<i class="pi pi-check text-2xl text-primary mb-2"></i>
|
||||
<div class="text-sm font-medium">Validation</div>
|
||||
<i class="pi pi-check-circle text-green-500 mt-1" style="display: #{creationEvenementBean.etapeValidationComplete ? 'inline' : 'none'};"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p:progressBar value="#{creationEvenementBean.progressionPourcentage}"
|
||||
labelTemplate="{value}% complété"
|
||||
styleClass="mb-3" />
|
||||
</div>
|
||||
|
||||
<h:form id="formCreation" styleClass="ui-fluid">
|
||||
<p:messages id="messages" showDetail="true" closable="true" />
|
||||
|
||||
<div class="grid">
|
||||
<!-- Informations de base -->
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-info-circle mr-2"></i>
|
||||
Informations de Base
|
||||
</h5>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="titre" value="Titre de l'événement" />
|
||||
<p:inputText id="titre" value="#{creationEvenementBean.evenement.titre}"
|
||||
required="true" placeholder="Ex: Assemblée Générale 2024" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="type" value="Type d'événement" />
|
||||
<p:selectOneMenu id="type" value="#{creationEvenementBean.evenement.typeEvenement}" required="true">
|
||||
<f:selectItem itemLabel="Sélectionner..." itemValue="" />
|
||||
<f:selectItem itemLabel="🏛️ Assemblée Générale" itemValue="ASSEMBLEE_GENERALE" />
|
||||
<f:selectItem itemLabel="📋 Réunion" itemValue="REUNION" />
|
||||
<f:selectItem itemLabel="🎓 Formation" itemValue="FORMATION" />
|
||||
<f:selectItem itemLabel="🎉 Événement social" itemValue="SOCIAL" />
|
||||
<f:selectItem itemLabel="🏆 Cérémonie" itemValue="CEREMONIE" />
|
||||
<f:selectItem itemLabel="🚌 Sortie/Voyage" itemValue="SORTIE" />
|
||||
<f:selectItem itemLabel="🍽️ Repas" itemValue="REPAS" />
|
||||
<f:selectItem itemLabel="🔧 Autre" itemValue="AUTRE" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="description" value="Description" />
|
||||
<p:inputTextarea id="description" value="#{creationEvenementBean.evenement.description}"
|
||||
rows="4" placeholder="Décrivez l'événement, son objectif et son déroulement..." />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="organisateur" value="Organisateur" />
|
||||
<p:inputText id="organisateur" value="#{creationEvenementBean.evenement.organisateur}"
|
||||
placeholder="Nom de l'organisateur principal" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="priorite" value="Priorité" />
|
||||
<p:selectOneMenu id="priorite" value="#{creationEvenementBean.evenement.priorite}">
|
||||
<f:selectItem itemLabel="🔴 Haute" itemValue="HAUTE" />
|
||||
<f:selectItem itemLabel="🟡 Normale" itemValue="NORMALE" />
|
||||
<f:selectItem itemLabel="🟢 Basse" itemValue="BASSE" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Date, heure et lieu -->
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-calendar mr-2"></i>
|
||||
Date, Heure et Lieu
|
||||
</h5>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="dateDebut" value="Date de début" />
|
||||
<p:calendar id="dateDebut" value="#{creationEvenementBean.evenement.dateDebut}"
|
||||
pattern="dd/MM/yyyy" showIcon="true" required="true"
|
||||
locale="fr" />
|
||||
</div>
|
||||
|
||||
<div class="formgrid grid">
|
||||
<div class="field col">
|
||||
<p:outputLabel for="heureDebut" value="Heure début" />
|
||||
<p:calendar id="heureDebut" value="#{creationEvenementBean.evenement.heureDebut}"
|
||||
pattern="HH:mm" timeOnly="true" showIcon="true" />
|
||||
</div>
|
||||
<div class="field col">
|
||||
<p:outputLabel for="heureFin" value="Heure fin" />
|
||||
<p:calendar id="heureFin" value="#{creationEvenementBean.evenement.heureFin}"
|
||||
pattern="HH:mm" timeOnly="true" showIcon="true" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="evenementRecurrent" value="#{creationEvenementBean.evenement.recurrent}" />
|
||||
<p:outputLabel for="evenementRecurrent" value=" Événement récurrent" />
|
||||
</div>
|
||||
|
||||
<div class="field" style="display: #{creationEvenementBean.evenement.recurrent ? 'block' : 'none'};">
|
||||
<p:outputLabel for="frequenceRecurrence" value="Fréquence" />
|
||||
<p:selectOneMenu id="frequenceRecurrence" value="#{creationEvenementBean.evenement.frequenceRecurrence}">
|
||||
<f:selectItem itemLabel="Hebdomadaire" itemValue="HEBDOMADAIRE" />
|
||||
<f:selectItem itemLabel="Mensuel" itemValue="MENSUEL" />
|
||||
<f:selectItem itemLabel="Trimestriel" itemValue="TRIMESTRIEL" />
|
||||
<f:selectItem itemLabel="Annuel" itemValue="ANNUEL" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="lieu" value="Lieu" />
|
||||
<p:inputText id="lieu" value="#{creationEvenementBean.evenement.lieu}"
|
||||
required="true" placeholder="Ex: Salle de réunion, Hôtel..." />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="adresse" value="Adresse complète" />
|
||||
<p:inputTextarea id="adresse" value="#{creationEvenementBean.evenement.adresse}"
|
||||
rows="3" placeholder="Adresse précise avec ville et points de repère" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Configuration des participants -->
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-users mr-2"></i>
|
||||
Participants et Inscription
|
||||
</h5>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="placesMax" value="Nombre maximum de places" />
|
||||
<p:inputNumber id="placesMax" value="#{creationEvenementBean.evenement.placesMax}"
|
||||
symbol="" min="1" max="10000" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="inscriptionRequise" value="#{creationEvenementBean.evenement.inscriptionRequise}" />
|
||||
<p:outputLabel for="inscriptionRequise" value=" Inscription obligatoire" />
|
||||
</div>
|
||||
|
||||
<div class="field" style="display: #{creationEvenementBean.evenement.inscriptionRequise ? 'block' : 'none'};">
|
||||
<p:outputLabel for="dateLimiteInscription" value="Date limite d'inscription" />
|
||||
<p:calendar id="dateLimiteInscription" value="#{creationEvenementBean.evenement.dateLimiteInscription}"
|
||||
pattern="dd/MM/yyyy HH:mm" showIcon="true" locale="fr" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="publicCible" value="Public cible" />
|
||||
<p:selectCheckboxMenu id="publicCible" value="#{creationEvenementBean.evenement.publicCible}"
|
||||
multiple="true" filter="true" filterMatchMode="contains">
|
||||
<f:selectItem itemLabel="Tous les membres" itemValue="TOUS" />
|
||||
<f:selectItem itemLabel="Membres actifs" itemValue="ACTIFS" />
|
||||
<f:selectItem itemLabel="Membres bienfaiteurs" itemValue="BIENFAITEURS" />
|
||||
<f:selectItem itemLabel="Membres honoraires" itemValue="HONORAIRES" />
|
||||
<f:selectItem itemLabel="Bureau exécutif" itemValue="BUREAU" />
|
||||
<f:selectItem itemLabel="Invités externes" itemValue="INVITES" />
|
||||
</p:selectCheckboxMenu>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="listeAttente" value="#{creationEvenementBean.evenement.listeAttente}" />
|
||||
<p:outputLabel for="listeAttente" value=" Activer liste d'attente si complet" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="accompagnateurs" value="Nombre d'accompagnateurs autorisés" />
|
||||
<p:inputNumber id="accompagnateurs" value="#{creationEvenementBean.evenement.accompagnateursMax}"
|
||||
symbol="" min="0" max="10" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tarification -->
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-dollar mr-2"></i>
|
||||
Tarification et Paiement
|
||||
</h5>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="evenementPayant" value="#{creationEvenementBean.evenement.payant}" />
|
||||
<p:outputLabel for="evenementPayant" value=" Événement payant" />
|
||||
</div>
|
||||
|
||||
<div class="field" style="display: #{creationEvenementBean.evenement.payant ? 'block' : 'none'};">
|
||||
<p:outputLabel for="prix" value="Prix par personne" />
|
||||
<p:inputNumber id="prix" value="#{creationEvenementBean.evenement.prix}"
|
||||
symbol=" FCFA" symbolPosition="s" min="0" />
|
||||
</div>
|
||||
|
||||
<div class="field" style="display: #{creationEvenementBean.evenement.payant ? 'block' : 'none'};">
|
||||
<p:outputLabel for="tarificationDifferenciee" value="Tarification différenciée" />
|
||||
<p:selectBooleanCheckbox id="tarificationDifferenciee" value="#{creationEvenementBean.evenement.tarificationDifferenciee}" />
|
||||
<p:outputLabel for="tarificationDifferenciee" value=" Activer tarifs différents selon le type de membre" />
|
||||
</div>
|
||||
|
||||
<div class="field" style="display: #{creationEvenementBean.evenement.tarificationDifferenciee ? 'block' : 'none'};">
|
||||
<h6>Tarifs par catégorie</h6>
|
||||
<div class="formgrid grid">
|
||||
<div class="field col-6">
|
||||
<p:outputLabel value="Membres actifs" />
|
||||
<p:inputNumber value="#{creationEvenementBean.evenement.prixMembresActifs}"
|
||||
symbol=" FCFA" symbolPosition="s" />
|
||||
</div>
|
||||
<div class="field col-6">
|
||||
<p:outputLabel value="Membres associés" />
|
||||
<p:inputNumber value="#{creationEvenementBean.evenement.prixMembresAssocies}"
|
||||
symbol=" FCFA" symbolPosition="s" />
|
||||
</div>
|
||||
<div class="field col-6">
|
||||
<p:outputLabel value="Invités externes" />
|
||||
<p:inputNumber value="#{creationEvenementBean.evenement.prixInvites}"
|
||||
symbol=" FCFA" symbolPosition="s" />
|
||||
</div>
|
||||
<div class="field col-6">
|
||||
<p:outputLabel value="Accompagnateurs" />
|
||||
<p:inputNumber value="#{creationEvenementBean.evenement.prixAccompagnateurs}"
|
||||
symbol=" FCFA" symbolPosition="s" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field" style="display: #{creationEvenementBean.evenement.payant ? 'block' : 'none'};">
|
||||
<p:outputLabel for="modesPaiement" value="Modes de paiement acceptés" />
|
||||
<p:selectCheckboxMenu id="modesPaiement" value="#{creationEvenementBean.evenement.modesPaiement}"
|
||||
multiple="true">
|
||||
<f:selectItem itemLabel="💰 Espèces" itemValue="ESPECES" />
|
||||
<f:selectItem itemLabel="📱 Wave Money" itemValue="WAVE" />
|
||||
<f:selectItem itemLabel="🏦 Virement bancaire" itemValue="VIREMENT" />
|
||||
<f:selectItem itemLabel="💳 Chèque" itemValue="CHEQUE" />
|
||||
<f:selectItem itemLabel="💸 Prélèvement automatique" itemValue="PRELEVEMENT" />
|
||||
</p:selectCheckboxMenu>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Notifications et communication -->
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-bell mr-2"></i>
|
||||
Notifications et Communication
|
||||
</h5>
|
||||
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="notifierCreation" value="#{creationEvenementBean.evenement.notifierCreation}" />
|
||||
<p:outputLabel for="notifierCreation" value=" Notifier immédiatement la création" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="canauxNotification" value="Canaux de notification" />
|
||||
<p:selectCheckboxMenu id="canauxNotification" value="#{creationEvenementBean.evenement.canauxNotification}"
|
||||
multiple="true">
|
||||
<f:selectItem itemLabel="📧 Email" itemValue="EMAIL" />
|
||||
<f:selectItem itemLabel="📱 SMS" itemValue="SMS" />
|
||||
<f:selectItem itemLabel="💬 WhatsApp" itemValue="WHATSAPP" />
|
||||
<f:selectItem itemLabel="🔔 Notification push" itemValue="PUSH" />
|
||||
</p:selectCheckboxMenu>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="messagePersonnalise" value="Message personnalisé" />
|
||||
<p:inputTextarea id="messagePersonnalise" value="#{creationEvenementBean.evenement.messagePersonnalise}"
|
||||
rows="4" placeholder="Message d'invitation personnalisé..." />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<h6>Rappels automatiques</h6>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="rappelJ7" value="#{creationEvenementBean.evenement.rappelJ7}" />
|
||||
<p:outputLabel for="rappelJ7" value=" Rappel 7 jours avant" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="rappelJ3" value="#{creationEvenementBean.evenement.rappelJ3}" />
|
||||
<p:outputLabel for="rappelJ3" value=" Rappel 3 jours avant" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="rappelJ1" value="#{creationEvenementBean.evenement.rappelJ1}" />
|
||||
<p:outputLabel for="rappelJ1" value=" Rappel 1 jour avant" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="rappelH2" value="#{creationEvenementBean.evenement.rappelH2}" />
|
||||
<p:outputLabel for="rappelH2" value=" Rappel 2 heures avant" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="notificationSuivi" value="#{creationEvenementBean.evenement.notificationSuivi}" />
|
||||
<p:outputLabel for="notificationSuivi" value=" Envoyer bilan après l'événement" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Documents et pièces jointes -->
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-file mr-2"></i>
|
||||
Documents et Pièces Jointes
|
||||
</h5>
|
||||
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="field">
|
||||
<p:outputLabel for="programme" value="Programme détaillé" />
|
||||
<p:fileUpload id="programme" mode="simple" skinSimple="true"
|
||||
accept="application/pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="invitation" value="Carte d'invitation" />
|
||||
<p:fileUpload id="invitation" mode="simple" skinSimple="true"
|
||||
accept="image/*,application/pdf" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="field">
|
||||
<p:outputLabel for="documentsComplementaires" value="Documents complémentaires" />
|
||||
<p:fileUpload id="documentsComplementaires" mode="advanced"
|
||||
multiple="true" dragDropSupport="true"
|
||||
uploadLabel="Télécharger" cancelLabel="Annuler" chooseLabel="Sélectionner"
|
||||
sizeLimit="10000000" fileLimit="5" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Actions -->
|
||||
<div class="card">
|
||||
<h5>Finalisation</h5>
|
||||
<div class="surface-50 p-4 border-round mb-4">
|
||||
<div class="flex align-items-center">
|
||||
<i class="pi pi-info-circle text-blue-500 mr-3"></i>
|
||||
<div>
|
||||
<div class="font-medium text-900">Vérifiez toutes les informations</div>
|
||||
<div class="text-600">L'événement sera créé avec le statut "Planifié" et pourra être modifié ultérieurement</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<p:commandButton value="🎯 Créer l'événement" icon="pi pi-check"
|
||||
styleClass="ui-button ui-button-success"
|
||||
action="#{creationEvenementBean.creerEvenement}"
|
||||
update="messages"
|
||||
disabled="#{!creationEvenementBean.formulaireValide}" />
|
||||
|
||||
<p:commandButton value="💾 Enregistrer brouillon" icon="pi pi-save"
|
||||
styleClass="ui-button ui-button-outlined ui-button-info"
|
||||
action="#{creationEvenementBean.enregistrerBrouillon}"
|
||||
update="messages" />
|
||||
|
||||
<p:commandButton value="👁️ Prévisualiser" icon="pi pi-eye"
|
||||
styleClass="ui-button ui-button-outlined ui-button-warning"
|
||||
onclick="PF('dlgPreview').show();"
|
||||
type="button" />
|
||||
|
||||
<p:commandButton value="🔄 Réinitialiser" icon="pi pi-refresh"
|
||||
styleClass="ui-button ui-button-outlined ui-button-secondary"
|
||||
type="reset"
|
||||
onclick="return confirm('Êtes-vous sûr de vouloir réinitialiser le formulaire ?');" />
|
||||
|
||||
<p:commandButton value="❌ Annuler" icon="pi pi-times"
|
||||
styleClass="ui-button ui-button-outlined ui-button-danger"
|
||||
action="/pages/admin/evenements/liste?faces-redirect=true"
|
||||
immediate="true"
|
||||
onclick="return confirm('Êtes-vous sûr de vouloir annuler la création ?');" />
|
||||
</div>
|
||||
|
||||
<div class="mt-4 text-600">
|
||||
<small>
|
||||
<i class="pi pi-shield mr-1"></i>
|
||||
Les données de l'événement sont sécurisées et conformes RGPD
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</h:form>
|
||||
|
||||
<!-- Dialog Prévisualisation -->
|
||||
<p:dialog header="Prévisualisation de l'événement" widgetVar="dlgPreview" modal="true" width="800" height="600">
|
||||
<h:form id="formPreview">
|
||||
<div class="card border-none p-0">
|
||||
<div class="flex align-items-start mb-4">
|
||||
<div class="border-round p-3 mr-3" style="background: var(--primary-color);">
|
||||
<i class="pi pi-calendar text-white text-2xl"></i>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<h4 class="mt-0 mb-2">#{creationEvenementBean.evenement.titre}</h4>
|
||||
<div class="text-600 mb-2">#{creationEvenementBean.evenement.typeEvenementLibelle}</div>
|
||||
<p:tag value="#{creationEvenementBean.evenement.priorite}"
|
||||
severity="#{creationEvenementBean.evenement.prioriteSeverity}" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<h6>📅 Date et Heure</h6>
|
||||
<p>#{creationEvenementBean.evenement.dateCompleteFormatee}</p>
|
||||
|
||||
<h6>📍 Lieu</h6>
|
||||
<p>#{creationEvenementBean.evenement.lieu}</p>
|
||||
<small class="text-600">#{creationEvenementBean.evenement.adresse}</small>
|
||||
|
||||
<h6>👥 Participants</h6>
|
||||
<p>Maximum #{creationEvenementBean.evenement.placesMax} places</p>
|
||||
<p>Public: #{creationEvenementBean.evenement.publicCibleFormate}</p>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<h6>💰 Tarification</h6>
|
||||
<p>
|
||||
<span class="text-green-500 font-bold" rendered="#{!creationEvenementBean.evenement.payant}">Gratuit</span>
|
||||
<span rendered="#{creationEvenementBean.evenement.payant}">
|
||||
Prix: #{creationEvenementBean.evenement.prix} FCFA
|
||||
</span>
|
||||
</p>
|
||||
|
||||
<h6>🔔 Notifications</h6>
|
||||
<p>Canaux: #{creationEvenementBean.evenement.canauxNotificationFormates}</p>
|
||||
|
||||
<h6>👨💼 Organisateur</h6>
|
||||
<p>#{creationEvenementBean.evenement.organisateur}</p>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<h6>📝 Description</h6>
|
||||
<p class="line-height-3">#{creationEvenementBean.evenement.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-2 mt-4">
|
||||
<p:commandButton value="Modifier" icon="pi pi-pencil"
|
||||
styleClass="ui-button-warning"
|
||||
onclick="PF('dlgPreview').hide();"
|
||||
type="button" />
|
||||
<p:commandButton value="Créer maintenant" icon="pi pi-check"
|
||||
styleClass="ui-button-success"
|
||||
action="#{creationEvenementBean.creerEvenement}"
|
||||
update=":formCreation:messages"
|
||||
oncomplete="if(!args.validationFailed) PF('dlgPreview').hide();" />
|
||||
<p:commandButton value="Fermer" icon="pi pi-times"
|
||||
styleClass="ui-button-secondary"
|
||||
onclick="PF('dlgPreview').hide();"
|
||||
type="button" />
|
||||
</div>
|
||||
</h:form>
|
||||
</p:dialog>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,588 @@
|
||||
<!DOCTYPE html>
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://xmlns.jcp.org/jsf/html"
|
||||
xmlns:f="http://xmlns.jcp.org/jsf/core"
|
||||
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/templates/main-template.xhtml">
|
||||
|
||||
<ui:define name="title">Gestion des Événements - UnionFlow</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<div class="ui-fluid">
|
||||
<!-- En-tête principal avec disposition Freya stricte -->
|
||||
<div class="card">
|
||||
<div class="formgrid grid">
|
||||
<div class="field col-12 lg:col-8">
|
||||
<h2 class="text-primary font-bold mb-2">
|
||||
<i class="pi pi-calendar text-blue-500 mr-2"></i>
|
||||
Gestion des Événements
|
||||
</h2>
|
||||
<p class="text-600 mt-0">
|
||||
Planification et suivi des activités associatives •
|
||||
<span class="font-semibold">#{evenementsBean.statistiques.totalEvenements} événements</span> •
|
||||
<span class="font-semibold text-green-600">#{evenementsBean.statistiques.evenementsActifs} actifs</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field col-12 lg:col-4 text-right">
|
||||
<h:form id="formActionsEntete">
|
||||
<p:commandButton icon="pi pi-plus"
|
||||
title="Nouvel événement"
|
||||
styleClass="ui-button-success ui-button-sm mr-3"
|
||||
onclick="PF('dlgNouvelEvenement').show();" />
|
||||
<p:commandButton icon="pi pi-calendar"
|
||||
title="Planning mensuel"
|
||||
styleClass="ui-button-info ui-button-outlined ui-button-sm mr-3"
|
||||
onclick="PF('dlgPlanningMensuel').show();" />
|
||||
<p:commandButton icon="pi pi-download"
|
||||
title="Exporter"
|
||||
styleClass="ui-button-secondary ui-button-outlined ui-button-sm"
|
||||
action="#{evenementsBean.exporterEvenements}" />
|
||||
</h:form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- KPIs avec grille Freya stricte -->
|
||||
<div class="formgrid grid">
|
||||
<!-- KPI 1: Total Événements -->
|
||||
<ui:include src="/templates/components/cards/kpi-card.xhtml">
|
||||
<ui:param name="title" value="Total Événements" />
|
||||
<ui:param name="value" value="#{evenementsBean.statistiques.totalEvenements}" />
|
||||
<ui:param name="icon" value="pi-calendar" />
|
||||
<ui:param name="iconColor" value="blue-600" />
|
||||
<ui:param name="growthValue" value="#{evenementsBean.statistiques.evenementsCeMois}" />
|
||||
<ui:param name="growthLabel" value="ce mois" />
|
||||
<ui:param name="growthType" value="number" />
|
||||
<ui:param name="showProgress" value="false" />
|
||||
</ui:include>
|
||||
|
||||
<!-- KPI 2: Événements Actifs -->
|
||||
<ui:include src="/templates/components/cards/kpi-card.xhtml">
|
||||
<ui:param name="title" value="Événements Actifs" />
|
||||
<ui:param name="value" value="#{evenementsBean.statistiques.evenementsActifs}" />
|
||||
<ui:param name="icon" value="pi-check" />
|
||||
<ui:param name="iconColor" value="green-600" />
|
||||
<ui:param name="progressValue" value="#{evenementsBean.statistiques.tauxParticipationMoyen}" />
|
||||
<ui:param name="noDataLabel" value="#{evenementsBean.statistiques.tauxParticipationMoyen}% de participation" />
|
||||
<ui:param name="showGrowth" value="false" />
|
||||
</ui:include>
|
||||
|
||||
<!-- KPI 3: Participants Inscrits -->
|
||||
<ui:include src="/templates/components/cards/kpi-card.xhtml">
|
||||
<ui:param name="title" value="Participants" />
|
||||
<ui:param name="value" value="#{evenementsBean.statistiques.participantsTotal}" />
|
||||
<ui:param name="icon" value="pi-users" />
|
||||
<ui:param name="iconColor" value="orange-600" />
|
||||
<ui:param name="statusIcon" value="pi-info-circle" />
|
||||
<ui:param name="statusLabel" value="Moyenne" />
|
||||
<ui:param name="statusValue" value="#{evenementsBean.statistiques.moyenneParticipants}/événement" />
|
||||
<ui:param name="showProgress" value="false" />
|
||||
</ui:include>
|
||||
|
||||
<!-- KPI 4: Budget Total -->
|
||||
<ui:include src="/templates/components/cards/kpi-card.xhtml">
|
||||
<ui:param name="title" value="Budget Total" />
|
||||
<ui:param name="value" value="#{evenementsBean.statistiques.budgetTotal}" />
|
||||
<ui:param name="icon" value="pi-dollar" />
|
||||
<ui:param name="iconColor" value="purple-600" />
|
||||
<ui:param name="statusIcon" value="pi-trending-up" />
|
||||
<ui:param name="statusLabel" value="Suivi budgétaire" />
|
||||
<ui:param name="statusValue" value="optimal" />
|
||||
<ui:param name="showProgress" value="false" />
|
||||
</ui:include>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Calendrier visuel des événements avec structure Freya -->
|
||||
<div class="card">
|
||||
<h5 class="mb-3">
|
||||
<i class="pi pi-calendar text-blue-500 mr-2"></i>
|
||||
Événements à Venir
|
||||
</h5>
|
||||
<div class="formgrid grid">
|
||||
<ui:repeat value="#{evenementsBean.evenementsProchains}" var="event" varStatus="status">
|
||||
<div class="field col-12 md:col-6 lg:col-4">
|
||||
<div class="surface-50 border-round-lg p-3 hover:surface-100 transition-colors transition-duration-150">
|
||||
<div class="flex align-items-start justify-content-between mb-3">
|
||||
<div class="flex align-items-center">
|
||||
<div class="flex align-items-center justify-content-center bg-primary-100 border-round-lg mr-3"
|
||||
style="width: 2.5rem; height: 2.5rem;">
|
||||
<i class="pi #{event.typeIcon} text-primary-600"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="text-900 font-medium m-0 mb-1">#{event.titre}</h6>
|
||||
<p:tag value="#{event.typeLibelle}"
|
||||
severity="#{event.typeSeverity}"
|
||||
styleClass="text-xs" />
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-500 text-sm font-semibold">#{event.joursRestants}j</span>
|
||||
</div>
|
||||
|
||||
<div class="text-600 mb-3">
|
||||
<div class="flex align-items-center mb-2">
|
||||
<i class="pi pi-calendar text-blue-500 mr-2"></i>
|
||||
<span class="text-sm">#{event.dateDebutFormatee}</span>
|
||||
</div>
|
||||
<div class="flex align-items-center mb-2">
|
||||
<i class="pi pi-map-marker text-orange-500 mr-2"></i>
|
||||
<span class="text-sm">#{event.lieu}</span>
|
||||
</div>
|
||||
<div class="flex align-items-center">
|
||||
<i class="pi pi-users text-green-500 mr-2"></i>
|
||||
<span class="text-sm">#{event.participantsInscrits}/#{event.capaciteMax} participants</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-content-between align-items-center">
|
||||
<div class="flex-1 mr-3">
|
||||
<p:progressBar value="#{event.tauxInscription}"
|
||||
showValue="false"
|
||||
styleClass="surface-200"
|
||||
style="height: 0.5rem;" />
|
||||
<div class="text-500 text-xs mt-1">#{event.tauxInscription}% rempli</div>
|
||||
</div>
|
||||
<h:form>
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-info ui-button-sm"
|
||||
title="Voir détails">
|
||||
<f:setPropertyActionListener target="#{evenementsBean.evenementSelectionne}" value="#{event}" />
|
||||
</p:commandButton>
|
||||
</h:form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:repeat>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Section Filtres avec structure Freya -->
|
||||
<div class="card">
|
||||
<h5 class="mb-3">
|
||||
<i class="pi pi-filter text-blue-500 mr-2"></i>
|
||||
Filtres et Recherche
|
||||
</h5>
|
||||
<h:form id="formFiltres">
|
||||
<div class="formgrid grid">
|
||||
<!-- Ligne 1: 4 champs principaux -->
|
||||
<div class="field col-12 md:col-6 lg:col-3">
|
||||
<label for="searchTitre" class="block text-900 font-medium mb-2">Titre de l'événement</label>
|
||||
<p:inputText id="searchTitre"
|
||||
value="#{evenementsBean.filtres.titre}"
|
||||
placeholder="Rechercher par titre..."
|
||||
styleClass="w-full">
|
||||
<p:ajax event="keyup" delay="300"
|
||||
update=":formTableEvenements:dtEvenements" />
|
||||
</p:inputText>
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6 lg:col-3">
|
||||
<label for="filterType" class="block text-900 font-medium mb-2">Type d'événement</label>
|
||||
<p:selectOneMenu id="filterType"
|
||||
value="#{evenementsBean.filtres.type}"
|
||||
styleClass="w-full">
|
||||
<f:selectItem itemLabel="Tous les types" itemValue="" />
|
||||
<f:selectItem itemLabel="Réunion" itemValue="REUNION" />
|
||||
<f:selectItem itemLabel="Formation" itemValue="FORMATION" />
|
||||
<f:selectItem itemLabel="Action Sociale" itemValue="ACTION_SOCIALE" />
|
||||
<f:selectItem itemLabel="Assemblée Générale" itemValue="ASSEMBLEE_GENERALE" />
|
||||
<f:selectItem itemLabel="Événement Festif" itemValue="EVENEMENT_FESTIF" />
|
||||
<p:ajax update=":formTableEvenements:dtEvenements" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6 lg:col-3">
|
||||
<label for="filterStatut" class="block text-900 font-medium mb-2">Statut</label>
|
||||
<p:selectOneMenu id="filterStatut"
|
||||
value="#{evenementsBean.filtres.statut}"
|
||||
styleClass="w-full">
|
||||
<f:selectItem itemLabel="Tous les statuts" itemValue="" />
|
||||
<f:selectItem itemLabel="Planifié" itemValue="PLANIFIE" />
|
||||
<f:selectItem itemLabel="En cours" itemValue="EN_COURS" />
|
||||
<f:selectItem itemLabel="Terminé" itemValue="TERMINE" />
|
||||
<f:selectItem itemLabel="Annulé" itemValue="ANNULE" />
|
||||
<p:ajax update=":formTableEvenements:dtEvenements" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6 lg:col-3">
|
||||
<label for="filterPriorite" class="block text-900 font-medium mb-2">Priorité</label>
|
||||
<p:selectOneMenu id="filterPriorite"
|
||||
value="#{evenementsBean.filtres.priorite}"
|
||||
styleClass="w-full">
|
||||
<f:selectItem itemLabel="Toutes les priorités" itemValue="" />
|
||||
<f:selectItem itemLabel="Faible" itemValue="FAIBLE" />
|
||||
<f:selectItem itemLabel="Normale" itemValue="NORMALE" />
|
||||
<f:selectItem itemLabel="Élevée" itemValue="ELEVEE" />
|
||||
<f:selectItem itemLabel="Critique" itemValue="CRITIQUE" />
|
||||
<p:ajax update=":formTableEvenements:dtEvenements" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<!-- Ligne 2: Période et Organisateur -->
|
||||
<div class="field col-12 md:col-6 lg:col-4">
|
||||
<label for="filterDateDebut" class="block text-900 font-medium mb-2">Période</label>
|
||||
<div class="flex gap-2">
|
||||
<p:datePicker id="filterDateDebut"
|
||||
value="#{evenementsBean.filtres.dateDebut}"
|
||||
placeholder="Date début"
|
||||
styleClass="w-full">
|
||||
<p:ajax update=":formTableEvenements:dtEvenements" />
|
||||
</p:datePicker>
|
||||
<p:datePicker id="filterDateFin"
|
||||
value="#{evenementsBean.filtres.dateFin}"
|
||||
placeholder="Date fin"
|
||||
styleClass="w-full">
|
||||
<p:ajax update=":formTableEvenements:dtEvenements" />
|
||||
</p:datePicker>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6 lg:col-4">
|
||||
<label for="filterOrganisateur" class="block text-900 font-medium mb-2">Organisateur</label>
|
||||
<p:inputText id="filterOrganisateur"
|
||||
value="#{evenementsBean.filtres.organisateur}"
|
||||
placeholder="Filtrer par organisateur..."
|
||||
styleClass="w-full">
|
||||
<p:ajax event="keyup" delay="300"
|
||||
update=":formTableEvenements:dtEvenements" />
|
||||
</p:inputText>
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-12 lg:col-4">
|
||||
<label class="block text-900 font-medium mb-2"> </label>
|
||||
<div class="flex justify-content-start">
|
||||
<p:commandButton value="Réinitialiser"
|
||||
icon="pi pi-refresh"
|
||||
styleClass="ui-button-outlined ui-button-secondary ui-button-sm"
|
||||
action="#{evenementsBean.reinitialiserFiltres}"
|
||||
update="@form :formTableEvenements:dtEvenements" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</h:form>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Table des Événements avec structure Freya -->
|
||||
<div class="card">
|
||||
<h:form id="formTableEvenements">
|
||||
<div class="flex align-items-center justify-content-between mb-3">
|
||||
<h5 class="m-0">
|
||||
<i class="pi pi-list text-primary mr-2"></i>
|
||||
Liste des Événements
|
||||
</h5>
|
||||
<div class="flex gap-3 align-items-center">
|
||||
<p:commandButton value="Actions groupées"
|
||||
icon="pi pi-bars"
|
||||
styleClass="ui-button-warning ui-button-sm"
|
||||
onclick="PF('dlgActionsGroupees').show();"
|
||||
disabled="#{empty evenementsBean.evenementsSelectionnes}" />
|
||||
<p:commandButton value="Export Excel"
|
||||
icon="pi pi-file-excel"
|
||||
styleClass="ui-button-success ui-button-outlined ui-button-sm"
|
||||
action="#{evenementsBean.exporterExcel}" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p:dataTable id="dtEvenements"
|
||||
value="#{evenementsBean.evenementsFiltres}"
|
||||
var="evenement"
|
||||
selection="#{evenementsBean.evenementsSelectionnes}"
|
||||
rowKey="#{evenement.id}"
|
||||
paginator="true"
|
||||
rows="20"
|
||||
paginatorPosition="bottom"
|
||||
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
|
||||
rowsPerPageTemplate="10,20,50,100"
|
||||
currentPageReportTemplate="Affichage {startRecord}-{endRecord} sur {totalRecords} événements"
|
||||
styleClass="p-datatable-sm p-datatable-gridlines p-datatable-striped"
|
||||
emptyMessage="Aucun événement trouvé">
|
||||
|
||||
<p:column selectionMode="multiple" style="width:3rem" exportable="false"/>
|
||||
|
||||
<p:column headerText="Événement" sortBy="#{evenement.titre}" filterBy="#{evenement.titre}">
|
||||
<div class="flex align-items-center">
|
||||
<div class="flex align-items-center justify-content-center bg-primary-100 border-circle mr-2"
|
||||
style="width: 2rem; height: 2rem;">
|
||||
<i class="pi #{evenement.typeEvenementIcon} text-primary-600"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-900 font-medium">#{evenement.titre}</div>
|
||||
<div class="text-500 text-xs">#{evenement.description}</div>
|
||||
</div>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Type" sortBy="#{evenement.typeEvenement}" filterBy="#{evenement.typeEvenement}" style="width:8rem">
|
||||
<p:tag value="#{evenement.typeEvenementLibelle}"
|
||||
severity="#{evenement.typeEvenementSeverity}"
|
||||
icon="pi #{evenement.typeEvenementIcon}"
|
||||
styleClass="text-xs" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Date et Heure" sortBy="#{evenement.dateDebut}" style="width:10rem">
|
||||
<div>
|
||||
<div class="text-900 font-medium text-sm">#{evenement.dateDebutFormatee}</div>
|
||||
<div class="text-500 text-xs">#{evenement.heureDebutFormatee} - #{evenement.heureFinFormatee}</div>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Lieu" style="width:10rem">
|
||||
<div>
|
||||
<div class="text-900 font-medium text-sm">#{evenement.lieu}</div>
|
||||
<div class="text-500 text-xs">#{evenement.adresse}</div>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Organisateur">
|
||||
<div class="flex align-items-center" rendered="#{evenement.organisateur != null}">
|
||||
<div class="bg-300 border-circle mr-2" style="width: 1.5rem; height: 1.5rem;"></div>
|
||||
<div>
|
||||
<div class="text-900 text-sm">#{evenement.organisateur}</div>
|
||||
<div class="text-500 text-xs">#{evenement.organisateurEmail}</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-400 text-xs" rendered="#{evenement.organisateur == null}">
|
||||
Aucun organisateur
|
||||
</span>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Participants" sortBy="#{evenement.participantsInscrits}" style="width:8rem; text-align:center">
|
||||
<div class="text-center">
|
||||
<div class="text-900 font-bold">#{evenement.participantsInscrits}</div>
|
||||
<div class="text-500 text-xs mb-1">/#{evenement.capaciteMax} places</div>
|
||||
<p:progressBar value="#{evenement.tauxInscription}"
|
||||
showValue="false"
|
||||
styleClass="surface-200"
|
||||
style="height: 0.3rem;" />
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Budget" sortBy="#{evenement.budget}" style="width:8rem">
|
||||
<div class="text-900 font-bold text-right">#{evenement.budgetFormatte}</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Priorité" sortBy="#{evenement.priorite}" filterBy="#{evenement.priorite}" style="width:7rem">
|
||||
<p:tag value="#{evenement.priorite}"
|
||||
severity="#{evenement.prioriteSeverity}"
|
||||
styleClass="text-xs w-full" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" sortBy="#{evenement.statut}" filterBy="#{evenement.statut}" style="width:8rem">
|
||||
<p:tag value="#{evenement.statut}"
|
||||
severity="#{evenement.statutSeverity}"
|
||||
icon="pi #{evenement.statutIcon}"
|
||||
styleClass="text-xs w-full" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" style="width:8rem" exportable="false">
|
||||
<h:form id="formActions#{evenement.id}">
|
||||
<div class="flex gap-1">
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-info ui-button-sm"
|
||||
onclick="PF('dlgDetailsEvenement').show();"
|
||||
title="Voir détails">
|
||||
<f:setPropertyActionListener target="#{evenementsBean.evenementSelectionne}" value="#{evenement}" />
|
||||
</p:commandButton>
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-warning ui-button-sm"
|
||||
onclick="PF('dlgModifierEvenement').show();"
|
||||
title="Modifier">
|
||||
<f:setPropertyActionListener target="#{evenementsBean.evenementSelectionne}" value="#{evenement}" />
|
||||
</p:commandButton>
|
||||
<p:commandButton icon="pi pi-cog"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-secondary ui-button-sm"
|
||||
onclick="PF('dlgActionsEvenement').show();"
|
||||
title="Actions">
|
||||
<f:setPropertyActionListener target="#{evenementsBean.evenementSelectionne}" value="#{evenement}" />
|
||||
</p:commandButton>
|
||||
</div>
|
||||
</h:form>
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
</h:form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Dialogs avec structure Freya -->
|
||||
|
||||
<!-- Dialog Nouvel Événement -->
|
||||
<p:dialog header="Créer un Nouvel Événement"
|
||||
widgetVar="dlgNouvelEvenement"
|
||||
modal="true"
|
||||
width="800"
|
||||
height="auto"
|
||||
resizable="false">
|
||||
<h:form id="formNouvelEvenement">
|
||||
<div class="ui-fluid formgrid grid">
|
||||
<div class="field col-12 md:col-6">
|
||||
<label for="newTitre" class="block text-900 font-medium mb-2">Titre de l'événement *</label>
|
||||
<p:inputText id="newTitre"
|
||||
value="#{evenementsBean.nouvelEvenement.titre}"
|
||||
required="true"
|
||||
placeholder="Ex: Assemblée Générale 2024" />
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6">
|
||||
<label for="newType" class="block text-900 font-medium mb-2">Type d'événement *</label>
|
||||
<p:selectOneMenu id="newType"
|
||||
value="#{evenementsBean.nouvelEvenement.typeEvenement}"
|
||||
required="true">
|
||||
<f:selectItem itemLabel="Sélectionner un type" itemValue="" />
|
||||
<f:selectItem itemLabel="Réunion" itemValue="REUNION" />
|
||||
<f:selectItem itemLabel="Formation" itemValue="FORMATION" />
|
||||
<f:selectItem itemLabel="Action Sociale" itemValue="ACTION_SOCIALE" />
|
||||
<f:selectItem itemLabel="Assemblée Générale" itemValue="ASSEMBLEE_GENERALE" />
|
||||
<f:selectItem itemLabel="Événement Festif" itemValue="EVENEMENT_FESTIF" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6">
|
||||
<label for="newDateDebut" class="block text-900 font-medium mb-2">Date de début *</label>
|
||||
<p:datePicker id="newDateDebut"
|
||||
value="#{evenementsBean.nouvelEvenement.dateDebut}"
|
||||
required="true" />
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6">
|
||||
<label for="newDateFin" class="block text-900 font-medium mb-2">Date de fin</label>
|
||||
<p:datePicker id="newDateFin"
|
||||
value="#{evenementsBean.nouvelEvenement.dateFin}" />
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6">
|
||||
<label for="newLieu" class="block text-900 font-medium mb-2">Lieu *</label>
|
||||
<p:inputText id="newLieu"
|
||||
value="#{evenementsBean.nouvelEvenement.lieu}"
|
||||
required="true"
|
||||
placeholder="Ex: Salle de conférence" />
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-6">
|
||||
<label for="newCapacite" class="block text-900 font-medium mb-2">Capacité maximum</label>
|
||||
<p:inputNumber id="newCapacite"
|
||||
value="#{evenementsBean.nouvelEvenement.capaciteMax}"
|
||||
placeholder="100" />
|
||||
</div>
|
||||
|
||||
<div class="field col-12">
|
||||
<label for="newAdresse" class="block text-900 font-medium mb-2">Adresse complète</label>
|
||||
<p:inputTextarea id="newAdresse"
|
||||
value="#{evenementsBean.nouvelEvenement.adresse}"
|
||||
rows="2"
|
||||
placeholder="Adresse complète de l'événement..." />
|
||||
</div>
|
||||
|
||||
<div class="field col-12">
|
||||
<label for="newDescription" class="block text-900 font-medium mb-2">Description</label>
|
||||
<p:inputTextarea id="newDescription"
|
||||
value="#{evenementsBean.nouvelEvenement.description}"
|
||||
rows="3"
|
||||
placeholder="Description détaillée de l'événement..." />
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-4">
|
||||
<label for="newPriorite" class="block text-900 font-medium mb-2">Priorité</label>
|
||||
<p:selectOneMenu id="newPriorite"
|
||||
value="#{evenementsBean.nouvelEvenement.priorite}">
|
||||
<f:selectItem itemLabel="Normale" itemValue="NORMALE" />
|
||||
<f:selectItem itemLabel="Faible" itemValue="FAIBLE" />
|
||||
<f:selectItem itemLabel="Élevée" itemValue="ELEVEE" />
|
||||
<f:selectItem itemLabel="Critique" itemValue="CRITIQUE" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-4">
|
||||
<label for="newOrganisateur" class="block text-900 font-medium mb-2">Organisateur</label>
|
||||
<p:inputText id="newOrganisateur"
|
||||
value="#{evenementsBean.nouvelEvenement.organisateur}"
|
||||
placeholder="Nom de l'organisateur" />
|
||||
</div>
|
||||
|
||||
<div class="field col-12 md:col-4">
|
||||
<label for="newBudget" class="block text-900 font-medium mb-2">Budget estimé</label>
|
||||
<p:inputNumber id="newBudget"
|
||||
value="#{evenementsBean.nouvelEvenement.budget}"
|
||||
mode="currency"
|
||||
currency="XOF"
|
||||
locale="fr-CI"
|
||||
placeholder="50000" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-content-end gap-2 mt-3">
|
||||
<p:commandButton value="Annuler"
|
||||
icon="pi pi-times"
|
||||
styleClass="ui-button-secondary ui-button-outlined ui-button-sm"
|
||||
onclick="PF('dlgNouvelEvenement').hide();"
|
||||
type="button" />
|
||||
<p:commandButton value="Créer l'événement"
|
||||
icon="pi pi-check"
|
||||
styleClass="ui-button-success ui-button-sm"
|
||||
action="#{evenementsBean.creerEvenement}"
|
||||
update="@form :formTableEvenements:dtEvenements"
|
||||
oncomplete="if(!args.validationFailed) PF('dlgNouvelEvenement').hide();" />
|
||||
</div>
|
||||
</h:form>
|
||||
</p:dialog>
|
||||
|
||||
|
||||
<!-- Dialog Actions Événement -->
|
||||
<p:dialog header="Actions sur l'Événement"
|
||||
widgetVar="dlgActionsEvenement"
|
||||
modal="true"
|
||||
width="400"
|
||||
height="auto"
|
||||
resizable="false">
|
||||
<h:form id="formActionsEvenement">
|
||||
<div class="surface-50 border-round-lg p-3 mb-3">
|
||||
<div class="text-500 text-sm mb-1">Événement sélectionné</div>
|
||||
<div class="text-900 font-bold">#{evenementsBean.evenementSelectionne.titre}</div>
|
||||
<div class="text-500 text-sm">#{evenementsBean.evenementSelectionne.dateDebutFormatee}</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-column gap-2">
|
||||
<p:commandButton value="Gérer les participants"
|
||||
icon="pi pi-users"
|
||||
styleClass="ui-button-info ui-button-outlined ui-button-sm w-full"
|
||||
action="#{evenementsBean.gererParticipants}" />
|
||||
|
||||
<p:commandButton value="Envoyer invitations"
|
||||
icon="pi pi-send"
|
||||
styleClass="ui-button-success ui-button-outlined ui-button-sm w-full"
|
||||
action="#{evenementsBean.envoyerInvitations}" />
|
||||
|
||||
<p:commandButton value="Rapports de participation"
|
||||
icon="pi pi-chart-bar"
|
||||
styleClass="ui-button-secondary ui-button-outlined ui-button-sm w-full"
|
||||
action="#{evenementsBean.voirRapports}" />
|
||||
|
||||
<p:commandButton value="Planning mensuel"
|
||||
icon="pi pi-calendar"
|
||||
styleClass="ui-button-warning ui-button-outlined ui-button-sm w-full"
|
||||
onclick="PF('dlgPlanningMensuel').show();" />
|
||||
|
||||
<p:commandButton value="Dupliquer l'événement"
|
||||
icon="pi pi-copy"
|
||||
styleClass="ui-button-info ui-button-outlined ui-button-sm w-full"
|
||||
action="#{evenementsBean.dupliquerEvenement}" />
|
||||
|
||||
<hr class="surface-border" />
|
||||
|
||||
<p:commandButton value="Annuler l'événement"
|
||||
icon="pi pi-ban"
|
||||
styleClass="ui-button-danger ui-button-sm w-full"
|
||||
onclick="return confirm('ATTENTION: Confirmer l\'annulation ?');"
|
||||
action="#{evenementsBean.annulerEvenement}"
|
||||
rendered="#{evenementsBean.evenementSelectionne.statut != 'ANNULE'}" />
|
||||
</div>
|
||||
</h:form>
|
||||
</p:dialog>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,430 @@
|
||||
<!DOCTYPE html>
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://xmlns.jcp.org/jsf/html"
|
||||
xmlns:f="http://xmlns.jcp.org/jsf/core"
|
||||
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/templates/main-template.xhtml">
|
||||
|
||||
<ui:define name="title">Gestion des Événements - UnionFlow</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<!-- En-tête -->
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<h3 class="mb-2">
|
||||
<i class="pi pi-calendar text-blue-500 mr-2"></i>
|
||||
Gestion des Événements
|
||||
</h3>
|
||||
<p class="text-600 m-0">#{evenementBean.totalEvenements} événements • #{evenementBean.evenementsActifs} actifs • #{evenementBean.prochainEvenement}</p>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<p:commandButton value="Nouvel événement"
|
||||
icon="pi pi-plus"
|
||||
styleClass="ui-button-success"
|
||||
action="/pages/admin/evenements/creation?faces-redirect=true" />
|
||||
<p:commandButton value="Calendrier"
|
||||
icon="pi pi-calendar-plus"
|
||||
styleClass="ui-button-outlined ui-button-info"
|
||||
action="#{evenementBean.voirCalendrier}" />
|
||||
<p:commandButton value="Import/Export"
|
||||
icon="pi pi-download"
|
||||
styleClass="ui-button-outlined ui-button-secondary"
|
||||
action="#{evenementBean.importExport}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Statistiques -->
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-blue-100 border-left-3 border-blue-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-blue-900 font-bold text-2xl">#{evenementBean.evenementsActifs}</div>
|
||||
<div class="text-blue-700">Événements Actifs</div>
|
||||
</div>
|
||||
<div class="bg-blue-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-calendar text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-green-100 border-left-3 border-green-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-green-900 font-bold text-2xl">#{evenementBean.totalParticipants}</div>
|
||||
<div class="text-green-700">Participants Inscrits</div>
|
||||
</div>
|
||||
<div class="bg-green-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-users text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-purple-100 border-left-3 border-purple-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-purple-900 font-bold text-2xl">#{evenementBean.revenusEvenements}</div>
|
||||
<div class="text-purple-700">Revenus Événements</div>
|
||||
</div>
|
||||
<div class="bg-purple-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-dollar text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-orange-100 border-left-3 border-orange-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-orange-900 font-bold text-2xl">#{evenementBean.tauxParticipation}%</div>
|
||||
<div class="text-orange-700">Taux Participation</div>
|
||||
</div>
|
||||
<div class="bg-orange-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-chart-pie text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Prochains événements (aperçu rapide) -->
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-clock mr-2"></i>
|
||||
Prochains Événements
|
||||
</h5>
|
||||
<div class="grid">
|
||||
<ui:repeat value="#{evenementBean.prochainsEvenements}" var="event" varStatus="status">
|
||||
<div class="col-12 md:col-6 lg:col-4">
|
||||
<div class="surface-card border-round p-3 border-left-3 #{event.prioriteColor}">
|
||||
<div class="flex align-items-start justify-content-between mb-2">
|
||||
<div>
|
||||
<span class="text-500 font-medium">#{event.dateFormatee}</span>
|
||||
<div class="text-900 font-medium text-xl mt-1">#{event.titre}</div>
|
||||
</div>
|
||||
<p:tag value="#{event.statut}" severity="#{event.statutSeverity}" />
|
||||
</div>
|
||||
<div class="text-600 mb-3">
|
||||
<i class="pi pi-map-marker mr-1"></i>
|
||||
#{event.lieu}
|
||||
</div>
|
||||
<div class="flex align-items-center justify-content-between">
|
||||
<span class="text-green-500 font-bold">
|
||||
#{event.inscrits}/#{event.placesMax} inscrits
|
||||
</span>
|
||||
<div class="flex gap-1">
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-sm"
|
||||
action="#{evenementBean.voirEvenement(event)}" />
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-sm"
|
||||
action="#{evenementBean.modifierEvenement(event)}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ui:repeat>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Liste complète des événements -->
|
||||
<div class="card">
|
||||
<h:form id="formEvenements">
|
||||
<h5>Tous les Événements</h5>
|
||||
|
||||
<!-- Filtres -->
|
||||
<p:toolbar>
|
||||
<p:toolbarGroup>
|
||||
<div class="flex align-items-center gap-2">
|
||||
<span class="p-input-icon-left">
|
||||
<i class="pi pi-search"></i>
|
||||
<p:inputText placeholder="Rechercher..."
|
||||
value="#{evenementBean.searchFilter}">
|
||||
<p:ajax event="keyup" update="dtEvenements" />
|
||||
</p:inputText>
|
||||
</span>
|
||||
|
||||
<p:selectOneMenu value="#{evenementBean.statutFilter}">
|
||||
<f:selectItem itemLabel="Tous les statuts" itemValue="" />
|
||||
<f:selectItem itemLabel="Planifié" itemValue="PLANIFIE" />
|
||||
<f:selectItem itemLabel="Ouvert aux inscriptions" itemValue="OUVERT" />
|
||||
<f:selectItem itemLabel="Complet" itemValue="COMPLET" />
|
||||
<f:selectItem itemLabel="En cours" itemValue="EN_COURS" />
|
||||
<f:selectItem itemLabel="Terminé" itemValue="TERMINE" />
|
||||
<f:selectItem itemLabel="Annulé" itemValue="ANNULE" />
|
||||
<p:ajax update="dtEvenements" />
|
||||
</p:selectOneMenu>
|
||||
|
||||
<p:selectOneMenu value="#{evenementBean.typeFilter}">
|
||||
<f:selectItem itemLabel="Tous les types" itemValue="" />
|
||||
<f:selectItem itemLabel="Réunion" itemValue="REUNION" />
|
||||
<f:selectItem itemLabel="Formation" itemValue="FORMATION" />
|
||||
<f:selectItem itemLabel="Loisir" itemValue="LOISIR" />
|
||||
<f:selectItem itemLabel="Cérémonie" itemValue="CEREMONIE" />
|
||||
<f:selectItem itemLabel="Autre" itemValue="AUTRE" />
|
||||
<p:ajax update="dtEvenements" />
|
||||
</p:selectOneMenu>
|
||||
|
||||
<p:calendar value="#{evenementBean.dateFilter}"
|
||||
pattern="dd/MM/yyyy" showIcon="true"
|
||||
placeholder="Filtrer par date">
|
||||
<p:ajax event="dateSelect" update="dtEvenements" />
|
||||
</p:calendar>
|
||||
</div>
|
||||
</p:toolbarGroup>
|
||||
|
||||
<p:toolbarGroup align="right">
|
||||
<p:commandButton icon="pi pi-refresh"
|
||||
styleClass="ui-button-outlined ui-button-secondary"
|
||||
action="#{evenementBean.actualiser}"
|
||||
update="@form"
|
||||
title="Actualiser" />
|
||||
</p:toolbarGroup>
|
||||
</p:toolbar>
|
||||
|
||||
<!-- DataTable -->
|
||||
<p:dataTable id="dtEvenements"
|
||||
var="evenement"
|
||||
value="#{evenementBean.evenements}"
|
||||
paginator="true"
|
||||
rows="10"
|
||||
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
|
||||
rowsPerPageTemplate="5,10,25,50"
|
||||
currentPageReportTemplate="Affichage {startRecord}-{endRecord} sur {totalRecords}"
|
||||
selection="#{evenementBean.selectedEvenements}"
|
||||
rowKey="#{evenement.id}"
|
||||
selectionMode="multiple"
|
||||
styleClass="mt-3">
|
||||
|
||||
<p:column selectionMode="multiple" style="width:50px" />
|
||||
|
||||
<p:column headerText="Titre" sortBy="#{evenement.titre}">
|
||||
<div class="flex align-items-center">
|
||||
<div class="border-round p-2 mr-3" style="background: #{evenement.couleurCategorie};">
|
||||
<i class="pi #{evenement.iconeType} text-white"></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="font-medium text-900">#{evenement.titre}</div>
|
||||
<small class="text-600">#{evenement.typeEvenementLibelle}</small>
|
||||
</div>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Date/Heure" sortBy="#{evenement.dateDebut}" style="width:180px">
|
||||
<div>
|
||||
<div class="font-medium">#{evenement.dateDebut}</div>
|
||||
<small class="text-600">#{evenement.heureDebut} - #{evenement.heureFin}</small>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Lieu" sortBy="#{evenement.lieu}">
|
||||
<div class="flex align-items-center">
|
||||
<i class="pi pi-map-marker text-500 mr-2"></i>
|
||||
<span>#{evenement.lieu}</span>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" sortBy="#{evenement.statut}" style="width:120px">
|
||||
<p:tag value="#{evenement.statut}"
|
||||
severity="#{evenement.statutSeverity}"
|
||||
icon="pi #{evenement.statutIcon}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Participants" style="width:120px">
|
||||
<div class="text-center">
|
||||
<div class="font-bold">#{evenement.nombreInscrits}/#{evenement.placesMax}</div>
|
||||
<p:progressBar value="#{evenement.tauxRemplissage}"
|
||||
labelTemplate=""
|
||||
styleClass="h-1rem" />
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Prix" sortBy="#{evenement.prix}" style="width:100px">
|
||||
<h:outputText value="#{evenement.prix}" styleClass="font-bold" rendered="#{evenement.prix > 0}">
|
||||
<f:convertNumber type="currency" currencySymbol="FCFA " />
|
||||
</h:outputText>
|
||||
<span class="text-green-500 font-medium" rendered="#{evenement.prix == 0}">Gratuit</span>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Organisateur" sortBy="#{evenement.organisateur}">
|
||||
<h:outputText value="#{evenement.organisateur}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" style="width:200px">
|
||||
<div class="flex gap-1">
|
||||
<p:commandButton icon="pi pi-eye"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-info"
|
||||
action="#{evenementBean.voirEvenement(evenement)}"
|
||||
title="Voir détails" />
|
||||
<p:commandButton icon="pi pi-users"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-success"
|
||||
action="#{evenementBean.gererParticipants(evenement)}"
|
||||
title="Gérer participants" />
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-warning"
|
||||
action="#{evenementBean.modifierEvenement(evenement)}"
|
||||
title="Modifier" />
|
||||
<p:commandButton icon="pi pi-copy"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-secondary"
|
||||
action="#{evenementBean.dupliquerEvenement(evenement)}"
|
||||
title="Dupliquer" />
|
||||
<p:commandButton icon="pi pi-times"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-danger"
|
||||
action="#{evenementBean.annulerEvenement(evenement)}"
|
||||
onclick="return confirm('Êtes-vous sûr de vouloir annuler cet événement ?');"
|
||||
title="Annuler"
|
||||
disabled="#{evenement.statut == 'TERMINE' or evenement.statut == 'ANNULE'}" />
|
||||
</div>
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
|
||||
<!-- Actions groupées -->
|
||||
<div class="mt-3 flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<span class="text-600">#{evenementBean.selectedEvenements.size()} événement(s) sélectionné(s)</span>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<p:commandButton value="Notification groupée"
|
||||
icon="pi pi-bell"
|
||||
styleClass="ui-button-outlined ui-button-info"
|
||||
action="#{evenementBean.notificationGroupee}"
|
||||
disabled="#{empty evenementBean.selectedEvenements}" />
|
||||
<p:commandButton value="Exporter sélection"
|
||||
icon="pi pi-file-excel"
|
||||
styleClass="ui-button-outlined ui-button-success"
|
||||
action="#{evenementBean.exporterSelection}"
|
||||
disabled="#{empty evenementBean.selectedEvenements}" />
|
||||
<p:commandButton value="Annuler sélection"
|
||||
icon="pi pi-ban"
|
||||
styleClass="ui-button-outlined ui-button-danger"
|
||||
action="#{evenementBean.annulerSelection}"
|
||||
onclick="return confirm('Êtes-vous sûr de vouloir annuler les événements sélectionnés ?');"
|
||||
disabled="#{empty evenementBean.selectedEvenements}" />
|
||||
</div>
|
||||
</div>
|
||||
</h:form>
|
||||
</div>
|
||||
|
||||
<!-- Calendrier intégré (optionnel) -->
|
||||
<div class="card">
|
||||
<h5>
|
||||
<i class="pi pi-calendar mr-2"></i>
|
||||
Vue Calendrier
|
||||
</h5>
|
||||
<p:schedule value="#{evenementBean.eventModel}"
|
||||
widgetVar="schedule"
|
||||
timeZone="GMT+0"
|
||||
clientTimeZone="GMT+0"
|
||||
locale="fr"
|
||||
style="height: 600px;"
|
||||
view="month">
|
||||
|
||||
<p:ajax event="eventSelect" listener="#{evenementBean.onEventSelect}" />
|
||||
<p:ajax event="dateSelect" listener="#{evenementBean.onDateSelect}" />
|
||||
<p:ajax event="eventMove" listener="#{evenementBean.onEventMove}" />
|
||||
<p:ajax event="eventResize" listener="#{evenementBean.onEventResize}" />
|
||||
</p:schedule>
|
||||
</div>
|
||||
|
||||
<!-- Dialog Détails événement -->
|
||||
<p:dialog header="Détails de l'événement" widgetVar="dlgDetails" modal="true" width="700" height="500">
|
||||
<h:form id="formDetails" rendered="#{evenementBean.evenementSelectionne != null}">
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="field">
|
||||
<label class="font-medium">Titre</label>
|
||||
<div class="text-900">#{evenementBean.evenementSelectionne.titre}</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="font-medium">Type</label>
|
||||
<div class="text-900">#{evenementBean.evenementSelectionne.typeEvenementLibelle}</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="font-medium">Date et heure</label>
|
||||
<div class="text-900">
|
||||
#{evenementBean.evenementSelectionne.dateComplete}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="font-medium">Lieu</label>
|
||||
<div class="text-900">#{evenementBean.evenementSelectionne.lieu}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="field">
|
||||
<label class="font-medium">Statut</label>
|
||||
<div>
|
||||
<p:tag value="#{evenementBean.evenementSelectionne.statut}"
|
||||
severity="#{evenementBean.evenementSelectionne.statutSeverity}" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="font-medium">Participants</label>
|
||||
<div class="text-900">
|
||||
#{evenementBean.evenementSelectionne.nombreInscrits}/#{evenementBean.evenementSelectionne.placesMax}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="font-medium">Prix</label>
|
||||
<div class="text-900">
|
||||
<h:outputText value="#{evenementBean.evenementSelectionne.prix}" rendered="#{evenementBean.evenementSelectionne.prix > 0}">
|
||||
<f:convertNumber type="currency" currencySymbol="FCFA " />
|
||||
</h:outputText>
|
||||
<span class="text-green-500" rendered="#{evenementBean.evenementSelectionne.prix == 0}">Gratuit</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="font-medium">Organisateur</label>
|
||||
<div class="text-900">#{evenementBean.evenementSelectionne.organisateur}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<div class="field">
|
||||
<label class="font-medium">Description</label>
|
||||
<div class="text-900 line-height-3">#{evenementBean.evenementSelectionne.description}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-2 mt-4">
|
||||
<p:commandButton value="Modifier" icon="pi pi-pencil"
|
||||
styleClass="ui-button-warning"
|
||||
action="#{evenementBean.modifierEvenement(evenementBean.evenementSelectionne)}"
|
||||
oncomplete="PF('dlgDetails').hide();" />
|
||||
<p:commandButton value="Gérer participants" icon="pi pi-users"
|
||||
styleClass="ui-button-success"
|
||||
action="#{evenementBean.gererParticipants(evenementBean.evenementSelectionne)}"
|
||||
oncomplete="PF('dlgDetails').hide();" />
|
||||
<p:commandButton value="Fermer" icon="pi pi-times"
|
||||
styleClass="ui-button-secondary"
|
||||
onclick="PF('dlgDetails').hide();" type="button" />
|
||||
</div>
|
||||
</h:form>
|
||||
</p:dialog>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
@@ -0,0 +1,517 @@
|
||||
<!DOCTYPE html>
|
||||
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
|
||||
xmlns:h="http://xmlns.jcp.org/jsf/html"
|
||||
xmlns:f="http://xmlns.jcp.org/jsf/core"
|
||||
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
|
||||
xmlns:p="http://primefaces.org/ui"
|
||||
template="/templates/main-template.xhtml">
|
||||
|
||||
<ui:define name="title">Gestion des Participants - UnionFlow</ui:define>
|
||||
|
||||
<ui:define name="content">
|
||||
<!-- En-tête -->
|
||||
<div class="grid">
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="flex align-items-center justify-content-between">
|
||||
<div>
|
||||
<h3 class="mb-2">
|
||||
<i class="pi pi-users text-blue-500 mr-2"></i>
|
||||
Gestion des Participants
|
||||
</h3>
|
||||
<p class="text-600 m-0">#{participantBean.evenement.titre} • #{participantBean.dateEvenement} • #{participantBean.nombreInscrits}/#{participantBean.placesMax} places</p>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<p:commandButton value="Inscrire membre"
|
||||
icon="pi pi-user-plus"
|
||||
styleClass="ui-button-success"
|
||||
onclick="PF('dlgInscrireMembre').show();" />
|
||||
<p:commandButton value="Liste d'attente"
|
||||
icon="pi pi-clock"
|
||||
styleClass="ui-button-outlined ui-button-warning"
|
||||
action="#{participantBean.gererListeAttente}" />
|
||||
<p:commandButton value="Retour à l'événement"
|
||||
icon="pi pi-arrow-left"
|
||||
styleClass="ui-button-outlined ui-button-secondary"
|
||||
action="#{participantBean.retourEvenement}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Statistiques -->
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-blue-100 border-left-3 border-blue-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-blue-900 font-bold text-2xl">#{participantBean.nombreInscrits}</div>
|
||||
<div class="text-blue-700">Inscrits Confirmés</div>
|
||||
</div>
|
||||
<div class="bg-blue-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-check text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<p:progressBar value="#{participantBean.tauxRemplissage}"
|
||||
labelTemplate=""
|
||||
styleClass="h-1rem" />
|
||||
<small class="text-600">#{participantBean.tauxRemplissage}% de remplissage</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-orange-100 border-left-3 border-orange-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-orange-900 font-bold text-2xl">#{participantBean.enAttente}</div>
|
||||
<div class="text-orange-700">En Attente</div>
|
||||
</div>
|
||||
<div class="bg-orange-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-clock text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-green-100 border-left-3 border-green-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-green-900 font-bold text-2xl">#{participantBean.montantCollecte}</div>
|
||||
<div class="text-green-700">Collecté</div>
|
||||
</div>
|
||||
<div class="bg-green-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-dollar text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-3">
|
||||
<div class="card bg-purple-100 border-left-3 border-purple-500">
|
||||
<div class="flex justify-content-between">
|
||||
<div>
|
||||
<div class="text-purple-900 font-bold text-2xl">#{participantBean.accompagnateurs}</div>
|
||||
<div class="text-purple-700">Accompagnateurs</div>
|
||||
</div>
|
||||
<div class="bg-purple-500 text-white border-round text-center"
|
||||
style="width: 3rem; height: 3rem; line-height: 3rem;">
|
||||
<i class="pi pi-user-plus text-xl"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Actions rapides -->
|
||||
<div class="card">
|
||||
<h5>Actions Rapides</h5>
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-4">
|
||||
<div class="surface-50 p-3 border-round text-center">
|
||||
<i class="pi pi-envelope text-blue-500 text-2xl mb-2"></i>
|
||||
<div class="font-medium mb-2">Notifications</div>
|
||||
<p:commandButton value="Envoyer rappel général"
|
||||
icon="pi pi-send"
|
||||
styleClass="ui-button-outlined ui-button-info w-full mb-2"
|
||||
action="#{participantBean.envoyerRappelGeneral}" />
|
||||
<p:commandButton value="Info dernière minute"
|
||||
icon="pi pi-exclamation-triangle"
|
||||
styleClass="ui-button-outlined ui-button-warning w-full"
|
||||
onclick="PF('dlgInfoDernierMinute').show();" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-4">
|
||||
<div class="surface-50 p-3 border-round text-center">
|
||||
<i class="pi pi-qrcode text-green-500 text-2xl mb-2"></i>
|
||||
<div class="font-medium mb-2">Check-in</div>
|
||||
<p:commandButton value="Scanner QR Code"
|
||||
icon="pi pi-camera"
|
||||
styleClass="ui-button-outlined ui-button-success w-full mb-2"
|
||||
onclick="PF('dlgScannerQR').show();" />
|
||||
<p:commandButton value="Check-in manuel"
|
||||
icon="pi pi-check"
|
||||
styleClass="ui-button-outlined ui-button-secondary w-full"
|
||||
onclick="PF('dlgCheckinManuel').show();" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-4">
|
||||
<div class="surface-50 p-3 border-round text-center">
|
||||
<i class="pi pi-file text-purple-500 text-2xl mb-2"></i>
|
||||
<div class="font-medium mb-2">Rapports</div>
|
||||
<p:commandButton value="Feuille d'émargement"
|
||||
icon="pi pi-file-pdf"
|
||||
styleClass="ui-button-outlined ui-button-danger w-full mb-2"
|
||||
action="#{participantBean.genererEmargement}" />
|
||||
<p:commandButton value="Liste participants"
|
||||
icon="pi pi-file-excel"
|
||||
styleClass="ui-button-outlined ui-button-success w-full"
|
||||
action="#{participantBean.exporterListe}" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Liste des participants -->
|
||||
<div class="card">
|
||||
<h:form id="formParticipants">
|
||||
<h5>Liste des Participants</h5>
|
||||
|
||||
<!-- Filtres -->
|
||||
<p:toolbar>
|
||||
<p:toolbarGroup>
|
||||
<div class="flex align-items-center gap-2">
|
||||
<span class="p-input-icon-left">
|
||||
<i class="pi pi-search"></i>
|
||||
<p:inputText placeholder="Rechercher..."
|
||||
value="#{participantBean.searchFilter}">
|
||||
<p:ajax event="keyup" update="dtParticipants" />
|
||||
</p:inputText>
|
||||
</span>
|
||||
|
||||
<p:selectOneMenu value="#{participantBean.statutFilter}">
|
||||
<f:selectItem itemLabel="Tous les statuts" itemValue="" />
|
||||
<f:selectItem itemLabel="Confirmé" itemValue="CONFIRME" />
|
||||
<f:selectItem itemLabel="En attente" itemValue="EN_ATTENTE" />
|
||||
<f:selectItem itemLabel="Présent" itemValue="PRESENT" />
|
||||
<f:selectItem itemLabel="Absent" itemValue="ABSENT" />
|
||||
<f:selectItem itemLabel="Annulé" itemValue="ANNULE" />
|
||||
<p:ajax update="dtParticipants" />
|
||||
</p:selectOneMenu>
|
||||
|
||||
<p:selectOneMenu value="#{participantBean.typeFilter}">
|
||||
<f:selectItem itemLabel="Tous les types" itemValue="" />
|
||||
<f:selectItem itemLabel="Membres" itemValue="MEMBRE" />
|
||||
<f:selectItem itemLabel="Accompagnateurs" itemValue="ACCOMPAGNATEUR" />
|
||||
<f:selectItem itemLabel="Invités" itemValue="INVITE" />
|
||||
<p:ajax update="dtParticipants" />
|
||||
</p:selectOneMenu>
|
||||
|
||||
<p:selectOneMenu value="#{participantBean.paiementFilter}">
|
||||
<f:selectItem itemLabel="Tous paiements" itemValue="" />
|
||||
<f:selectItem itemLabel="Payé" itemValue="PAYE" />
|
||||
<f:selectItem itemLabel="Non payé" itemValue="NON_PAYE" />
|
||||
<f:selectItem itemLabel="Gratuit" itemValue="GRATUIT" />
|
||||
<p:ajax update="dtParticipants" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
</p:toolbarGroup>
|
||||
|
||||
<p:toolbarGroup align="right">
|
||||
<p:commandButton icon="pi pi-refresh"
|
||||
styleClass="ui-button-outlined ui-button-secondary"
|
||||
action="#{participantBean.actualiser}"
|
||||
update="@form"
|
||||
title="Actualiser" />
|
||||
</p:toolbarGroup>
|
||||
</p:toolbar>
|
||||
|
||||
<!-- DataTable -->
|
||||
<p:dataTable id="dtParticipants"
|
||||
var="participant"
|
||||
value="#{participantBean.participants}"
|
||||
paginator="true"
|
||||
rows="15"
|
||||
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
|
||||
rowsPerPageTemplate="10,15,25,50"
|
||||
currentPageReportTemplate="Affichage {startRecord}-{endRecord} sur {totalRecords}"
|
||||
selection="#{participantBean.selectedParticipants}"
|
||||
rowKey="#{participant.id}"
|
||||
selectionMode="multiple"
|
||||
styleClass="mt-3">
|
||||
|
||||
<p:column selectionMode="multiple" style="width:50px" />
|
||||
|
||||
<p:column headerText="Participant" sortBy="#{participant.nom}">
|
||||
<div class="flex align-items-center">
|
||||
<div class="border-circle overflow-hidden mr-3"
|
||||
style="width: 40px; height: 40px;">
|
||||
<h:graphicImage value="#{participant.photoUrl}"
|
||||
style="width: 100%; height: 100%; object-fit: cover;"
|
||||
rendered="#{participant.photoUrl != null}" />
|
||||
<div class="bg-primary text-white flex align-items-center justify-content-center w-full h-full"
|
||||
rendered="#{participant.photoUrl == null}">
|
||||
<span style="font-size: 0.9rem;">#{participant.initiales}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="font-medium text-900">#{participant.nomComplet}</div>
|
||||
<div class="text-600 text-sm">
|
||||
<span>#{participant.numeroMembre}</span>
|
||||
<span class="mx-2">•</span>
|
||||
<span>#{participant.telephone}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Type" sortBy="#{participant.type}" style="width:120px">
|
||||
<p:tag value="#{participant.type}"
|
||||
severity="#{participant.typeSeverity}"
|
||||
icon="pi #{participant.typeIcon}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Statut" sortBy="#{participant.statut}" style="width:120px">
|
||||
<p:tag value="#{participant.statut}"
|
||||
severity="#{participant.statutSeverity}"
|
||||
icon="pi #{participant.statutIcon}" />
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Inscription" sortBy="#{participant.dateInscription}" style="width:140px">
|
||||
<div>
|
||||
<div class="font-medium">#{participant.dateInscription}</div>
|
||||
<small class="text-600">#{participant.heureInscription}</small>
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Paiement" style="width:120px">
|
||||
<div class="text-center">
|
||||
<div class="font-bold #{participant.paiementColor}">#{participant.montantPaye}</div>
|
||||
<p:tag value="#{participant.statutPaiement}"
|
||||
severity="#{participant.paiementSeverity}"
|
||||
styleClass="text-xs" />
|
||||
</div>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Accomp." style="width:80px; text-align: center;">
|
||||
<span class="bg-purple-100 text-purple-800 border-round px-2 py-1 text-sm font-medium"
|
||||
rendered="#{participant.nombreAccompagnateurs > 0}">
|
||||
#{participant.nombreAccompagnateurs}
|
||||
</span>
|
||||
<span class="text-400" rendered="#{participant.nombreAccompagnateurs == 0}">-</span>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Check-in" style="width:100px; text-align: center;">
|
||||
<i class="pi pi-check-circle text-green-500 text-xl"
|
||||
rendered="#{participant.presente}"
|
||||
title="Présent depuis #{participant.heureCheckin}" />
|
||||
<i class="pi pi-times-circle text-red-400 text-xl"
|
||||
rendered="#{!participant.presente and participant.statut == 'CONFIRME'}"
|
||||
title="Pas encore arrivé" />
|
||||
<span class="text-400" rendered="#{participant.statut != 'CONFIRME'}">-</span>
|
||||
</p:column>
|
||||
|
||||
<p:column headerText="Actions" style="width:180px">
|
||||
<div class="flex gap-1">
|
||||
<p:commandButton icon="pi pi-check"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-success"
|
||||
action="#{participantBean.confirmerParticipant(participant)}"
|
||||
title="Confirmer"
|
||||
rendered="#{participant.statut == 'EN_ATTENTE'}" />
|
||||
<p:commandButton icon="pi pi-qrcode"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-info"
|
||||
action="#{participantBean.checkinParticipant(participant)}"
|
||||
title="Check-in"
|
||||
rendered="#{!participant.presente and participant.statut == 'CONFIRME'}" />
|
||||
<p:commandButton icon="pi pi-undo"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-warning"
|
||||
action="#{participantBean.annulerCheckin(participant)}"
|
||||
title="Annuler check-in"
|
||||
rendered="#{participant.presente}" />
|
||||
<p:commandButton icon="pi pi-envelope"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-secondary"
|
||||
action="#{participantBean.envoyerNotification(participant)}"
|
||||
title="Notifier" />
|
||||
<p:commandButton icon="pi pi-pencil"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-warning"
|
||||
onclick="#{participantBean.preparerModification(participant)}; PF('dlgModifierParticipant').show();"
|
||||
title="Modifier" />
|
||||
<p:commandButton icon="pi pi-times"
|
||||
styleClass="ui-button-rounded ui-button-text ui-button-danger"
|
||||
action="#{participantBean.annulerInscription(participant)}"
|
||||
onclick="return confirm('Êtes-vous sûr de vouloir annuler cette inscription ?');"
|
||||
title="Annuler inscription" />
|
||||
</div>
|
||||
</p:column>
|
||||
</p:dataTable>
|
||||
|
||||
<!-- Actions groupées -->
|
||||
<div class="mt-3 flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<span class="text-600">#{participantBean.selectedParticipants.size()} participant(s) sélectionné(s)</span>
|
||||
</div>
|
||||
<div class="flex gap-2">
|
||||
<p:commandButton value="Check-in groupé"
|
||||
icon="pi pi-check-circle"
|
||||
styleClass="ui-button-outlined ui-button-success"
|
||||
action="#{participantBean.checkinGroupe}"
|
||||
disabled="#{empty participantBean.selectedParticipants}" />
|
||||
<p:commandButton value="Notification groupée"
|
||||
icon="pi pi-bell"
|
||||
styleClass="ui-button-outlined ui-button-info"
|
||||
onclick="PF('dlgNotificationGroupee').show();"
|
||||
disabled="#{empty participantBean.selectedParticipants}" />
|
||||
<p:commandButton value="Exporter sélection"
|
||||
icon="pi pi-file-excel"
|
||||
styleClass="ui-button-outlined ui-button-secondary"
|
||||
action="#{participantBean.exporterSelection}"
|
||||
disabled="#{empty participantBean.selectedParticipants}" />
|
||||
</div>
|
||||
</div>
|
||||
</h:form>
|
||||
</div>
|
||||
|
||||
<!-- Dialog Inscrire Membre -->
|
||||
<p:dialog header="Inscrire un Membre" widgetVar="dlgInscrireMembre" modal="true" width="600">
|
||||
<h:form id="formInscrireMembre">
|
||||
<div class="ui-fluid">
|
||||
<div class="field">
|
||||
<p:outputLabel for="membreSelect" value="Sélectionner le membre" />
|
||||
<p:autoComplete id="membreSelect"
|
||||
value="#{participantBean.membreAInscrire}"
|
||||
completeMethod="#{participantBean.rechercherMembres}"
|
||||
var="membre" itemLabel="#{membre.nomComplet}" itemValue="#{membre}"
|
||||
converter="membreConverter"
|
||||
placeholder="Taper le nom du membre..."
|
||||
scrollHeight="200">
|
||||
<p:column>
|
||||
<div class="flex align-items-center">
|
||||
<div class="border-circle bg-primary text-white flex align-items-center justify-content-center mr-2"
|
||||
style="width: 30px; height: 30px;">
|
||||
<span style="font-size: 0.8rem;">#{membre.initiales}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="font-medium">#{membre.nomComplet}</div>
|
||||
<small class="text-600">#{membre.numeroMembre} • #{membre.typeMembre}</small>
|
||||
</div>
|
||||
</div>
|
||||
</p:column>
|
||||
</p:autoComplete>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="accompagnateursNb" value="Nombre d'accompagnateurs" />
|
||||
<p:inputNumber id="accompagnateursNb"
|
||||
value="#{participantBean.nombreAccompagnateursInscription}"
|
||||
symbol="" min="0" max="#{participantBean.maxAccompagnateurs}" />
|
||||
</div>
|
||||
|
||||
<div class="field" rendered="#{participantBean.evenement.payant}">
|
||||
<p:outputLabel value="Montant à payer" />
|
||||
<div class="font-bold text-2xl text-green-500">#{participantBean.montantAPayer} FCFA</div>
|
||||
<small class="text-600">#{participantBean.detailTarification}</small>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="commentaire" value="Commentaire" />
|
||||
<p:inputTextarea id="commentaire"
|
||||
value="#{participantBean.commentaireInscription}"
|
||||
rows="3" placeholder="Commentaire optionnel..." />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-2 mt-3">
|
||||
<p:commandButton value="Inscrire" icon="pi pi-check"
|
||||
styleClass="ui-button-success"
|
||||
action="#{participantBean.inscrireMembre}"
|
||||
update="@form :formParticipants"
|
||||
oncomplete="if(!args.validationFailed) PF('dlgInscrireMembre').hide();" />
|
||||
<p:commandButton value="Annuler" icon="pi pi-times"
|
||||
styleClass="ui-button-secondary"
|
||||
onclick="PF('dlgInscrireMembre').hide();" type="button" />
|
||||
</div>
|
||||
</h:form>
|
||||
</p:dialog>
|
||||
|
||||
<!-- Dialog Check-in Manuel -->
|
||||
<p:dialog header="Check-in Manuel" widgetVar="dlgCheckinManuel" modal="true" width="500">
|
||||
<h:form id="formCheckinManuel">
|
||||
<div class="ui-fluid">
|
||||
<div class="field">
|
||||
<p:outputLabel for="participantCheckin" value="Participant" />
|
||||
<p:autoComplete id="participantCheckin"
|
||||
value="#{participantBean.participantCheckin}"
|
||||
completeMethod="#{participantBean.rechercherParticipants}"
|
||||
var="p" itemLabel="#{p.nomComplet}" itemValue="#{p}"
|
||||
converter="participantConverter"
|
||||
placeholder="Taper le nom du participant...">
|
||||
<p:column>
|
||||
<div class="flex align-items-center">
|
||||
<div class="border-circle bg-primary text-white flex align-items-center justify-content-center mr-2"
|
||||
style="width: 30px; height: 30px;">
|
||||
<span style="font-size: 0.8rem;">#{p.initiales}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div class="font-medium">#{p.nomComplet}</div>
|
||||
<small class="text-600">#{p.numeroMembre}</small>
|
||||
</div>
|
||||
</div>
|
||||
</p:column>
|
||||
</p:autoComplete>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="heureArrivee" value="Heure d'arrivée" />
|
||||
<p:calendar id="heureArrivee"
|
||||
value="#{participantBean.heureCheckin}"
|
||||
pattern="HH:mm" timeOnly="true" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-2 mt-3">
|
||||
<p:commandButton value="Confirmer" icon="pi pi-check"
|
||||
styleClass="ui-button-success"
|
||||
action="#{participantBean.effectuerCheckinManuel}"
|
||||
update="@form :formParticipants"
|
||||
oncomplete="if(!args.validationFailed) PF('dlgCheckinManuel').hide();" />
|
||||
<p:commandButton value="Annuler" icon="pi pi-times"
|
||||
styleClass="ui-button-secondary"
|
||||
onclick="PF('dlgCheckinManuel').hide();" type="button" />
|
||||
</div>
|
||||
</h:form>
|
||||
</p:dialog>
|
||||
|
||||
<!-- Dialog Info Dernière Minute -->
|
||||
<p:dialog header="Information Dernière Minute" widgetVar="dlgInfoDernierMinute" modal="true" width="600">
|
||||
<h:form id="formInfoDernierMinute">
|
||||
<div class="ui-fluid">
|
||||
<div class="field">
|
||||
<p:outputLabel for="sujetInfo" value="Sujet" />
|
||||
<p:inputText id="sujetInfo" value="#{participantBean.sujetInfo}"
|
||||
placeholder="Ex: Changement de lieu, horaire..." />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="messageInfo" value="Message" />
|
||||
<p:inputTextarea id="messageInfo" value="#{participantBean.messageInfo}"
|
||||
rows="4" placeholder="Votre message d'information..." />
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:outputLabel for="prioriteInfo" value="Priorité" />
|
||||
<p:selectOneMenu id="prioriteInfo" value="#{participantBean.prioriteInfo}">
|
||||
<f:selectItem itemLabel="🔴 Urgente" itemValue="URGENTE" />
|
||||
<f:selectItem itemLabel="🟡 Importante" itemValue="IMPORTANTE" />
|
||||
<f:selectItem itemLabel="🟢 Normale" itemValue="NORMALE" />
|
||||
</p:selectOneMenu>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<p:selectBooleanCheckbox id="envoyerSMS" value="#{participantBean.envoyerSMS}" />
|
||||
<p:outputLabel for="envoyerSMS" value=" Envoyer par SMS (recommandé pour urgent)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-2 mt-3">
|
||||
<p:commandButton value="Envoyer" icon="pi pi-send"
|
||||
styleClass="ui-button-warning"
|
||||
action="#{participantBean.envoyerInfoDernierMinute}"
|
||||
update="@form"
|
||||
oncomplete="if(!args.validationFailed) PF('dlgInfoDernierMinute').hide();" />
|
||||
<p:commandButton value="Annuler" icon="pi pi-times"
|
||||
styleClass="ui-button-secondary"
|
||||
onclick="PF('dlgInfoDernierMinute').hide();" type="button" />
|
||||
</div>
|
||||
</h:form>
|
||||
</p:dialog>
|
||||
</ui:define>
|
||||
|
||||
</ui:composition>
|
||||
Reference in New Issue
Block a user