{% extends 'base.html' %}
{% block content %}
<div class="container py-3">
  <h2 class="mb-3">Employee Documents</h2>

  <!-- Filters -->
  <form method="get" class="row g-2 align-items-end mb-3">
    <div class="col-md-3">
      <label class="form-label">Search</label>
      <input type="text" name="q" class="form-control" placeholder="Name, code, email" value="{{ q or '' }}">
    </div>

    <div class="col-md-3">
      <label class="form-label">Department</label>
      <select name="department_id" class="form-select">
        <option value="">All</option>
        {% for d in departments %}
          <option value="{{ d.id }}" {% if dept_id == d.id %}selected{% endif %}>{{ d.name }}</option>
        {% endfor %}
      </select>
    </div>

    <div class="col-md-3">
      <label class="form-label">Designation</label>
      <select name="designation_id" class="form-select">
        <option value="">All</option>
        {% for d in designations %}
          <option value="{{ d.id }}" {% if desig_id == d.id %}selected{% endif %}>{{ d.title }}</option>
        {% endfor %}
      </select>
    </div>

    <div class="col-md-2">
      <label class="form-label">Status</label>
      <select name="status" class="form-select">
        <option value="">All</option>
        <option value="active"   {% if status=='active' %}selected{% endif %}>Active</option>
        <option value="notice"   {% if status=='notice' %}selected{% endif %}>Notice</option>
        <option value="resigned" {% if status=='resigned' %}selected{% endif %}>Resigned</option>
      </select>
    </div>

    <div class="col-md-1">
      <label class="form-label">Rows</label>
      <select name="per_page" class="form-select">
        {% for n in [12, 24, 48] %}
          <option value="{{ n }}" {% if per_page == n %}selected{% endif %}>{{ n }}</option>
        {% endfor %}
      </select>
    </div>

    <div class="col-12 mt-1">
      <button class="btn btn-primary me-2"><i class="bi bi-filter"></i> Filter</button>
      <a class="btn btn-secondary" href="{{ url_for('documents.employee_repository') }}">Reset</a>
    </div>
  </form>

  {% if employees %}
    <div class="card shadow-sm">
      <div class="table-responsive">
        <table class="table table-hover align-middle mb-0">
          <thead class="table-light">
            <tr class="text-uppercase small text-muted">
              <th>Emp Code</th>
              <th>Name</th>
              <th>Department</th>
              <th>Designation</th>
              <th>Docs</th>
            </tr>
          </thead>
          <tbody>
            {% for e in employees %}
              <tr>
                <td class="text-nowrap">{{ e.employee_code }}</td>
                <td>
                  <div class="fw-semibold">{{ e.full_name }}</div>
                  <div class="small text-muted">{{ e.email }}</div>
                </td>
                <td>{{ e.department.name if e.department else '—' }}</td>
                <td>{{ e.designation.title if e.designation else '—' }}</td>
                <td class="small">
                  {# Quick badges for presence/absence #}
                  {% for key,label in doc_fields %}
                    {% set has_doc = e|attr(key) %}
                    <span class="badge rounded-pill {% if has_doc %}bg-success-subtle text-success border border-success-subtle{% else %}bg-secondary-subtle text-secondary border border-secondary-subtle{% endif %} me-1 mb-1">
                      {{ label }}
                    </span>
                  {% endfor %}
                </td>
                
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>

      <div class="card-footer d-flex flex-column flex-md-row gap-2 align-items-center justify-content-between">
        <div class="small text-muted">
          Page {{ pagination.page }} of {{ pagination.pages or 1 }} •
          Showing {{ employees|length }} of {{ pagination.total }} employees
        </div>

        <nav aria-label="pagination">
          <ul class="pagination mb-0">
            <li class="page-item {% if not pagination.has_prev %}disabled{% endif %}">
              <a class="page-link"
                 href="{{ url_for('documents.employee_repository',
                                  page=pagination.prev_num,
                                  per_page=per_page, q=q,
                                  department_id=dept_id, designation_id=desig_id, status=status) }}">Prev</a>
            </li>

            {% for p in page_numbers %}
              <li class="page-item {% if p == pagination.page %}active{% endif %}">
                <a class="page-link"
                   href="{{ url_for('documents.employee_repository',
                                    page=p,
                                    per_page=per_page, q=q,
                                    department_id=dept_id, designation_id=desig_id, status=status) }}">{{ p }}</a>
              </li>
            {% endfor %}

            <li class="page-item {% if not pagination.has_next %}disabled{% endif %}">
              <a class="page-link"
                 href="{{ url_for('documents.employee_repository',
                                  page=pagination.next_num,
                                  per_page=per_page, q=q,
                                  department_id=dept_id, designation_id=desig_id, status=status) }}">Next</a>
            </li>
          </ul>
        </nav>
      </div>
    </div>
  {% else %}
    <div class="alert alert-info">No employees match your filters.</div>
  {% endif %}
</div>
{% endblock %}