{% extends 'base.html' %}

{% block titulo %}
    Configuración Estudio Socioeconómico
{% endblock titulo %}

{% block body %}
    {% load custom_filters %}    
    

    

    {% include 'admin/config_nav.html' %}
    <div class="rounded-2 p-1 mx-4 texto-general">
        <div class="rounded-2 mx-4">
            <div class="row">
                <p class="col h5 subtitulo-mod">Estudio socio económico</p>
                <hr>
            </div>
        </div>
    </div>
    <!-- Seguirle aqui cuando haya internet -->
    <div id="cargandoESE" style="height: 50vh; transition: opacity 0.3s ease-in-out;">
        <div class="m-0 d-flex justify-content-center align-items-center" style="height: 50vh;">
            <div class="spinner-border text-primary" role="status">                
            </div>
            <span class="row m-0 visually-hidden">Cargando...</span>
        </div>
    </div>    
    {% if request.method == "GET" %}        
        <div class="texto-general" id="form-placeholder"></div>
    {% elif request.method == "POST" %}
        {% include 'admin/config_estudioSEForm.html' %}
    {% endif %}
    

    
    <script>               
        
        // Document Ready de jQuery
        $(document).ready(function() {            
            
            {% if request.method == "GET" %}
                // Realiza una petición AJAX para obtener el formulario
                $.ajax({
                    url: '{% url "estudioSE:AConfigGetEstudioForm" %}',
                    type: 'GET',
                    success: function(data) {
                        // Inserta el contenido en el marcador
                        $('#form-placeholder').html(data);
                    }
                });
            {% endif %}
            
            
        });

        // Function to handle form submission
        function desactivar(elem) {
            // Disable the submit button to prevent multiple submits
            elem.disabled = true;
            document.getElementById("ESE_Form").submit();
            // Submit the form            
        }

    </script>

{% endblock body %}