95 lines
4.3 KiB
Twig
95 lines
4.3 KiB
Twig
{#
|
||
pagination.twig - Универсальный компонент пагинации
|
||
Использует встроенный пейджер CodeIgniter 4
|
||
|
||
Параметры:
|
||
- pagination: Объект с данными пагинации (из pager->getDetails())
|
||
- currentPage: Текущая страница
|
||
- pageCount: Всего страниц
|
||
- total: Всего записей
|
||
- perPage: Записей на странице
|
||
- from: Начальная запись
|
||
- to: Конечная запись
|
||
- id: ID таблицы для уникальности элементов
|
||
#}
|
||
{% set currentPage = pagination.currentPage|default(1) %}
|
||
{% set totalPages = pagination.pageCount|default(1) %}
|
||
{% set totalRecords = pagination.total|default(0) %}
|
||
{% set perPage = pagination.perPage|default(10) %}
|
||
{% set from = pagination.from|default((currentPage - 1) * perPage + 1) %}
|
||
{% set to = pagination.to|default(min(currentPage * perPage, totalRecords)) %}
|
||
|
||
{# Информация о записях #}
|
||
{% set infoText = 'Показано ' ~ from ~ '–' ~ to ~ ' из ' ~ totalRecords %}
|
||
|
||
<div class="pagination-wrapper">
|
||
{# Информация о количестве записей #}
|
||
<div class="pagination-info">
|
||
<span>{{ infoText }}</span>
|
||
</div>
|
||
|
||
{# Кнопки навигации - посередине #}
|
||
<nav aria-label="Пагинация" style="float: left;">
|
||
<ul class="pagination pagination-sm mb-0">
|
||
{# Предыдущая страница #}
|
||
<li class="page-item {{ currentPage <= 1 ? 'disabled' }}">
|
||
<a class="page-link" href="#" data-nav-page="prev" aria-label="Предыдущая">
|
||
<i class="fa-solid fa-chevron-left"></i>
|
||
</a>
|
||
</li>
|
||
|
||
{# Номера страниц #}
|
||
{% set startPage = max(1, currentPage - 2) %}
|
||
{% set endPage = min(totalPages, currentPage + 2) %}
|
||
|
||
{# Всегда показываем первую страницу если есть #}
|
||
{% if startPage > 1 %}
|
||
<li class="page-item">
|
||
<a class="page-link" href="#" data-page="1">1</a>
|
||
</li>
|
||
{% if startPage > 2 %}
|
||
<li class="page-item disabled">
|
||
<span class="page-link">...</span>
|
||
</li>
|
||
{% endif %}
|
||
{% endif %}
|
||
|
||
{# Страницы вокруг текущей #}
|
||
{% for page in startPage..endPage %}
|
||
<li class="page-item {{ page == currentPage ? 'active' }}">
|
||
<a class="page-link" href="#" data-page="{{ page }}">{{ page }}</a>
|
||
</li>
|
||
{% endfor %}
|
||
|
||
{# Всегда показываем последнюю страницу если есть #}
|
||
{% if endPage < totalPages %}
|
||
{% if endPage < totalPages - 1 %}
|
||
<li class="page-item disabled">
|
||
<span class="page-link">...</span>
|
||
</li>
|
||
{% endif %}
|
||
<li class="page-item">
|
||
<a class="page-link" href="#" data-page="{{ totalPages }}">{{ totalPages }}</a>
|
||
</li>
|
||
{% endif %}
|
||
|
||
{# Следующая страница #}
|
||
<li class="page-item {{ currentPage >= totalPages ? 'disabled' }}">
|
||
<a class="page-link" href="#" data-nav-page="next" aria-label="Следующая">
|
||
<i class="fa-solid fa-chevron-right"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</nav>
|
||
|
||
{# Выбор количества записей - справа #}
|
||
<div class="per-page-selector" style="float: right;">
|
||
<label for="per-page-select-{{ id|default('table') }}">Записей на странице:</label>
|
||
<select id="per-page-select-{{ id|default('table') }}" class="form-select-sm per-page-select">
|
||
<option value="10" {{ perPage == 10 ? 'selected' }}>10</option>
|
||
<option value="25" {{ perPage == 25 ? 'selected' }}>25</option>
|
||
<option value="50" {{ perPage == 50 ? 'selected' }}>50</option>
|
||
<option value="100" {{ perPage == 100 ? 'selected' }}>100</option>
|
||
</select>
|
||
</div>
|
||
</div> |