{% extends "base.html" %}
{% load static %}
{% load widget_tweaks %}

{% block inicio %}
<div class="form-group form-group-md col-md-7">
    <h4>MATRICULACIÓN CURSOS 2024/2025</h4>
</div>
<div class="form-group form-group-md col-md-2">
    <button id="btn_web" type="button" class="btn_web btn btn-danger" data-toggle="modal" data-target="#ModalWeb">
        INICIO
    </button>
</div>
{% endblock inicio %}


{% block contenido %}

<!-- ##################################################################################################### -->
<!-- ################################  PAGO  MATRÍCULA  ################################################## -->
<!-- ##################################################################################################### -->

<div id="pago">
    <fieldset>
        <legend class="titulos">PAGO MATRÍCULA</legend>
        <div class="texto_cabecera_2">DESCRIPCIÓN Y TIPO DE PAGO</div>
        <br>      

    <div class="container">
        <div class="texto_cabecera_2" style="font-size: .9em; text-align: center; border-bottom: 1px solid #9d001d;; border-top: 1px solid #9d001d; margin-bottom: 4px;">REF.: {{ matricula_p1.referencia }}</div>
        <div class="row">                
            <label for="nombre" class="col-md-2 col-form-label">Matrícula para Alumno:</label>
            <div class="col-md-8">
                <span  class="lbl_resumen">{{ matricula_p1.nombre |default_if_none:"" }} {{ matricula_p1.apellidos |default_if_none:"" }}</span>
            </div>
        </div>           
        <div class="row">
            <label class="col-md-2 col-form-label">IMPORTE a PAGAR: </label>
            
            {% if matricula_p2.pago_total_curso == True %}
            <div class="col-md-1">
                <span  class="lbl_resumen">{{ matricula_p2.importe_curso |default_if_none:"" }} €</span>                
            </div>
            {% else %}
            <div class="col-md-1">
                <span  class="lbl_resumen">{{ matricula_p2.importe_matricula |default_if_none:"" }} €</span>                
            </div> 
            {% endif %}
                
                           
            
        </div>
        <div class="texto_cabecera_2">TIPO DE PAGO SELECCIONADO <span style="color:red">(puede modificarlo para este pago)</span></div>

        {% if matricula_p1.tipo_pago == "Domiciliación Bancaria" %}

        <div class="container tipo_pago">
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Domiciliación Bancaria" id="id_tipo_pago_domiciliacion" checked>
                <label class="form-check-label">DOMICILIACIÓN BANCARIA</label>
            </div>
            <!--
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Efectivo o Tarjeta" id="id_tipo_pago_efectivo_tarjeta">
                <label class="form-check-label">PAGO CON TARJETA</label>
            </div>
        -->
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Trasferencia Bancaria a Academia EGA" id="id_tipo_pago_transferencia">
                <label class="form-check-label">TRANSFERENCIA BANCARIA A Academia EGA</label>
            </div>      
        </div>

        <div class="container" id="pago_domiciliado">        
            <div class="row">
                <p style="text-align: center;">Academia EGA le pasará el recibo en la próxima remesa. Finalice el proceso.
                </p>
            </div>           
            <div class="row">                
                <label for="IBAN" class="col-md-3 col-form-label">IBAN CLIENTE: <span class="obligatorio">(*)</span></label>
                <div class="col-md-9">
                    <input type="text" id="res_iban" class="form-matriculas input_res" value="{{ matricula_p1.IBAN }}">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                    <div class="alert alert-danger alert-dismissible fade show" id="iban_1" role="alert">
                        El IBAN introducido no es correcto.<br>
                        Utilice el formato correcto respetando los espacios.<br>
                        ES00 0000 0000 0000 0000 0000                       
                    </div> 
                </div>
            </div>                 
            <div class="row">                
                <label for="domiciliacion_nombre_apellidos" class="col-md-3 col-form-label">Nombre y Apellidos titular de la Cuenta: <span class="obligatorio">(*)</span></label>
                <div class="col-md-5">
                    <input type="text" id="res_domiciliacion_nombre_apellidos" class="form-matriculas input_res" value="{{ matricula_p1.domiciliacion_nombre_apellidos }}">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                </div>
                <label for="domiciliacion_dni" class="col-md-1 col-form-label">DNI: <span class="obligatorio">(*)</span></label>
                <div class="col-md-3">
                    <input type="text" id="res_domiciliacion_dni" class="form-matriculas input_res" value="{{ matricula_p1.domiciliacion_dni }}">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                    <div class="alert alert-danger alert-dismissible fade show" id="dni_1" role="alert">
                        DNI Incorrecto                       
                    </div> 
                </div>
            </div>
            <div class="btn_res_pasos">
                <button type="button" id="btn_finalizar" class="btn btn-warning" onclick="finalizar_pago_domiciliacion('{{ matricula_p1.id }}')">FINALIZAR</button>
            </div>
        </div>

        <div class="container" id="pago_tarjeta">
            <div class="btn_res_pasos">
                {{ form.sandbox }}                
            </div>
        </div>

        <div class="container" id="pago_transferencia">
            <p style="text-align: center; width: 100%;">A Academia EGA en una de las siguientes cuentas, indicando en el concepto "Matrícula EGA", nombre y apellidos del alumno. <br>
            Finalice el proceso el proceso
            <br>
            <span style="font-weight: bold;">EuroCajaRural ES94 3081 0215 1450 0032 0374</span>  
            </p>
            <div class="btn_res_pasos">
                <button type="button" id="btn_finalizar" class="btn btn-warning" onclick="finalizar_pago_transferencia('{{ matricula_p1.id }}')">FINALIZAR</button>
                {{ form.sandbox }}
            </div>
        </div>

        {% endif %}

        {% if matricula_p1.tipo_pago == "Efectivo o Tarjeta" %}
        
        <div class="container tipo_pago">
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Domiciliación Bancaria" id="id_tipo_pago_domiciliacion">
                <label class="form-check-label">DOMICILIACIÓN BANCARIA</label>
            </div>
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Efectivo o Tarjeta" id="id_tipo_pago_efectivo_tarjeta" checked>
                <label class="form-check-label">PAGO CON TARJETA</label>
            </div>
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Trasferencia Bancaria a Academia EGA" id="id_tipo_pago_transferencia">
                <label class="form-check-label">TRANSFERENCIA BANCARIA A Academia EGA</label>
            </div>      
        </div>

        <div class="container" id="pago_domiciliado">        
            <div class="row">
                <p style="text-align: center;">Academia EGA le pasará el recibo en la próxima remesa. Finalice el proceso.
                </p>
            </div>           
            <div class="row">                
                <label for="IBAN" class="col-md-3 col-form-label">IBAN CLIENTE: <span class="obligatorio">(*)</span></label>
                <div class="col-md-9">
                    <input type="text" id="res_iban" class="form-matriculas input_res">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                    <div class="alert alert-danger alert-dismissible fade show" id="iban_1" role="alert">
                        El IBAN introducido no es correcto.<br>
                        Utilice el formato correcto respetando los espacios.<br>
                        ES00 0000 0000 0000 0000 0000                       
                    </div>
                </div>
            </div>                 
            <div class="row">                
                <label for="domiciliacion_nombre_apellidos" class="col-md-3 col-form-label">Nombre y Apellidos titular de la Cuenta: <span class="obligatorio">(*)</span></label>
                <div class="col-md-5">
                    <input type="text" id="res_domiciliacion_nombre_apellidos" class="form-matriculas input_res">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                </div>
                <label for="domiciliacion_dni" class="col-md-1 col-form-label">DNI: <span class="obligatorio">(*)</span></label>
                <div class="col-md-3">
                    <input type="text" id="res_domiciliacion_dni" class="form-matriculas input_res">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                    <div class="alert alert-danger alert-dismissible fade show" id="dni_1" role="alert">
                        DNI Incorrecto                       
                    </div> 
                </div>
            </div>
            <div class="btn_res_pasos">
                <button type="button" id="btn_finalizar" class="btn btn-warning" onclick="finalizar_pago_domiciliacion('{{ matricula_p1.id }}')">FINALIZAR</button>
            </div>
        </div>

        <div class="container" id="pago_tarjeta">
            <div class="btn_res_pasos">
                {{ form.sandbox }}                
            </div>
        </div>

        <div class="container" id="pago_transferencia">
            <p style="text-align: center; width: 100%;">A Academia EGA en una de las siguientes cuentas, indicando en el concepto "Matrícula EGA", nombre y apellidos del alumno. <br>
            Finalice el proceso el proceso
            <br>
            <span style="font-weight: bold;">EuroCajaRural ES94 3081 0215 1450 0032 0374</span>  
            </p>
            <div class="btn_res_pasos">
                <button type="button" id="btn_finalizar" class="btn btn-warning" onclick="finalizar_pago_transferencia('{{ matricula_p1.id }}')">FINALIZAR</button>
            </div>
        </div>

        {% endif %}

        {% if matricula_p1.tipo_pago == "Trasferencia Bancaria a Academia EGA" %}
        
        <div class="container tipo_pago">
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Domiciliación Bancaria" id="id_tipo_pago_domiciliacion">
                <label class="form-check-label" for="inlineRadio1">DOMICILIACIÓN BANCARIA</label>
            </div>
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Efectivo o Tarjeta" id="id_tipo_pago_efectivo_tarjeta">
                <label class="form-check-label" for="inlineRadio2">PAGO CON TARJETA</label>
            </div>
            <div class="form-check form-check-inline">
                <input class="for_tipo_pago" type="radio" name="tipo_pago" value="Trasferencia Bancaria a Academia EGA" id="id_tipo_pago_transferencia" checked>
                <label class="form-check-label" for="inlineRadio2">TRANSFERENCIA BANCARIA A Academia EGA</label>
            </div>      
        </div>

        <div class="container" id="pago_domiciliado">        
            <div class="row">
                <p style="text-align: center;">Academia EGA le pasará el recibo en la próxima remesa. Finalice el proceso.
                </p>
            </div>           
            <div class="row">                
                <label for="IBAN" class="col-md-3 col-form-label">IBAN CLIENTE: <span class="obligatorio">(*)</span></label>
                <div class="col-md-9">
                    <input type="text" id="res_iban" class="form-matriculas input_res">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                    <div class="alert alert-danger alert-dismissible fade show" id="iban_1" role="alert">
                        El IBAN introducido no es correcto.<br>
                        Utilice el formato correcto respetando los espacios.<br>
                        ES00 0000 0000 0000 0000 0000                       
                    </div>
                </div>
            </div>                 
            <div class="row">                
                <label for="domiciliacion_nombre_apellidos" class="col-md-3 col-form-label">Nombre y Apellidos titular de la Cuenta: <span class="obligatorio">(*)</span></label>
                <div class="col-md-5">
                    <input type="text" id="res_domiciliacion_nombre_apellidos" class="form-matriculas input_res">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                </div>
                <label for="domiciliacion_dni" class="col-md-1 col-form-label">DNI: <span class="obligatorio">(*)</span></label>
                <div class="col-md-3">
                    <input type="text" id="res_domiciliacion_dni" class="form-matriculas input_res">
                    <div class="campo_invalido">
                        Campo Obligatorio
                    </div>
                    <div class="alert alert-danger alert-dismissible fade show" id="dni_1" role="alert">
                        DNI Incorrecto                       
                    </div> 
                </div>
            </div>
            <div class="btn_res_pasos">
                <button type="button" id="btn_finalizar" class="btn btn-warning" onclick="finalizar_pago_domiciliacion('{{ matricula_p1.id }}')">FINALIZAR</button>
            </div>
        </div>

        <div class="container" id="pago_tarjeta">
            <div class="btn_res_pasos">
                {{ form.sandbox }}                
            </div>
        </div>

        <div class="container" id="pago_transferencia">
            <p style="text-align: center; width: 100%;">A Academia EGA en una de las siguientes cuentas, indicando en el concepto "Matrícula EGA", nombre y apellidos del alumno. <br>
            Finalice el proceso el proceso
            <br>
            <span style="font-weight: bold;">EuroCajaRural ES94 3081 0215 1450 0032 0374</span>   
            </p>
            <div class="btn_res_pasos">
                <button type="button" id="btn_finalizar" class="btn btn-warning" onclick="finalizar_pago_transferencia('{{ matricula_p1.id }}')">FINALIZAR</button>
            </div>
        </div>
        {% endif %}
    </div>
    <div class="obligatorio">
        <span> &nbsp;&nbsp; (*) Campo Obligatorio</span>
    </div>
    </fieldset>   

