{% extends "base.html" %}
{% load i18n %}
{% load custom_filters %}
{% load tenhal_tag %}
{% block title %}{{ page_title }} - {{ sale_order.formatted_order_id }}{% endblock %}
{% block content %}
    <div class="container mt-4">
        <div class="card">
            <div class="card-header">
                <h2 class="mb-0">
                    {% trans "Sales Order" %} #{{ sale_order.formatted_order_id }}
                    <span class="badge bg-{{ sale_order.status|status_badge_color }} float-end">
                        {{ status_choices|get_item:sale_order.status }}
                    </span>
                </h2>
            </div>
            <div class="card-body">
                <!-- Basic Information -->
                <div class="row mb-4">
                    <div class="col-md-4">
                        <h4 class="mb-3">{% trans "Customer Information" %}</h4>
                        <p>
                            <strong>{% trans "Name" %}:</strong> {{ sale_order.full_name|title }}
                            <br>
                            {% if sale_order.customer %}
                                <strong>{% trans "Contact" %}:</strong> {{ sale_order.customer.phone_number }}
                                <br>
                                <strong>{% trans "Email" %}:</strong> {{ sale_order.customer.email }}
                            {% endif %}
                        </p>
                    </div>
                    <div class="col-md-4">
                        <h4 class="mb-3">{% trans "Order Details" %}</h4>
                        <p>
                            <strong>{% trans "Order Date" %}:</strong> {{ sale_order.order_date|date }}
                            <br>
                            <strong>{% trans "Dealer" %}:</strong> {{ sale_order.dealer.name }}
                            <br>
                            <strong>{% trans "Created By" %}:</strong> {{ sale_order.created_by }}
                        </p>
                    </div>
                    {% if not prems.inventory.change_saleorder %}
                        <div class="col-md-4 row mb-4">
                            <div class="col-12">
                                <h4>{% trans "Update Order Status" %}</h4>
                                <form method="post" action="">
                                    {% csrf_token %}
                                    <div class="mb-3">
                                        <label for="status" class="form-label">{% trans "Status" %}</label>
                                        <select class="form-select" id="status" name="status">
                                            <option value="PENDING_APPROVAL"
                                                    {% if sale_order.status == 'PENDING_APPROVAL' %}selected{% endif %}>{% trans "Pending Approval" %}</option>
                                            <option value="APPROVED"
                                                    {% if sale_order.status == 'APPROVED' %}selected{% endif %}>{% trans "Approved" %}</option>
                                            <option value="IN_FINANCING"
                                                    {% if sale_order.status == 'IN_FINANCING' %}selected{% endif %}>{% trans "In Financing" %}</option>
                                            <option value="PARTIALLY_PAID"
                                                    {% if sale_order.status == 'PARTIALLY_PAID' %}selected{% endif %}>{% trans "Partially Paid" %}</option>
                                            <option value="FULLY_PAID"
                                                    {% if sale_order.status == 'FULLY_PAID' %}selected{% endif %}>{% trans "Fully Paid" %}</option>
                                            <option value="PENDING_DELIVERY"
                                                    {% if sale_order.status == 'PENDING_DELIVERY' %}selected{% endif %}>{% trans "Pending Delivery" %}</option>
                                            <option value="DELIVERED"
                                                    {% if sale_order.status == 'DELIVERED' %}selected{% endif %}>{% trans "Delivered" %}</option>
                                            <option value="CANCELLED"
                                                    {% if sale_order.status == 'CANCELLED' %}selected{% endif %}>{% trans "Cancelled" %}</option>
                                        </select>
                                    </div>
                                    <button type="submit" class="btn btn-primary">{% trans "Save" %}</button>
                                </form>
                            </div>
                        </div>
                    {% endif %}
                </div>
                <!-- Vehicles Information -->
                {% if sale_order.estimate %}
                    <div class="row mb-4">
                        <div class="col-12">
                            <h4>{% trans "Vehicles Information" %}</h4>
                            <div class="card">
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <p>
                                                <strong>{% trans "Make" %}:</strong> {{ sale_order.cars.0.id_car_make }}
                                                <br>
                                                <strong>{% trans "Model" %}:</strong> {{ sale_order.cars.0.id_car_model }}
                                                <br>
                                                <strong>{% trans "Year" %}:</strong> {{ sale_order.cars.0.year }}
                                                <br>
                                                <strong>{% trans "Vin" %}:</strong> {{ sale_order.cars.0.vin }}
                                                <br>
                                                <strong>{% trans "Status" %}: </strong><span class="badge bg-success">{{ sale_order.cars.0.status|capfirst }}</span>
                                                </p>
                                        </div>
                                        <div class="col-md-6"></div>
                                    </div>
                                    {% if sale_order.estimate.notes %}
                                        <div class="mt-3">
                                            <strong>{% trans "Notes" %}:</strong>
                                            <div class="border p-2 mt-1">{{ sale_order.estimate.notes|linebreaks }}</div>
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                {% endif %}
                <!-- Estimate Information -->
                {% if sale_order.estimate %}
                    <div class="row mb-4">
                        <div class="col-12">
                            <h4>{% trans "Estimate Information" %}</h4>
                            <div class="card">
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <p>
                                                <strong>{% trans "Estimate Number" %}:</strong> {{ sale_order.estimate.estimate_number }}
                                                <br>
                                                <strong>{% trans "Date" %}:</strong> {{ sale_order.estimate.created|date }}
                                                <br>
                                                <strong>{% trans "Status" %}:</strong> <span class="badge
              {% if sale_order.estimate.status == 'draft' %}
                  bg-warning
              {% elif sale_order.estimate.status == 'in_review' %}
                  bg-info
              {% elif sale_order.estimate.status == 'approved' %}
                  bg-primary
              {% elif sale_order.estimate.status == 'completed' %}
                  bg-success
              {% elif sale_order.estimate.status == 'canceled' %}
                  bg-danger
              {% endif %}">{{ sale_order.estimate.get_status_display }}</span>
                                            </p>
                                        </div>
                                        <div class="col-md-6"></div>
                                    </div>
                                    {% if sale_order.estimate.notes %}
                                        <div class="mt-3">
                                            <strong>{% trans "Notes" %}:</strong>
                                            <div class="border p-2 mt-1">{{ sale_order.estimate.notes|linebreaks }}</div>
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                {% endif %}

                <!-- Invoice Information -->
                {% if sale_order.invoice %}
                    <div class="row mb-4">
                        <div class="col-12">
                            <h4>{% trans "Invoice Information" %}</h4>
                            <div class="card">
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <p>
                                                <strong>{% trans "Invoice Number" %}:</strong> {{ sale_order.invoice.invoice_number }}
                                                <br>
                                                <strong>{% trans "Date" %}:</strong> {{ sale_order.invoice.created|date }}
                                                <br>
                                                <strong>{% trans "Status" %}:</strong>
                                                <span class="badge
                                                             {% if sale_order.invoice.invoice_status == 'draft' %}
                                                                 bg-warning
                                                             {% elif sale_order.invoice.invoice_status == 'in_review' %}
                                                                 bg-info
                                                             {% elif sale_order.invoice.invoice_status == 'approved' %}
                                                                 bg-primary
                                                             {% elif sale_order.invoice.invoice_status == 'paid' %}
                                                                 bg-success
                                                             {% elif sale_order.invoice.invoice_status == 'declined' %}
                                                                 bg-danger
                                                             {% endif %}">
                                                    {{ sale_order.invoice.invoice_status|capfirst }}
                                                </span>
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <p>
                                                <table>
                                                    <tbody>
                                                        <tr>
                                                            <td style="padding-right: 0.5rem;">
                                                                <strong>{% trans "Amount Paid" %}:</strong>
                                                            </td>
                                                            <td style="padding-left: 0.5rem;">
                                                                <span class="icon-saudi_riyal"></span>{{ sale_order.invoice.amount_paid|floatformat:2 }}
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td style="padding-right: 0.5rem;">
                                                                <strong>{% trans "Balance Due" %}:</strong>
                                                            </td>
                                                            <td style="padding-left: 0.5rem;">
                                                                <span class="icon-saudi_riyal"></span>{{ sale_order.invoice.amount_due|floatformat:2 }}
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td style="padding-right: 0.5rem;">
                                                                <strong>{% trans "Amount Unearned" %}:</strong>
                                                            </td>
                                                            <td style="padding-left: 0.5rem;">
                                                                <span class="icon-saudi_riyal"></span>{{ sale_order.invoice.amount_unearned|floatformat:2 }}
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td style="padding-right: 0.5rem;">
                                                                <strong>{% trans "Amount Receivable" %}:</strong>
                                                            </td>
                                                            <td style="padding-left: 0.5rem;">
                                                                <span class="icon-saudi_riyal"></span>{{ sale_order.invoice.amount_receivable|floatformat:2 }}
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </p>
                                        </div>
                                    </div>
                                    {% if sale_order.invoice.notes %}
                                        <div class="mt-3">
                                            <strong>{% trans "Notes" %}:</strong>
                                            <div class="border p-2 mt-1">{{ sale_order.invoice.notes|linebreaks }}</div>
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                {% endif %}
                <!-- Ledger Information -->
                {% if sale_order.invoice.ledger %}
                    <div class="row mb-4">
                        <div class="col-12">
                            <h4>{% trans "Ledger Information" %}</h4>
                            <div class="card">
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <p>
                                                <strong>{% trans "Ledger Number" %}:</strong><a href="{% url 'ledger_detail' dealer_slug=request.dealer.slug entity_slug=sale_order.invoice.ledger.entity.slug pk=sale_order.invoice.ledger.pk %}"
   target="_blank"
   rel="noopener noreferrer"> {{ sale_order.invoice.ledger }} <i class="fa fa-external-link" aria-hidden="true"></i></a>
                                                <br>
                                                <strong>{% trans "Date" %}:</strong> {{ sale_order.invoice.ledger.created|date }}
                                                <br>
                                            </p>
                                        </div>
                                        <div class="col-md-6">
                                            <p>
                                                <table>
                                                    <tbody>
                                                        {% for je in sale_order.invoice.ledger.journal_entries.all %}
                                                            <tr>
                                                                <td style="padding-right: 0.5rem;">
                                                                    <strong>{{ je }}</strong>
                                                                </td>
                                                            </tr>
                                                        {% endfor %}
                                                    </tbody>
                                                </table>
                                            </p>
                                        </div>
                                    </div>
                                    {% if sale_order.invoice.notes %}
                                        <div class="mt-3">
                                            <strong>{% trans "Notes" %}:</strong>
                                            <div class="border p-2 mt-1">{{ sale_order.invoice.notes|linebreaks }}</div>
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                {% endif %}
                <!-- Delivery Information -->
                {% if sale_order.expected_delivery_date or sale_order.actual_delivery_date %}
                    <div class="row mb-4">
                        <div class="col-12">
                            <h4>{% trans "Delivery Information" %}</h4>
                            <p>
                                {% if sale_order.expected_delivery_date %}
                                    <strong>{% trans "Expected Delivery" %}:</strong> {{ sale_order.expected_delivery_date|date:"DATE_FORMAT" }}
                                    <br>
                                {% endif %}
                                {% if sale_order.actual_delivery_date %}
                                    <strong>{% trans "Actual Delivery" %}:</strong> {{ sale_order.actual_delivery_date|date:"DATETIME_FORMAT" }}
                                {% endif %}
                            </p>
                        </div>
                    </div>
                {% endif %}
                <!-- Cars/Items -->

                <!-- Cancellation Info -->
                {% if is_cancelled %}
                    <div class="row mb-4">
                        <div class="col-12">
                            <div class="alert alert-danger">
                                <h4>{% trans "Order Cancelled" %}</h4>
                                <p>
                                    <strong>{% trans "Cancellation Date" %}:</strong> {{ sale_order.cancelled_date|date:"DATETIME_FORMAT" }}
                                    <br>
                                    <strong>{% trans "Reason" %}:</strong> {{ sale_order.cancellation_reason }}
                                </p>
                            </div>
                        </div>
                    </div>
                {% endif %}
                <!-- Comments -->
                {% if sale_order.comments %}
                    <div class="row">
                        <div class="col-12">
                            <h4>{% trans "Comments" %}</h4>
                            <div class="card bg-light">
                                <div class="card-body">{{ sale_order.comments|linebreaks }}</div>
                            </div>
                        </div>
                    </div>
                {% endif %}
            </div>
            <div class="card-footer text-end">
                <a href="{% url 'sales_list' request.dealer.slug %}"
                   class="btn btn-phoenix-secondary">{% trans "Back to List" %}</a>
                <!-- Add links to view full estimate and invoice if they exist -->
                {% if sale_order.estimate %}
                    <a href="{% url 'estimate_detail' request.dealer.slug sale_order.estimate.pk %}"
                       class="btn btn-info ms-2">{% trans "View Full Estimate" %}</a>
                {% endif %}
                {% if sale_order.invoice %}
                    <a href="{% url 'invoice_detail' request.dealer.slug request.entity.slug sale_order.invoice.pk %}"
                       class="btn btn-info ms-2">{% trans "View Full Invoice" %}</a>
                {% endif %}
            </div>
        </div>
    </div>
{% endblock %}