{% extends 'core/base.html' %}
{% load static %}

{% block title %}Purchase Orders - SwiftPOS{% endblock %}
{% block topbar_title %}Purchase Orders{% endblock %}

{% block content %}
<div class="container-fluid px-0">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <div>
            <h5 class="mb-0">Purchase Orders</h5>
            <div class="small text-muted">Manage stock coming from suppliers.</div>
        </div>
        <a href="{% url 'inventory:purchase_order_create' %}" class="btn btn-primary btn-sm">
            <i class="fas fa-plus me-1"></i> New Purchase Order
        </a>
    </div>

    <div class="card shadow-sm">
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-sm align-middle mb-0">
                    <thead class="table-light">
                        <tr>
                            <th>#</th>
                            <th>Supplier</th>
                            <th>Reference</th>
                            <th>Status</th>
                            <th>Ordered</th>
                            <th>Received</th>
                            <th class="text-end">Total Cost ({{ currency_symbol }})</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for order in orders %}
                            <tr>
                                <td>
                                    <a href="{% url 'inventory:purchase_order_detail' order.id %}">
                                        #{{ order.id }}
                                    </a>
                                </td>
                                <td>{{ order.supplier.name }}</td>
                                <td>{{ order.reference_number|default:"-" }}</td>
                                <td>
                                    <span class="badge
                                        {% if order.status == 'received' %} bg-success-subtle text-success
                                        {% elif order.status == 'ordered' %} bg-primary-subtle text-primary
                                        {% elif order.status == 'draft' %} bg-secondary-subtle text-secondary
                                        {% else %} bg-danger-subtle text-danger
                                        {% endif %}">
                                        {{ order.get_status_display }}
                                    </span>
                                </td>
                                <td>{{ order.date_ordered|date:"Y-m-d" }}</td>
                                <td>{{ order.date_received|date:"Y-m-d"|default:"-" }}</td>
                                <td class="text-end">{{ currency_symbol }}{{ order.total_cost|floatformat:2 }}</td>
                            </tr>
                        {% empty %}
                            <tr>
                                <td colspan="7" class="text-center text-muted py-3">
                                    No purchase orders yet. Click <strong>New Purchase Order</strong> to get started.
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
{% endblock %}