{% extends "base.html.twig" %}
{% trans_default_domain 'customer' %}

{% block searchform_container %}{% endblock %}

{% block actionheader %}
{% endblock %}

{% block body %}

    {{ form_start(form, {'attr': {'class': 'form-stacked' } }) }}

    <div class="box pad box-warning">

        <div class="box-header">

            <!-- tools box -->
            &nbsp;&nbsp;
            <div class="btn-group">
                <a href="{{ path('partner_transporte_index') }}" class="btn btn-app">
                    <i class="glyphicon glyphicon-list-alt"></i>
                    Listado
                </a>
                 {% if entity.id %}
                    <a href="{{ path('partner_transporte_add') }}" class="btn btn-app">
                        <i class="glyphicon glyphicon-file"></i>
                        Nuevo
                    </a>
                {% endif %}

                <button type="submit" class="btn btn-app" name="save">
                    <i class="glyphicon glyphicon-floppy-disk"></i>{% trans %}form.submit{% endtrans %}
                </button>

                {% if entity.id %}
                    <button type="submit" name="Form-delete" class="btn btn-app"
                            data-confirm="¿Estás seguro de eliminar el registro seleccionado?">
                        <i class="glyphicon glyphicon-trash"></i>{% trans %}form.submit_delete{% endtrans %}
                    </button>
                {% endif %}


            </div>
        </div>

        <div class="box-body">
            <article class="invoice-like">
                {{ form_errors(form) }}

                <div class="row">
                    <div class="col-md-3">
                        {{ form_row(form.ptoemisionsocio) }}
                    </div>
                    <div class="col-md-3">
                        {{ form_row(form.rucsocio) }}
                    </div>
                    <div class="col-md-3">
                        {{ form_row(form.tpcontribuyentesocio) }}
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-9">
                        {{ form_row(form.nombresocio) }}
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-9">
                        {{ form_row(form.email) }}
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-3">
                        {{ form_row(form.password) }}
                    </div>
                </div>
                <br>

                <div class="row">
                    <div class="col-md-3">
                        {{ form_row(form.enabled) }}
                    </div>
                </div>

                <table id="invoice-like-items" class="table table-condensed table-striped align-middle">
                    <thead>
                    <tr>
                        <th></th>
                        <th>Placa</th>
                    </tr>
                    </thead>
                    <tbody data-prototype="{{ include('Config/placa.html.twig', { 'form': form.placas.vars.prototype })|e }}">
                    {% for item in form.placas %}
                        {{ include('Config/placa.html.twig', { 'form': item, 'entity': item.vars.value}) }}
                    {% endfor %}

                    {# TODO: Action buttons: add/remove items, taxes, sort... #}
                    </tbody>
                </table>

                <div class="row totals">
                    <div class="col-md-6">

                        <button type="button" id="invoice-like-add-item" class="btn-sm btn-primary"><span
                                    class="glyphicon glyphicon-plus glyphicon-white"></span>&nbsp;Agregar Placa
                        </button>

                        <script type="text/javascript">
                            $('#invoice-like-add-item').on('click', function (event) {
                                event.preventDefault();
                                var collectionHolder = $('#invoice-like-items tbody');
                                var prototype = collectionHolder.attr('data-prototype');
                                form = prototype.replace(/__name__/g, collectionHolder.children().length);
                                collectionHolder.append(form);

                            });

                        </script>

                    </div>
                </div>
                <br>

                {{ form_rest(form) }}
            </article>
        </div>

    </div>
    {{ form_end(form) }}

{% endblock %}

{% block javascripts %}
    <script>
        function tipodocumento(sender) {

            let maxlenght = 20;
            if (sender.value === '05') {
                maxlenght = 10;
            } else if (sender.value === '04') {
                maxlenght = 13;
            }
            document.getElementById("transportista_identification").maxLength = maxlenght;
        }
    </script>
{% endblock %}