agdar/templates/partial/pagination.html
2025-11-02 14:35:35 +03:00

99 lines
4.1 KiB
HTML

{% load i18n static %}
<div class="d-flex justify-content-between align-items-center p-2">
<div class="text-body-secondary">
{% trans "Showing" %} {{ page_obj.start_index }} {% trans "to" %} {{ page_obj.end_index }}
{% trans "of" %} {{ page_obj.paginator.count }} {% trans "results" %}
</div>
<nav aria-label="{% trans 'Pagination' %}">
<ul class="pagination pagination-sm mb-3">
{# First Page #}
{% if page_obj.has_previous %}
<li class="page-item">
<a class="page-link" href="?page=1{% if q %}&q={{ q }}{% endif %}{% if mode %}&mode={{ mode }}{% endif %}" aria-label="{% trans 'First' %}">
{% if LANGUAGE_CODE == 'ar' %}
<span class="fa fa-angle-double-right" aria-hidden="true"></span>
{% else %}
<span class="fa fa-angle-double-left" aria-hidden="true"></span>
{% endif %}
</a>
</li>
{% else %}
<li class="page-item disabled">
<span class="page-link">
{% if LANGUAGE_CODE == 'ar' %}
<span class="fa fa-chevron-right" aria-hidden="true"></span>
{% else %}
<span class="fa fa-chevron-left" aria-hidden="true"></span>
{% endif %}
</span>
</li>
{% endif %}
{# Previous Page #}
{% if page_obj.has_previous %}
<li class="page-item">
<a class="page-link"
href="?page={{ page_obj.previous_page_number }}{% if q %}&q={{ q }}{% endif %}{% if mode %}&mode={{ mode }}{% endif %}"
aria-label="{% trans 'Previous' %}" rel="prev">
{% if LANGUAGE_CODE == 'ar' %}
<span class="fas fa-chevron-right" aria-hidden="true"></span>
{% else %}
<span class="fas fa-chevron-left" aria-hidden="true"></span>
{% endif %}
</a>
</li>
{% endif %}
{# Page Numbers (window of ±2 around current, plus first & last) #}
{% with start=page_obj.number|add:"-2" end=page_obj.number|add:"2" %}
{% for num in page_obj.paginator.page_range %}
{% if num == 1 or num == page_obj.paginator.num_pages %}
<li class="page-item {% if num == page_obj.number %}active{% endif %}">
<a class="page-link" {% if num == page_obj.number %}aria-current="page"{% endif %}
href="?page={{ num }}{% if q %}&q={{ q }}{% endif %}{% if mode %}&mode={{ mode }}{% endif %}">{{ num }}</a>
</li>
{% elif num >= start and num <= end %}
<li class="page-item {% if num == page_obj.number %}active{% endif %}">
<a class="page-link" {% if num == page_obj.number %}aria-current="page"{% endif %}
href="?page={{ num }}{% if q %}&q={{ q }}{% endif %}{% if mode %}&mode={{ mode }}{% endif %}">{{ num }}</a>
</li>
{% endif %}
{% endfor %}
{% endwith %}
{# Next Page #}
{% if page_obj.has_next %}
<li class="page-item">
<a class="page-link"
href="?page={{ page_obj.next_page_number }}{% if q %}&q={{ q }}{% endif %}{% if mode %}&mode={{ mode }}{% endif %}"
aria-label="{% trans 'Next' %}" rel="next">
{% if LANGUAGE_CODE == 'ar' %}
<span class="fa fa-chevron-left" aria-hidden="true"></span>
{% else %}
<span class="fa fa-chevron-right" aria-hidden="true"></span>
{% endif %}
</a>
</li>
{% endif %}
{# Last Page #}
{% if page_obj.has_next %}
<li class="page-item">
<a class="page-link"
href="?page={{ page_obj.paginator.num_pages }}{% if q %}&q={{ q }}{% endif %}{% if mode %}&mode={{ mode }}{% endif %}"
aria-label="{% trans 'Last' %}">
{% if LANGUAGE_CODE == 'ar' %}
<span class="fa fa-angle-double-left" aria-hidden="true"></span>
{% else %}
<span class="fa fa-angle-double-right" aria-hidden="true"></span>
{% endif %}
</a>
</li>
{% endif %}
</ul>
</nav>
</div>