330 lines
15 KiB
HTML
330 lines
15 KiB
HTML
<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.medecin']}
|
|
</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;
|
|
}
|
|
|
|
.card .ui-datatable-tablewrapper table td,
|
|
.card .ui-datatable-tablewrapper table th {
|
|
vertical-align: middle !important;
|
|
}
|
|
.card .ui-datatable-tablewrapper table td {
|
|
padding-top: 14px !important;
|
|
padding-bottom: 14px !important;
|
|
}
|
|
|
|
.page-center-wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
min-height: calc(100vh - 160px);
|
|
}
|
|
.page-center-wrapper .card {
|
|
width: 100%;
|
|
}
|
|
|
|
.table-header-title {
|
|
font-weight: 700;
|
|
font-size: 1.05rem;
|
|
color: #343a40;
|
|
}
|
|
|
|
.btn-green,
|
|
.btn-green.ui-button,
|
|
.btn-green .ui-button-text {
|
|
background-color: #0D9488 !important;
|
|
border-color: #0D9488 !important;
|
|
color: #ffffff !important;
|
|
}
|
|
.btn-green:hover {
|
|
background-color: #0b7d73 !important;
|
|
border-color: #0b7d73 !important;
|
|
}
|
|
|
|
.btn-green-outline,
|
|
.btn-green-outline.ui-button {
|
|
background-color: #ffffff !important;
|
|
border: 1px solid #0D9488 !important;
|
|
color: #0D9488 !important;
|
|
}
|
|
.btn-green-outline:hover {
|
|
background-color: #e6f5f4 !important;
|
|
}
|
|
|
|
.btn-view-green,
|
|
.btn-view-green.ui-button {
|
|
background-color: #0D9488 !important;
|
|
border-color: #0D9488 !important;
|
|
color: #ffffff !important;
|
|
}
|
|
.btn-view-green:hover {
|
|
background-color: #0b7d73 !important;
|
|
}
|
|
|
|
.btn-export {
|
|
background-color: #ffffff !important;
|
|
border: 1px solid #dee2e6 !important;
|
|
color: #0D9488 !important;
|
|
}
|
|
.btn-export:hover {
|
|
background-color: #e6f5f4 !important;
|
|
border-color: #0D9488 !important;
|
|
}
|
|
|
|
.status-badge {
|
|
display: inline-block;
|
|
padding: 4px 14px;
|
|
border-radius: 6px;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
min-width: 90px;
|
|
}
|
|
|
|
.status-badge-actif {
|
|
background-color: #29ABE2;
|
|
}
|
|
|
|
.status-badge-inactif {
|
|
background-color: #F16B77;
|
|
}
|
|
|
|
.status-badge-indisponible {
|
|
background-color: #F5A623;
|
|
}
|
|
|
|
.ui-chkbox-box.ui-state-active,
|
|
.ui-datatable-toggler-content .ui-chkbox-box.ui-state-active {
|
|
background-color: #0D9488 !important;
|
|
border-color: #0D9488 !important;
|
|
color: #ffffff !important;
|
|
}
|
|
.ui-chkbox-box:hover,
|
|
.ui-chkbox-box.ui-state-hover {
|
|
border-color: #0D9488 !important;
|
|
}
|
|
.ui-chkbox-box.ui-state-focus {
|
|
border-color: #0D9488 !important;
|
|
box-shadow: 0 0 0 2px rgba(13, 148, 136, 0.2) !important;
|
|
}
|
|
|
|
/* MODIF : spécialités - texte tronqué cliquable, ouvre un dialog avec la liste complète */
|
|
.specialite-text {
|
|
display: inline-block;
|
|
max-width: 170px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
color: #0D9488;
|
|
font-size: 0.9rem;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
border-bottom: 1px dashed rgba(13, 148, 136, 0.4);
|
|
vertical-align: middle;
|
|
text-decoration: none !important;
|
|
}
|
|
.specialite-text:hover {
|
|
color: #0b7d73;
|
|
border-bottom-color: #0D9488;
|
|
}
|
|
|
|
.specialites-dialog .ui-dialog-titlebar {
|
|
background-color: #0D1B2E !important;
|
|
color: #ffffff !important;
|
|
border-radius: 8px 8px 0 0 !important;
|
|
}
|
|
.specialites-dialog .ui-dialog-titlebar-close .ui-icon {
|
|
filter: brightness(0) invert(1) !important;
|
|
}
|
|
.specialites-dialog .ui-dialog-titlebar-close:hover {
|
|
background-color: rgba(255,255,255,0.15) !important;
|
|
}
|
|
.specialites-dialog .ui-dialog-content {
|
|
padding: 18px !important;
|
|
border-radius: 0 0 8px 8px !important;
|
|
}
|
|
.specialites-dialog-list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 8px;
|
|
}
|
|
.specialite-chip {
|
|
display: inline-block;
|
|
background-color: rgba(13, 148, 136, 0.1);
|
|
color: #0D9488;
|
|
font-size: 0.85rem;
|
|
font-weight: 600;
|
|
padding: 4px 14px;
|
|
border-radius: 20px;
|
|
border: 1px solid rgba(13, 148, 136, 0.25);
|
|
}
|
|
</style>
|
|
|
|
<div class="page-center-wrapper">
|
|
<h:form id="form">
|
|
<div class="card">
|
|
<p:dataTable id="dataTable" var="user"
|
|
rows="30" paginator="true" draggableColumns="true"
|
|
value="#{medecinBean.allMedecin}"
|
|
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.id}" >
|
|
<f:facet name="header">
|
|
<div class="flex justify-content-between align-items-center">
|
|
<div>
|
|
<span class="table-header-title">#{msg['distribution.page.Utilisateurs']}</span>
|
|
</div>
|
|
<div>
|
|
<p:commandButton id="xlsExport"
|
|
styleClass="mr-2 mb-2 btn-export"
|
|
type="button"
|
|
icon="pi pi-file-excel"
|
|
title="Excel">
|
|
|
|
<p:dataExporter type="xls"
|
|
target="dataTable"
|
|
fileName="utilisateurs" />
|
|
</p:commandButton>
|
|
|
|
<p:commandButton id="pdfExport"
|
|
styleClass="mr-2 mb-2 btn-export"
|
|
type="button"
|
|
icon="pi pi-file-pdf"
|
|
title="PDF">
|
|
|
|
<p:dataExporter type="pdf"
|
|
target="dataTable"
|
|
fileName="utilisateurs" />
|
|
</p:commandButton>
|
|
<p:commandButton id="toggler" styleClass="mr-2 mb-2 btn-green-outline" type="button" value="Columns" icon="pi pi-align-justify"/>
|
|
<p:columnToggler datasource="dataTable"
|
|
trigger="toggler">
|
|
<p:ajax event="toggle" oncomplete="updateLastColumnState();" />
|
|
</p:columnToggler>
|
|
|
|
<p:commandButton title="#{msg['distribution.page.entreprise.ajouterenreprise']}" icon="pi pi-plus" styleClass="ui-button-success btn-green mr-2" action="#{medecinBean.ajouterUser()}" rendered="#{utilControleAccess.isshowPrivilegeAdd('user')}" />
|
|
</div>
|
|
</div>
|
|
</f:facet>
|
|
|
|
<p:column style="text-align: center;" headerText="#{msg['distribution.page.user.nom']}" filterBy="#{user.fkUser.nom}" filterMatchMode="contains" sortBy="#{user.fkUser.nom}" >
|
|
<h:outputText value="#{user.fkUser.nom}" />
|
|
</p:column>
|
|
|
|
<p:column style="text-align: center;" headerText="#{msg['distribution.page.user.prenom']}" filterBy="#{user.fkUser.prenom}" filterMatchMode="contains" sortBy="#{user.fkUser.prenom}" >
|
|
<h:outputText value="#{user.fkUser.prenom}" />
|
|
</p:column>
|
|
|
|
<p:column style="text-align: center;" headerText="#{msg['stock.page.fournisseur.Telephone']}" filterBy="#{user.fkUser.telephone}" filterMatchMode="contains" sortBy="#{user.fkUser.telephone}" >
|
|
<h:outputText value="#{user.fkUser.telephone}" />
|
|
</p:column>
|
|
|
|
<p:column style="text-align: center;" headerText="#{msg['stock.page.fournisseur.mail']}" filterBy="#{user.fkUser.mail}" filterMatchMode="contains" sortBy="#{user.fkUser.mail}" >
|
|
<h:outputText value="#{user.fkUser.mail}" />
|
|
</p:column>
|
|
|
|
<!-- MODIF : spécialités cliquables, ouvre un dialog partagé avec la liste complète -->
|
|
<p:column style="text-align: center; width: 190px;" headerText="#{msg['distribution.page.medecins.specialite']}">
|
|
<p:commandLink styleClass="specialite-text"
|
|
process="@this"
|
|
actionListener="#{medecinBean.onShowSpecialites(user)}"
|
|
update=":form:specDialogContent"
|
|
oncomplete="PF('specDialogWidget').show()">
|
|
<h:outputText value="#{medecinBean.getSpecialitesDisplay(user)}" />
|
|
</p:commandLink>
|
|
</p:column>
|
|
|
|
<p:column style="text-align: center;" headerText="Status">
|
|
<h:panelGroup styleClass="status-badge status-badge-actif"
|
|
rendered="#{medecinBean.getStatusMedecin(user) eq 'disponible'}">
|
|
<h:outputText value="Actif" />
|
|
</h:panelGroup>
|
|
<h:panelGroup styleClass="status-badge status-badge-inactif"
|
|
rendered="#{medecinBean.getStatusMedecin(user) eq 'false'}">
|
|
<h:outputText value="Inactif" />
|
|
</h:panelGroup>
|
|
<h:panelGroup styleClass="status-badge status-badge-indisponible"
|
|
rendered="#{medecinBean.getStatusMedecin(user) eq 'indisponible'}">
|
|
<h:outputText value="Indisponible" />
|
|
</h:panelGroup>
|
|
</p:column>
|
|
|
|
<p:column style="width:130px; text-align: center;" exportable="false" visible="true" draggable="false" toggleable="false" headerText="Action">
|
|
<p:commandButton id="buttonSelect" styleClass="btn-view-green" style="height:30px; text-align: center" action="#{medecinBean.voirUser()}" icon="pi pi-search" title="#{msg['distribution.page.consulter']}">
|
|
<f:setPropertyActionListener value="#{user}" target="#{medecinBean.selectedMedecin}" />
|
|
</p:commandButton>
|
|
</p:column>
|
|
|
|
</p:dataTable>
|
|
|
|
<p:dialog widgetVar="specDialogWidget" header="#{msg['distribution.page.medecins.specialite']}"
|
|
modal="true" resizable="false" closable="true"
|
|
styleClass="specialites-dialog" width="360">
|
|
<h:panelGroup id="specDialogContent">
|
|
<div class="specialites-dialog-list">
|
|
<ui:repeat value="#{medecinBean.selectedRowSpecialites}" var="spec">
|
|
<span class="specialite-chip">
|
|
<h:outputText value="#{spec.name}" />
|
|
</span>
|
|
</ui:repeat>
|
|
</div>
|
|
</h:panelGroup>
|
|
</p:dialog>
|
|
</div>
|
|
</h:form>
|
|
</div>
|
|
<script type="text/javascript">
|
|
//<![CDATA[
|
|
$(document).on('click', '.ui-widget-overlay', function () {
|
|
if (PF('specDialogWidget')) {
|
|
PF('specDialogWidget').hide();
|
|
}
|
|
});
|
|
|
|
function updateLastColumnState() {
|
|
|
|
var active = $('.ui-columntoggler .ui-chkbox-box.ui-state-active');
|
|
|
|
$('.ui-columntoggler .ui-chkbox-box')
|
|
.removeClass('ui-state-disabled')
|
|
.css('pointer-events', '');
|
|
|
|
if (active.length === 1) {
|
|
active.addClass('ui-state-disabled')
|
|
.css('pointer-events', 'none');
|
|
}
|
|
}
|
|
|
|
$(document).on('click', '#form\\:toggler', function () {
|
|
setTimeout(updateLastColumnState, 200);
|
|
});
|
|
|
|
|
|
//]]>
|
|
</script>
|
|
|
|
</ui:define>
|
|
</ui:composition> |