{% extends "pos/base.html" %}
{% load static %}
{% block title %}Held Purchases{% endblock %}
{% block heading %}Held Purchase Invoices{% endblock %}

{% block content %}
<div class="mb-3">
  <a href="{% url 'purchases:purchases_list' %}" class="btn btn-secondary btn-sm">
    <i class="fas fa-arrow-left me-1"></i> Back to Purchases
  </a>
</div>

<div class="card shadow mb-4">
  <div class="card-body">
    <div class="table-responsive">
      <table class="table table-bordered" id="holdsTable" width="100%" cellspacing="0">
        <thead>
          <tr>
            <th>#</th>
            <th>Invoice #</th>
            <th>Challan #</th>
            <th>Date</th>
            <th>Vendor</th>
            <th class="text-end">Total</th>
            <th class="text-center">Hold Option</th>
            <th class="text-center">Stock</th>
            <th class="text-center">Ledger</th>
            <th class="text-center">Actions</th>
          </tr>
        </thead>
        <tbody>
          {% for row in rows %}
          {% with p=row.p %}
          <tr>
            <td>{{ forloop.counter }}</td>
            <td>{{ p.description }}</td>
            <td>{{ p.builty_no }}</td>
            <td>{{ p.transaction_date }}</td>
            <td>{{ p.party_descp }}</td>
            <td class="text-end">{{ p.total_amount|floatformat:2 }}</td>
            <td class="text-center">
              {% if row.hold_action == "stock" %}Stock only
              {% elif row.hold_action == "ledger" %}Ledger only
              {% elif row.hold_action == "both" %}Stock & Ledger
              {% else %}—{% endif %}
            </td>
            <td class="text-center">
              {% if row.stock_posted %}<span class="badge bg-success">Posted</span>
              {% else %}<span class="badge bg-secondary">Pending</span>{% endif %}
            </td>
            <td class="text-center">
              {% if row.ledger_posted %}<span class="badge bg-success">Posted</span>
              {% else %}<span class="badge bg-secondary">Pending</span>{% endif %}
            </td>
            <td class="text-center">
              <a href="{% url 'purchases:purchase_edit' p.description %}?bill_type=vendor_purchase"
                 class="btn btn-warning btn-sm" title="Edit / Complete">
                <i class="fas fa-edit"></i>
              </a>
              <a href="{% url 'purchases:purchase_delete' p.description %}?bill_type=vendor_purchase"
                 class="btn btn-danger btn-sm"
                 onclick="return confirm('Delete held invoice #{{ p.description }}?');">
                <i class="fas fa-trash"></i>
              </a>
            </td>
          </tr>
          {% endwith %}
          {% endfor %}
        </tbody>
      </table>
    </div>
    <div class="text-end mt-3">
      <span class="badge bg-primary p-2" style="color:#fff; font-weight:bold;">
        Grand Total: {{ grand_total|floatformat:2 }}
      </span>
    </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(){ $('#holdsTable').DataTable({ order:[[3,'desc']] }); });
</script>
{% endblock %}