{% extends "base.html" %}
{% load i18n %}
{% load custom_filters %}
{% block title %}
    {% trans 'Sale Orders' %} {% endblock %}
    {% block content %}
        {% if txs or request.GET.q %}
            <section class="mt-2">
                <div class="row overflow-x-auto whitespace-nowrap -mx-2 sm:mx-0">
                    <div class="row g-3 justify-content-between mb-4">
                        <div class="col-auto">
                            <div class="d-md-flex justify-content-between">
                                <h2 class="mb-4">
                                    {% trans 'Sale Orders' %}<i class="fa-solid fa-cart-shopping ms-2 text-primary"></i>
                                </h2>
                            </div>
                        </div>
                        {% comment %} <div class="col-auto">
                            <div class="d-flex">{% include 'partials/search_box.html' %}</div>
                        </div> {% endcomment %}
                    </div>
                    <div class="table-responsive scrollbar mx-n1 px-1">
                        <table class="table align-items-center table-flush">
                            <thead>
                                <tr class="bg-body-highlight">
                                    <th class="sort white-space-nowrap align-middle ps-0"
                                        scope="col"
                                        data-sort="customer_name">{{ _("Customer Name") }}</th>
                                    <th class="sort align-middle ps-3"
                                        scope="col"
                                        data-sort="customer_address">{{ _("Customer Address") }}</th>
                                    <th class="sort align-middle ps-3" scope="col" data-sort="customer_phone">{{ _("Customer Phone") }}</th>
                                    <th class="sort align-middle ps-3" scope="col" data-sort="quotation">{{ _("Quotation") }}</th>
                                    <th class="sort align-middle ps-3" scope="col" data-sort="invoice">{{ _("Invoice") }}</th>
                                    <th class="sort align-middle text-end" scope="col"></th>
                                </tr>
                            </thead>
                            <tbody class="list" id="project-list-table-body">
                                {% for tx in txs %}
                                    <tr class="position-static">
                                        <td class="align-middle white-space-nowrap customer_name px-1">
                                            <p class="mb-0 fs-9 text-body">{{ tx.customer.first_name }}  {{ tx.customer.last_name }}</p>
                                        </td>
                                        <td class="align-middle white-space-nowrap customer_address">
                                            <p class="mb-0 fs-9 text-body">{{ tx.customer.address }}</p>
                                        </td>
                                        <td class="align-middle white-space-nowrap customer_phone">
                                            <p class="mb-0 fs-9 text-body">{{ tx.customer.phone_number }}</p>
                                        </td>
                                        <td class="align-middle white-space-nowrap quotation">
                                            {% if tx.estimate and perms.django_ledger.view_estimatemodel %}
                                                <p class="fw-bo text-body fs-9 mb-0">
                                                    <a href="{% url 'estimate_detail' request.dealer.slug tx.estimate.uuid %}">{{ tx.estimate.estimate_number }}</a>
                                                    <br>
                                                    {% if tx.estimate.status == "draft" %}
                                                        <span class="badge badge-phoenix badge-phoenix-warning">{{ tx.estimate.status }}</span>
                                                    {% elif tx.estimate.status == "in_review" %}
                                                        <span class="badge badge-phoenix badge-phoenix-info">{{ tx.estimate.status }}</span>
                                                    {% elif tx.estimate.status == "approved" %}
                                                        <span class="badge badge-phoenix badge-phoenix-primary">{{ tx.estimate.status }}</span>
                                                    {% elif tx.estimate.status == "completed" %}
                                                        <span class="badge badge-phoenix badge-phoenix-success">{{ tx.estimate.status }}</span>
                                                    {% endif %}
                                                </p>
                                            {% endif %}
                                        </td>
                                        <td class="align-middle white-space-nowrap invoice">
                                            {% if tx.invoice and perms.django_ledger.view_invoicemodel %}
                                                <p class="fw-bo text-body fs-9 mb-0">
                                                    <a href="{% url 'invoice_detail' request.dealer.slug request.entity.slug tx.invoice.uuid %}">
                                                        {{ tx.invoice.invoice_number }}
                                                    </a>
                                                    <br>
                                                    {% if tx.invoice.is_draft %}
                                                        <span class="badge badge-phoenix badge-phoenix-warning">{{ tx.invoice.invoice_status }}</span>
                                                    {% elif tx.invoice.is_review %}
                                                        <span class="badge badge-phoenix badge-phoenix-info">{{ tx.invoice.invoice_status }}</span>
                                                    {% elif tx.invoice.is_approved %}
                                                        <span class="badge badge-phoenix badge-phoenix-primary">{{ tx.invoice.invoice_status }}</span>
                                                    {% elif tx.invoice.is_completed %}
                                                        <span class="badge badge-phoenix badge-phoenix-success">{{ tx.invoice.invoice_status }}</span>
                                                    {% elif tx.invoice.is_paid %}
                                                        <span class="badge badge-phoenix badge-phoenix-success">{{ tx.invoice.invoice_status }}</span>
                                                    {% elif tx.invoice.is_canceled %}
                                                        <span class="badge badge-phoenix badge-phoenix-danger">{{ tx.invoice.invoice_status }}</span>
                                                    {% elif tx.invoice.is_past_due %}
                                                        <span class="badge badge-phoenix badge-phoenix-danger">{{ _("Past Due") }}</span>
                                                    {% endif %}
                                                </p>
                                            {% endif %}
                                        </td>
                                        <td class="align-middle text-end white-space-nowrap pe-4 action">
                                            <div class="btn-reveal-trigger position-static">
                                                <button class="btn btn-sm dropdown-toggle dropdown-caret-none transition-none btn-reveal fs-10"
                                                        type="button"
                                                        data-bs-toggle="dropdown"
                                                        data-boundary="window"
                                                        aria-haspopup="true"
                                                        aria-expanded="false"
                                                        data-bs-reference="parent">
                                                    <span class="fas fa-ellipsis-h fs-10"></span>
                                                </button>
                                                <div class="dropdown-menu dropdown-menu-end py-2">
                                                    <a class="dropdown-item text-success-dark"
                                                       href="{% url 'order_detail' request.dealer.slug tx.pk %}">{{ _("View Sales Order Detail") }}</a>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                    {% if page_obj.paginator.num_pages > 1 %}
                        <div class="d-flex justify-content-end mt-3">
                            <div class="d-flex">{% include 'partials/pagination.html' %}</div>
                        </div>
                    {% endif %}
                </div>
            </section>
        {% else %}
            {% url 'estimate_create' request.dealer.slug as url %}
        {% include "empty-illustration-page.html" with value="Sale Orders" url=url %}
        {% endif %}
    {% endblock %}