68 lines
3.2 KiB
HTML
68 lines
3.2 KiB
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"
|
|
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
|
|
|
|
<!--
|
|
Composant réutilisable: Carte Statistique Utilisateur (WOU/DRY Pattern)
|
|
Version 2.0.0 - Utilise maintenant kpi-card.xhtml en interne
|
|
|
|
Auteur: Lions User Manager
|
|
Description: Wrapper autour de kpi-card.xhtml pour compatibilité ascendante
|
|
|
|
Paramètres:
|
|
- title: String (requis) - Titre de la carte
|
|
- value: String/Number (requis) - Valeur à afficher
|
|
- icon: String (requis) - Classe d'icône PrimeIcons
|
|
- iconColor: String (requis) - Couleur de l'icône
|
|
- subtitle: String (optionnel) - Sous-titre
|
|
- trend: Number (optionnel) - Tendance (pourcentage) - Mappé vers growthValue
|
|
- trendLabel: String (optionnel) - Libellé de la tendance - Mappé vers growthLabel
|
|
- colSize: String (défaut: "col-12 md:col-6 lg:col-3") - Taille de colonne
|
|
- clickable: Boolean (défaut: false) - Rendre la carte cliquable
|
|
- clickOutcome: String (optionnel) - Page de redirection au clic
|
|
|
|
Note: Ce composant est un wrapper de compatibilité. Pour de nouvelles implémentations,
|
|
utilisez directement kpi-card.xhtml qui offre plus de fonctionnalités.
|
|
|
|
Exemples d'utilisation:
|
|
|
|
1. Carte simple:
|
|
<ui:include src="/templates/components/shared/cards/user-stat-card.xhtml">
|
|
<ui:param name="title" value="Total Utilisateurs" />
|
|
<ui:param name="value" value="#{userBean.totalUsers}" />
|
|
<ui:param name="icon" value="pi-users" />
|
|
<ui:param name="iconColor" value="blue-600" />
|
|
</ui:include>
|
|
|
|
2. Carte avec tendance:
|
|
<ui:include src="/templates/components/shared/cards/user-stat-card.xhtml">
|
|
<ui:param name="title" value="Utilisateurs Actifs" />
|
|
<ui:param name="value" value="#{userBean.activeUsers}" />
|
|
<ui:param name="icon" value="pi-user-check" />
|
|
<ui:param name="iconColor" value="green-600" />
|
|
<ui:param name="trend" value="#{userBean.activeUsersTrend}" />
|
|
<ui:param name="trendLabel" value="ce mois" />
|
|
</ui:include>
|
|
-->
|
|
|
|
<!-- Déléguer à kpi-card.xhtml -->
|
|
<ui:include src="/templates/components/shared/cards/kpi-card.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="#{trend}" />
|
|
<ui:param name="growthLabel" value="#{trendLabel}" />
|
|
<ui:param name="growthType" value="percentage" />
|
|
<ui:param name="colSize" value="#{colSize}" />
|
|
<ui:param name="clickable" value="#{clickable}" />
|
|
<ui:param name="clickOutcome" value="#{clickOutcome}" />
|
|
</ui:include>
|
|
|
|
</ui:composition>
|
|
|