{% extends 'layouts/panel_layout.html.twig' %}

{% block title %}

Facturación
{% endblock %}


{% block stylesheets %}
    {{ encore_entry_link_tags('facturacion_nuevo') }}
{% endblock %}

{% block content %}

    {# TITULO #}
    <div class="bg-dark m-b-30">
        <div class="container">
            <div class="row p-b-60 p-t-60">

                <div class="col-md-10 mx-auto text-center text-white p-b-30">
                    <div class="m-b-20">
                        <div class="avatar avatar-xl my-auto">
                            <i class="icon-placeholder mdi mdi-ticket-account" style="font-size: 5rem"></i>
                            <i class="mdi mdi-plus position-absolute"  style="font-size: 3rem"></i>
                        </div>
                    </div>
                    <h1 id="page-offset">Nueva factura</h1>
                </div>

            </div>
        </div>
    </div>

    {# BOTONERA PRINCIPAL #}
    <div class="container pull-up pb-5 mb-3">

        <div class="row">

            <div class="col-12 m-b-30">
                <div class="card card-hover" style="cursor: pointer">
                    <div class="card-body">

                        <div class="row py-2 px-2">

                            <div class="col-6">

                                <h4 class="text-muted pb-4">
                                    ASIGNACIÓN
                                </h4>

                                <h3 >
                                    {% if is_granted('ROLE_CAJERO') %}
                                        {% set currentVendedor = factura.vendedor ? factura.vendedor.id: app.user.id %}
                                    <select name="factura[vendedor]" id="factura_vendedor" class="form-control js-select2 initial-tab" >
                                    {% for vendedor in vendedores %}
                                        <option value="{{ vendedor.id }}" {% if currentVendedor == vendedor.id %}selected{% endif %}>
                                            {{ vendedor.nombre }}
                                            {% if vendedor.role == 'ROLE_ADMIN' %}
                                                (admin)
                                            {% elseif vendedor.role == 'ROLE_CAJERO' %}
                                                (cajero)
                                            {% elseif vendedor.role == 'ROLE_VENDEDOR' %}
                                                (vendedor)
                                            {% endif %}
                                        </option>
                                    {% endfor %}
                                    </select>
                                    {% else %}
                                        {{ factura.vendedor.nombre }}
                                    {% endif %}
                                </h3>

                            </div>

                            <div class="col-6">

                                <p class="text-right">
                                    <a href="{{ path('facturacion_index') }}" class="btn btn-outline-dark">
                                        <i class="mdi mdi-restore mdi-18px m-r-5"></i> Volver
                                    </a>
                                </p>

                                <h4 class="text-right">
                                    <small class="text-muted">Proceso Nº: </small> {{ factura.codfacturaTmp }}
                                </h4>

                            </div>

                        </div>

                    </div>
                </div>
            </div>
        </div>

    </div>

    {# CONTENIDO PRINCIPAL #}
    <div class="container-fluid pull-up pb-5 mb-5">

        <div class="card mb-1" >
            <div class="card-body pt-4" id="cliente_container">
                <div class="row">

                    <div class="col-5">
                        <form name="factura_cliente" method="post" action="#" autocomplete="off">
                            <div class="form-row">

                                <div class="form-group form-inline col-12">
                                    <label class="col-4" for="factura_cliente_cuenta">Cliente Nº:</label>
                                    <input type="text" id="factura_cliente_cuenta" name="cliente[cuenta]"
                                           class="form-control col-5" value="{{ factura.deposito.id }}" readonly>
                                    <div class="col-3 text-right p-0" style="display: none;">
                                        <button type="button" class="btn btn-sm btn-primary p-1" onclick="alert('Nothing to do!')">
                                            <i class="mdi mdi-magnify"></i>
                                        </button>
                                        <button type="button" class="btn btn-sm btn-primary p-1" onclick="alert('Nothing to do!')">
                                            <i class="mdi mdi-contacts"></i>
                                        </button>
                                    </div>
                                </div>

                                <div class="form-group form-inline col-12">
                                    <label class="col-4" for="factura_cliente_nombre">Nombre:</label>
                                    <input type="text" id="factura_cliente_nombre" name="cliente[apenom]"
                                           class="form-control col-8 input-autocompletable"
                                           value="{{ factura.deposito.nombre }}"
                                           disabled="disabled"
                                           data-autocomplete-label="{{ factura.deposito.nombre }}"
                                           data-autocomplete-id="{{ factura.deposito.id }}"
                                           maxlength="200" data-entity="Cliente" data-search-field="apenom" data-min-text="2">
                                </div>

                                <div class="form-group form-inline col-12">
                                    <label class="col-4" for="factura_cliente"></label>
                                    <div class="col-8 text-muted pl-0 infocliente">
                                        CUIT/DNI > <span>{{ factura.deposito.cuit ? factura.deposito.cuit : factura.deposito.id }}</span>
                                        <input type="hidden" id="cuit" name="cuit" value="{{ factura.deposito.cuit ? factura.deposito.cuit : factura.deposito.id }}" />
                                    </div>
                                    <div id="set_auto" class="text-right col-12" style="display: none;">
                                        <label class="cstm-switch" for="cant_auto">
                                            <input type="checkbox" id="cant_auto" name="cant_auto" value="1" class="cstm-switch-input">
                                            <span class="cstm-switch-indicator bg-warning "></span>
                                            <span class="cstm-switch-description">Cant. Auto</span>
                                        </label>
                                    </div>
                                </div>

                            </div>
                        </form>
                    </div>

                    <div class="col-3">

{#                        <a href="{{ path('cliente_edit', { cuenta: factura.deposito.id } ) }}" class="btn btn-outline-primary text-center w-100">#}
{#                            MODIFICAR <br/>#}
{#                            CLIENTE#}
{#                        </a>#}

                        <h4 id="cond_iva" class="pt-2 text-center" style="display: none;">
                            <small class="text-secondary">CONDICION IVA</small> <br/>
                            <span class="text-danger">{{ factura.deposito.nombre }}</span>
                        </h4>

                    </div>

{#                    <div class="col-4 text-right">#}

{#                        <p>Saldo en Cuenta Corriente:#}
{#                            <span>#}
{#                            {% if factura.cliente.cuentaCorriente %}#}
{#                                ${{ factura.cliente.cuentaCorriente.monto | number_format(2)}}#}
{#                            {% else %}#}
{#                                0#}
{#                            {% endif %}#}
{#                            </span>#}
{#                        </p>#}

{#                        <p>#}
{#                            <a href="javascript:alert('Nothing to show!')" class="btn-link">#}
{#                                Ver Resumen de Cuenta#}
{#                            </a>#}
{#                        </p>#}

{#                        <h4 id="historico_de_compras"  class="pt-2 text-right" style="display: none;">#}
{#                            <small class="text-secondary" onClick="alert('#')">#}
{#                                Historico <a href="#" class="btn-link">Actividades</a>#}
{#                            </small>#}
{#                        </h4>#}

{#                        {% if not is_granted('ROLE_VENDEDOR') %}#}
{#                            <div class="form-group form-inline col-12">#}
{#                                <label class="col-4" for="factura_factura_fecha">Fecha:</label>#}
{#                                <input type="text" id="factura_factura_fecha" name="factura[fecha]"#}
{#                                       class="form-control col-8 datesingle text-right">#}
{#                            </div>#}
{#                        {% endif %}#}

{#                    </div>#}

                </div>
            </div>
        </div>

        <div class="card mb-1">
            <div class="card-body" id="articulo_container">

                <form id="factura_articulo" method="post" action="{{ path("facturacion_nueva_linea", { id: factura.id }) }}" autocomplete="off">
                    <input type="hidden" id="no_afecta_al_encolar" name="articulo[noAfectaAlEncolar]" value="0" />

                    <div class="form-row">

                        <div class="col-6">

                            <div class="row">

                                <div class="form-group form-inline col-9">
                                    <label class="col-4" for="factura_articulo_codigo">Código</label>
                                    <input type="text" id="factura_articulo_codigo" name="articulo[codigo]"
                                           class="form-control col-8 {% if not is_granted('ROLE_CAJERO') %}initial-tab{% endif %}">
                                </div>

                                <div class="col-3">
                                    <button type="button" class="btn btn-secondary" tabindex="-1"
                                            onclick="alert('Nothing to do!')">
                                        <i class="mdi mdi-magnify"></i>
                                    </button>
                                </div>

                                <div class="form-group form-inline col-12">

                                    <label class="col-3" for="factura_articulo_descripcion">Descripción</label>
                                    <div class="input-group col-9 p-0">
                                        <div class="input-group-prepend">
                                            <span class="input-group-text bg-success" id="prepend-0"></span>
                                        </div>
                                        <input type="text" id="factura_articulo_descripcion" name="articulo[descripcion]"
                                               class="form-control input-autocompletable"
                                               maxlength="200" data-entity="Articulo" data-search-field="descripcion" data-min-text="2"
                                               aria-describedby="prepend-0">
                                    </div>

                                </div>

                            </div>

                        </div>

                        <div class="col-3 pb-1">
                            <div class="avatar avatar-xl" id=foto_preview style="display: none; cursor: pointer">
                                <img src="" alt="..." class="avatar-img rounded">
                            </div>
                        </div>

                        <div class="col-3 text-left p-3 border-dark" id="stock-container" style="border-radius: 6px">

                            <p class="m-0 pb-1">
                                <span  class="text-secondary pr-2">Stock Actual:</span> <span id="stock_actual"></span>
                            </p>

                            <p class="m-0 pb-1">
                                <span class="text-secondary pr-2">Quedarían:</span> <span id="stock_quedarian"></span>
                            </p>

                            <p class="m-0 pb-1">
                                <span class="text-secondary pr-2">Otro Local:</span> <span id="#stock_otro_local"></span>
                                <span class="spinner-border text-primary mini-spinner mx-2" style="display: none;"></span>
                            </p>

                            <p class="m-0 pb-1">
                                <span class="text-secondary pr-2 text-danger" style="display: none;"
                                      id="pr_ot_listas"></span>
                            </p>
                        </div>

                        <div class="form-group form-inline col-3 pt-3">
                            <label class="col-3 text-secondary p-0" for="factura_articulo_precio">
                                <span class="w-100 text-right">Precio</span>
                            </label>
                            <div class="input-group col-9">
                                <div class="input-group-prepend">
                                    <span class="input-group-text" id="prepend-1">$</span>
                                </div>
                                <input type="hidden" id="factura_articulo_precio_real" name="articulo[precioReal]">
                                <input type="text" class="form-control" id="factura_articulo_precio"  name="articulo[precio]"
                                       aria-describedby="prepend-1">
                            </div>
                        </div>

                        <div class="form-group form-inline col-2 pt-3">
                            <label class="col-6 text-secondary" for="factura_articulo_descuento_linea">
                                <span class="w-100 text-right">Des/Aum (%) </span>
                            </label>
                            <input type="text" id="factura_articulo_descuento_linea" name="articulo[descuento_linea]"
                                   class="form-control col-6">
                        </div>

                        <div class="form-group form-inline col-2 pt-3">
                            <label class="col-6 text-secondary" for="factura_articulo_descuento_monto_linea">
                                <span class="w-100 text-right">Des/Aum ($) </span>
                            </label>
                            <input type="text" id="factura_articulo_descuento_monto_linea" name="articulo[descuento_monto_linea]"
                                   class="form-control col-6">
                        </div>

                        <div class="form-group form-inline col-2 pt-3">
                            <label class="col-7 text-secondary" for="factura_articulo_cantidad">
                                <span class="w-100 text-right">Cantidad</span>
                            </label>
                            <input type="number" id="factura_articulo_cantidad" name="articulo[cantidad]"
                                   class="form-control col-5">
                        </div>

                        <div class="form-group form-inline col-3 pt-3">
                            <label class="col-4 text-secondary p-0" for="factura_articulo_importe">
                                <span class="w-100 text-right">Importe</span>
                            </label>
                            <div class="input-group col-8">
                                <div class="input-group-prepend">
                                    <span class="input-group-text" id="prepend-2">$</span>
                                </div>
                                <input type="text" class="form-control" id="factura_articulo_importe"  name="articulo[importe]"
                                       aria-describedby="prepend-2">
                                <input type="hidden" name="factura[ivaVenta]" id="factura_articulo_iva_venta" />
                            </div>
                        </div>

                        <div class="col-12 text-right">
                            <button type="button" class="btn btn-outline-success" id="agregar-producto">Agregar</button>
                        </div>

                    </div>
                </form>
            </div>
        </div>

        <div class="card mb-1">
            <div class="card-body" style="height: 33vh; overflow-y: auto" data-ui="factulinea-container">
                {% include 'facturacion/templates/table_factulinea.html.twig'
                with { factulineas: factura.factuLinea, lineaActual: 0 } %}
            </div>
        </div>

        <form action="{{ path('facturacion_guardar', { id: factura.id }) }}" id="form_factura" method="POST">
        <div class="card" style="cursor: pointer">
            <div class="card-body">
                <div class="row pb-5">

                    <input type="hidden" name="cc[cuotas]" id="cc_cuotas_transf">

                    <div class="col-4">
                        <button type="button"  class="btn btn-sm btn-success" id="guardar_factura">
                            <i class="mdi mdi-check mr-2"></i> Confirmar Pedido
                        </button>
{#                        <a href="{{ path('facturacion_index') }}" class="btn btn-sm btn-danger ml-2">#}
{#                            <i class="mdi mdi-close-circle"></i> cancelar#}
{#                        </a>#}
{#                        <a href="{{ path('facturacion_index') }}" class="btn btn-sm btn-success">#}
{#                            <i class="mdi mdi-check mr-2"></i> Finalizar Pedido#}
{#                        </a>#}
                        <button  type="button"  class="btn btn-sm btn-dark ml-2" onclick="alert('Nothing to do!')" style="display: none">
                            <i class="mdi mdi-printer"></i> imprimir
                        </button>
                    </div>

                    <div class="col-8">

                        <div class="form-row">

                            <div class="form-group form-inline col-12" style="display: none;">

                                <label class="col-6" for="factura_base_imponible">
                                    <span class="w-100 text-right">Sub-total: </span>
                                </label>

                                <div class="input-group col-6">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text">$</span>
                                    </div>
                                    <input type="text" class="form-control text-right" id="factura_base_imponible"
                                           name="factura[baseImponible]" readonly="readonly">
                                </div>

                            </div>

                            <div class="form-group form-inline col-12" style="display: none;">

                                <label class="col-6" for="factura_base_impuesto">
                                    <span class="w-100 text-right">IVA:</span>
                                </label>

                                <div class="input-group col-6">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text">$</span>
                                    </div>
                                    <input type="text" class="form-control text-right" id="factura_base_impuesto"
                                           name="factura[baseImpuesto]" readonly="readonly">
                                    <input name="factura[iva]" id="factura_iva" type="hidden"/>
                                </div>

                            </div>

                            <div class="form-group form-inline col-12">

                                <label class="col-6" for="factura_precio_total">
                                    <span class="w-100 text-right">Subtotal:</span>
                                </label>

                                <div class="input-group col-6">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text">$</span>
                                    </div>
                                    <input type="text" class="form-control text-right" id="factura_precio_total"
                                           value="{{ factura.subtotal ? factura.subtotal | number_format(2) : ''  }}"
                                           name="factura[precioTotal]" size="10" readonly="readonly">
                                </div>
                            </div>

                        </div>

                    </div>

                    <div class="col-6 col-md-5 pt-3">

                        <div class="form-row">

                            <label class="cstm-switch col-4">
                                <input type="checkbox" id="imprime" name="imprime" value="1"
                                       class="cstm-switch-input">
                                <span class="cstm-switch-indicator"></span>
                                <label class="ml-2 text-danger pt-2" for="id_talonario">(F)</label>
                            </label>

                            <div class="col-8">
                                <select class="form-control js-select2" disabled="disabled"
                                        name="id_talonario" id="id_talonario"></select>
                            </div>

                            <label class="cstm-switch col-4">
                                <input type="checkbox" id="nota_credito" name="nota_credito" class="cstm-switch-input">
                                <span class="cstm-switch-indicator"></span>
                                <label class="ml-2 pt-2 text-uppercase">Nota de Crédito</label>
                            </label>

{#                            <div class="col-8 my-2" style="display: none">#}
{#                                <select class="form-control js-select2" disabled="disabled"#}
{#                                        name="facturaRelacionada" id="id_fact_rel">#}
{#                                    <option value="">Seleccione Factura</option>#}
{#                                    {% for f in facturasRelacionadas %}#}
{#                                        <option value="{{ f.codfactura }}">{{ f.fechaOperacion | date('d-m-Y')}}: {{ f.codfactura }}</option>#}
{#                                    {% endfor %}#}
{#                                </select>#}
{#                            </div>#}

                        </div>

                        <hr/>

{#                        <div class="">#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="cheque" onchange="$('#mdlCheque').modal('show');"#}
{#                                           class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">Cheque</span>#}
{#                                </label>#}
{#                            </div>#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="financiera" onchange="$('#mdlFinanciera').modal('show');"#}
{#                                           class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">Financiera</span>#}
{#                                </label>#}
{#                            </div>#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" checked value="efectivo"#}
{#                                           class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">Efectivo</span>#}
{#                                </label>#}
{#                            </div>#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="tarjeta"#}
{#                                           onchange="$('#mdlTarjeta').modal('show');" class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">Tarjeta</span>#}
{#                                </label>#}
{#                            </div>#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="cuenta_corriente"#}
{#                                           onchange="$('#mdlCuentaCorriente').modal('show');"#}
{#                                           data-cuota-vencida="1"#}
{#                                           class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">Cuenta corriente</span>#}
{#                                </label>#}
{#                            </div>#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="pago_dividido"#}
{#                                           onchange="$('#mdlPagoDividido').modal('show');" class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">Pago dividido</span>#}
{#                                </label>#}
{#                            </div>#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="pago_mutual"#}
{#                                           onchange="$('#mdlMutual').modal('show');" class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">MUTUAL</span>#}
{#                                </label>#}
{#                            </div>#}

{#                             <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="transferencia"#}
{#                                           onchange="$('#mdlTransferencia').modal('show');" class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">TRANSFERENCIA</span>#}
{#                                </label>#}
{#                            </div>#}

{#                            <div class=" m-b-10">#}
{#                                <label class="cstm-switch">#}
{#                                    <input type="radio" name="tipo_cuenta" value="qr"#}
{#                                           onchange="$('#mdlQR').modal('show');" class="cstm-switch-input">#}
{#                                    <span class="cstm-switch-indicator"></span>#}
{#                                    <span class="cstm-switch-description text-uppercase">QR</span>#}
{#                                </label>#}
{#                            </div>#}

{#                        </div>#}

                    </div>

                    {% include 'facturacion/templates/formTotales.html.twig' %}

                    <div style="display:none;" class="col-6 col-md-5 offset-md-2 p-2">

                        <div class="form-row border border-secondary p-2">

                            {# <div class="form-group form-inline col-12">

                                <label class="col-6" for="factura_descuento">
                                    <span class="w-100 text-right">Aplica Descuento:</span>
                                </label>

                                <div class="input-group col-6">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="prepend-3">%</span>
                                    </div>
                                    <input type="number" class="form-control text-right" id="factura_descuento"
                                           value="{{ factura.porcentajeDesc ? factura.porcentajeDesc : descuentoEfectivo }}"
                                           name="factura[descuento]">
                                </div>

                            </div> #}

                            {#<div class="form-group form-inline col-12">#}
                                {#<label class="col-6" for="factura_aumento_costo">#}
                                    {#<span class="w-100 text-right">Aumento Sobre el Costo:</span>#}
                                {#</label>#}
                                {#<div class="input-group col-6">#}
                                    {#<div class="input-group-prepend">#}
                                        {#<span class="input-group-text" id="prepend-3">%</span>#}
                                    {#</div>#}
                                    {#<input type="number" class="form-control text-right" id="factura_aumento_costo"#}
                                           {#name="factura[aumentoCosto]">#}
                                    {#<input name="total_costo" id="total_costo" type="hidden" value=""/>#}
                                {#</div>#}
                            {#</div>#}

                            <div class="form-group form-inline col-12">
                                <label class="col-6" for="factura_aumento_total">
                                    <span class="w-100 text-right">Aumento Sobre el Total:</span>
                                </label>
                                <div class="input-group col-6">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="prepend-3">%</span>
                                    </div>
                                    <input type="number" class="form-control text-right" id="factura_aumento_total"
                                           value="{{ factura.porcentajeAum ? factura.porcentajeAum : '' }}"
                                           name="factura[aumentoTotal]">
                                    <input name="factura[sobreTotal]" type="hidden" value=""/>
                                </div>
                            </div>

                            <div class="form-group form-inline col-12">
                                <label class="col-6" for="factura_aumento_total">
                                    <span class="w-100 text-right">Aumento por forma de pago</span>
                                </label>
                                <div class="input-group col-6">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="prepend-3">$</span>
                                    </div>
                                    <input type="number" class="form-control text-right"
                                           name="factura[aumentoFormaPago]">
                                </div>
                            </div>

                            <div class="form-group form-inline col-12">
                                <label class="col-4" for="factura_total">
                                    <span class="w-100 text-right">Total:</span>
                                </label>
                                <div class="input-group col-8">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="prepend-3">$</span>
                                    </div>
                                    <input type="text" class="form-control text-right" id="factura_total"
                                           value="{{ factura.TotalFactura ? factura.TotalFactura : '' }}"
                                           size="10" aria-describedby="prepend-3">
                                </div>
                            </div>

                        </div>
{# 
                        <div class="text-center pt-3">
                            <button type="button" class="btn btn-lg btn-info text-uppercase" onclick="$('#mdlAccesoOtrasOperaciones').modal('show');">
                                Otras operaciones
                            </button>
                        </div> #}
                    </div>

                </div>
            </div>
        </div>

        {# MODAL - CUENTA CORRIENTE #}
        <div class="modal fade" id="mdlCuentaCorriente" tabindex="-1" role="dialog" aria-hidden="true"
             data-keyboard="false" data-backdrop="static">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">

                    <div class="modal-header d-block">
                        <h5 class="modal-title">DATOS CUENTA CORRIENTE</h5>
                        <small class="text-primary"> {{ factura.cliente ? factura.cliente.apenom : '' }}</small>
                    </div>

{#                    <div class="modal-body">#}

{#                        {% include 'facturacion/templates/cuenta_corriente.html.twig' with { form_prefix: 'cc', cliente: factura.cliente } %}#}

{#                    </div>#}

                    <div class="modal-footer">
                        <button type="button" id="cancelar_pago_cuenta_corriente" data-dismiss="modal" class="btn btn-outline-secondary">DENEGAR</button>
                        <button type="button" id="aceptar_pago_cuenta_corriente" class="btn btn-primary">GRABAR</button>
                    </div>

                </div>
            </div>
        </div>

        </form>
    </div>

    {# MODALES - ACCESO OTRAS OPERACIONES #}
    <div class="modal fade" id="mdlAccesoOtrasOperaciones" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">

                <div class="modal-header">
                    <h5 class="modal-title">NECESITA PERMISO</h5>
                </div>

                <div class="modal-body">

                    <div class="pt-1 form-inline col-12">
                        <label class="col-5" for="password_operaciones">CLAVE: </label>
                        <input type="password" id="password_operaciones" name="password_operaciones"
                               class="form-control col-7" autocomplete="off">
                    </div>

                </div>

                <div class="modal-footer">
                    <button type="button" id="cancelar_acceso_otras_operaciones" data-dismiss="modal" class="btn btn-outline-secondary">CANCELAR</button>
                    <button type="button" id="aceptar_acceso_otras_operaciones" class="btn btn-primary">AUTORIZAR</button>
                </div>

            </div>
        </div>
    </div>

    {# MODALES - OTRAS OPERACIONES #}
    <form action="#" id="form_factura_extra">
    <div class="modal fade" id="mdlOtrasOperaciones" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">

                <div class="modal-header">
                    <h5 class="modal-title">PERMISO CONCEDIDO: OTRAS OPERACIONES</h5>
                </div>

                <div class="modal-body pl-3">

                    <input type="hidden" name="factura[token]" id="otrasOperaciones_token"/>
                    <div class=" m-b-10">
                        <label class="cstm-switch">
                            <input type="checkbox" name="factura[no_afecta_stock]" value="1"
                                   class="cstm-switch-input">
                            <span class="cstm-switch-indicator"></span>
                            <span class="cstm-switch-description text-uppercase">NO Afecta Stock</span>
                        </label>
                    </div>

                    <div class=" m-b-10">
                        <label class="cstm-switch">
                            <input type="checkbox" name="factura[no_afecta_caja]" value="1"
                                   class="cstm-switch-input">
                            <span class="cstm-switch-indicator"></span>
                            <span class="cstm-switch-description text-uppercase">NO afecta caja</span>
                        </label>
                    </div>

                    <div class=" m-b-10">
                        <label class="cstm-switch">
                            <input type="checkbox" name="factura[pago_anticipado]" value="1"
                                   class="cstm-switch-input">
                            <span class="cstm-switch-indicator"></span>
                            <span class="cstm-switch-description text-uppercase">Pago Anticipado <small>NO afecta caja, SI afecta stock</small></span>
                        </label>
                    </div>

                    <div class=" m-b-10">
                        <label class="cstm-switch">
                            <input type="checkbox" name="factura[nota_credito]" value="1"
                                   class="cstm-switch-input">
                            <span class="cstm-switch-indicator"></span>
                            <span class="cstm-switch-description text-uppercase">Es nota de credito</span>
                        </label>
                    </div>

                    <div class=" m-b-10">
                        <label class="cstm-switch">
                            <input type="checkbox" name="factura[especial]" value="1" data-ui="operacion-especial"
                                   class="cstm-switch-input">
                            <span class="cstm-switch-indicator"></span>
                            <span class="cstm-switch-description text-uppercase">Es operación especial</span>
                        </label>
                    </div>


                </div>

                <div class="modal-footer">
                    <button type="button" data-dismiss="modal" class="btn btn-outline-secondary">ACEPTAR</button>
                </div>

            </div>
        </div>
    </div>
    </form>

    {# MODALES - CHEQUE #}
    <div class="modal fade" id="mdlCheque" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">

                <div class="modal-header">
                    <h5 class="modal-title">DATOS CHEQUE</h5>
                </div>

{#                <div class="modal-body">#}

{#                    <form action="{{ path('facturacion_temporal_agregar_cheque', { id: factura.id }) }}" id="form_mdlCheque">#}
{#                    {% include 'facturacion/templates/cheque.html.twig' with { id: 'mdlCheque', form_prefix: 'cheque',#}
{#                        cliente: factura.cliente.apenom } %}#}
{#                    </form>#}

{#                </div>#}

                <div class="modal-footer">
                    <button type="button" id="cancelar_pago_cheque" data-dismiss="modal" class="btn btn-outline-secondary">CANCELAR</button>
                    <button type="button" id="aceptar_pago_cheque" class="btn btn-primary">GRABAR</button>
                </div>

            </div>
        </div>
    </div>

    {# MODALES - FINANCIERA #}
    <div class="modal fade" id="mdlFinanciera" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">

                <div class="modal-header">
                    <h5 class="modal-title">DATOS FINANCIERA</h5>
                </div>

                <div class="col-12">
                    <h6 class="text-right">
                        <span class="text-secondary">TOTAL COMPROBANTE: $</span> <span class="total_alcanzado"></span> |
                    </h6>
                    <h6 class=" text-right">
                        <span class="text-secondary">TOTAL AUMENTO: $</span><span id="aumentoFinanciera2">0</span>
                    </h6>
                    <h6 class=" text-right">
                        <span class="text-secondary">TOTAL EN EFECTIVO: $</span><span id="efectivoFinanciera">0</span>
                    </h6>
                </div>

                <div class="modal-body">

                    <form action="{{ path('facturacion_temporal_agregar_financiera', { id: factura.id }) }}" id="form_mdlFinanciera">
                        {% include 'facturacion/templates/financiera.html.twig' with { id: 'mdlFinanciera', form_prefix: 'financiera',
                            tipos: tiposfinancieras } %}
                    </form>


                </div>

                <div class="modal-footer">
                    <button type="button" id="cancelar_pago_financiera" data-dismiss="modal" class="btn btn-outline-secondary">CANCELAR</button>
                    <button type="button" id="aceptar_pago_financiera" class="btn btn-primary">GRABAR</button>
                </div>

            </div>
        </div>
    </div>

    {# MODALES - MUTUAL #}
    <div class="modal fade" id="mdlMutual" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">

                <div class="modal-header">
                    <h5 class="modal-title">DATOS MUTUALES</h5>
                </div>

                <div class="col-12">
                    <h6 class="text-right">
                        <span class="text-secondary">TOTAL COMPROBANTE: $</span> <span class="total_alcanzado"></span>
                    </h6>

                        <h6 class="autocalculado text-right">
                            <span class="text-secondary">TOTAL AUMENTO: $</span> <span class="total_aumentado"></span>
                        </h6>
                    <h6 class="final text-right">
                        <span class="text-secondary">TOTAL FINAL: $</span> <span class="total_mutual_final"></span>
                    </h6>
                </div>

                <div class="modal-body">

                    <form action="{{ path('facturacion_temporal_agregar_mutual', { id: factura.id }) }}" id="form_mdlMutual">
                        {% include 'facturacion/templates/mutual.html.twig' with { id: 'mdlMutual', form_prefix: 'mutual',
                            tipos: tiposmutuales } %}
                    </form>


                </div>

                <div class="modal-footer">
                    <button type="button" id="cancelar_pago_mutual" data-dismiss="modal" class="btn btn-outline-secondary">CANCELAR</button>
                    <button type="button" id="aceptar_pago_mutual" class="btn btn-primary">GRABAR</button>
                </div>

            </div>
        </div>
    </div>

    {# MODAL - QR #}
    <div class="modal fade" id="mdlQR" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static" >
        <div class="modal-dialog modal-dialog-centered" role="document" style="max-width: 66vw">
            <div class="modal-content">

                <div class="modal-header">
                    <h5 class="modal-title">DATOS QR</h5>
                </div>

                <div class="col-12">
                    <h6 class="text-right">
                        <span class="text-secondary">TOTAL COMPROBANTE: $</span> <span class="total_alcanzado"></span>
                    </h6>
                    <h6 class="autocalculado text-right">
                        <span class="text-secondary">PAGADO: $</span> <span class="total_autocalculado"></span>
                    </h6>
                    <h6 class="autocalculado text-right">
                        <span>RESTA PAGAR: $</span> <span class="text-danger resta_pagar"></span>
                    </h6>
                </div>

                <div class="modal-body">

                    <form action="{{ path('facturacion_temporal_agregar_qr', { id: factura.id }) }}" id="form_mdlQR">
                        {% include 'facturacion/templates/box_qr.html.twig' with { id: 'mdlQR', form_prefix: 'qr',
                            tipos: tiposQR } %}
                    </form>

                </div>

                <div class="col-md-12 p-4">
                    <span class="text-secondary ">DESCUENTO POR FORMA DE PAGO :$<span class="descuentoQR">0</span ></span><br>
                </div>

                <div class="modal-footer">
                    <button type="button" id="cancelar_pago_qr" data-dismiss="modal" class="btn btn-outline-secondary">CANCELAR</button>
                    <button type="button" id="aceptar_pago_qr" class="btn btn-primary">GRABAR</button>
                </div>

            </div>
        </div>
    </div>

    {# MODALES - TARJETA #}
    <div class="modal fade" id="mdlTarjeta" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog modal-dialog-centered" role="document" style="max-width: 66vw">
            <div class="modal-content px-3">

                <div class="modal-header">
                    <h5 class="modal-title">DATOS TARJETA</h5>
                </div>

                <div class="modal-body">

                    <div class="col-12">
                        <h6 class="text-right">
                            <span class="text-secondary">TOTAL COMPROBANTE: $</span> <span class="total_alcanzado"></span>
                        </h6>
                        <h6 class="autocalculado text-right">
                            <span class="text-secondary">RECARGO POR METODO DE PAGO: $</span> <span class="total_aumentado"></span> |
                            <span class="text-secondary">PAGADO: $</span> <span class="total_autocalculado"></span>
                        </h6>
                        <h6 class="autocalculado text-right">
                            <span class="text-secondary">RESTA PAGAR: $</span> <span class="resta_pagar"></span>
                        </h6>
                    </div>

                    <form action="{{ path('facturacion_temporal_tarjeta_agregar', { id: factura.id }) }}" id="form_mdlTarjeta">
                    {% include 'facturacion/templates/box_tarjeta.html.twig' with { id: 'mdlTarjeta', form_prefix: 'tarjeta',
                        tipos: tiposTarjeta } %}
                    </form>
                </div>
                <div class="col-md-12 p-4">
                    <span class="text-secondary ">AUMENTO POR FORMA DE PAGO :$<span class="aumentoTarjetas">0</span ></span><br>
                    <span class="text-secondary ">DESCUENTO :$<span class="descuentoDebito">0</span></span><br>
                </div>

                <div class="modal-footer">
                    <button type="button" id="cancelar_pago_tarjeta"  data-dismiss="modal"  class="btn btn-outline-secondary">CANCELAR</button>
                    <button type="button" id="aceptar_pago_tarjeta" class="btn btn-primary">ACEPTAR</button>
                </div>

            </div>
        </div>
    </div>

    {# MODALES - PAGO DIVIDIDO #}
{#    <div class="modal fade" id="mdlPagoDividido" tabindex="-1" role="dialog" aria-hidden="true"#}
{#         data-keyboard="false" data-backdrop="static">#}
{#        <div class="modal-dialog modal-dialog-centered" role="document" style="max-width: 66vw">#}
{#            <div class="modal-content px-3">#}

{#                <div class="modal-body">#}

{#                    <form action="{{ path('facturacion_temporal_pago_dividido_agregar', { id: factura.id }) }}" id="form_mdlPagoDividido">#}

{#                    <div class="row">#}

{#                        <div class="col-12 col-lg-6 offset-lg-6 bg-gray-300 py-2 mb-3 border rounded shadow-sm"#}
{#                             style="position: sticky;top: 2rem;z-index: 1;">#}
{#                                <h6 class="text-right"><span>TOTAL FACTURA: $</span> <b class="total_alcanzado"></b> |#}
{#                                    <div class="d-none descuento_efectivo">#}
{#                                        <span class="text-secondary">Descuento: $</span> <b class="descuento_total"></b> |#}
{#                                    </div>#}
{#                                    <span>RESTA PAGAR:</span> <b class="resta_pagar text-danger"></b>#}
{#                                </h6>#}
{#                                <h6 class="autocalculado text-right">#}
{#                                    <span>TOTAL AUMENTO: $</span> <b class="total_aumentado">0</b> |#}
{#                                    <span>AUTOCALCULADO: $</span> <b class="total_autocalculado"></b>#}
{#                                </h6>#}
{#                        </div>#}

{#                        #}{# <div class="col-6">#}

{#                            <h5 class="bg-dark text-light p-2">CHEQUE</h5>#}

{#                            {% include 'facturacion/templates/cheque.html.twig' with { id: 'mdlCheque', form_prefix: 'pagoDivido[cheque]',#}
{#                                cliente: factura.cliente.apenom, mostrarImporte: true } %}#}

{#                        </div> #}

{#                        <div class="col-6 mb-3">#}
{#                            <h5 class="bg-dark text-light p-2">FINANCIERA</h5>#}
{#                            {% include 'facturacion/templates/financieraDividido.html.twig' with { id: 'mdlFinanciera', form_prefix: 'financiera', tipos: tiposfinancieras } %}#}
{#                        </div>#}

{#                        <div class="col-6 mb-3">#}
{#                            <h5 class="bg-dark text-light p-2">MUTUAL</h5>#}
{#                            {% include 'facturacion/templates/mutualDividido.html.twig' with { id: 'mdlMutual', form_prefix: 'mutual', tipos: tiposmutuales } %}#}
{#                        </div>#}
{#                        <div class="col-6">#}

{#                            <h5 class="bg-dark text-light p-2 col-12">EFECTIVO</h5>#}

{#                            <div class="pt-1 form-inline col-12 px-0 mb-5">#}
{#                                <label class="col-4 justify-content-end" for="pago_dividido_importe"><span class="text-danger p-r-5">*</span>Importe: $</label>#}
{#                                <input type="text" id="pago_dividido_importe" name="pagoDivido[efectivo]" autocomplete="off"#}
{#                                       class="form-control col-8 importe" onclick="$(this).select()">#}
{#                            </div>#}
{#                            <span class="text-secondary ">DESCUENTO POR EFECTIVO :$<span id="descuento_efectivo_bloque">0</span></span><br>#}
{#                            <span class="text-secondary ">DEBERIA COBRAR:$<span id="deberia_cobrar_efectivo_bloque">0</span></span>#}
{#                        </div>#}
{#                        <div class="col-6">#}
{#                            <h5 class="bg-dark text-light p-2 mt-2 col-12">CUENTA CORRIENTE</h5>#}

{#                            {% include 'facturacion/templates/cuenta_corriente.html.twig' with {#}
{#                                form_prefix: 'pagoDivido[cc]', showImporte: true, cliente: factura.cliente } %}#}
{#                        </div>#}

{#                        <div class="col-12 pt-3">#}
{#                            <h5 class="bg-dark text-light p-2">DATOS TARJETA</h5>#}
{#                            {% include 'facturacion/templates/box_tarjeta.html.twig' with { id: 'mdlPagoDividido', form_prefix: 'pagoDivido[tarjeta]',#}
{#                                tipos: tiposTarjeta, action: '#' } %}#}
{#                                <div class="col-md-12 p-4">#}
{#                                <span class="text-secondary ">AUMENTO POR FORMA DE PAGO :$<span class="aumentoTarjetas">0</span ></span><br>#}
{#                                <span class="text-secondary ">DESCUENTO POR DEBITO :$<span class="descuentoDebito">0</span></span>#}
{#                            </div>#}
{#                        </div>#}

{#                        <div class="col-12 pt-3">#}
{#                            <h5 class="bg-dark text-light p-2">DATOS PAGO QR</h5>#}
{#                            {% include 'facturacion/templates/box_qr.html.twig' with { id: 'mdlPagoDividido', form_prefix: 'pagoDivido[qr]',#}
{#                                tipos: tiposTarjeta, action: '#' } %}#}
{#                            <div class="col-md-12 p-4">#}
{#                                <span class="text-secondary ">DESCUENTO POR FORMA DE PAGO :$<span class="descuentoQR">0</span ></span><br>#}
{#                            </div>#}
{#                        </div>#}

{#                    </div>#}

{#                    </form>#}
{#                </div>#}

{#                <div class="modal-footer">#}
{#                    <button type="button" id="cancelar_pago_dividido" data-dismiss="modal" class="btn btn-outline-secondary">CANCELAR</button>#}
{#                    <button type="button" id="aceptar_pago_dividido" class="btn btn-primary">ACEPTAR</button>#}
{#                </div>#}

{#            </div>#}
{#        </div>#}
{#    </div>#}

    {# MODALES - TRANSFERENCIA #}
{#    <div class="modal fade" id="mdlTransferencia" tabindex="-1" role="dialog" aria-hidden="true"#}
{#         data-keyboard="false" data-backdrop="static">#}
{#        <div class="modal-dialog modal-dialog-centered" role="document">#}
{#            <div class="modal-content">#}

{#                <div class="modal-header">#}
{#                    <h5 class="modal-title">DATOS TRANSFERENCIA BANCARIA</h5>#}
{#                </div>#}

{#                <div class="col-12">#}
{#                    <h6 class="text-right">#}
{#                        <span class="text-secondary">TOTAL COMPROBANTE: $</span> <span class="total_alcanzado"></span>#}
{#                    </h6>#}

{#                        <h6 class="autocalculado text-right">#}
{#                            <span class="text-secondary">TOTAL AUMENTO: $</span> <span class="total_aumentado"></span>#}
{#                        </h6>#}
{#                </div>#}

{#                <div class="modal-body">#}

{#                    <form action="{{ path('facturacion_temporal_agregar_transferencia', { id: factura.id }) }}" id="form_mdlTransferencia">#}
{#                        {% include 'facturacion/templates/transferencia.html.twig' with { id: 'mdlTransferencia', form_prefix: 'transferencia',#}
{#                            cliente: factura.cliente.apenom } %}#}
{#                    </form>#}


{#                </div>#}

{#                <div class="modal-footer">#}
{#                    <button type="button" id="cancelar_pago_transferencia" data-dismiss="modal" class="btn btn-outline-secondary">CANCELAR</button>#}
{#                    <button type="button" id="aceptar_pago_transferencia" class="btn btn-primary">GRABAR</button>#}
{#                </div>#}

{#            </div>#}
{#        </div>#}
{#    </div>#}

    {# MODALES - PRODUCT PAGE #}
    <div class="modal fade" id="mdlProductPage" tabindex="-1" role="dialog" aria-hidden="true"
         data-keyboard="false" data-backdrop="static">
        <div class="modal-dialog modal-dialog-centered" role="document" style="min-width: 85vw; min-height: 50vh;">
            <div class="modal-content">

                <div class="modal-header">
                    <h5 class="modal-title mx-auto"><strong class="text-primary" data-ui="art-name"></strong></h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-body">

                    <div class="row">

                        <div class="col-12 col-md-6">
                            <table class="table table-striped">
                                <tr><td class="py-1">GENERO</td><td class="py-1"><strong data-ui="art-genero"></strong></td></tr>
                                <tr><td class="py-1">COLOR</td><td class="py-1"><strong data-ui="art-color"></strong></td></tr>
                                <tr><td class="py-1">CATEGORÍA</td><td class="py-1"><strong data-ui="art-categoria"></strong></td></tr>
                                <tr><td class="py-1">DISCIPLINA</td><td class="py-1"><strong data-ui="art-disciplina"></strong></td></tr>
                                <tr><td class="py-1">MARCA</td><td class="py-1"><strong data-ui="art-marca"></strong></td></tr>
                                <tr><td class="py-1" colspan="2">OBSERVACIONES</td></tr>
                                <tr><td class="py-1 pl-5" colspan="2" data-ui="art-observacion"></td>
                                </tr>
                            </table>
                        </div>

                        <div class="col-12 col-md-6 d-flex">
                            <div id="carouselExampleControls" class="carousel slide my-auto w-100 bg-gray-400 p-3 rounded" data-ride="carousel">
                                <div class="carousel-inner"></div>
                                <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
                                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                    <span class="sr-only">Previous</span>
                                </a>
                                <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
                                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                    <span class="sr-only">Next</span>
                                </a>
                            </div>
                        </div>

                    </div>

                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block javascripts %}
    <script>
        // CONTAINER DE URLS A USAR EN JAVASCRIPT DESDE PATH IN SYMFONY
        const urlContainer = {
          buscarArticulo: '{{ path("articulo_filtrar") }}',
          {#obtenerCliente: '{{ path("obtener_cliente_json", { cuenta: factura.cliente.cuenta}) }}',#}
          borrarCheque: '{{ path("facturacion_temporal_cheque_borrar", { id: factura.id }) }}',
          borrarFinanciera: '{{ path("facturacion_temporal_financiera_borrar", { id: factura.id }) }}',
          borrarMutual: '{{ path("facturacion_temporal_mutual_borrar", { id: factura.id }) }}',
          borrarQR: '{{ path("facturacion_temporal_qr_borrar", { id: factura.id }) }}',
          borrarTarjeta: '{{ path("facturacion_temporal_tarjeta_borrar", { id: factura.id }) }}',
          borrarTransferencia: '{{ path("facturacion_temporal_transferencia_borrar", { id: factura.id }) }}',
          autorizarOperaciones: '{{ path("usuario_autorizacion" ) }}',
          borrarLinea: '{{ path('facturacion_borrar_linea', { id: '_id_' } ) }}',
          ver: '{{ path('facturacion_ver', { id: '_id_' }) }}?imprimir=1',
          actualizar: '{{ path('facturacion_temporal_actualizar', { id: factura.id } ) }}',
          obtener_forma_pago: '{{ path('obtener_forma_pago', { id: factura.id } ) }}',
          buscarplan: '{{ path("list_plan_finan")}}',
          buscarplanmutuales: '{{ path("list_plan_mutual")}}',
          buscarcoeficientes: '{{ path("list_coeficientes_financieras")}}',
          planesTarjeta: '{{ path("planes_por_marcas_tarjetas") }}',
          planpagoid:   '{{ path("list_plan_mutual_pagos") }}',
          getImages: "{{ path ('getImages')}}",
        };

        const tipoTalonario = [];
        {% for talonario in talonarios %}
        tipoTalonario.push({
          id: '{{ talonario.idTalonario }}', text: '{{ talonario.tipoComprobante.tipoComp }}',
          factura: '{{ 'FACTURA' in talonario.tipoComprobante.tipoComp }}' == 1,
          visible: false, tipo: '{{ talonario.tipoComprobante.tipo }}' });
        {% endfor %}

      //  console.log(tipoTalonario);

        // TODO: CONSIDERE REUBICAR
        function enter2tab(e) {

          if (e.keyCode == 13) {

            const el$ = $(this);
            const selector = el$.attr('tabindex');

            const cb = parseInt(el$.attr('tabindex'));

            if ($('#' + selector + ' :input[tabindex=\'' + (cb + 1) + '\']') != null) {
                $('#' + selector + ' :input[tabindex=\'' + (cb + 1) + '\']').focus();
                $('#' + selector + ' :input[tabindex=\'' + (cb + 1) + '\']').select();
              e.preventDefault();
              return false;
            }
          }
        }

        $(document).ready(function () {
          let tb = $('#form_row_mdlTarjeta input');
          tb.data('enter2tab-selector', '#form_row_mdlTarjeta');
          if ($.browser && $.browser.mozilla) $(tb).keypress(enter2tab); else  $(tb).keydown(enter2tab);
          tb = $('#form_row_mdlCheque input');
          tb.data('enter2tab-selector', '#form_row_mdlCheque');
          if ($.browser && $.browser.mozilla) $(tb).keypress(enter2tab); else  $(tb).keydown(enter2tab);
        });

    </script>
    {{ encore_entry_script_tags('facturacion_nuevo') }}
    {{ encore_entry_script_tags('facturacion_calcularTotales') }}
    {{ encore_entry_script_tags('facturacion_pagoDivididoFinanciera') }}
    {{ encore_entry_script_tags('facturacion_financiera') }}
    {{ encore_entry_script_tags('facturacion_pagoDivididoMutual') }}
{% endblock %}