</div>

<script type="text/javascript">

    window.onload=function() {        

        tipopago = '{{ matricula_p1.tipo_pago }}';

        if( tipopago == "Domiciliación Bancaria"){
            $('#pago_domiciliado').show();
            $('#pago_transferencia').hide();
            $('#pago_tarjeta').hide();
        }
        if( tipopago == "Efectivo o Tarjeta"){
            $('#pago_domiciliado').hide();
            $('#pago_transferencia').hide();
            $('#pago_tarjeta').show();            
        }
        if( tipopago == "Trasferencia Bancaria a Academia EGA"){
            $('#pago_domiciliado').hide();
            $('#pago_transferencia').show();
            $('#pago_tarjeta').hide();
        }
    }

    $('#id_tipo_pago_domiciliacion').click(function(){
        if( $(this).prop('checked') ) {
            $('#pago_tarjeta').hide();
            $('#pago_transferencia').hide();
            $('#pago_domiciliado').show();
        }else{
            $('#pago_domiciliado').hide();
        }
    })

    $('#id_tipo_pago_efectivo_tarjeta').click(function(){
        if( $(this).prop('checked') ) {
            $('#pago_tarjeta').show();
            $('#pago_transferencia').hide();
            $('#pago_domiciliado').hide();
        }else{
            $('#pago_tarjeta').hide();
        }
    })

    $('#id_tipo_pago_transferencia').click(function(){
        if( $(this).prop('checked') ) {
            $('#pago_tarjeta').hide();
            $('#pago_transferencia').show();
            $('#pago_domiciliado').hide();
        }else{
            $('#pago_transferencia').hide();
        }
    })

$('#btn_acceso').hide();

</script>

{% endblock contenido %}