{% extends 'base_dashboard.html' %}

{% block title %}{{ verbose_name_plural }} — {{ site_settings.institute_name }}{% endblock %}

{% block content %}
<nav aria-label="breadcrumb">
  <ol class="breadcrumb small">
    <li class="breadcrumb-item"><a href="{% url 'dashboard:data_home' %}">Data Manager</a></li>
    <li class="breadcrumb-item active">{{ verbose_name_plural }}</li>
  </ol>
</nav>

<div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mb-3">
  <div>
    <h3 class="fw-bold mb-0">{{ verbose_name_plural }}</h3>
    <div class="text-muted small">{{ total }} record{{ total|pluralize }}</div>
  </div>
  {% if can_add %}
  <a href="{% url 'dashboard:data_add' app_label model_name %}" class="btn btn-primary">
    <i class="bi bi-plus-lg me-1"></i>Add {{ verbose_name }}
  </a>
  {% endif %}
</div>

{% if has_search %}
<form method="get" class="mb-3">
  <div class="input-group" style="max-width:420px;">
    <input type="text" name="q" value="{{ q }}" class="form-control" placeholder="Search {{ verbose_name_plural|lower }}…">
    <button class="btn btn-outline-secondary" type="submit"><i class="bi bi-search"></i></button>
    {% if q %}<a href="{% url 'dashboard:data_list' app_label model_name %}" class="btn btn-outline-secondary">Clear</a>{% endif %}
  </div>
</form>
{% endif %}

<div class="card border-0 shadow-sm">
  <div class="table-responsive">
    <table class="table table-hover align-middle mb-0">
      <thead class="table-light">
        <tr>
          {% for h in headers %}<th>{{ h }}</th>{% endfor %}
          <th class="text-end">Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for row in rows %}
        <tr>
          {% for cell in row.cells %}<td>{{ cell }}</td>{% endfor %}
          <td class="text-end text-nowrap">
            <a href="{% url 'dashboard:data_edit' app_label model_name row.pk %}" class="btn btn-sm btn-outline-primary">Edit</a>
            {% if can_delete %}
            <form method="post" action="{% url 'dashboard:data_delete' app_label model_name row.pk %}" class="d-inline" onsubmit="return confirm('Delete this record? This cannot be undone.');">
              {% csrf_token %}
              <button type="submit" class="btn btn-sm btn-outline-danger">Delete</button>
            </form>
            {% endif %}
          </td>
        </tr>
        {% empty %}
        <tr><td colspan="{{ headers|length|add:1 }}" class="text-center text-muted py-4">No records found.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>

{% if page_obj.has_other_pages %}
<nav class="mt-3">
  <ul class="pagination pagination-sm">
    {% 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 %}">Previous</a></li>
    {% else %}
    <li class="page-item disabled"><span class="page-link">Previous</span></li>
    {% endif %}
    <li class="page-item disabled"><span class="page-link">Page {{ page_obj.number }} of {{ paginator.num_pages }}</span></li>
    {% 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 %}">Next</a></li>
    {% else %}
    <li class="page-item disabled"><span class="page-link">Next</span></li>
    {% endif %}
  </ul>
</nav>
{% endif %}
{% endblock %}