{% extends 'ria/antecedentes_base.html.twig' %}

{% block js_document_ready %}
    {{ parent() }}
    $("#body_general").show();
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        function clickOpenModal(event) {
            event.preventDefault();
            //Hago una solicitud AJAX al controller
            $.ajax({
                url: event.currentTarget.dataset.url ,
                method: 'GET',
                context: event.currentTarget,
                success: function (data) {
                    // Inserto el contenido en el div del modal
                    $("#modalDetalle .modal-content").html(data);
                    $("#modalDetalle").modal({dismissible: false,});
                    $("#modalDetalle").modal('open');
                    //Agrego a los inputs normales la clase active a los label, para que se "levanten"
                    if($(this)[0].title.includes('Editar'))
                        {$("#modalDetalle").find('input').siblings('label').addClass('active');}
                    $("select").formSelect();
                    inicializarElementDatePicker(
                        $('.datepicker'),
                        null,
                        [new Date().getFullYear()-50, new Date().getFullYear()],
                        new Date(),
                        false
                    );
                    $('.checkFechaFin').click(function(e) {
                        {# Deshabilito la fecha fin en el caso de setear el checkbox  #}
                        $(this).parents('.rango_padre').find('.dateFechaFin').prop('disabled', $(this).is(":checked"));
                        $(this).parents('.rango_padre').find('span.helper-text').css("display", $(this).is(":checked") ? "none" : "");
                    });

                    cargaValidadores();
                },
                error: function (error) {
                }
            });
        }

        function checkDiv(div) {
            if(div.children().length < 2)
            {
                var divVacio ='<div class="col s12 m12 vacio">'+
                    '<div class="card">'+
                        '<div class="card-content">'+
                            '<div class="row">'+
                                'No hay datos declarados'+
                            '</div>'+
                        '</div>'+
                    '</div>'+
                '</div>';
                div.find('span').after(divVacio);
            }
        }

        function clickEliminar(e) { 
            $url_eliminar=e.currentTarget.dataset.url;
            swal({
                title: "Eliminar",
                text: "¿Está seguro que quiere eliminar lo declarado?",
                icon: "warning",
                buttons: true,
                })
                .then((aceptar) => {
                if (aceptar) {
                    $.ajax({
                        url: $url_eliminar,
                        method: 'POST',
                        mensaje:"hola",
                        {# beforeSend: function (data) {
                            console.log("hola") ;
                        }, #}
                        success: function (data) {
                            M.toast({html: 'Se eliminó lo declarado con éxito'});
                            //Encuentro el div padre, que tenga la clase terminada en _div
                            var div = $(e.target).parents("div[class$='_div']");
                            //Borro el div padre, que tenga la clase terminada en _box y la borro
                            $(e.target).parents("div[class$='_box']").remove();
                            checkDiv(div);
                        },
                        error: function (error) {
                            if(error.status == 500)
                            {
                                swal({
                                    icon: 'error',
                                    title: 'Error',
                                    text:  error.getResponseHeader('mensaje') ?  error.getResponseHeader('mensaje').replaceAll(".", ".\n").replaceAll("&atilde", "á") : 'Error del servidor, intente más tarde.',
                                });
                            }
                        },
                        complete: function(html) {
                        }
                    });
                } 
            });
        }
    </script>
{% endblock %}

{% block dialogos_modales %}
<div id="modalDetalle" class="modal">
    <div class="modal-content">
        <!-- Acá se va a cargar el contenido del modal mediante AJAX -->
    </div>
</div>
{% endblock %}

{% block body %}
    <div id="body_general" hidden>
        {{ form_start(form, {'attr': {'novalidate':'novalidate', 'id':'form_paso3'}}) }}
            <div class="row"> 
                <div class="col l12 ">
                    <div class="card-panel identidad-color lighten-4">
                    <span class="high black-text">
                        <span class="material-icons identidad-color-text">
                        info
                        </span> Los campos marcados con * son obligatorios. 
                    </span>
                    </div>
                </div>
            </div>
            <br>

            <div class="row patrocinioGratuito_div">
                <span class="card-title patrocinioGratuito_title">
                    Patrocinios gratuitos
                    <button type="button" class="btn {# btn-floating btn-flat #} darken-2 tooltipped modalDetalle" name="action" 
                        onclick="clickOpenModal(event)" title="Agregar Patrocinio Gratuito" data-tooltip="Agregar Patrocinio Gratuito"
                        data-url="{{ path('patrocinio_gratuito_modal_new', {'idView': presentacion_antecedente.idView}) }}">
                        Agregar <i class="material-icons right">add</i>
                    </button>
                </span>
                {% for indice, patrocinioGratuito in form.vars.value.patrociniosGratuitos|filter(v => v.id != null) %}
                    {{ include('ria/presentacion_antecedentes/paso3/_boxPatrocinioGratuito.html.twig', 
                        {'patrocinioGratuito': patrocinioGratuito,}) }}
                {% else %}
                    {{ include('ria/presentacion_antecedentes/paso2/_boxVacio.html.twig')}}
                {% endfor %}
            </div>

            <hr color="identidad-color">

            <div class="row trabajoExtension_div">
                <span class="card-title proyectoExtension_title">
                    Proyectos de Extensión y/o Vinculación en carácter de director/a o co-director/a
                    <button type="button" class="btn {# btn-floating btn-flat #} darken-2 tooltipped modalDetalle" name="action" 
                        onclick="clickOpenModal(event)" title="Agregar Proyecto de Extensión" data-tooltip="Agregar Proyecto de Extensión"
                        data-url="{{ path('proyecto_extension_modal_new', {'idView': presentacion_antecedente.idView}) }}">
                        Agregar <i class="material-icons right">add</i>
                    </button>
                </span>
                {% for indice, proyectoExtension in form.vars.value.proyectosExtension|filter(v => v.id != null) %}
                    {{ include('ria/presentacion_antecedentes/paso3/_boxProyectoExtension.html.twig', 
                        {'proyectoExtension': proyectoExtension,}) }}
                {% else %}
                    {{ include('ria/presentacion_antecedentes/paso2/_boxVacio.html.twig')}}
                {% endfor %}
            </div>

            <hr color="identidad-color">

            <div class="row expositor_div">
                <span class="card-title expositor_title">
                    Participación en conferencias, jornadas, charlas, congresos y/o seminarios en calidad de expositor/a
                    <button type="button" class="btn {# btn-floating btn-flat #} darken-2 tooltipped modalDetalle" name="action" 
                        onclick="clickOpenModal(event)" title="Agregar Exposición" data-tooltip="Agregar Exposición"
                        data-url="{{ path('expositor_modal_new', {'idView': presentacion_antecedente.idView}) }}">
                        Agregar <i class="material-icons right">add</i>
                    </button>
                </span>
                {% for indice, expositor in form.vars.value.exposiciones|filter(v => v.id != null) %}
                    {{ include('ria/presentacion_antecedentes/paso3/_boxExpositor.html.twig', 
                        {'expositor': expositor,}) }}
                {% else %}
                    {{ include('ria/presentacion_antecedentes/paso2/_boxVacio.html.twig')}}
                {% endfor %}
            </div>

            <hr color="identidad-color">

            <div class="row trabajoLegislativo_div">
                <span class="card-title trabajoLegislativo_title">
                    Trabajos en materia legislativa vinculados con un fuero
                    <button type="button" class="btn {# btn-floating btn-flat #} darken-2 tooltipped modalDetalle" name="action" 
                        onclick="clickOpenModal(event)" title="Agregar Trabajo Legislativo" data-tooltip="Agregar Trabajo Legislativo"
                        data-url="{{ path('trabajo_legislativo_modal_new', {'idView': presentacion_antecedente.idView}) }}">
                        Agregar <i class="material-icons right">add</i>
                    </button>
                </span>
                {% for indice, trabajoLegislativo in form.vars.value.trabajosLegislativos|filter(v => v.id != null) %}
                    {{ include('ria/presentacion_antecedentes/paso3/_boxTrabajoLegislativo.html.twig', 
                        {'trabajoLegislativo': trabajoLegislativo,}) }}
                {% else %}
                    {{ include('ria/presentacion_antecedentes/paso2/_boxVacio.html.twig')}}
                {% endfor %}
            </div>

            <hr color="identidad-color">

            <div class="row cargoEjecutivo_div">
                <span class="card-title cargoEjecutivo_title">
                    Cargos ejecutivos en institutos y/o instituciones
                    <button type="button" class="btn {# btn-floating btn-flat #} darken-2 tooltipped modalDetalle" name="action" 
                        onclick="clickOpenModal(event)" title="Agregar Cargo Ejecutivo" data-tooltip="Agregar Cargo Ejecutivo"
                        data-url="{{ path('cargo_ejecutivo_modal_new', {'idView': presentacion_antecedente.idView}) }}">
                        Agregar <i class="material-icons right">add</i>
                    </button>
                </span>
                {% for indice, cargoEjecutivo in form.vars.value.cargosEjecutivos|filter(v => v.id != null) %}
                    {{ include('ria/presentacion_antecedentes/paso3/_boxCargoEjecutivo.html.twig', 
                        {'cargoEjecutivo': cargoEjecutivo,}) }}
                {% else %}
                    {{ include('ria/presentacion_antecedentes/paso2/_boxVacio.html.twig')}}
                {% endfor %}
            </div>

            <div class="row">
                <div class="input-field col s12">
                    {{ form_widget(form.siguiente) }}
                    {# {{ form_widget(form.guardar) }} #}
                    {{ form_widget(form.anterior) }}
                </div>
            </div>

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