sboulahtit/orion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: standardize pagination across all admin pages

Browse Source 
Migrated marketplace.js, imports.js, and logs.js to use the same
pagination pattern as companies.js, users.js, and vendors.js:

- pagination: { page, per_page, total, pages }
- Computed getters: totalPages, startIndex, endIndex, pageNumbers
- Methods: previousPage(), nextPage(), goToPage()

Updated templates to use the shared pagination macro:
- marketplace.html
- imports.html
- logs.html

All admin pages now use consistent pagination behavior and styling.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Samir Boulahtit
2025-12-06 20:15:41 +01:00
parent 00538e643e
commit 74e8620fc7
6 changed files with 232 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
app/templates/admin/imports.html
View File

@@ -1,5 +1,6 @@
{# app/templates/admin/imports.html #}
{% extends "admin/base.html" %}
{% from 'shared/macros/pagination.html' import pagination %}
{% block title %}Import Jobs - Platform Monitoring{% endblock %}
@@ -289,33 +290,7 @@
</div>
</div>
{# noqa: FE-001 - Custom pagination with page/limit/totalJobs variables #}
<!-- Pagination -->
<div x-show="!loading && totalJobs > limit" class="px-4 py-3 border-t dark:border-gray-700">
<div class="flex items-center justify-between">
<div class="text-sm text-gray-700 dark:text-gray-400">
Showing <span x-text="((page - 1) * limit) + 1"></span> to
<span x-text="Math.min(page * limit, totalJobs)"></span> of
<span x-text="totalJobs"></span> jobs
</div>
<div class="flex space-x-2">
<button
@click="previousPage()"
:disabled="page === 1"
class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md hover:bg-purple-700 focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed"
>
Previous
</button>
<button
@click="nextPage()"
:disabled="page * limit >= totalJobs"
class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md hover:bg-purple-700 focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed"
>
Next
</button>
</div>
</div>
</div>
{{ pagination(show_condition="!loading && pagination.total > 0") }}
</div>
</div>

27
app/templates/admin/logs.html
View File

@@ -1,5 +1,6 @@
{# app/templates/admin/logs.html #}
{% extends "admin/base.html" %}
{% from 'shared/macros/pagination.html' import pagination %}
{% block title %}Application Logs{% endblock %}
@@ -236,31 +237,7 @@
</table>
</div>
{# noqa: FE-001 - Custom pagination with filters.skip/limit/totalLogs variables #}
<!-- Pagination -->
<div x-show="!loading && logs.length > 0" class="px-4 py-3 border-t dark:border-gray-700 bg-gray-50 dark:bg-gray-800">
<div class="flex items-center justify-between">
<div class="text-sm text-gray-700 dark:text-gray-400">
Showing <span x-text="filters.skip + 1"></span> to <span x-text="Math.min(filters.skip + filters.limit, totalLogs)"></span> of <span x-text="totalLogs"></span>
</div>
<div class="flex space-x-2">
<button
@click="previousPage()"
:disabled="filters.skip === 0"
class="px-3 py-1 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600"
>
Previous
</button>
<button
@click="nextPage()"
:disabled="filters.skip + filters.limit >= totalLogs"
class="px-3 py-1 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600"
>
Next
</button>
</div>
</div>
</div>
{{ pagination(show_condition="!loading && logs.length > 0") }}
</div>
</div>

29
app/templates/admin/marketplace.html
View File

@@ -1,5 +1,6 @@
{# app/templates/admin/marketplace.html #}
{% extends "admin/base.html" %}
{% from 'shared/macros/pagination.html' import pagination %}
{% block title %}Marketplace Import{% endblock %}
@@ -370,33 +371,7 @@
</div>
</div>
{# noqa: FE-001 - Custom pagination with page/limit/totalJobs variables #}
<!-- Pagination -->
<div x-show="!loading && totalJobs > limit" class="px-4 py-3 border-t dark:border-gray-700">
<div class="flex items-center justify-between">
<div class="text-sm text-gray-700 dark:text-gray-400">
Showing <span x-text="((page - 1) * limit) + 1"></span> to
<span x-text="Math.min(page * limit, totalJobs)"></span> of
<span x-text="totalJobs"></span> jobs
</div>
<div class="flex space-x-2">
<button
@click="previousPage()"
:disabled="page === 1"
class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md hover:bg-purple-700 focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed"
>
Previous
</button>
<button
@click="nextPage()"
:disabled="page * limit >= totalJobs"
class="px-3 py-1 text-sm font-medium leading-5 text-white transition-colors duration-150 bg-purple-600 border border-transparent rounded-md hover:bg-purple-700 focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed"
>
Next
</button>
</div>
</div>
</div>
{{ pagination(show_condition="!loading && pagination.total > 0") }}
</div>
</div>