ucef/as-talange
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add pagination to equipment and licence search screens
AS Talange CI/CD Pipeline - Production / Build & Run Unit Tests (push) Successful in 1m53s
Details
AS Talange CI/CD Pipeline - Production / Deploy to Prod Environment (push) Successful in 2m46s
Details

Browse Source
This commit is contained in:
ucef
2026-08-03 16:09:52 +02:00
parent b9a7dc089c
commit 8d2a2e486a
4 changed files with 155 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
as-talange-web/src/main/resources/templates/parametrage/licences_recherche.html
+59 -1
View File
@@ -62,7 +62,7 @@
</form>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
<div id="licences-table-container" class="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
<div class="overflow-x-auto">
<table class="w-full text-left border-collapse min-w-[900px]">
<thead>
@@ -96,6 +96,64 @@
</tbody>
</table>
</div>
<!-- Pagination Footer -->
<div class="px-6 py-4 border-t border-gray-200 flex items-center justify-between bg-gray-50 text-sm text-gray-700">
<div th:if="${totalElements > 0}">
Affichage de <span class="font-semibold" th:text="${currentPage * pageSize + 1}">1</span> à
<span class="font-semibold" th:text="${T(java.lang.Math).min((currentPage + 1) * pageSize, totalElements)}">20</span> sur
<span class="font-semibold" th:text="${totalElements}">100</span> licences
</div>
<div th:if="${totalElements == 0}">
Aucune licence à afficher
</div>
<div class="flex items-center space-x-2" th:if="${totalPages > 1}">
<!-- Page Précédente -->
<a th:if="${currentPage > 0}"
th:href="@{/admin/licences/recherche(nom=${nomFilter},prenom=${prenomFilter},categorieId=${categorieId},numeroLicence=${numeroLicenceFilter},email=${emailFilter},typeDemande=${typeDemandeFilter},page=${currentPage - 1})}"
hx-get="/admin/licences/recherche"
hx-target="#licences-table-container"
hx-select="#licences-table-container"
hx-push-url="true"
th:attr="hx-vals=|{&quot;nom&quot;: &quot;${nomFilter != null ? nomFilter : ''}&quot;, &quot;prenom&quot;: &quot;${prenomFilter != null ? prenomFilter : ''}&quot;, &quot;categorieId&quot;: &quot;${categorieId != null ? categorieId : ''}&quot;, &quot;numeroLicence&quot;: &quot;${numeroLicenceFilter != null ? numeroLicenceFilter : ''}&quot;, &quot;email&quot;: &quot;${emailFilter != null ? emailFilter : ''}&quot;, &quot;typeDemande&quot;: &quot;${typeDemandeFilter != null ? typeDemandeFilter : ''}&quot;, &quot;page&quot;: ${currentPage - 1}}|"
class="px-3 py-1 border border-gray-300 rounded hover:bg-gray-100 transition-colors">
Précédent
</a>
<span th:if="${currentPage == 0}" class="px-3 py-1 border border-gray-200 rounded text-gray-400 bg-gray-50 cursor-not-allowed">
Précédent
</span>
<!-- Numéros de pages -->
<th:block th:each="pageNum : ${#numbers.sequence(0, totalPages - 1)}" th:if="${totalPages > 0}">
<a th:href="@{/admin/licences/recherche(nom=${nomFilter},prenom=${prenomFilter},categorieId=${categorieId},numeroLicence=${numeroLicenceFilter},email=${emailFilter},typeDemande=${typeDemandeFilter},page=${pageNum})}"
hx-get="/admin/licences/recherche"
hx-target="#licences-table-container"
hx-select="#licences-table-container"
hx-push-url="true"
th:attr="hx-vals=|{&quot;nom&quot;: &quot;${nomFilter != null ? nomFilter : ''}&quot;, &quot;prenom&quot;: &quot;${prenomFilter != null ? prenomFilter : ''}&quot;, &quot;categorieId&quot;: &quot;${categorieId != null ? categorieId : ''}&quot;, &quot;numeroLicence&quot;: &quot;${numeroLicenceFilter != null ? numeroLicenceFilter : ''}&quot;, &quot;email&quot;: &quot;${emailFilter != null ? emailFilter : ''}&quot;, &quot;typeDemande&quot;: &quot;${typeDemandeFilter != null ? typeDemandeFilter : ''}&quot;, &quot;page&quot;: ${pageNum}}|"
th:text="${pageNum + 1}"
class="px-3 py-1 rounded transition-colors"
th:classappend="${currentPage == pageNum ? 'bg-blue-600 text-white' : 'border border-gray-300 hover:bg-gray-100'}">
1
</a>
</th:block>
<!-- Page Suivante -->
<a th:if="${currentPage < totalPages - 1}"
th:href="@{/admin/licences/recherche(nom=${nomFilter},prenom=${prenomFilter},categorieId=${categorieId},numeroLicence=${numeroLicenceFilter},email=${emailFilter},typeDemande=${typeDemandeFilter},page=${currentPage + 1})}"
hx-get="/admin/licences/recherche"
hx-target="#licences-table-container"
hx-select="#licences-table-container"
hx-push-url="true"
th:attr="hx-vals=|{&quot;nom&quot;: &quot;${nomFilter != null ? nomFilter : ''}&quot;, &quot;prenom&quot;: &quot;${prenomFilter != null ? prenomFilter : ''}&quot;, &quot;categorieId&quot;: &quot;${categorieId != null ? categorieId : ''}&quot;, &quot;numeroLicence&quot;: &quot;${numeroLicenceFilter != null ? numeroLicenceFilter : ''}&quot;, &quot;email&quot;: &quot;${emailFilter != null ? emailFilter : ''}&quot;, &quot;typeDemande&quot;: &quot;${typeDemandeFilter != null ? typeDemandeFilter : ''}&quot;, &quot;page&quot;: ${currentPage + 1}}|"
class="px-3 py-1 border border-gray-300 rounded hover:bg-gray-100 transition-colors">
Suivant
</a>
<span th:if="${currentPage == totalPages - 1}" class="px-3 py-1 border border-gray-200 rounded text-gray-400 bg-gray-50 cursor-not-allowed">
Suivant
</span>
</div>
</div>
</div>
</div>
</main>