{% extends "pos/base.html" %}
{% load static %}
{% block title %}Debitor Receipt{% endblock %}
{% block stylesheets %}

{% endblock %}
{% block heading %}Debitor Receipt (Money In){% endblock %}
{% block content %}
<form method="get" class="filter-box mb-3">
  <div class="row align-items-end">
    <!-- Invoice # -->
    <div class="col-md-3">
      <label>Invoice #</label>
      <input name="invoice" value="{{ invoice_q }}" class="form-control">
    </div>
    <div class="col-auto">
      <input type="radio" name="filter" value="invoice"
             {% if picked_filter == "invoice" %}checked{% endif %}>
    </div>
    <!-- Debitor -->
    <div class="col-md-3">
      <label>Debitor</label>
      <input name="debitor" value="{{ debitor_q }}" class="form-control">
    </div>
    <div class="col-auto">
      <input type="radio" name="filter" value="debitor"
             {% if picked_filter == "debitor" %}checked{% endif %}>
    </div>
    <!-- Date -->
    <div class="col-md-3">
      <label>Date From</label>
      <input type="date" name="date_from" value="{{ date_from_q }}" class="form-control">
    </div>
    <div class="col-md-3">
      <label>Date To</label>
      <input type="date" name="date_to" value="{{ date_to_q }}" class="form-control">
    </div>
    <div class="col-auto">
      <input type="radio" name="filter" value="date"
             {% if picked_filter == "date" %}checked{% endif %}>
    </div>
    <div class="col-auto">
      <button class="btn btn-primary">Search</button>
      <a href="{% url 'transactions:debitor_receipt_list' %}" class="btn btn-secondary">Reset</a>
    </div>
  </div>
</form>

<div class="mb-3">
  <a href="{% url 'transactions:debitor_receipt_add' %}" class="btn btn-success">
    New Receipt
  </a>
</div>

<table id="dataTable" class="table table-bordered table-hover">
  <thead>
    <tr>
      <th>#</th><th>Invoice #</th><th>Date</th>
      <th>Debitor</th><th class="text-end">Received</th>
      <th class="text-end">Balance</th><th>Actions</th>
    </tr>
  </thead>
  <tbody>
    {% for p in payments %}
    <tr>
      <td>{{ forloop.counter }}</td>
      <td>{{ p.description }}</td>
      <td>{{ p.transaction_date }}</td>
      <td>{{ p.party_descp }}</td>
      <td class="text-end">{{ p.amount_transaction|floatformat:2 }}</td>
      <td class="text-end">{{ p.total_amount|floatformat:2 }}</td>
      <td>
        <a href="{% url 'transactions:debitor_receipt_edit' p.description %}" class="btn btn-warning btn-sm">Edit</a>
        <a href="{% url 'transactions:debitor_receipt_delete' p.description %}" 
           class="btn btn-danger btn-sm"
           onclick="return confirm('Delete receipt #{{p.description}}?')">Del</a>
        <a href="{% url 'transactions:debitor_receipt_pdf' p.description %}" class="btn btn-dark btn-sm">PDF</a>
      </td>
    </tr>
    {% endfor %}
  </tbody>
</table>
<div class="text-end mt-3">
  <span class="badge bg-primary">Grand Total: {{ grand_total|floatformat:2 }}</span>
</div>
{% endblock %}

{% block javascripts %}

<script>$('#dataTable').DataTable({order:[[2,'desc']]});</script>
{% endblock %}