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

{% block page_title %}{{ 'picking_list.enter_pallets' | trans }}{% endblock %}

{% block page_content %}
    <div class="row">
        <div class="col-md-4">
            <div class="box">
                {{ form_start(form) }}
                <div class="box-body">
                    <div class="text-right">
                        <a href="#" class="btn btn-primary" id="europallet-switch">Europallets</a>
                        <a href="#" class="btn btn-primary" id="american-pallet-switch">Pallets americanos</a>
                    </div>
                    {% for pallet in form.pallets %}
                        <div class="row">
                            <div class="col-md-12">
                                <strong>Pallet #{{ loop.index }}</strong>
                            </div>
                            <hr/>
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-sm-3">
                                        {{ form_label(pallet.width) }}
                                        {{ form_widget(pallet.width) }}
                                    </div>
                                    <div class="col-sm-3">
                                        {{ form_label(pallet.length) }}
                                        {{ form_widget(pallet.length) }}
                                    </div>
                                    <div class="col-sm-3">
                                        {{ form_label(pallet.height) }}
                                        {{ form_widget(pallet.height) }}
                                    </div>
                                    <div class="col-sm-3">
                                        {{ form_label(pallet.weight) }}
                                        {{ form_widget(pallet.weight) }}
                                    </div>
                                </div>
                            </div>
                        </div>

                    {% endfor %}
                </div>
                <div class="box-footer">
                    <div class="col-md-12 text-right">
                        {{ form_widget(form.submit) }}
                    </div>
                </div>
                {{ form_rest(form) }}
                {{ form_end(form) }}
            </div>
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        $('#europallet-switch').click(function(e){
            e.preventDefault();
            $('[id$=_width]').val('80');
            $('[id$=_length]').val('120');
        });

        $('#american-pallet-switch').click(function(e){
            e.preventDefault();
            $('[id$=_width]').val('100');
            $('[id$=_length]').val('120');
        });

        $('#europallet-switch').click();

    </script>
{% endblock %}