{% extends 'base.html' %}
{% block title %}Purchase Orders{% endblock %}

{% block content %}
<div class="flex justify-between items-center mb-6">
  <h1 class="text-2xl font-bold">Purchase Orders</h1>
  <a href="{% url 'inventory:po_create' %}" class="btn btn-primary btn-sm">➕ New Order</a>
</div>

<!-- Filter -->
<form method="get" class="flex flex-wrap gap-2 mb-4">
  <input type="text" name="q" value="{{ query }}"
         placeholder="Search reference or supplier..."
         class="input input-bordered input-sm w-64"/>
  <select name="status" class="select select-bordered select-sm">
    <option value="">All Status</option>
    <option value="pending" {% if current_status == 'pending' %}selected{% endif %}>Pending</option>
    <option value="received" {% if current_status == 'received' %}selected{% endif %}>Received</option>
    <option value="cancelled" {% if current_status == 'cancelled' %}selected{% endif %}>Cancelled</option>
  </select>
  <button class="btn btn-primary btn-sm">🔍 Filter</button>
  <a href="{% url 'inventory:po_list' %}" class="btn btn-ghost btn-sm">Reset</a>
</form>

<div class="card bg-base-100 shadow">
  <div class="card-body p-0">
    <table class="table table-zebra">
      <thead>
        <tr>
          <th>Reference</th>
          <th>Supplier</th>
          <th>Items</th>
          <th>Total</th>
          <th>Status</th>
          <th>Date</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {% for po in orders %}
        <tr>
          <td class="font-mono font-bold">{{ po.reference }}</td>
          <td>{{ po.supplier.name }}</td>
          <td>{{ po.items.count }}</td>
          <td>{{ po.total|floatformat:0 }}</td>
          <td>
            <span class="badge badge-sm
              {% if po.status == 'received' %}badge-success
              {% elif po.status == 'pending' %}badge-warning
              {% else %}badge-ghost{% endif %}">
              {{ po.get_status_display }}
            </span>
          </td>
          <td>{{ po.date|date:"d M Y" }}</td>
          <td>
            <a href="{% url 'inventory:po_detail' po.pk %}" class="btn btn-ghost btn-xs">View</a>
          </td>
        </tr>
        {% empty %}
        <tr>
          <td colspan="7" class="text-center text-base-content/40 py-10">
            No purchase orders yet.
            <a href="{% url 'inventory:po_create' %}" class="link link-primary">Create first order</a>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>

{% include 'partials/pagination.html' with page_obj=orders %}
{% endblock %}