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

{% block title %}{{ 'menu.orders'|trans }}{% endblock %}

{% block page_title %}
    <span class="mr-6">
        <i class="fad fa-clipboard text-dark mr-2"></i>
        <span class="plus bold">{{ 'menu.orders'|trans }}</span>
    </span>
{% endblock %}

{% block stylesheets %}
    {{ parent() }}

    {{ encore_entry_link_tags('status') }}
    {{ encore_entry_link_tags('order') }}
{% endblock %}

{% block content %}
    <div class="card card-custom bg-success gutter-b">
        <div class="card-body">
            <span class="card-title text-inverse-primary font-weight-bold font-size-h2 mb-0 mt-6 d-block">{{ orders_new }}</span>
            <span class="font-weight-bold text-inverse-primary font-size-sm">{{ 'label.orders_waiting'|trans }}</span>
        </div>
    </div>

    <div class="card card-custom">
        <div class="card-header flex-wrap border-0 pt-6 pb-0 pb-4">
            <ul class="nav nav-dark nav-bold nav-tabs nav-tabs-line" data-remember-tab="tab_id" role="tablist">
                <li class="nav-item">
                    <span class="js-filter-status nav-link active" data-toggle="tab"
                          data-url="{{ path('order_filter_by_status', { 'status': constant('App\\Entity\\OrderPim::STATUS_ALL') }) }}">
                        {{ 'label.all'|trans }}
                    </span>
                </li>
                {% for status in order_status %}
                    <li class="nav-item">
                        <span class="js-filter-status nav-link" data-toggle="tab"
                              data-url="{{ path('order_filter_by_status', { 'status': status }) }}">
                            {% if attribute(statuses_labels, status) is defined %}
                                {{ attribute(statuses_labels, status)|trans }}
                            {% else %}
                                {{ status|replace({'_': ' '})|lower|capitalize }}
                            {% endif %}
                        </span>
                    </li>
                {% endfor %}
            </ul>
        </div>
        <div class="card-body py-0 pb-4">
            {#
            <div class="row">
                <div class="col-lg-3">
                    <div class="form-group">
                        <div class="input-icon">
                            <input id="search-orders" type="text" class="form-control" placeholder="Search..."
                                   data-url="{{ path('app_order_search') }}"/>
                            <span><i class="flaticon2-search-1 icon-md"></i></span>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3">
                    <div class="form-group">
                        <button class="btn btn-primary" type="button">
                            <i class="glyphicon glyphicon-filter icon-md"></i> Filtrar
                        </button>
                    </div>
                </div>
            </div>
            #}
            <table
                    id="order-list-datatable"
                    class="table table-border-bottom"
                    data-url="{{ path('order_refresh') }}">
                <thead>
                <tr class="text-start text-gray-400 fw-bold fs-7 text-uppercase gs-0">
                    <th>{{ 'label.order_number'|trans }}</th>
                    <th>{{ 'label.date'|trans }}</th>
                    <th>{{ 'label.expedition_date'|trans }}</th>
                    <th>{{ 'label.import_value'|trans }}</th>
                    <th>{{ 'label.status'|trans }}</th>
                    <th>{{ 'label.actions'|trans }}</th>
                </tr>
                </thead>
                <tbody class="text-gray-600 fw-semibold">
                </tbody>
            </table>
        </div>
    </div>

    <div class="modal fade" id="modal-create-tracking" tabindex="-1" role="dialog"
         aria-labelledby="staticBackdrop" aria-hidden="true">
        <div class="modal-dialog" data-backdrop="static" role="document">
            {{ form_start(form_create_tracking) }}
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modal-title">{{ 'label.tracking'|trans }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i aria-hidden="true" class="ki ki-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group row">
                        {{ form_label(form_create_tracking.carrier, null, {'label_attr': {'class': 'col-form-label text-left col-lg-6 col-sm-12'}}) }}
                        {{ form_widget(form_create_tracking.carrier, {'attr': {'class': 'form-control form-control-solid h-auto py-6 px-6 rounded-lg font-size-h6', 'placeholder': 'label.carrier'|trans}}) }}
                    </div>
                    <div class="form-group row">
                        {{ form_label(form_create_tracking.trackingNumber, null, {'label_attr': {'class': 'col-form-label text-left col-lg-6 col-sm-12'}}) }}
                        {{ form_widget(form_create_tracking.trackingNumber, {'attr': {'class': 'form-control form-control-solid h-auto py-6 px-6 rounded-lg font-size-h6', 'placeholder': 'label.tracking_number'|trans}}) }}
                    </div>
                    <div class="form-group row">
                        {{ form_label(form_create_tracking.trackingUrl, null, {'label_attr': {'class': 'col-form-label text-left col-lg-6 col-sm-12'}}) }}
                        {{ form_widget(form_create_tracking.trackingUrl, {'attr': {'class': 'form-control form-control-solid h-auto py-6 px-6 rounded-lg font-size-h6', 'placeholder': 'label.tracking_url'|trans}}) }}
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light-primary font-weight-bold"
                            data-dismiss="modal">{{ 'label.close'|trans }}</button>
                    <button id="create-tracking" type="submit"
                            class="btn btn-primary font-weight-bold">{{ 'label.create'|trans }}</button>
                </div>
            </div>
            <input type="hidden" id="tracking_url_to_create">
            {{ form_end(form_create_tracking) }}
        </div>
    </div>

    <div class="modal fade" id="modal-create-shipping" tabindex="-1" role="dialog"
         aria-labelledby="staticBackdrop" aria-hidden="true">
        <div class="modal-dialog" data-backdrop="static" role="document">
            {{ form_start(form_create_shipping) }}
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modal-title">{{ 'label.shipping'|trans }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i aria-hidden="true" class="ki ki-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group row">
                        {{ form_label(form_create_shipping.weight, null, {'label_attr': {'class': 'col-form-label text-left col-lg-6 col-sm-12'}}) }}
                        {{ form_widget(form_create_shipping.weight, {'attr': {'class': 'form-control form-control-solid h-auto py-6 px-6 rounded-lg font-size-h6', 'placeholder': 'label.weight'|trans}}) }}
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light-primary font-weight-bold"
                            data-dismiss="modal">{{ 'label.close'|trans }}</button>
                    <button id="create-shipping" type="submit"
                            class="btn btn-primary font-weight-bold">{{ 'label.create'|trans }}</button>
                </div>
            </div>
            <input type="hidden" id="shipping_url_to_create">
            {{ form_end(form_create_shipping) }}
        </div>
    </div>

    <div class="modal fade" id="modal-create-delivery-note" tabindex="-1" role="dialog"
         aria-labelledby="staticBackdrop" aria-hidden="true">
        <div class="modal-dialog" data-backdrop="static" role="document">
            {{ form_start(form_create_delivery_note) }}
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modal-title">{{ 'label.delivery_note'|trans }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i aria-hidden="true" class="ki ki-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group row">
                        {{ form_label(form_create_delivery_note.deliveryNoteNumber, null, {'label_attr': {'class': 'col-form-label text-left col-lg-6 col-sm-12'}}) }}
                        {{ form_widget(form_create_delivery_note.deliveryNoteNumber, {'attr': {'class': 'form-control form-control-solid h-auto py-6 px-6 rounded-lg font-size-h6', 'placeholder': 'label.delivery_note_number'|trans}}) }}
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light-primary font-weight-bold"
                            data-dismiss="modal">{{ 'label.close'|trans }}</button>
                    <button id="create-delivery-note" type="submit"
                            class="btn btn-primary font-weight-bold">{{ 'label.create'|trans }}</button>
                </div>
            </div>
            <input type="hidden" id="delivery_note_url_to_create">
            {{ form_end(form_create_delivery_note) }}
        </div>
    </div>

    <div class="modal fade" id="modal-create-invoice" tabindex="-1" role="dialog"
         aria-labelledby="staticBackdrop" aria-hidden="true">
        <div class="modal-dialog" data-backdrop="static" role="document">
            {{ form_start(form_create_invoice) }}
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modal-title">{{ 'label.invoice'|trans }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i aria-hidden="true" class="ki ki-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group row">
                        {{ form_label(form_create_invoice.invoiceNumber, null, {'label_attr': {'class': 'col-form-label text-left col-lg-6 col-sm-12'}}) }}
                        {{ form_widget(form_create_invoice.invoiceNumber, {'attr': {'class': 'form-control form-control-solid h-auto py-6 px-6 rounded-lg font-size-h6', 'placeholder': 'label.invoice_number'|trans}}) }}
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light-primary font-weight-bold"
                            data-dismiss="modal">{{ 'label.close'|trans }}</button>
                    <button id="create-invoice" type="submit"
                            class="btn btn-primary font-weight-bold">{{ 'label.create'|trans }}</button>
                </div>
            </div>
            <input type="hidden" id="invoice_url_to_create">
            {{ form_end(form_create_invoice) }}
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}

    {{ encore_entry_script_tags('order-index-datatable') }}
{% endblock %}