{% extends 'Common/baseAdminPannel.html.twig' %}

    {% block title %}
        {{ "Aprobación de pago de concessionario" }}
    {% endblock %}

    {% block subtitle %}
        <a class="loadaction"  data-method="GET" data-response-type="html" data-replace-container="#contract-show"  data-url="{{ path('contract_show',{id: contract.id}) }}"><i class="fa fa-arrow-left"> </i> Regresar al contrato</a>
    {% endblock %}

    {% block body %}
        {% if error is defined %}
            <div class="alert alert-danger">
                {{ error }}
            </div>
        {% else %}

            {% embed 'Common/baseAdminPannel.html.twig' %}
                {% block title %}
                    Datos del contrato
                {% endblock %}
                {% block subtitle %}
                {% endblock %}
                {% block body %}
                    <div class="row">
                        <div class="col-md-4"><b>{{ 'contract'|trans|capitalize }}</b>: {{ contract.contractNumber }}</div>
                        <div class="col-md-4"><b>{{ 'productType.name'|trans|capitalize }}</b>: {{ contract.productType.name }}</div>
                        <div class="col-md-4"><b>{{ 'status'|trans|capitalize }}</b>: {{ contract.status }}</div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <a class="loadinmodal btn btn-info" data-action="{{ path('contract_show', { 'id': contract.id }) }}">
                                Ver detalles
                            </a>
                        </div>
                    </div>
                {% endblock %}
            {% endembed %}

        {{ form_start(form, {'attr':{'data-remote':'true', 'data-method':'POST', 'data-url':form.vars.action , 'data-redirect':path('traveler_dashboard')~'#'~path('concessionairepayment_index') }}) }}

            {% embed 'Common/baseAdminPannel.html.twig' %}
                {% block title %}
                    Detalles del pago
                {% endblock %}
                {% block subtitle %}
                {% endblock %}
                {% block body %}
                    <div class="row">
                        <div class="col-md-3">{{ form_row(form.paymentDate) }}</div>
                        <div class="col-md-3">{{ form_row(form.paymentAmount) }}</div>
                        <div class="col-md-3">{{ form_row(form.paymentMethod) }}</div>
                        <div class="col-md-3">{{ form_row(form.invoiceReceipt) }}</div>
                    </div>
                    {#<div class="row">#}
                        {#<div class="col-md-12">{{ form_row(form.files) }}</div>#}
                    {#</div>#}
                {% endblock %}
            {% endembed %}

        <div id="{{ form.vars.id~'_transactions' }}">
            <table class="table table-bordered table-hover">
                <thead>
                <th style="font-weight: bold" class="text-right">No.</th>
                <th style="font-weight: bold" class="text-center">Fecha</th>
                <th style="font-weight: bold" class="text-right">Monto cargo</th>
                <th style="font-weight: bold" class="text-right">Con descuento</th>
                <th style="font-weight: bold" class="text-right">Monto abonos</th>
                <th style="font-weight: bold" class="text-right">Monto pendiente</th>
                <th style="font-weight: bold" class="text-center">Promesa</th>
                <th style="font-weight: bold" >Abono</th>
                <th style="font-weight: bold" class="text-center">Saldar</th>
                </thead>
                <tbody>

                {% for key, t in initialTransactions %}
                    {#{% if t.isPayed == false %}#}
                        {% if key == 0 %}
                            <tr class="{% if t.movementType.name == 'Enganche' %}success{% elseif t.movementType.name == 'Saldo' %}info{% else %}warning{% endif %}">
                                <td colspan="9"><b>{{ t.movementType.name|upper }}</b></td>
                            </tr>
                            {% include 'backend/sales/concessionairePayment/transactionRow.html.twig' with {edit_form: form} %}
                        {% elseif t.movementType.name != initialTransactions[key-1].movementType.name %}
                            <tr class="{% if t.movementType.name == 'Enganche' %}success{% elseif t.movementType.name == 'Saldo' %}info{% else %}warning{% endif %}">
                                <td colspan="9"><b>{{ t.movementType.name|upper }}</b></td>
                            </tr>
                            {% include 'backend/sales/concessionairePayment/transactionRow.html.twig' with {edit_form: form} %}
                        {% else %}
                            {% include 'backend/sales/concessionairePayment/transactionRow.html.twig' with {edit_form: form} %}
                        {% endif %}
                    {#{% endif %}#}
                {% endfor %}
                </tbody>
            </table>
        </div>


            <button type="submit" class="btn btn-success" >
                <i class="fa fa-check"></i> {{"Aplicar pago"}}<div class="ripple-container"></div>
            </button>

        {{ form_end(form) }}
        {% endif %}
    {% endblock %}