{% load i18n %}


{% if table.page %}
  {% with page_param=table.prefix|stringformat:"s"|add:"page" %}
  <div class="d-flex justify-content-between align-items-center border-{% if placement == 'top' %}bottom{% else %}top{% endif %} p-2">
    {% if table.paginator.num_pages > 1 %}
      <nav aria-label="{% trans "Page selection" %}">
        <ul class="pagination mb-0">
          {% if table.page.has_previous %}
            <li class="page-item">
              <a href="?tab={{ table.tab }}&{{ page_param }}={{ table.page.previous_page_number }}&{{ table.prefix }}per_page={{ table.paginator.per_page }}&interface_name_field={{ interface_name_field }}" class="page-link">
                <i class="mdi mdi-chevron-left"></i>
              </a>
            </li>
          {% endif %}

          {% for p in table.page.smart_pages %}
            <li class="page-item{% if table.page.number == p %} active{% endif %}">
              {% if p %}
              <a href="?tab={{ table.tab }}&{{ page_param }}={{ p }}&{{ table.prefix }}per_page={{ table.paginator.per_page }}&interface_name_field={{ interface_name_field }}" class="page-link">{{ p }}</a>
              {% else %}
                <span class="page-link" disabled>&hellip;</span>
              {% endif %}
            </li>
          {% endfor %}

          {% if table.page.has_next %}
            <li class="page-item">
              <a href="?tab={{ table.tab }}&{{ page_param }}={{ table.page.next_page_number }}&{{ table.prefix }}per_page={{ table.paginator.per_page }}&interface_name_field={{ interface_name_field }}" class="page-link">
                <i class="mdi mdi-chevron-right"></i>
              </a>
            </li>
          {% endif %}
        </ul>
      </nav>
    {% endif %}

    <small class="text-end text-muted">
      {% blocktrans trimmed with start=table.page.start_index end=table.page.end_index total=table.paginator.count %}
        Showing {{ start }}-{{ end }} of {{ total }}
      {% endblocktrans %}
    </small>

    <nav class="text-end" aria-label="{% trans "Pagination options" %}">
      <div class="dropdown">
        <button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown">
          {% trans "Per Page" %}
        </button>
        <div class="dropdown-menu">
          {% for n in table.paginator.get_page_lengths %}
          <a href="?tab={{ table.tab }}&{{ table.prefix }}per_page={{ n }}&{{ page_param }}={{ table.page.number }}&interface_name_field={{ interface_name_field }}" class="dropdown-item">{{ n }}</a>
          {% endfor %}
        </div>
      </div>
    </nav>
  </div>
  {% endwith %}
{% endif %}
