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

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

{% block js_document_ready %}

    $('#datatable2').dataTable({
        createdRow: function(row, data, dataIndex) {
                },

        filter : false,
        language: {
           "url": "//cdn.datatables.net/plug-ins/1.12.1/i18n/es-ES.json"
        },
        aLengthMenu: "",
        bAutoWidth: false,
        "columns": [
            {
                "data": null, // Deja "data" en null para que DataTables no extraiga ningún dato de la columna
                "render": function(data, type, row) {
                    if (type === 'display') {
                        return "<div>" + row.presentacionAntecedentes.datosPersonales.apellidos + ', ' + row.presentacionAntecedentes.datosPersonales.nombres + "</div>"; 
                    }
                    return data;
                }
            },
            { "data": "presentacionAntecedentes.datosPersonales.dni"},
            { "data": "pantecedente",
                "render": function(data, type, row) {
                    if (type === 'display') {
                        return "<div class='center'><div class='center-align; chip'>"+ data+ "</div></div>"; 
                    }
                    return data;
                }
            },
            { "data": "examenEscrito",
                "render": function(data, type, row) {
                    if (type === 'display') {
                        return "<div class='center'><div class='center-align; chip'>"+ data+ "</div></div>"; 
                    }
                    return data;
                }
            },
            { "data": "entrevista",
                "render": function(data, type, row) {
                    if (type === 'display') {
                        return "<div class='center'><div class='center-align; chip'>"+ data+ "</div></div>"; 
                    }
                    return data;
                }
            },
            { "data": "total",
                "render": function(data, type, row) {
                    if (type === 'display') {
                        return "<div class='center'><div class='center-align; chip'>"+ data+ "</div></div>"; 
                    }
                    return data;
                }
            },
            { 
                "data": "acciones" ,
                render: function(data, type, row, meta) {
                    if (type === 'display') {
                        $botones = [
                            ' <a href="',
                            data["seleccionar"],
                            '" class="btn-floating btn-flat identidad-color darken-2" title="Ver Detalle Completo">',
                            '<i class="material-icons">visibility</i>',
                            '</a> ',
                        ].join('');
                        {% if orden.estadoMerito != 'Definitivo' %}
                            $botones += [
                                ' <a href="',
                                data["editar"],
                                '" class="btn-floating btn-flat identidad-color darken-2" title="Editar Detalle">',
                                '<i class="material-icons">edit</i>',
                                '</a>',
                            ].join('');
                        {% endif %}
                        return $botones;
                    }
                    return data;
                },
            },
        ],
        order: [[ 0, 'asc' ]],
        columnDefs: [
            // These are the column name variables that will be sent to the server
            { 
                "name": "dp.apellidos",   
                "searchable": true, 
                "targets": 0,
            },
            { 
                "name": "dp.dni",   
                "searchable": true, 
                "targets": 1 
            },
            { 
                "name": "pantecedente",   
                "searchable": false, 
                "orderable": false, 
                "targets": 2 
            },
            { 
                "name": "examenEscrito",   
                "searchable": false, 
                "orderable": false, 
                "targets": 3
            },
            { 
                "name": "entrevista",   
                "searchable": false, 
                "orderable": false,  
                "targets": 4
            },
            { 
                "name": "total",   
                "searchable": false, 
                "orderable": false,  
                "targets": 5
            },
            { 
                "searchable": false, 
                "orderable": false,  
                "targets": 6 
            },
        ],
        serverSide: true,
        processing: true,
        ajax: {
            url: '{{ path('ordenes_merito_detalle_datos', {'idView': orden.idView}) }}',
            type: 'POST'
        }
    });

    // the "href" attribute of the modal trigger must specify the modal ID that wants to be triggered
    {# $('.modal1').modal(); #}
    $('select').formSelect(); 

     $('.limpiar').click(function(){
        window.location.href="{{ path('orden_merito_limpiar_index') }}"
    });
{% endblock %}

{% block titulo_body %}
        <i class="material-icons medium left identidad-color-text">business_center</i>
        <h4 style="margin-top: 12px;">{{ orden.cargo }}
            {% if orden.estadoRegistro == 'Borrador' %}
                <span style="margin-top: 15px;margin-left: 5px;"><i><sub style="color:darkorange">{Borrador}</sub></i></span>
            {% endif %}
        </h4> 
        <blockquote>
            <h5> {{ orden.departamentoJudicial }} 
            {% if orden.jurisdiccion is not null %} 
            - {{ orden.jurisdiccion }}    
            {% endif %}</h5>
        </blockquote>
{% endblock %}

{% block titulo_acciones_body %}
    {% if orden.estadoRegistro == 'Terminado' and orden.estadoMerito != 'Definitivo'  %}
        <a class="btn green darken-2 waves-effect waves-light col s6 modal-trigger" href="#modal1" style="margin-top: 12px; margin-right:6px; float:right;">
            <i class="material-icons right">check</i>
            Orden Definitivo
        </a>
    {% endif %}
    {% if orden.estadoMerito != 'Definitivo'  %}
        <a href="{{path('orden_merito_edit_view', {'idView': orden.idView})}}" class="btn oscuro darken-2 waves-effect waves-light col s5" style="margin-top: 12px; float:left;">
            <i class="material-icons right">edit</i>
            Editar Orden
        </a>
    {% endif %}


    <br>
    <br>
    <br>
    {% if orden.estadoRegistro == 'Borrador' %}
        <a id="new" href="{{ path('orden_merito_terminar', {'idView': orden.idView}) }}" class="btn convocatoria darken-2 waves-effect waves-light col s12" style="margin-right:30px;">
            <i class="material-icons medium right">publish</i>
            <i class="material-icons medium right">business_center</i>
            Dar por terminado el Orden
        </a>
    {% endif %}
    
{% endblock %}

{% block body %}
    <div class="row">
        <div class="col l12 m12 s12">
            <div class="card">
                <div class="card-content">
                    {{ form_start(form) }}
                        <div class="row">
                            <div class="input-field col s12 m6 l4">
                                {{ form_widget(form.textoBusqueda) }}
                                {{ form_label(form.textoBusqueda) }}
                            </div>
                            <div class="input-field col s12 m2 l2">
                                {{ form_label(form.dni) }}
                                {{ form_widget(form.dni) }}
                            </div>

                            <div class="input-field col m2 s12 l2">
                                <button id="boton" class="btn identidad-color darken-2 waves-effect waves-light col s12" type="submit" >Buscar<i class="material-icons right">search</i></button>
                            </div>
                            {% if form.children | filter(v => (v.vars.name != "_token" and not (v.vars.value == "" or v.vars.value == []))) | length > 0 %}
                                <div class="input-field col m2 s12 l2">
                                    <a id="botonLimpiar" href="{{ path('orden_merito_detalle_limpiar', {'idView': orden.idView}) }}"
                                        class="limpiar btn orange darken-2 waves-effect waves-light col s12" type="">Limpiar<i class="material-icons right">close</i>
                                    </a>
                                </div>
                            {% endif %} 
                        </div>
                    {{ form_end(form) }}
                </div>
            </div>
        </div>
    </div>


    <div class="row">
        <div class="col l12 m12 s12">
            <div class="row">
                 <a href="{{path('orden_merito_detalles_excel_descargar', {'idView': orden.idView})}}" class="btn oscuro darken-2 waves-effect waves-light col s2" style="margin-top: 12px; margin-left: 12px;">
                <i class="material-icons right">vertical_align_bottom</i>
                Descargar Excel
                </a>
            </div>
            <div class="card">
                <div class="card-content">

                    <table id="datatable2" class="display nowrap">
                        <thead>
                            <tr>
                                <th style="">Apellido/s y Nombre/s</th>
                                <th style="">DNI</th>
                                <th class="center">Puntaje Antecedente</th>
                                <th class="center">Puntaje Examen</th>
                                <th class="center">Puntaje Entrevista</th>
                                <th class="center">Total </th>
                                <th style="">Acciones</th>
                        </tr>
                        </thead>

                        <tbody> 

                        </tbody>
                    </table>

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

    <a class="btn waves-effect waves-light left-align" style="margin-right:15px; margin-left: 12px;" href="{{ path('orden_merito_index')}}">Volver
        <i class="material-icons right">undo</i>
    </a>

    <div id="modal1" class="modal modal-fixed-footer">
        <div class="modal-content">
          <h4>¿Ud. está seguro de generar el orden de mérito definitivo?</h4>
          <hr>
          <br>
            <div class="row">
                <p>Tenga en cuenta que el Orden de mérito una vez que lo declare terminado y generado como definitivo no podrá editarlo ni borrarlo.</p>
            </div>
        </div>
        <div class="modal-footer">
          <a href="#" class="modal-action modal-close waves-effect waves-grey btn-flat left">Cancelar</a>
          <a href="{{ path('orden_merito_definitivo', { 'idView':  orden.idView })}}" class="modal-action modal-close waves-effect waves-green btn">Generar Orden Definitivo</a>
        </div>  
    </div>
{% endblock %}