lions-user-manager-client-quarkus-primefaces-freya/target/classes/META-INF/resources/templates/components/shared/cards/kpi-card.xhtml

<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"
                xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">

    <!--
        Composant réutilisable: Carte KPI (Indicateur de Performance) - Écosystème LionsDev
        
        Auteur: Lions User Manager
        Version: 2.1.0
        Description: Carte KPI générique et réutilisable pour tous les projets de l'écosystème lionsdev
    -->
    
    <c:set var="colSize" value="#{empty colSize ? 'col-12 md:col-6 lg:col-3' : colSize}" />
    <c:set var="clickable" value="#{empty clickable ? false : clickable}" />
    <c:set var="growthType" value="#{empty growthType ? 'percentage' : growthType}" />
    <c:set var="showGrowth" value="#{empty showGrowth ? (not empty growthValue) : showGrowth}" />
    <c:set var="showProgress" value="#{empty showProgress ? (not empty progressValue) : showProgress}" />
    <c:set var="noDataLabel" value="#{empty noDataLabel ? 'Données non disponibles' : noDataLabel}" />
    
    <div class="#{colSize}">
        <c:choose>
            <c:when test="#{clickable and not empty clickOutcome}">
                <p:commandLink styleClass="card-link w-full #{styleClass}" outcome="#{clickOutcome}">
                    <div class="card surface-0 hover:surface-100 border-round-lg transition-all transition-duration-200">
                        <ui:include src="/templates/components/shared/cards/kpi-card-content.xhtml">
                            <ui:param name="title" value="#{title}" />
                            <ui:param name="value" value="#{value}" />
                            <ui:param name="icon" value="#{icon}" />
                            <ui:param name="iconColor" value="#{iconColor}" />
                            <ui:param name="subtitle" value="#{subtitle}" />
                            <ui:param name="growthValue" value="#{growthValue}" />
                            <ui:param name="growthLabel" value="#{growthLabel}" />
                            <ui:param name="growthType" value="#{growthType}" />
                            <ui:param name="showGrowth" value="#{showGrowth}" />
                            <ui:param name="noDataLabel" value="#{noDataLabel}" />
                            <ui:param name="progressValue" value="#{progressValue}" />
                            <ui:param name="showProgress" value="#{showProgress}" />
                            <ui:param name="statusIcon" value="#{statusIcon}" />
                            <ui:param name="statusLabel" value="#{statusLabel}" />
                            <ui:param name="statusValue" value="#{statusValue}" />
                        </ui:include>
                    </div>
                </p:commandLink>
            </c:when>
            <c:when test="#{clickable and not empty clickAction}">
                <p:commandLink styleClass="card-link w-full #{styleClass}" action="#{clickAction}">
                    <div class="card surface-0 hover:surface-100 border-round-lg transition-all transition-duration-200">
                        <ui:include src="/templates/components/shared/cards/kpi-card-content.xhtml">
                            <ui:param name="title" value="#{title}" />
                            <ui:param name="value" value="#{value}" />
                            <ui:param name="icon" value="#{icon}" />
                            <ui:param name="iconColor" value="#{iconColor}" />
                            <ui:param name="subtitle" value="#{subtitle}" />
                            <ui:param name="growthValue" value="#{growthValue}" />
                            <ui:param name="growthLabel" value="#{growthLabel}" />
                            <ui:param name="growthType" value="#{growthType}" />
                            <ui:param name="showGrowth" value="#{showGrowth}" />
                            <ui:param name="noDataLabel" value="#{noDataLabel}" />
                            <ui:param name="progressValue" value="#{progressValue}" />
                            <ui:param name="showProgress" value="#{showProgress}" />
                            <ui:param name="statusIcon" value="#{statusIcon}" />
                            <ui:param name="statusLabel" value="#{statusLabel}" />
                            <ui:param name="statusValue" value="#{statusValue}" />
                        </ui:include>
                    </div>
                </p:commandLink>
            </c:when>
            <c:otherwise>
                <div class="card surface-0 border-round-lg #{styleClass}">
                    <ui:include src="/templates/components/shared/cards/kpi-card-content.xhtml">
                        <ui:param name="title" value="#{title}" />
                        <ui:param name="value" value="#{value}" />
                        <ui:param name="icon" value="#{icon}" />
                        <ui:param name="iconColor" value="#{iconColor}" />
                        <ui:param name="subtitle" value="#{subtitle}" />
                        <ui:param name="growthValue" value="#{growthValue}" />
                        <ui:param name="growthLabel" value="#{growthLabel}" />
                        <ui:param name="growthType" value="#{growthType}" />
                        <ui:param name="showGrowth" value="#{showGrowth}" />
                        <ui:param name="noDataLabel" value="#{noDataLabel}" />
                        <ui:param name="progressValue" value="#{progressValue}" />
                        <ui:param name="showProgress" value="#{showProgress}" />
                        <ui:param name="statusIcon" value="#{statusIcon}" />
                        <ui:param name="statusLabel" value="#{statusLabel}" />
                        <ui:param name="statusValue" value="#{statusValue}" />
                    </ui:include>
                </div>
            </c:otherwise>
        </c:choose>
    </div>
    
</ui:composition>