<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                template="/WEB-INF/layout/template.xhtml">
    <ui:define name="title">
        #{msg['distribution.page.Utilisateurs']}
    </ui:define>

    <ui:define name="breadcrumb">
        <f:metadata>
            <f:viewParam name="homeOutcome" value="/favorites/dashboard" />
            <f:viewParam name="value" value="Utilisateurs" />
            <f:event type="preRenderView" listener="#{userBean.init}" />

        </f:metadata>
    </ui:define>
    <ui:define name="content">
        <style>
            .inactive-row {
                background-color: #f8d7da !important;
                background-image: none !important;
                color: #ffffff;
            }
        </style>
        <h:form>
            <div class="card">
                <p:dataTable id="dataTable" var="user"
                             rows="30" paginator="true" draggableColumns="true"
                             value="#{userBean.listeUser}" 
                             selection="#{userBean.userSelected}"
                             paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}"
                             rowsPerPageTemplate="20,30,40,60,80,100"
                             emptyMessage="#{msg['distribution.page.user.liste.message.non'] }"
                             selectionMode="single"
                             rowKey="#{user.userid}" >
                    <f:facet name="header">
                        <div class="flex justify-content-between align-items-center">
                            <div>
                            </div>
                            <div>
                                
                                <p:commandButton id="toggler"  styleClass="mr-2 mb-2" type="button" value="Columns" icon="pi pi-align-justify"/>
                                <p:columnToggler datasource="dataTable"  trigger="toggler">
                                    <p:ajax />
                                </p:columnToggler>
                                <p:commandButton title="#{msg['distribution.page.entreprise.ajouterenreprise']}" icon="pi pi-plus" styleClass="ui-button-success mr-2" action="#{userBean.ajouterUser()}" rendered="#{utilControleAccess.isshowPrivilegeAdd('User')}" />

                            </div>
                        </div>
                    </f:facet>

                    <p:column style=" text-align: center;" headerText="#{msg['distribution.page.user.nom']}"  filterBy="#{user.nom}" filterMatchMode="contains" sortBy="#{user.nom}"  >  
                        <h:outputText value="#{user.nom}" />  
                    </p:column>

                    <p:column style=" text-align: center;"  headerText="#{msg['distribution.page.user.prenom']}"   filterBy="#{user.prenom}" filterMatchMode="contains" sortBy="#{user.prenom}"  >  
                        <h:outputText value="#{user.prenom}" />  
                    </p:column>

                    <p:column style=" text-align: center;"  headerText="#{msg['stock.page.fournisseur.Telephone']}"   filterBy="#{user.telephone}" filterMatchMode="contains" sortBy="#{user.telephone}"  >  
                        <h:outputText value="#{user.telephone}" />  
                    </p:column>
                    
                    <p:column style="text-align: center;" headerText="#{msg['distribution.page.user.actf']}"
                              filterBy="#{user.actif}" filterMatchMode="contains" sortBy="#{user.actif}">  
                        <h:outputText value="#{user.actif ? 'Oui' : 'Non'}" />
                    </p:column>

                    <p:column style=" text-align: center;"  headerText="#{msg['stock.page.fournisseur.mail']}"   filterBy="#{user.mail}" filterMatchMode="contains" sortBy="#{user.mail}"  >  
                        <h:outputText value="#{user.mail}" />  
                    </p:column>

                    <p:column style="width:130px; text-align: center;" exportable="false" visible="true" draggable="false" toggleable="false"> 

                        <p:commandButton  id="buttonSelect" style="height:30px; text-align: center"  action="#{userBean.voirUser()}" icon="pi pi-search" title="#{msg['distribution.page.consulter']}">
                            <f:setPropertyActionListener value="#{user}" target="#{userBean.userSelected}" /> 
                        </p:commandButton>

                    </p:column> 

                </p:dataTable> 
            </div>
        </h:form> 
    </ui:define>
</ui:composition>
