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


{% block page_title %}{{ 'dhl_freight.confirm_pending_expeditions' | trans }}{% endblock %}

{% block page_content %}
    <div class="select-all-expeditions-container">
        <span class="btn btn-xs btn-primary" id="select-all-expeditions">Seleccionar todas las expediciones</span>
    </div>
    <div>
        <form id="confirm-expeditions-form" action="#" method="POST">
            {% set today = "today"|date("U")  %}
            {% for expedition in expeditions %}
                <div class="row">
                    <div class="expedition-container" {% if expedition.dateAdd|date('U') < today %}style="background: #ffd45c"{% endif %}>
                        <div class="checkbox-col">
                            <input class="expedition-checkbox" type="checkbox" data-expedition-id="{{ expedition.id }}" />
                        </div>
                        <div class="col-sm-5">
                            <h4>{# expedition.trackings[0].reference #} {{ expedition.carrierExpeditionId }} </h4>
                           {{ 'expedition.id' | trans}}: {{ expedition.id }} ({{ 'picking_list.singular' | trans}} {{ expedition.pickingList.name }})<br/>
                            {{ expedition.dateAdd|date('d/m/Y H:i') }}
                        </div>
                        <div class="col-sm-6">
                            {% for pallet in expedition.pallets %}
                                <span class="pallet-desc">{{ pallet.length }} cm X {{ pallet.width }} cm X {{ pallet.height }}cm ({{ pallet.weight }} kg.)</span>
                            {% endfor %}
                        </div>
                    </div>
                </div>
            {% endfor %}
            <input type="hidden" name="expeditionIds" value="" />
            <div class="col-sm-6">
                <input type="submit" value="Marcar como confirmadas" class="pull-left btn btn-danger" id="mark-as-confirmed"/>
            </div>
            <div class="col-sm-6">
                <input type="submit" value="{{ 'dhl_freight.submit_confirmation' | trans }}" class="pull-right btn btn-primary" id="confirm-expeditions"/>
            </div>
        </form>
    </div>
{% endblock %}
{% block javascripts %}
    {{ parent() }}
    <script>

        function collectExpeditionIds()
        {
            let selectedExpeditions = [];

            $('.expedition-checkbox').each(function (e) {
                if ($(this).prop('checked')) {
                    selectedExpeditions.push($(this).data('expedition-id'));
                }
            });

            $('input[name=expeditionIds]').val(selectedExpeditions.toString());
        }

        $('body').on('click', '#confirm-expeditions', function (e){
            e.preventDefault();
            collectExpeditionIds();
            let form = $('#confirm-expeditions-form');
            form.attr('action', '{{ path('app_expedition_dhlfreight_confirm_expeditions') }}');
            form.submit();
        });

        $('body').on('click', '#mark-as-confirmed', function (e){
            e.preventDefault();

            if (confirm('¿Seguro que quieres marcarlas como ya confirmadas?')) {
                collectExpeditionIds();
                let form = $('#confirm-expeditions-form');
                form.attr('action', '{{ path('app_expedition_dhlfreight_expeditions_mark_as_confirmed') }}');
                form.submit();
            }
        });

        $('body').on('click', '#select-all-expeditions', function (e){
            e.preventDefault();

            $('.expedition-checkbox').each(function (e) {
                $(this).prop('checked', true);
            });

        });
    </script>
{% endblock %}