{% extends 'netbox_kea/combined_base.html' %}
{% load render_table from django_tables2 %}

{% block tab_content %}

<div class="card mb-3">
  <div class="card-header">
    <strong><i class="mdi mdi-magnify"></i> Filter Subnets</strong>
  </div>
  <div class="card-body">
    <form method="get" class="row g-2 align-items-end">
      {# Preserve server selection when filtering #}
      {% for pk in selected_server_pks %}
      <input type="hidden" name="server" value="{{ pk }}">
      {% endfor %}
      <div class="col-auto flex-grow-1">
        <label for="id_q" class="form-label">{{ search_form.q.label }}</label>
        {{ search_form.q }}
      </div>
      <div class="col-auto">
        <label for="id_subnet_id" class="form-label">{{ search_form.subnet_id.label }}</label>
        {{ search_form.subnet_id }}
      </div>
      <div class="col-auto">
        <button type="submit" class="btn btn-primary btn-sm">
          <i class="mdi mdi-magnify"></i> Filter
        </button>
        {% if request.GET.q or request.GET.subnet_id %}
        <a href="{{ request.path }}{% if server_qs %}?{{ server_qs }}{% endif %}"
           class="btn btn-outline-secondary btn-sm">
          <i class="mdi mdi-close"></i> Clear
        </a>
        {% endif %}
        <div class="dropdown d-inline-block ms-1">
          <button type="button" class="btn btn-purple btn-sm dropdown-toggle" data-bs-toggle="dropdown">
            <i class="mdi mdi-download"></i> Export
          </button>
          <ul class="dropdown-menu dropdown-menu-end">
            <li><a class="dropdown-item" href="?{% if request.GET.urlencode %}{{ request.GET.urlencode }}&{% endif %}export=table">Current View (CSV)</a></li>
          </ul>
        </div>
      </div>
    </form>
  </div>
</div>

{% if errors %}
<div class="alert alert-warning mt-3">
  <strong>Some servers could not be reached:</strong>
  <ul class="mb-0 mt-1">
    {% for name, msg in errors %}
    <li><strong>{{ name }}</strong>: {{ msg }}</li>
    {% endfor %}
  </ul>
</div>
{% endif %}

{% render_table table %}

<div class="row mt-2">
  <div class="col-auto text-muted small">
    Showing {{ table.objects_count }} subnet{{ table.objects_count|pluralize }}
  </div>
</div>

{% endblock tab_content %}