{% extends 'base.html.twig' %}

{% block stylesheets %}
    {{ parent() }}
{% endblock %}

{% block javascripts %}
    {{ parent() }}
{% endblock %}

{% block js_document_ready %}
    {{ parent() }}

    var $departamentoJudicial = $('#orden_merito_departamentoJudicial');

    $departamentoJudicial.change(function() {

        const departamentoId = this.value;
        // Realiza la solicitud AJAX para cargar las jurisdicciones
        // Reemplaza la URL con la ruta correcta para cargar las jurisdicciones

        // Limpia las opciones actuales del campo de selección de jurisdicciones
        var $jurisdiccionSelect = $('#orden_merito_jurisdiccion');
        $jurisdiccionSelect.empty();

        //Agrego la opcion vacia
        const option = document.createElement("option");
        option.value = '';
        option.text = '';
        $jurisdiccionSelect.append(option);
        $jurisdiccionSelect.formSelect(); 

        $.ajax({
            type: "GET", // Método HTTP
            url: '{{ path("cargar_jurisdicciones", {"departamentoId": "PLACEHOLDER"}) }}'.replace('PLACEHOLDER', departamentoId),
            dataType: "json", // Tipo de datos esperados en la respuesta
            success: function(data) {
                var $jurisdiccionSelect = $('#orden_merito_jurisdiccion');
                // Agrega las nuevas opciones al campo de selección de jurisdicciones
                data.forEach(jurisdiccion => {
                    const option = document.createElement("option");
                    option.value = jurisdiccion.id;
                    option.text = jurisdiccion.descrip;
                    $jurisdiccionSelect.append(option);
                });

                $jurisdiccionSelect.formSelect(); 
            },
            error: function(error) {
                alert("Error en la solicitud AJAX: " + error.statusText);
            }
        });
    });

    $departamentoJudicial.change();
{% endblock %}


{% block dialogos_modales %}
{% endblock %}

{% block breadcrumb %}
     <ol class="breadcrumbs">
        {# <li><a href="{{ path('main') }}">Inicio</a></li> #}
        <li><a href="{{ path('orden_merito_index') }}">Ordenes Mérito</a></li>
        <li><a class="active">Nuevo Orden de Mérito</a></li>
    </ol>
{% endblock %}

{% block titulo_body %}
  <div style="display: flex;">
        <i class="material-icons medium left identidad-color-text">business_center</i> 
        <h4 style="margin-top: 12px;">Nuevo Orden Mérito</h4>
    {#     {% if constant('App\\Entity\\SN\\Notificacion::ESTADO_BORRADOR') in workflow_marked_places(notificacion) %}
            <span style="margin-top: 15px;margin-left: 5px;"><i><sub style="color:darkorange">{Borrador}</sub></i></span>
        {% elseif constant('App\\Entity\\SN\\Notificacion::ESTADO_ELIMINADO') in workflow_marked_places(notificacion)%}
            <span style="margin-top: 15px;margin-left: 5px;"><i><sub style="color:red">{Eliminado}</sub></i></span>
        {% else %}
            <span style="margin-top: 15px;margin-left: 5px;"><i><sub style="color:green">{Publicado}</sub></i></span>
        {% endif %} #}
 {#   </div>#}
{% endblock %} 

	
{% block body %}

    {# <div id="divFormulario" hidden> #}
   
    <div class="col s12 m12 l12">
        <div class="card-panel">
            {{ form_start(form) }} 
                <div class="card-content">
                    <div class="row">
                        <div class="input-field col s12">
                            {{ form_label(form.cargo) }}
                            <br>
                            {{ form_widget(form.cargo) }}
                        </div>
                        <div class="input-field col s12 l6">
                            {{ form_label(form.departamentoJudicial) }}
                            <br>
                            {{ form_widget(form.departamentoJudicial, { 'attr': { 'class': 'departamento-select'} }) }}
                        </div>
                        <div class="input-field col s12 l6">
                            {{ form_label(form.jurisdiccion) }}
                            <br>
                            {{ form_widget(form.jurisdiccion, { 'attr': { 'class': 'jurisdiccion-select', 'style': 'display: none;' } }) }}
                            <br>
                        </div>
                    </div>
                </div>
                <div class="divider"></div>
                <div class="card-action right-align">
                    {# <div class="col s12 l12"> #}
                        <br>
                        {{ form_label(form.guardarComoBorrador) }}
                        {{ form_widget(form.guardarComoBorrador) }}
                
                        {{ form_label(form.cargarPostulantes) }}
                        {{ form_widget(form.cargarPostulantes) }}
                    {# </div> #}
                <div>
                <a class="btn waves-effect waves-light left-align" style="margin-right:15px;" href="{{ path('orden_merito_index') }}">Volver
                    <i class="material-icons right">undo</i>
                </a>
            {{ form_end(form) }}
        </div>
    </div>
    
        {# <div class="row" style="justify-content: space-between;">
            <div class="col right">
                <button class="btn identidad-color darken-2 guardarNoti right" onclick="clickTerminar()" {{ workflow_can(notificacion, 'terminar') ? "" : "disabled"}} >
                    Guardar y terminar
                    <i class="material-icons right">publish</i>
                </button>
            </div>                      
            <div class="col right">
                <button class="btn identidad-color darken-2 guardarNoti left" {{ workflow_can(notificacion, 'terminar') ? "" : "disabled"}}> 
                    Guardar como borrador
                    <i class="material-icons right">save</i>
                </button>
            </div>  
            <div class="col right">
                <button class="btn left red darken-2" {{ workflow_can(notificacion, 'eliminar') ? "" : "disabled"}} 
                    onclick="clickEliminar()" type="button">
                    Borrar
                    <i class="material-icons right">delete</i>
                </button>
            </div>
            <input type="hidden" name="tipoSubmit" id="tipoSubmit" value='guardar'>
        </div> #}

{% endblock %}