{% extends "basic/base_template.html" %}

{% block pageName %}
Attendance Summary Archive
{% endblock pageName %}


{% block content %}
<!-- Date Filter Form -->
<div class='d-flex justify-content-end w-100'>
    <form method="GET" class=" d-block">
        <label class="form-label" for="date">Select Date:</label>
        <div class='input-group'>
        <input class="form-control" type="date" id="date" name="date" value="{{ date }}">
        <button class="btn btn-primary" type="submit">Filter</button>
        </div>
    </form>
</div>

<div class="table-responsive">
    <table class="table">
        <tr>
            <th>Action</th>
            <th>Date</th>
        </tr>
        {% for date in dates %}
        <tr>
            <td>{{date|date:'d-M-Y'}}</td>
            <td>
                <a class="btn btn-primary" href="{% url "parade_state_admin" date %}"><i class="bi bi-view-list mx-2"></i>Parade State View</a>
                <a class="btn btn-success" onclickopenAndDownload(event)  target="_blank" href="{% url "parade_state_pdf_admin" date %}"><i class="bi bi-printer mx-2"></i>PDF</a>
            </td>
        </tr>
        {% endfor %}
    </table>
</div>

{% include "components/pagination.html" with page_obj=dates %}

<script>
    function openAndDownload(event) {
      event.preventDefault();
      const pdfUrl = event.currentTarget.getAttribute('href');
  
      // Open in new tab
      window.open(pdfUrl, '_blank');
  
      // Trigger download
      const link = document.createElement('a');
      link.href = pdfUrl;
      link.download = 'your-file.pdf'; // Optional: set a filename
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    }
  </script>
{% endblock content %}