{% extends "pos/base.html" %}
{% load static %}
{% block title %}Bill Wise Purchase Report{% endblock %}
{% block heading %}Bill Wise Purchase Report{% endblock %}

{% block content %}
{% csrf_token %}
<form method="get" class="filter-box mb-3" id="filterForm">
  <div class="row align-items-end">
    <div class="col-md-3 mb-2">
      <label class="small mb-1">Vendor</label>
      <select id="vendor_select" name="vendor_id" class="form-control" style="width:100%">
        {% if filters.vendor_id %}<option value="{{ filters.vendor_id }}" selected>{{ filters.vendor_name }}</option>{% endif %}
      </select>
    </div>
    <div class="col-md-2 mb-2">
      <label class="small mb-1">Bill Type</label>
      <select name="bill_type_filter" class="form-control">
        <option value="all" {% if filters.bill_type_filter == "all" %}selected{% endif %}>All</option>
        <option value="purchase" {% if filters.bill_type_filter == "purchase" %}selected{% endif %}>Purchase</option>
        <option value="return" {% if filters.bill_type_filter == "return" %}selected{% endif %}>Purchase Return</option>
      </select>
    </div>
    <div class="col-md-2 mb-2">
      <label class="small mb-1">Challan #</label>
      <input type="text" name="challan_no" value="{{ filters.challan_no }}" class="form-control" placeholder="Challan #">
    </div>
    <div class="col-md-3 mb-2">
      <label class="small mb-1">From</label>
      <input type="date" name="date_from" value="{{ filters.date_from }}" class="form-control">
    </div>
    <div class="col-md-3 mb-2">
      <label class="small mb-1">To</label>
      <input type="date" name="date_to" value="{{ filters.date_to }}" class="form-control">
    </div>
    <div class="col-auto mb-2">
      <button type="submit" class="btn btn-primary btn-sm"><i class="fas fa-search me-1"></i>Search</button>
      <a href="?" class="btn btn-secondary btn-sm">Reset</a>
    </div>
  </div>
  <div class="row mt-1">
    <div class="col-auto">
      <a href="#" id="btnExportPdf" class="btn btn-danger btn-sm"><i class="fas fa-file-pdf me-1"></i>Export PDF</a>
      <a href="#" id="btnExportExcel" class="btn btn-success btn-sm"><i class="fas fa-file-excel me-1"></i>Export Excel</a>
    </div>
  </div>
</form>

<div class="card shadow mb-4">
  <div class="card-body">
    <div class="table-responsive">
      <table class="table table-bordered table-sm" id="dataTable" width="100%">
        <thead>
          <tr>
            <th>Invoice #</th><th>Type</th><th>Date</th><th>Vendor</th><th>Challan #</th>
            <th class="text-end">Discount</th><th class="text-end">Transport</th>
            <th class="text-end">Other</th><th class="text-end">GST</th><th class="text-end">F.Tax</th>
            <th class="text-end">Total</th><th class="text-end">Paid</th><th class="text-end">Balance</th>
            <th class="text-center">Action</th>
          </tr>
        </thead>
        <tbody>
          {% for r in rows %}
          <tr {% if r.is_return %}class="table-danger"{% endif %}>
            <td>{{ r.invoice_no }}</td>
            <td>{{ r.type_label }}</td>
            <td>{{ r.date }}</td>
            <td>{{ r.vendor }}</td>
            <td>{{ r.challan }}</td>
            <td class="text-end">{{ r.discount|floatformat:2 }}</td>
            <td class="text-end">{{ r.transport|floatformat:2 }}</td>
            <td class="text-end">{{ r.other|floatformat:2 }}</td>
            <td class="text-end">{{ r.gst|floatformat:2 }}</td>
            <td class="text-end">{{ r.ftax|floatformat:2 }}</td>
            <td class="text-end">{{ r.total|floatformat:2 }}</td>
            <td class="text-end">{{ r.paid|floatformat:2 }}</td>
            <td class="text-end">{{ r.balance|floatformat:2 }}</td>
            <td class="text-center">
              {% if r.is_return %}
                <a href="{% url 'purchases:purchase_return_edit' r.invoice_no %}?bill_type=vendor_purchase" class="btn btn-warning btn-sm" title="Edit">
                  <i class="fas fa-edit"></i>
                </a>
                <a href="{% url 'purchases:purchase_return_pdf' r.invoice_no %}?bill_type=vendor_purchase" target="_blank" class="btn btn-info btn-sm" title="View">
                  <i class="fas fa-eye"></i>
                </a>
              {% else %}
                <a href="{% url 'purchases:purchase_edit' r.invoice_no %}?bill_type=vendor_purchase" class="btn btn-warning btn-sm" title="Edit">
                  <i class="fas fa-edit"></i>
                </a>
                <a href="{% url 'purchases:purchase_invoice_pdf' r.invoice_no %}?bill_type=vendor_purchase" target="_blank" class="btn btn-info btn-sm" title="View">
                  <i class="fas fa-eye"></i>
                </a>
              {% endif %}
            </td>
          </tr>
          {% endfor %}
        </tbody>
        <tfoot>
          <tr class="fw-bold">
            <td colspan="5">TOTALS</td>
            <td class="text-end">{{ totals.discount|floatformat:2 }}</td>
            <td class="text-end">{{ totals.transport|floatformat:2 }}</td>
            <td class="text-end">{{ totals.other|floatformat:2 }}</td>
            <td class="text-end">{{ totals.gst|floatformat:2 }}</td>
            <td class="text-end">{{ totals.ftax|floatformat:2 }}</td>
            <td class="text-end">{{ totals.total|floatformat:2 }}</td>
            <td class="text-end">{{ totals.paid|floatformat:2 }}</td>
            <td class="text-end">{{ totals.balance|floatformat:2 }}</td>
            <td></td>
          </tr>
        </tfoot>
      </table>
    </div>
  </div>
</div>
{% endblock %}

{% block javascripts %}
<script src="{% static 'vendor/datatables/jquery.dataTables.min.js' %}"></script>
<script src="{% static 'vendor/datatables/dataTables.bootstrap4.min.js' %}"></script>
<script>
  $(function(){
    $('#dataTable').DataTable({ order:[[1,'asc']], paging:true });

    $('#vendor_select').select2({
      placeholder: 'All Vendors',
      allowClear: true,
      ajax: {
        url: "{% url 'purchases:get_vendors' %}",
        type: 'POST',
        headers: { 'X-CSRFToken': $('[name=csrfmiddlewaretoken]').val() },
        data: function(params){ return { term: params.term || '' }; },
        processResults: function(data){ return { results: data.results }; },
      },
    });

    function _qs(extra){
      const params = new URLSearchParams(window.location.search);
      Object.keys(extra||{}).forEach(k => params.set(k, extra[k]));
      return params.toString();
    }
    $('#btnExportPdf').on('click', function(e){
      e.preventDefault();
      window.open("{% url 'reports:bill_wise_purchase_report_pdf' %}?" + _qs(), '_blank');
    });
    $('#btnExportExcel').on('click', function(e){
      e.preventDefault();
      window.location.href = "{% url 'reports:bill_wise_purchase_report_excel' %}?" + _qs();
    });
  });
</script>
{% endblock %}