{% extends "base.html" %}

{% block title %}Delivery simulator — SendParcel Demo{% endblock %}

{% block page_title %}Delivery simulator{% endblock %}

{% block content %}
<div class="card">
  <div class="card-header">
    <h3 class="card-title">Operator panel</h3>
    <div class="card-actions">
      <span class="text-secondary">
        Simulates the behavior of a courier company.
        Click a button to send a status change callback.
      </span>
    </div>
  </div>
  {% if shipments %}
    <div class="table-responsive">
      <table class="table table-vcenter card-table">
        <thead>
          <tr>
            <th>ID</th>
            <th>Order</th>
            <th>Provider</th>
            <th>Tracking number</th>
            <th>Status</th>
            <th>Actions</th>
          </tr>
        </thead>
        <tbody>
          {% for shipment in shipments %}
            <tr>
              <td>{{ shipment.pk }}</td>
              <td>
                <a
                  href="{% url 'shipping:order_detail' pk=shipment.order.pk %}"
                >
                  #{{ shipment.order.pk }}
                </a>
              </td>
              <td>{{ shipment.provider }}</td>
              <td>
                <code>{{ shipment.tracking_number|default:"—" }}</code>
              </td>
              <td>
                <span class="badge">{{ shipment.get_status_display }}</span>
              </td>
              <td>
                <div class="btn-list">
                  {% if shipment.status == 'label_ready' or shipment.status == 'created' %}
                    <form
                      method="post"
                      action="{% url 'delivery_sim:trigger_status' shipment_id=shipment.pk %}"
                      class="d-inline"
                    >
                      {% csrf_token %}
                      <input
                        type="hidden"
                        name="status"
                        value="in_transit"
                      />
                      <button
                        type="submit"
                        class="btn btn-sm btn-yellow"
                      >
                        In transit
                      </button>
                    </form>
                  {% endif %}
                  {% if shipment.status == 'in_transit' %}
                    <form
                      method="post"
                      action="{% url 'delivery_sim:trigger_status' shipment_id=shipment.pk %}"
                      class="d-inline"
                    >
                      {% csrf_token %}
                      <input
                        type="hidden"
                        name="status"
                        value="out_for_delivery"
                      />
                      <button
                        type="submit"
                        class="btn btn-sm btn-cyan"
                      >
                        Out for delivery
                      </button>
                    </form>
                    <form
                      method="post"
                      action="{% url 'delivery_sim:trigger_status' shipment_id=shipment.pk %}"
                      class="d-inline"
                    >
                      {% csrf_token %}
                      <input
                        type="hidden"
                        name="status"
                        value="delivered"
                      />
                      <button
                        type="submit"
                        class="btn btn-sm btn-green"
                      >
                        Delivered
                      </button>
                    </form>
                  {% endif %}
                  {% if shipment.status == 'out_for_delivery' %}
                    <form
                      method="post"
                      action="{% url 'delivery_sim:trigger_status' shipment_id=shipment.pk %}"
                      class="d-inline"
                    >
                      {% csrf_token %}
                      <input
                        type="hidden"
                        name="status"
                        value="delivered"
                      />
                      <button
                        type="submit"
                        class="btn btn-sm btn-green"
                      >
                        Delivered
                      </button>
                    </form>
                    <form
                      method="post"
                      action="{% url 'delivery_sim:trigger_status' shipment_id=shipment.pk %}"
                      class="d-inline"
                    >
                      {% csrf_token %}
                      <input
                        type="hidden"
                        name="status"
                        value="returned"
                      />
                      <button
                        type="submit"
                        class="btn btn-sm btn-orange"
                      >
                        Returned
                      </button>
                    </form>
                  {% endif %}
                  {% if shipment.status == 'new' or shipment.status == 'created' or shipment.status == 'label_ready' %}
                    <form
                      method="post"
                      action="{% url 'delivery_sim:trigger_status' shipment_id=shipment.pk %}"
                      class="d-inline"
                    >
                      {% csrf_token %}
                      <input
                        type="hidden"
                        name="status"
                        value="cancelled"
                      />
                      <button
                        type="submit"
                        class="btn btn-sm btn-red"
                      >
                        Cancel
                      </button>
                    </form>
                  {% endif %}
                </div>
              </td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  {% else %}
    <div class="card-body">
      <div class="empty">
        <p class="empty-title">No shipments</p>
        <p class="empty-subtitle text-secondary">
          Create an order and a shipment to see them here.
        </p>
      </div>
    </div>
  {% endif %}
</div>
{% endblock %}