{% extends 'layout.html.twig' %}

{% set seo_title = 'Review Order' %}

{% block content %}
    <div class="container">
        <div class="order-progress">
            <div class="order-progress-item"><a href="{{ path('order_index') }}" class="order-progress-link">Order</a></div>
            <div class="order-progress-item"><a href="{{ path('order_shipping') }}" class="order-progress-link">Shipping</a></div>
            <div class="order-progress-item current">Review</div>
            <div class="order-progress-item">Confirmation</div>
        </div>
        <h1>Review Order</h1>

        {{ form_start(form) }}
            <table class="order-table">
                <thead>
                    <tr>
                        <th>Collection</th>
                        <th>Width</th>
                        <th>Colour</th>
                        <th>Pack size</th>
                        <th>Quantity</th>
                        <th>Drop size(s)</th>
                    </tr>
                </thead>
                <tbody>
                    {% for item in order.orderItems %}
                        <tr class="order-table-item">
                            <td>
                                <div class="order-table-heading">Collection</div>
                                {{ item.collection.title }}
                            </td>
                            <td>
                                <div class="order-table-heading">Width</div>
                                {{ item.product.length }}
                            </td>
                            <td>
                                <div class="order-table-heading">Colour</div>
                                {{ item.part.description }}
                            </td>
                            <td>
                                <div class="order-table-heading">Pack size</div>
                                {{ item.product.packSize }}
                            </td>
                            <td>
                                <div class="order-table-heading">Quantity</div>
                                {{ item.quantity }}
                            </td>
                            <td>
                                <div class="order-table-heading">Drop size(s)</div>
                                {{ item.dropSizes ?: '—' }}
                            </td>
                        </tr>

                        {% if item.part.stockUpdate %}
                            <tr class="order-table-stock">
                                <td colspan="6"><strong>Stock update:</strong> Due on {{ item.part.stockUpdate.dateAvailable|date('jS F Y') }}</td>
                            </tr>
                        {% endif %}
                    {% endfor %}
                </tbody>
            </table>


            <div class="order-review-details">
                <h2 class="order-review-details-title">Shipping address</h2>
                <strong>{{ order.company }}</strong><br>
                Att: {{ order.firstName }} {{ order.lastName }}<br>
                {{ order.address }}<br>
                {{ order.suburb }}
                {{ order.state }}
                {{ order.postcode }}
                {{ order.country|country_name }}<br>
                Phone: {{ order.phoneNumber }}
            </div>

            {% if order.purchaseOrderNumber %}
                <div class="order-review-details">
                    <h2 class="order-review-details-title">Purchase order number</h2>
                    {{ order.purchaseOrderNumber }}
                </div>
            {% endif %}

            {% if order.specialRequests %}
                <div class="order-review-details">
                    <h2 class="order-review-details-title">Special requests</h2>
                    <p>{{ order.specialRequests|nl2br }}</p>
                </div>
            {% endif %}

            <div class="order-review-buttons">
                <a href="{{ path('order_shipping') }}" class="btn btn-secondary btn-prev">Go Back</a>
                <button type="submit" class="btn btn-primary btn-more">Submit order</button>
            </div>
        {{ form_end(form) }}
    </div>
{% endblock %}