{% extends '::base.html.twig' %}
{% block menuTop %}

{% endblock %}

{% block dashboard %}
<style>

    .checkbox-menu li label {
        display: block;
        padding: 3px 10px;
        clear: both;
        font-weight: normal;
        line-height: 1.42857143;
        color: #333;
        white-space: nowrap;
        margin:0;
        transition: background-color .4s ease;
    }
    .checkbox-menu li input {
        margin: 0px 5px;
        top: 2px;
        position: relative;
    }

    .checkbox-menu li.active label {
        background-color: #cbcbff;
        font-weight:bold;
    }

    .checkbox-menu li label:hover,
    .checkbox-menu li label:focus {
        background-color: #f5f5f5;
    }

    .checkbox-menu li.active label:hover,
    .checkbox-menu li.active label:focus {
        background-color: #b8b8ff;
    }

    .panel-green {
        border-color: #5cb85c;
    }

    .panel-green .panel-heading {
        border-color: #5cb85c;
        color: #fff;
        background-color: #5cb85c;
    }

    .panel-green a {
        color: #5cb85c;
    }

    .panel-green a:hover {
        color: #3d8b3d;
    }

    .panel-red {
        border-color: #d9534f;
    }

    .panel-red .panel-heading {
        border-color: #d9534f;
        color: #fff;
        background-color: #d9534f;
    }

    .panel-red a {
        color: #d9534f;
    }

    .panel-red a:hover {
        color: #b52b27;
    }

    .panel-yellow {
        border-color: #f0ad4e;
    }

    .panel-yellow .panel-heading {
        border-color: #f0ad4e;
        color: #fff;
        background-color: #f0ad4e;
    }

    .panel-yellow a {
        color: #f0ad4e;
    }

    .panel-yellow a:hover {
        color: #df8a13;
    }
    .double-scroll {
        width: 100%;
        margin-bottom: 40px;
        overflow: scroll !important;
    }
    /* pager wrapper, div */
    .pager {
        padding-left: 0;
        margin: 0;
        text-align: left;
        list-style: none;
    }
    /* pager wrapper, in thead/tfoot */
    td.pager {
        background-color: #e6eeee;
    }
    /* pager navigation arrows */
    .pager img {
        vertical-align: middle;
        margin-right: 2px;
    }
    /* pager output text */
    .pager .pagedisplay {
        font-size: 14px;
        font-weight: bold;
        padding: 0 5px 0 5px;
        width: 50px;
        text-align: center;
    }

    /*** loading ajax indeterminate progress indicator ***/
    #tablesorterPagerLoading {
        background: rgba(255,255,255,0.8) url(icons/loading.gif) center center no-repeat;
        position: absolute;
        z-index: 1000;
    }

    /*** css used when "updateArrows" option is true ***/
    /* the pager itself gets a disabled class when the number of rows is less than the size */
    .pager.disabled {
        display: none;
    }
    /* hide or fade out pager arrows when the first or last row is visible */
    .pager img.disabled {
        /* visibility: hidden */
        opacity: 0.5;
        filter: alpha(opacity=50);
    }

    .tablesorter-pager select {
        margin: 0;
        padding: 0;
        width: 50px;
    }

    .wrapper{padding-bottom:50px;}
    .header{background:#000000;}.header .container{padding-bottom:20px;}.header .container h1{color:#FFF;line-height:50px;margin-top:30px;margin-bottom:0;}
    .header .container h3{color:#E0E0E0;font-size:16px;margin-top:-5px;}.header .container h3 a{color:#66aacc;}.header .container h3 a:hover{color:#b3d5e6;}
    .top-menu{position:absolute;z-index:9999;}.top-menu .nav-list{background:rgba(255, 255, 255, 0.8);border:1px solid #CCC;margin:20px;position:fixed;right:0;}
    pre,.well{background:#FFFFFF;}
    .syntax-container{background:#FCFCFC;-webkit-border-radius:7px;-webkit-background-clip:padding-box;-moz-border-radius:7px;-moz-background-clip:padding;border-radius:7px;background-clip:padding-box;border:1px solid #e3e3e3;margin-bottom:30px;padding-bottom:20px;}
    .isloading-wrapper.isloading-right{margin-left:10px;}
    .isloading-overlay{position:relative;text-align:center;}.isloading-overlay .isloading-wrapper{background:#FFFFFF;-webkit-border-radius:7px;-webkit-background-clip:padding-box;-moz-border-radius:7px;-moz-background-clip:padding;border-radius:7px;background-clip:padding-box;display:inline-block;margin:0 auto;padding:10px 20px;top:10%;z-index:9000;}

    /*Glyphicon Spinner*/
    .glyphicon-spin {
        -animation: spin .9s infinite linear;
        -webkit-animation: spin2 .9s infinite linear;
    }

    @-webkit-keyframes spin2 {
        from { -webkit-transform: rotate(0deg);}
        to { -webkit-transform: rotate(360deg);}
    }

    @keyframes spin {
        from { transform: scale(1) rotate(0deg);}
        to { transform: scale(1) rotate(360deg);}
    }
    #menuTop {
        margin-top: 30px;
    }



    body {
        /*margin-top: 80px;*/
    }
    h1{
        font-size: 36px;
    }

    table.tablesorter {
        font-family: arial;
        /* background-color: #CDCDCD; */
        margin: 10px 0pt 15px;
        font-size: 8pt;
        /* width: 100%; */
        text-align: left;
        margin-bottom: 150px;
    }


    .tablesorter-header-inner,table.tablesorter thead tr th,.tablesorter-filter {
        color: #fff;
        background-color: #082a99;
        border-color: #2643a5;

    }
    table.tablesorter thead tr th{

        height: 40px;
    }

    .tablesorter-blue .headerSortUp, .tablesorter-blue .tablesorter-headerSortUp, .tablesorter-blue .tablesorter-headerAsc {
        background-color: #082a99;}
    .tablesorter-blue .headerSortDown, .tablesorter-blue .tablesorter-headerSortDown, .tablesorter-blue .tablesorter-headerDesc {
        background-color: #082a99;}


    .tablesorter-blue .tablesorter-filter-row td {
        background: #2643a5;}

    input[type="search"]{
        display: block;
        width: 100%;
        height: 34px;
        padding: 6px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        border: 1px solid #ccc;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    }
</style>
<script src="{{ asset('js/jquery.form.js') }}"></script>
<script src="{{asset('js/jquery.isloading.js')}}" type="text/javascript"></script>
<script src="{{asset('js/jquery.doubleScroll.js')}}" type="text/javascript"></script>
<script src="{{ asset('js/tableExport.js') }}"></script>
<script src="{{ asset('js/jquery.base64.js') }}"></script>
<script type="text/javascript">
    var id_region_global = 0;
    var strFileTypes = "*.xlsx";
    var arrFileTypes = ['xlsx'];

    $(document).ready(function() {
        $('#proyecto').select2({
            "placeholder" : "Seleccione Proyecto..."
        });
        $("#proyecto").on("change", function() {
            var alias = $(this).find('option:selected').data('alias');
            $('.mainTab a[href="#_' + alias + '"]').tab('show');
            var region = $('#region').select2("val");
            var proyecto = $('#proyecto').select2("val");
            if (proyecto !== "" && region !== ""){
                $('#txtSitio').select2("val","");
                $('#txtSitio').select2("enable",true);
            }else{
                $('#txtSitio').select2("enable",false);
            }
        });

        $('#region').select2({
            "placeholder" : "Seleccione Región..."
        });

        $('#region').change(function(){
            //var selected = $(this).find('option:selected');
            var region = $('#region').select2("val");
            id_region_global= region;
            var proyecto = $('#proyecto').select2("val");
            if (proyecto !== "" && region !== ""){
                $('#txtSitio').select2("val","");
                $('#txtSitio').select2("enable",true);
            }else{
                $('#txtSitio').select2("enable",false);
            }
            //$('#txtSitio').select2("open")
            /*$.ajax({
             url: '{{ path('reporteappenate_getSiteIdByRegion') }}',
             dataType: 'json',
             data: {
             idsitio: '',
             idregion: region,
             idproyectos: {{ idproyectos }},
             idproceso: proyecto
             },
             success: function (response) {
             console.log(response)
             },
             error: function (jqXHR, textStatus, errorThrown) {
             console.log('error...');
             }
             });*/
        });

        $('#asignado').select2();

        function formatShort(sitio) {
            return sitio.id;
        }

        function formatLarge(sitio) {
            return "[" + sitio.id + "] " + sitio.text.toUpperCase();
        }

        $('#txtSitio').select2({
            placeholder: 'ID',
            minimumInputLength: 3,
            multiple: false,
            ajax: {
                url: '{{ path('reporteappenate_getSiteIdByRegion') }}',
                dataType: 'json',
                quietMillis: 550,
                data: function (term, page) {
                    return {
                        idsitio: term, // Termino de busqueda
                        idregion: jQuery('#region').select2("val"),
                        idproyectos: {{ idproyectos }},
                        idproceso: jQuery('#proyecto').select2("val")
                    };
                },
                beforeSend: function(){
                    console.log('E beforeSend');
                    //return false;
                },
                success: function (response) {
                    console.log("E Successs: " + response);
                },
                error: function(xhr){
                    console.log("E Error: " + xhr);
                },
                complete: function(){
                    console.log("E Complete: ");
                },
                /*initSelection: function(callback) {
                 $.ajax("{{ path('reporteappenate_getSiteIdByRegion') }}", {
                 dataType: "json"
                 }).done(function(data) { callback(data); });

                 },*/
                results: function (data, page) { // parse the results into the format expected by Select2.
                    // since we are using custom formatting functions we do not need to alter the remote JSON data
                    return { results: data };
                },
                cache: true
            },
            formatResult: formatLarge,
            formatSelection: formatShort,
            escapeMarkup: function(m) { return m; },
            /*transport: function (params, success, failure) {
             var $request = $.ajax(params);
             console.log(params);
             $request.then(success);
             $request.fail(failure);

             return $request;
             }*/
        });
        $('#txtSitio').select2("enable",false);

        $("#fileToUpload").fileinput({
            uploadUrl: "{{ path("reporteappenate_uploadFileATPs") }}",
            uploadAsync: false,
            minFileCount: 1,
            maxFileCount: 1,
            allowedFileExtensions: arrFileTypes,
            overwriteInitial: false,
            showPreview: false,
            showCancel: false,
            uploadExtraData: function() {
                return {
                    idproyectos: {{ idproyectos }},
                    idprocesos: $('#txtProceso').val()
                };
            },
            previewFileExtSettings: {
                'xls': function (ext) {
                    return ext.match(/(xls|xlsx)$/i);
                }
            },
            progress: '<div class="progress">\n' +
            '    <div class="progress-bar progress-bar-success progress-bar-striped text-center" role="progressbar" aria-valuenow="{percent}" aria-valuemin="0" aria-valuemax="100" style="width:{percent}%;">\n' +
            '        {status}\n' +
            '     </div>\n' +
            '</div>',
        });
        $('#fileToUpload').on('filecleared', function(event) {
            /*$('#previewContent').hide();
             $("#tableData").html('');*/
        });
        $('#fileToUpload').on('filepreajax', function(event, previewId, index) {
            //console.log('File pre ajax triggered: ');
            $("#cargar").css('display','');
        });
        $('#fileToUpload').on('filebatchuploaderror', function(event, data, previewId, index) {
            var form = data.form;
            var files = data.files;
            var extra = data.extra;
            var response = data.response;
            //console.log(data);
            swal("Error!", response.error + "<br>Please contact the administrator", "error");
            $('#fileToUpload').fileinput('clear');
            $('#fileToUpload').fileinput('reset');
            $('#modalfileUpload').modal('hide');
            $("#cargar").css('display','none');
            //$('#previewContent').hide();
            //$("#tableData").html('');
        });
        $('#fileToUpload').on('filebatchuploadsuccess', function(event, data, previewId, index) {
            var form = data.form;
            var files = data.files;
            var filename = data.filenames[0];
            var extra = data.extra;
            var response = data.response;
            var str = "";
            var n_procesados = parseInt(response.items_procesados);
            var arrNoProc = response.items_no_procesados;

            swal("Process Completed!", "Upload success", "success");
            $("#generar").click();
            if (n_procesados>0){
                str += '<div class="alert alert-success" role="alert">' +
                        '<strong>Archivo Procesado!!!</strong> Se procesaron ' + n_procesados + ' sitios.' +
                        '</div>';
            }
            if (arrNoProc.length>0){
                str+= '<div class="alert alert-warning" role="alert">' +
                        '<strong>Advertencia:</strong> ' + (arrNoProc.length) + ' sitios sin procesar.';
                        '</div>';
                str+="<div style='max-height: 150px; overflow: scroll'>";
                str+= "<samp>";
                for (var i=0; i<arrNoProc.length; i++){
                    str+= arrNoProc[i] + "<br>";
                }
                str+= "<samp>";
            }
            $('#fileToUpload').fileinput('clear');
            $('#fileToUpload').fileinput('reset');
            $('#fileToUpload').fileinput('refresh');
            $('#fileToUpload').fileinput('enable');
            $('#msjFileUpload').empty().append(str).show();
            //$('#modalfileUpload').modal('hide');

        });

        $("#fileToUploadVL").fileinput({
            uploadUrl: "{{ path("reporteappenate_uploadFileVideollamada") }}",
            uploadAsync: false,
            minFileCount: 1,
            maxFileCount: 1,
            allowedFileExtensions: arrFileTypes,
            overwriteInitial: false,
            showPreview: false,
            showCancel: false,
            uploadExtraData: function() {
                return {
                    idproyectos: {{ idproyectos }},
                    idprocesos: $('#txtProceso').val()
                };
            },
            previewFileExtSettings: {
                'xls': function (ext) {
                    return ext.match(/(xls|xlsx)$/i);
                }
            },
            progress: '<div class="progress">\n' +
            '    <div class="progress-bar progress-bar-success progress-bar-striped text-center" role="progressbar" aria-valuenow="{percent}" aria-valuemin="0" aria-valuemax="100" style="width:{percent}%;">\n' +
            '        {status}\n' +
            '     </div>\n' +
            '</div>',
        });
        $('#fileToUploadVL').on('filecleared', function(event) {
            /*$('#previewContent').hide();
             $("#tableData").html('');*/
        });
        $('#fileToUploadVL').on('filepreajax', function(event, previewId, index) {
            //console.log('File pre ajax triggered: ');
            $("#cargar").css('display','');
        });
        $('#fileToUploadVL').on('filebatchuploaderror', function(event, data, previewId, index) {
            var form = data.form;
            var files = data.files;
            var extra = data.extra;
            var response = data.response;
            //console.log(data);
            swal("Error!", response.error + "<br>Please contact the administrator", "error");
            $('#fileToUploadVL').fileinput('clear');
            $('#fileToUploadVL').fileinput('reset');
            $('#modalfileUpload').modal('hide');
            $("#cargar").css('display','none');
            //$('#previewContent').hide();
            //$("#tableData").html('');
        });
        $('#fileToUploadVL').on('filebatchuploadsuccess', function(event, data, previewId, index) {
            var form = data.form;
            var files = data.files;
            var filename = data.filenames[0];
            var extra = data.extra;
            var response = data.response;
            var str = "";
            var n_procesados = parseInt(response.items_procesados);
            var arrNoProc = response.items_no_procesados;

            swal("Process Completed!", "Upload success", "success");
            $("#generar").click();
            if (n_procesados>0){
                str += '<div class="alert alert-success" role="alert">' +
                        '<strong>Archivo Procesado!!!</strong> Se procesaron ' + n_procesados + ' sitios.' +
                        '</div>';
            }
            if (arrNoProc.length>0){
                str+= '<div class="alert alert-warning" role="alert">' +
                        '<strong>Advertencia:</strong> ' + (arrNoProc.length) + ' sitios sin procesar.';
                        '</div>';
                str+="<div style='max-height: 150px; overflow: scroll'>";
                str+= "<samp>";
                for (var i=0; i<arrNoProc.length; i++){
                    str+= arrNoProc[i] + "<br>";
                }
                str+= "<samp>";
            }
            $('#fileToUploadVL').fileinput('clear');
            $('#fileToUploadVL').fileinput('reset');
            $('#fileToUploadVL').fileinput('refresh');
            $('#fileToUploadVL').fileinput('enable');
            $('#msjFileUploadVL').empty().append(str).show();
            //$('#modalfileUpload').modal('hide');

        });

    });

    $(function () {
        $('.repuesto').change(function () {
            var sel = $(this).val();
            $(".descripcion_repuesto option:contains(" + sel + ")").attr('selected', true);
            console.log($('.descripcion_repuesto').val());
        });

        $('.all').live('click', function () {
            var c = this.checked;
            var elem = '.validarExtra';
            //$(':checkbox').prop('checked', c);
            $(elem).each(function(){
                $(this).prop("checked", c);
            });
        });

        $(".chkValAll").live('click', function (){
            //var idprocesos = $("li.active").attr("idprocesos");
            var idprocesos = $("#proyecto").val();
            var elem = '#tbody_' + idprocesos + ' input[name=chkValidar_' + idprocesos + ']';
            var checked = false;

            if($(this).is(':checked')){
                checked = true;
            }else{
                checked = false;
            }

            $(elem).each(function(){
                $(this).prop("checked", checked);
            });
        });


        $('#chkValExtraAll').live('click', function(){
            var checked = false;
            if($(this).is(':checked')){
                checked = true;
            }else{
                checked = false;
            }
            $('.chkValExtraStyle').each(function(){
                if (!$(this).is(':disabled')){
                    $(this).prop("checked", checked);
                }
            });
        });

        $("#btnSaveSelectDeliverables").live('click', function () {
            var idTicket = $('#txtIdTicket').val();
            var arr = [];

            $('#frmSelectEntregable input[type=checkbox]').each(function(){
                var id_entregable = $(this).val();
                var idTicketEntregable = $(this).attr('id_ticket_entregable');
                var valor_old = $(this).attr('valor_old');
                var valor_new = this.checked==true ? '1' : '0';
                var isDisabled = $(this).is('[disabled]');
                var valor_texto = $(this).attr('valor_texto');
                var tipo = $(this).attr('tipo');

                var arrDatos = {};
                if ((valor_old != valor_new && idTicketEntregable !='0') || (idTicketEntregable =='0')){
                    if (isDisabled === false){
                        arrDatos = {
                            id_ticket: idTicket,
                            id_entregable: id_entregable,
                            id_ticket_entregable: idTicketEntregable,
                            valor_aplica: valor_new,
                            valor_texto: valor_texto,
                            tipo: tipo
                        };
                        arr.push(arrDatos);
                    }
                }
            });

            if (arr.length>0){
                $.confirm({
                    icon: 'glyphicon glyphicon-question-sign',
                    title: 'Excluir Reportes',
                    content: '¿Desea grabar los cambios?',
                    confirmButton: 'Si',
                    cancelButton: 'No',
                    confirmButtonClass: 'btn-success',
                    cancelButtonClass: 'btn-default',
                    confirm: function () {
                        $.isLoading({text: "Grabando los cambios..." });
                        $.ajax({
                            type: 'POST',
                            url: "{{ path('reporteappenate_saveAppenateListDeliverablesByProject') }}",
                            data: {
                                'arr_data': JSON.stringify(typeof(arr) === 'object' ? Object.values(arr) : arr),
                                'idproyectos': {{ idproyectos }}
                            },
                            dataType: 'json',
                            success: function (response) {
                                switch (response.status){
                                    case 'ok':
                                        $.isLoading("hide");
                                        swal("Información","Exclusión procesada!" );
                                        $('#modalSelectDeliverables').modal('hide');
                                        $.isLoading({text: "Refrescando los datos..." });
                                        //var groupQuery = $("li.active").attr("gruopquery");
                                        //var headerId = $("li.active").attr("headerId");
                                        var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                                        var headerId = $("#proyecto").find('option:selected').data('headerid');
                                        getReporte(groupQuery, headerId);
                                        $.isLoading("hide");
                                        break;
                                    case 'error':
                                        $.isLoading("hide");
                                        swal("Error","Error al excluir...");
                                        $('#modalSelectDeliverables').modal('hide');
                                        break;
                                    default:
                                        $.isLoading("hide");
                                        swal("Oops!!!", "Errores encontrados");
                                        $('#modalSelectDeliverables').modal('hide');
                                }
                            },
                            error: function (jqXHR, textStatus, errorThrown) {
                                $.isLoading("hide");
                                swal("Oops!!!", "Errores encontrados");
                                $('#modalSelectDeliverables').modal('hide');
                            }
                        });
                    },
                    cancel: function () {
                        $.isLoading("hide");
                        // $.alert('Cancel!');
                    }
                });
            }else{
                alert('No se han encontrado cambios.');
            }
        });

        $("#saveValidarExtra").live('click', function () {
            $("#validacionOtros").ajaxSubmit({
                beforeSubmit: function (formData, jqForm, options) {
                    $("#saveValidarExtra").attr('disabled', 'disabled');
                    $.isLoading({
                        text: "Guardando"
                    });
                },
                error: function (error) {
                    swal(error.statusText, error.error, "error");
                    $("#saveValidarExtra").prop('disabled', false);
                },
                success: function (responseText, statusText, xhr, $form) {
                    $("#saveValidarExtra").prop('disabled', false);
                    //var groupQuery = $("li.active").attr("gruopquery");
                    //var headerId = $("li.active").attr("headerId");
                    var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                    var headerId = $("#proyecto").find('option:selected').data('headerid');
                    getReporte(groupQuery, headerId);
                }
            });
            return false;
        });

        $(".checkbox-menu").on("change", "input[type='checkbox']", function () {
            $(this).closest("li").toggleClass("active", this.checked);
        });

        $(document).on('click', '.allow-focus', function (e) {
            e.stopPropagation();
        });

        $('form[name="rechazo"]').ajaxForm({
            beforeSubmit: function (formData, jqForm, options) {
                $.isLoading({
                    text: "Rechazando"
                });

            },
            error: function (error) {
                $.isLoading('hide');
            },
            success: function (responseText, statusText, xhr, $form) {
                $.isLoading('hide');
                swal("El Sitio Fue Rechazado", "You clicked the button!", "success");
                $("#modalRechazo").modal('hide');
                //var groupQuery = $("li.active").attr("gruopquery");
                //var headerId = $("li.active").attr("headerId");
                var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                var headerId = $("#proyecto").find('option:selected').data('headerid');
                getReporte(groupQuery, headerId);
            }
        });

        $('form[name="rechazoVideo"]').ajaxForm({
            beforeSubmit: function (formData, jqForm, options) {
                $.isLoading({
                    text: "Rechazando Video"
                });
            },
            error: function (error) {
                $.isLoading('hide');
            },
            success: function (responseText, statusText, xhr, $form) {
                $.isLoading('hide');
                swal("El Video Fue Rechazado", "You clicked the button!", "success");
                $("#modalRechazoVideo").modal('hide');
                //var groupQuery = $("li.active").attr("gruopquery");
                //var headerId = $("li.active").attr("headerId");
                var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                var headerId = $("#proyecto").find('option:selected').data('headerid');
                getReporte(groupQuery, headerId);
            }
        });

        $('form[name="formGestion"]').ajaxForm({
            beforeSubmit: function (formData, jqForm, options) {
                $.isLoading({
                    text: "Gestionando"
                });
            },
            error: function (error) {
                $.isLoading('hide');
            },
            success: function (responseText, statusText, xhr, $form) {
                $.isLoading('hide');
                $("#modalGestion").modal('hide');
                swal("El Sitio Fue Gestionado", "You clicked the button!", "success");
                //var groupQuery = $("li.active").attr("gruopquery");
                //var headerId = $("li.active").attr("headerId");
                var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                var headerId = $("#proyecto").find('option:selected').data('headerid');
                getReporte(groupQuery, headerId);
            }
        });

        $("#savePlan").click(function () {
            $("#formValidacion").ajaxSubmit({
                beforeSubmit: function (formData, jqForm, options) {
                    $("#savePlan").attr('disabled', 'disabled');
                    $.isLoading({
                        text: "Validando"
                    });
                },
                error: function (error) {
                    swal(error.statusText, error.error, "error");
                    $("#savePlan").prop('disabled', false);
                },
                success: function (responseText, statusText, xhr, $form) {
                    if (typeof responseText.error !== 'undefined') {
                        swal("ERROR", responseText.error, "error");
                        $.isLoading('hide');
                        return false;
                    }
                    $("#savePlan").prop('disabled', false);
                    $.isLoading('hide');
                    $('#modalDetail').modal('hide');
                    swal({title: "Sitio Validado Correctamente", text: "", type: "success"},
                            function () {
                            });

                    if (responseText.url != 'ok') {
                        window.open(responseText.url, '_blank');
                    }

                    //var groupQuery = $("li.active").attr("gruopquery");
                    //var headerId = $("li.active").attr("headerId");
                    var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                    var headerId = $("#proyecto").find('option:selected').data('headerid');
                    getReporte(groupQuery, headerId);
                }
            });
            return false;
        });

        $(".mainTab").live('click',function (){
            var idprocesos = $("li.active").attr("idprocesos");
            var proc =$(this).attr("idprocesos");
            //console.log("idprocesos: " + idprocesos);
            //console.log("proc: " + proc);
            $('#proyecto').select2("val",idprocesos);
        });

        $(".openModal").live('click', function () {

            var reporte_id = 0;
            var idproceso = $("#proyecto").val();
            if ($(this).hasClass('historial')) {
                var idticket = $(this).attr('id');
                reporte_id = 48;
                console.log(reporte_id,proyecto);
                $("#detalle").modal();
                $("#detalle .modal-body").empty();
                var data = {'reporte_id': reporte_id, 'ticket_id': idticket}
                $.getJSON('{{ path('reporteappenate_getDetalle') }}', data, function (data) {
                    $("#detalle .modal-body").html(createTableSimple(data.monitor));
                });
            } else {
                if (idproceso=='' || $("#validado").text()==0){
                    swal("Error!", "NO HAY SITIOS VALIDADOS", "error");
                    return false;
                }
                reporte_id = 49;
                console.log(reporte_id,proyecto);
                $("#detalle").modal();
                $("#detalle .modal-body").empty();
                var data = {'reporte_id': reporte_id, 'ticket_id': idticket,'idproceso':idproceso}
                $.getJSON('{{ path('reporteappenate_getDetalle') }}', data, function (data) {
                    $("#detalle .modal-body").html(createTableSimple(data.monitor));
                });
            }
        });

        $(".gestion").live('click', function () {


            var idticket = $(this).attr('id');
            $("#idticketGestion").val(idticket);
            $("#gestion").val("");
            $("#modalGestion").modal();


        });

        $(".validar").live('click', function () {
            var idestado = $(this).attr('idestado');
            var idticket = $(this).attr('id');
            //var idprocesos = $("li.active").attr("idprocesos");
            var idprocesos = $("#proyecto").val();

            $("#idticket").val(idticket);
            $("#idestado").val(idestado);
            $("#idprocesoGeneral").val(idprocesos);
            $("#modalDetail").modal();
            //$("#savePlan").click();

        });

        $(".trash").live('click', function () {
            $(this).parent().parent().remove();
        });

        $(".clone").live('click', function () {

            $("#" + $(this).attr('element')).clone().removeAttr('id').attr('class', 'row quitar').append(
                    '<label>&nbsp;</label><div class="col-lg-2"><a href="#" class="btn btn-danger fa fa-trash trash"></a></div>').appendTo("#" + $(this).attr('target'));

            $(".comentario").last().val("");
            return false;
        });

        $(".rechazar").live('click', function () {

            var idticket = $(this).attr('id');

            $("#idticketRechazo").val(idticket);
            $("#materialesContainer").children(":not(#primeraFila)").remove();
            $("#materialesContainer .quitar").remove();

            $(".descripcion_repuesto").find("option").remove();
            $(".repuesto").find("option").remove();
            $('.comentario').val("");
            //var idprocesos = $("li.active").attr("idprocesos");
            var idprocesos = $("#proyecto").val();


            var url = '{{ path('reporteappenate__getEntregableRechazoImp',{'idproyectos':idproyectos,'idproceso':'{parametro}'}) }}';

            var UrlProceso = url.replace('%7Bparametro%7D', idprocesos);

            $.ajax({
                url: UrlProceso,
                {#data: {'tipo':1,'categoria':61}#}
            }).done(function (data) {


                $('.descripcion_repuesto').append($("<option/>", {
                    value: " ",
                    text: " "
                }));

                $('.repuesto').append($("<option/>", {
                    value: " ",
                    text: " "
                }));
                for (var i = 0; i < data.length; i++) {
                    $('.descripcion_repuesto').append($("<option/>", {
                        value: data[i]['descripcion'],
                        text: data[i]['id']
                    }));
                    $('.repuesto').append($("<option/>", {
                        value: data[i]['id'],
                        text: data[i]['descripcion']
                    }));
                }

            });
            $("#modalRechazo").modal();

        });

        $(".rechazarVideo").live('click', function () {
            var idticket = $(this).attr('id');

            $("#idticketRechazoVideo").val(idticket);

            $("#modalRechazoVideo").modal();
        });

        $(".export").click(function () {

            $("#" + $(this).attr("idForm")).submit();

            return false;

        });

        var intervalTime = null;
        $("#autoload").click(function () {

            var time = parseInt($("#time").val());

            if ($(this).prop('checked')) {

                intervalTime = window.setInterval(getReporte, time);
            } else {

                clearInterval(intervalTime);
            }

        });

        function intervalReport(fun, time) {

        }

        $('.datepicker').datepicker({
            dateFormat: 'yy-mm-dd',
            maxDate: new Date(),
            defaultDate: new Date(),

        }).datepicker("setDate", new Date());

        $("#type").change(function () {


            if ($(this).val() == 1) {

                $("#chart1").show();

                $("#chart3").hide();

            } else {

                $("#chart1").hide();

                $("#chart3").show();
            }

        });
        var starYear = 2017;
        var d = new Date();
        var year = d.getFullYear();
        var month = new Array();

        $(".checklist").live('click', function () {


            window.location.href = $(this).attr('href');
        });

        for (var i = starYear; year >= i; i++) {
            $('#ano').append($("<option/>", {
                value: i,
                text: i
            }));

        }

        month[0] = "January";
        month[1] = "February";
        month[2] = "March";
        month[3] = "April";
        month[4] = "May";
        month[5] = "June";
        month[6] = "July";
        month[7] = "August";
        month[8] = "September";
        month[9] = "October";
        month[10] = "November";
        month[11] = "December";
        var n = month[d.getMonth()];
        var options = new Array();

        for (var i = 0; i < month.length; i++) {


            if (i <= d.getMonth()) {


                $('#mes').append($("<option/>", {
                    value: i + 1,
                    text: month[i]
                }));

            }
        }
        $("#ano").change(function () {

            var yearSelected = parseInt($(this).val());
            var semana = ISO8601_week_no(new Date());

            $('#mes').empty();

            for (var i = 0; i < month.length; i++) {
                if (yearSelected < year) {
                    $('#mes').append($("<option/>", {
                        value: i + 1,
                        text: month[i]
                    }));
                } else if (i <= d.getMonth()) {
                    $('#mes').append($("<option/>", {
                        value: i + 1,
                        text: month[i]
                    }));

                }
            }
            $('#semana').empty();

            if (yearSelected < year) {
                var semana = 52;
                for (var i = semana; i >= 1; i--) {

                    $('#semana').append($("<option/>", {
                        value: i,
                        text: i
                    }));
                }

            } else {

                for (var i = semana; i >= 1; i--) {

                    $('#semana').append($("<option/>", {
                        value: i,
                        text: i
                    }));
                }
            }


        });

        $("#tipoBusqueda").on('change load', function () {

            $(this).val() == 'mes' ? $("#mes").removeAttr('class', 'hide') : $("#mes").addClass('hide');
            $(this).val() == 'semana' ? $("#semana").removeAttr('class', 'hide') : $("#semana").addClass('hide');
            $(this).val() == 'dia' ? $("#dia").removeClass('hide') : $("#dia").addClass('hide');
        });

        $("#generar").click(function () {
            var alias = $("#proyecto").find('option:selected').data('alias');
            $('.mainTab a[href="#_' + alias + '"]').tab('show');
            if ($("#region").val() === "") {
                $("#region").css('border-color', 'red');
                return false;
            };

            $("#region").css('border-color', '#ccc');
            $.isLoading({
                text: "Loading"
            });
            var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
            var headerId = $("#proyecto").find('option:selected').data('headerid');
            //var groupQuery = $("li.active").attr("gruopquery");
            //var headerId = $("li.active").attr("headerId");
            getReporte(groupQuery, headerId);
        });
    });

    function getReporte(queryGroup, headerId){
        data = {};
        var tipo  = $("#tipoBusqueda").val();

        switch (tipo){
            case 'semana':
                data = {'semana': $("#semana").val()}
                break;
            case 'mes':
                data = {'mes' : $("#mes").val()}
                break;
            case 'dia':
                data = {'dia' : $("#dia").val()}
                break;
        }
        data['ano'] = $("#ano").val();
        data['grupoQuery'] = queryGroup;
        data['headerId'] = headerId;
        //data['proyecto'] = $("#proyecto").select2("val");
        data['region'] = $("#region").select2("val");
        id_region_global = parseInt($("#region").select2("val"));
        if($("#asignado").select2("val") != ""){
            data['asignado'] = $("#asignado").select2("val");
        };
        if($("#txtSitio").select2("val") != ""){
            /*var cad;
             var arr = $("#txtSitio").select2("val");

             for (var i=0; i<arr.length; i++){
             arr[i] = "'" + arr[i] + "'";
             }
             var cad = arr.join(",");
             data['sitio'] = cad;*/
            data['sitio'] = $("#txtSitio").select2("val");
        };

        var horaIni= new Date();
        console.log('BEGIN GET REPORTE: ' + horaIni);
        $.getJSON('{{ path('reporteappenate_getDetailValidacionVersion') }}', data, function (data) {
            horaIni= new Date();
            console.log('END GET REPORTE: ' + horaIni);
            var monitor = data.DETALLE;
            var validado = data.VALIDADOS[0].cantidad;
            var rechazado = data.RECHAZADOS[0].cantidad;
            var porValidar = data.POR_VALIDAR[0].cantidad;
            var entregablesRechazados = data.entregables;
            var targetReport = data.config[0].target_report;
            var isGestion = parseInt(data.config[0].is_gestion);
            var isVideoLlamada = parseInt(data.config[0].is_videollamada);
            var isValidated = parseInt(data.config[0].is_validate_other);
            var arrEtiquetas;

            if( data.hasOwnProperty('ETIQUETAS_VALIDABLES') ) {
                arrEtiquetas = data.ETIQUETAS_VALIDABLES;
            }
            if (arrEtiquetas==undefined){
                $("li.active").data("etiquetas",'');
            }else{
                $("li.active").data("etiquetas",arrEtiquetas);
            }

            $("#validado").text(validado);
            $("#rechazado").text(rechazado);
            $("#porValidar").text(porValidar);
            var flag = true;

            horaIni= new Date();
            console.log('INICIO PROCESAMIENTO: ' + horaIni);
            console.log(monitor.length);
            $(".reporte1").empty();
            if (monitor.length == 0) {
                $(".reporte1").empty();
                $("#chart1").empty();
                $("#chart2").empty();
                $(".reporte1").append('<div class="alert alert-warning text-center" role="alert">NO HAY SITIOS POR VALIDAR</div>');
                $.isLoading("hide");
                $("#inicio").show();
                return false;
            }

            if (entregablesRechazados.length > 0) {
                var headerEntregables = Object.keys(entregablesRechazados[0]);
                var entregableAux = new Array();
                var entregableAux2 = [];

                for (var i = 0; entregablesRechazados.length > i; i++) {
                    var objeto = {"ticket_id": entregablesRechazados[i]['ticket_id'], data: []};
                    for (var j = 1; headerEntregables.length > j; j++) {
                        if (entregablesRechazados[i][headerEntregables[j]] != 0) {
                            objeto.data.push(parseInt(entregablesRechazados[i][headerEntregables[j]]));
                        }
                    }
                    //entregableAux.push(objeto);
                    entregableAux['T' + entregablesRechazados[i]['ticket_id']] = objeto;
                }
                //console.log(entregableAux);
                //console.log('AHORA CON INDICE...');
                //console.log(entregableAux2);
            }
            var region = '{{ region }}';
            var objectType = {"9":1,"10":2,"11":3,"12":4,"13":5,"14":6};

            $("#" + targetReport + " .table1").empty();
            $("#" + targetReport).empty().append(createTable(
                    monitor,undefined,undefined,objectType,region,entregableAux,isGestion,
                    isVideoLlamada,isValidated));
            $('.double-scroll').doubleScroll();

            var pagerOptions = {
                // target the pager markup - see the HTML block below
                container: $(".pager"),
                // output string - default is '{page}/{totalPages}'; possible variables: {page}, {totalPages}, {startRow}, {endRow} and {totalRows}
                output: 'Rows : {endRow}',
                // if true, the table will remain the same height no matter how many records are displayed. The space is made up by an empty
                // table row set to a height to compensate; default is false
                fixedHeight: false,
                // remove rows from the table to speed up the sort of large tables.
                // setting this to false, only hides the non-visible rows; needed if you plan to add/remove rows with the pager enabled.
                removeRows: true,
                // go to page selector - select dropdown that sets the current page
                cssGoto: '.gotoPage'
            };
            // initial sort set using sortList option
            $(".table1").tablesorter({
                theme: 'blue',
                // sort on the first column and second column in ascending order
                widgets: ["zebra", "filter"],
                widgetOptions: {
                    // extra css class applied to the table row containing the filters & the inputs within that row
                    filter_cssFilter: '',
                    // If there are child rows in the table (rows with class name from "cssChildRow" option)
                    // and this option is true and a match is found anywhere in the child row, then it will make that row
                    // visible; default is false
                    filter_childRows: false,
                    // if true, filters are collapsed initially, but can be revealed by hovering over the grey bar immediately
                    // below the header row. Additionally, tabbing through the document will open the filter row when an input gets focus
                    filter_hideFilters: false,
                    // Set this option to false to make the searches case sensitive
                    filter_ignoreCase: true,
                    // jQuery selector string of an element used to reset the filters
                    filter_reset: '.reset',
                    // Use the $.tablesorter.storage utility to save the most recent filters
                    filter_saveFilters: true
                }
            }).tablesorterPager(pagerOptions);
            $(".pager").show();
            $("#inicio").show();
            $("#autoload").attr('disabled',false);
            $.isLoading('hide');
            horaIni= new Date();
            console.log('FIN DE PROCESAMIENTO: ' + horaIni);
            //$('#txtSitio').select2("val","");
            //$('#region').select2("val","");
        }).fail(function(){
            $.isLoading('hide');
        });
    }

    function createTable(monitor,total,nombreColTotal,type,region,entregableAux,isGestion,isVideoLlamada,isValidated){
        var headerAux = Object.keys(monitor[0]);
        var header = headerAux.filter(function(element){ return !element.startsWith('_')});
        var headerType = Object.keys(type);
        //var idProcesos = $("li.active").attr("idprocesos");
        var idProcesos = $("#proyecto").val();
        var table = '<table  class="table table-bordered table-hover table-striped table-responsive table1 table_' + idProcesos + '" ' +
                'id="tableSitios"> <thead>' +
                '<tr class="btn-info">';

        for (var j = 0; j < header.length; j++) {
            var h = header[j];
            if( j != 0 && !h.startsWith('_')){
                var s = h.trim();
                s = s.replace(' ','_');
                s = s.toUpperCase();
                table += "<th class='text-center " + s + "'>" + header[j] + "</th>"
            }
        }
        /* Columna Reporte x Sitio */
        table += "<th class='text-center'>" + "Excluir Entregables" + "</th>";

        if (isVideoLlamada){
            table += "<th class='text-center'>" + "Validar RSA" + "</th>";
            table += "<th class='text-center'>" + "Rechazar RSA" + "</th>";
        }

        table += "<th class='text-center' nowrap='nowrap'><input type='checkbox' " +
                "id='chkValAll_" + idProcesos + "' class='chkValAll'>&nbsp;" +
                "Validar<span id='countValAll_" + idProcesos + "'>" + "</span></th>";
        table += "<th class='text-center'>" + "Rechazar" + "</th>";
        table += "<th class='text-center'>" + "Historial" + "</th>";

        if (isGestion){
            table += "<th class='text-center'>" + "Gestion" + "</th>";
        }

        if(isValidated){
            table += "<th class='text-center'>" + "&nbsp;Validacion&nbsp;" + "</th>";
        }
        table += "</tr></thead>";
        table += "<tbody id='tbody_" + idProcesos + "'>";

        for (var i = 0; i < monitor.length; i++) {
            var aux;
            var clave = 'T' + monitor[i]['idticket'];

            if (entregableAux !== undefined){
                if (entregableAux[clave] !== undefined){
                    aux= entregableAux[clave]['data'];
                }else{
                    aux = undefined;
                }
            }

            //console.log(typeof(aux));
            /*if(monitor[i]['ESTADO'] == 'RECHAZADO'){

                /!*for(var k=0; entregableAux.length>k; k++){
                    if(monitor[i]['idticket'] == entregableAux[k]['ticket_id']){
                        aux = entregableAux[k]['data'];
                    }
                }*!/
                if (entregableAux['T' + monitor[i]['idticket']] !== undefined){
                    aux= entregableAux['T' + monitor[i]['idticket']]['data'];
                }
                //console.log('aux:' + aux);
            }
*/
            table += "<tr id='"+ monitor[i][header[0]] + "'>";
            for (var j = 0; j < header.length; j++) {
                var clases = '';
                var estilo="";
                if( $.inArray(j,headerType)){
                    var typeString = 'id="' + type[j] + '"';
                }

                if( j != 0) {
                    if (j>2){
                       estilo = " style='text-align:center;' ";
                    }
                    if(monitor[i][header[4]] == 'RECHAZADO'){
                        if(aux !== undefined && aux.indexOf(j)> -1){
                            clases = "class='btn-danger'";
                        }
                    }else if(j==17 || j==7) {
                        if(aux !== undefined && aux.indexOf(j)> -1){
                            clases = "class='btn-danger'";
                        }
                    }
                    table += "<td " + clases + typeString + estilo + " >" + monitor[i][header[j]] + "</td>";
                }

                if(j ==header.length -1){

                    {% if is_granted('ROLE_VALIDACION_CLIENTE_1') %}
                    {% if is_granted('ROLE_VALIDACION_CLIENTE_2') %}
                    /* Columna Reporte x Sitio */
                    table += '<td class="text-center" nowrap="nowrap" valign="middle" style="vertical-align: middle">' +
                            '<a class="btn btn-danger btn-sm" data-idticket="' + monitor[i][header[0]] +  '" ' +
                            ' href="javascript://" onClick="showSelectDeliverables(this);">' +
                            '<span title="Seleccionar Entregables" style="padding-left: 5px;" class="glyphicon glyphicon-list" aria-hidden="true"></span>&nbsp;Excluir</a>' +
                            '</td>';
                        if( isVideoLlamada){

                            var disabled="";
                            if(monitor[i][header[4]]=="VIDEOLLAMADA VALIDADA"){
                                disabled="disabled";
                            }
                            table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" idestado="3229" id=' + monitor[i][header[0]] + ' class="btn btn-success  btn-sm  validar">Validar RSA</button>' + "</td>";
                            table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] + ' class="btn btn-danger  btn-sm rejectVideoLlamada rechazarVideo '+disabled+'">Rechazar RSA</button>' + "</td>";
                        }
                        table += "<td class='text-center' style='vertical-align: middle' nowrap='nowrap'><input type='checkbox' name='chkValidar_" + idProcesos + "' idestado='2667' idt='" + monitor[i][header[0]] + "'>&nbsp;&nbsp;" +
                                '<button type="button" idestado="2667" id=' + monitor[i][header[0]] +  '" class="btn btn-success btn-sm validar">Validar</button>' + "</td>";
                        table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] +  '" class="btn btn-danger  btn-sm rechazar">Rechazar</button>' + "</td>";
                        table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] +  ' class="btn btn-default btn-sm openModal historial">Historial</button>' + "</td>";

                        if(isGestion) {
                            table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] + ' class="btn btn-info btn-sm gestion">Gestion</button>' + "</td>";
                        }

                        if(isValidated) {
                            var N_A = (idproceso=160) ? 'N/A' : '';
                        var valueAlarmas = (monitor[i]['_VALUE_ALARMA_EXTERIOR']==undefined ? '' : monitor[i]['_VALUE_ALARMA_EXTERIOR']);
                        var commentAlarmRO = '';
                        var commentAlarm = (monitor[i]['_COMENTARIO_ALARMA_EXTERIOR']==undefined ? '' : monitor[i]['_COMENTARIO_ALARMA_EXTERIOR']);
                        var respAlarm = (monitor[i]['_RESPONSABLE_ALARMA_EXTERIOR']==undefined ? '' : monitor[i]['_RESPONSABLE_ALARMA_EXTERIOR']);
                        var valueBaseline = (monitor[i]['_VALUE_BASELINE']==undefined ? '' : monitor[i]['_VALUE_BASELINE']);
                        var commentBaselineRO = '';
                        var commentBaseline = (monitor[i]['_COMENTARIO_BASELINE']==undefined ? '' : monitor[i]['_COMENTARIO_BASELINE']);
                        var respBaseline = (monitor[i]['_RESPONSABLE_BASELINE']==undefined ? '' : monitor[i]['_RESPONSABLE_BASELINE']);
                        var valueSRS = (monitor[i]['_VALUE_SRS']==undefined ? '' : monitor[i]['_VALUE_SRS']);
                        var commentSRSRO = '';
                        var commentSRS = (monitor[i]['_COMENTARIO_SRS']==undefined ? '' : monitor[i]['_COMENTARIO_SRS']);
                        var respSRS = (monitor[i]['_RESPONSABLE_SRS']==undefined ? '' : monitor[i]['_RESPONSABLE_SRS']);
                        var valueB158 = (monitor[i]['_VALUE_B158']==undefined ? N_A : monitor[i]['_VALUE_B158']);
                        var commentB158 = (monitor[i]['_COMENTARIO_B158']==undefined ? '' : monitor[i]['_COMENTARIO_B158']);
                        var respB158 = (monitor[i]['_RESPONSABLE_B158']==undefined ? '' : monitor[i]['_RESPONSABLE_B158']);
                        var buttonDisabled = '';
                        /*if(monitor[i]['ALARMAS VALIDADAS'] === 'SI' || monitor[i]['ALARMAS VALIDADAS'] === 'N/A'){
                            checkAlarmas = 'CHECKED disabled="disabled"';
                            commentAlarmRO = ' readonly="readonly" ';
                        }
                        if(monitor[i]['BASELINE VALIDADO'] === 'SI' || monitor[i]['BASELINE VALIDADO'] === 'N/A'){
                            checkbaseline = 'CHECKED disabled="disabled"';
                            commentBaselineRO = ' readonly="readonly" ';
                        }
                        if(monitor[i]['SRS VALIDADO'] === 'SI' || monitor[i]['SRS VALIDADO'] === 'N/A'){
                            checksrs = 'CHECKED disabled="disabled"';
                            commentSRSRO = ' readonly="readonly" ';
                        }
                        if(monitor[i]['ALARMAS VALIDADAS'] === 'SI' && monitor[i]['BASELINE VALIDADO'] === 'SI' && monitor[i]['SRS VALIDADO'] === 'SI'){
                            buttonDisabled = 'disabled';
                        }*/
                        table +='<td class="text-center" nowrap="nowrap" valign="middle" style="vertical-align: middle">' +
                                '<button type="button" class="btn btn-success  btn-sm btnValExtra" aria-label="Validación Extra" title="Validación Extra" ' +
                                'id="btnValExtra_' + idProcesos + '_' +  monitor[i][header[0]] + '" ' +
                                'data-idticket="' + monitor[i][header[0]] +  '" ' +
                                'data-val_alarmas="' + valueAlarmas +  '" ' +
                                'data-val_baseline="' + valueBaseline +  '" ' +
                                'data-val_srs="' + valueSRS +  '" ' +
                                'data-val_b158="' + valueB158 +  '" ' +
                                'data-com_alarmas="' + commentAlarm +  '" ' +
                                'data-resp_alarmas="' + respAlarm +  '" ' +
                                'data-com_baseline="' + commentBaseline +  '" ' +
                                'data-resp_baseline="' + respBaseline +  '" ' +
                                'data-com_b158="' + commentB158 +  '" ' +
                                'data-resp_b158="' + respB158 +  '"' +
                                'data-com_srs="' + commentSRS +  '" ' +
                                'data-resp_srs="' + respSRS +  '">' +                                
                                '<span title="Validación Extra" style="padding-left: 5px;" class="glyphicon glyphicon-check" aria-hidden="true"></span>' +
                                '</button></td>';

                        /*var old = '<form METHOD="POST" name="validacionOtros" id="validacionOtros" action="{{path('insertTicketDatos',{'idproyectos':idproyectos})}}" >' +
                                '<div class="dropdown">'+
                                '<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">'+
                                '    <i class="glyphicon glyphicon-cog"></i>'+
                                '    <span class="caret"></span>'+
                                '</button>'+
                                '<ul class="dropdown-menu pull-right checkbox-menu allow-focus" aria-labelledby="dropdownMenu1" style="width: 400px;">'+
                                '   <li>'+
                                '       <label>'+
                                '           <input type="checkbox"  class="all" id=chkValOtro_' + monitor[i][header[0]] + '> TODOS'+
                                '       </label>'+
                                '   </li>'+
                                '   <li >'+
                                '       <label>'+
                                '           <input type="checkbox" id=' + monitor[i][header[0]] + ' class="validarExtra" name="valueCheckbox[]" value="212" '+checkAlarmas+'> ALARMAS EXTERNAS'+
                                '           <textarea placeholder="Comentarios..." rows="1" style="width: 50%;vertical-align:bottom;" id="com_alarm_ext_' + monitor[i][header[0]] +
                                '                " name="com_alarm_ext"' + commentAlarmRO + '>' + commentAlarm +'</textarea>' +
                                '           <input type="hidden" name="idticket" value="' + monitor[i][header[0]] + '">'+
                                '       </label>'+
                                '   </li>'+
                                '   <li >'+
                                '       <label>'+
                                '           <input type="checkbox" id=' + monitor[i][header[0]] + ' class="validarExtra" name="valueCheckbox[]" value="213" '+checkbaseline+'> BASELINE'+
                                '           <textarea placeholder="Comentarios..." rows="1" style="width: 50%; vertical-align:bottom;" id="com_baseline_' + monitor[i][header[0]] +
                                '                " name="com_baseline"' + commentBaselineRO + ' >' + commentBaseline +'</textarea>' +
                                '       </label>'+
                                '   </li>'+
                                '   <li >'+
                                '       <label>'+
                                '           <input type="checkbox"  id=' + monitor[i][header[0]] + ' class="validarExtra" name="valueCheckbox[]" value="214" '+checksrs+'> SRS'+
                                '           <textarea placeholder="Comentarios..." rows="1" style="width: 50%; vertical-align:bottom;" id="com_srs' + monitor[i][header[0]] +
                                '                " name="com_srs"' + commentSRSRO + '>' + commentSRS +'</textarea>' +
                                '       </label>'+
                                '   </li>'+
                                '   <li >'+
                                '       <label>'+
                                '           <button type="button" class="btn btn-primary" id="saveValidarExtra"  '+buttonDisabled+'>Guardar</button>'+
                                '       </label>'+
                                '   </li>'+
                                '</ul>'+
                                '</div>'+
                                '</form>' +
                                "</td>";*/
                    }

                    {% else %}
                        if(monitor[i][header[3]] == region){
                                if( isVideoLlamada){

                                var disabled="";
                                if(monitor[i][header[5]]=="VIDEOLLAMADA VALIDADA"){
                                    disabled="disabled";
                                }
                                table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" idestado="3229" id=' + monitor[i][header[0]] + ' class="btn btn-success validar">Validar RSA</button>' + "</td>";
                                table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] + ' class="btn btn-danger rejectVideoLlamada rechazarVideo '+disabled+'">Rechazar RSA</button>' + "</td>";
                            }
                            table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button"  idestado="2667" id=' + monitor[i][header[0]] +  '" class="btn btn-success validar">Validar</button>' + "</td>";
                            table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] +  '" class="btn btn-danger rechazar">Rechazar</button>' + "</td>";
                            table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] +  ' class="btn btn-default openModal historial">Historial</button>' + "</td>";
                        }else{
                            table += "<td class='text-center'></td>";
                            table += "<td class='text-center'></td>";
                            table += "<td class='text-center'></td>";
                            table += "<td class='text-center'></td>";
                            table += "<td class='text-center' style='vertical-align: middle'>" + '<button type="button" id=' + monitor[i][header[0]] +  ' class="btn btn-default openModal historial">Historial</button>' + "</td>";
                        }
                    {% endif %}

                    {% else %}
                    table += "<td class='text-center'></td>";
                    table += "<td class='text-center'></td>";
                    {% endif %}
                }
            } //Fin del for (var j = 0; j < header.length; j++)
            table += "</tr>";

            if(typeof total !== "undefined") {
                if (i == monitor.length - 1) {
                    var headerTotal = Object.keys(total);
                    table += '<tr><td>' + nombreColTotal +'</td>';

                    for(var x=0; x<headerTotal.length;x++){
                        table += '<td>';
                        table += total[headerTotal[x]];
                        table += '</td>';
                    }
                    table += '</tr>';
                }
            }
        }
        table += "</tbody></table>";
        return table;
    }

    function createTableSimple(monitor,total,nombreColTotal){

        var header = Object.keys(monitor[0]);

        var table = '<table id="tableSitios"  class="table table-bordered table-hover table-striped table-responsive"> <thead>' +

                '<tr class="btn-info">';

        for (var j = 0; j < header.length; j++) {


            table += "<th class='text-center'>" + header[j] + "</th>"



        }
        table += "</tr></thead>";

        for (var i = 0; i < monitor.length; i++) {
            table += "<tr>";
            for (var j = 0; j < header.length; j++) {
                if( typeof monitor[i][header[j]] === 'object'){
                    table += "<td>" + monitor[i][header[j]].date.substring(0,19)  + "</td>";
                }else{
                    table += "<td>" + monitor[i][header[j]]  + "</td>";
                }

            }
            table += "</tr>";

            if(typeof total !== "undefined") {

                if (i == monitor.length - 1) {

                    var headerTotal = Object.keys(total);
                    table += '<tr><td>' + nombreColTotal +'</td>';

                    for(var x=0; x<headerTotal.length;x++){
                        table += '<td>';
                        table += total[headerTotal[x]];

                        table += '</td>';

                    }
                    table += '</tr>';
                }
            }
        }
        table += "</table>";

        return table;
    }

    function ISO8601_week_no(dt){
        var tdt = new Date(dt.valueOf());
        var dayn = (dt.getDay() + 6) % 7;
        tdt.setDate(tdt.getDate() - dayn + 3);
        var firstThursday = tdt.valueOf();
        tdt.setMonth(0, 1);
        if (tdt.getDay() !== 4)
        {
            tdt.setMonth(0, 1 + ((4 - tdt.getDay()) + 7) % 7);
        }
        return 1 + Math.ceil((firstThursday - tdt) / 604800000);
    }

    function getTotal(valor,key,tipo)
    {
        var total = new Array();

        var header = Object.keys(valor[0]);


        for(var i = 0; i< valor.length;i++){

            for(var j = 0; j< key.length;j++){

                if(typeof total[key[j]] === "undefined"){
                    total[key[j]] = 0;
                }

                if (tipo==1){
                    total[key[j]] +=  parseFloat(valor[i][header[key[j]]]);
                    if (i == (valor.length-1)) total[key[j]]=parseFloat(total[key[j]]).toPrecision(3);
                    //alert(total[key[j]]);
                }
                else
                    total[key[j]] +=  parseInt(valor[i][header[key[j]]]);
            }

        }
        return total;
    }


    function showSelectDeliverables(id){
        var idticket = $(id).data('idticket');
        var idproyectos = {{ idproyectos }};
        //var idprocesos = $("li.active").attr("idprocesos");
        var idprocesos = $("#proyecto").val();
        var idEtiquetas = getListEtiquetas();


        $('#txtIdTicket').val(idticket);
        var postData = {
            idproyectos: idproyectos,
            idproceso: idprocesos,
            idticket: idticket,
            idetiquetas: idEtiquetas
        };
        $.ajax({
            type: 'POST',
            url: "{{ path('reporteappenate_getAppenateListDeliverablesByProject') }}",
            data: postData,
            dataType: 'json',
            beforeSend: function (){
                $('#divLoadingModal').show();
                $('#divLoadingModal').html('<strong>Cargando lista de Reportes...</strong>');
                $('#bodyTableEntregables').empty();
                $('#btnSaveSelectDeliverables').prop('disabled', true);
            },
            success: function (r) {
                if (r){
                    var str = "";
                    var ent = r.entregables;
                    var ext = r.extra;
                    for (var i=0; i<ent.length; i++){
                        var check = ent[i]['valor_aplica']=='1' ? 'checked' : '';
                        var disabled = '';

                        str += "<tr>" +
                                "<td class='text-left'" + " style='font-weight: normal'>" + ent[i]['nombre_entregable'] + "</td>" +
                                "<td class='text-center'>" +
                                "<input tipo='" + ent[i]['tipo'] + "' type='checkbox' id='chk_" + idticket + "_" + ent[i]['id_entregable'] + "' " +
                                "name='chkAplicaEntregable[]' " +
                                "value='" + ent[i]['id_entregable'] + "' " +
                                "id_ticket_entregable='" + ent[i]['id_ticket_entregable'] + "' " +
                                "valor_texto='' " +
                                "valor_old='" + ent[i]['valor_aplica'] + "' " + disabled + " " +
                                check + "></td>" +
                                "</tr>";
                    }
                    str += "";
                    $('#bodyTableEntregables').empty().append(str);
                    var strOther = "<tr class='info'><td class='text-left'><strong>Ítem</strong></td><td class='text-center'><strong>No Aplica</strong></td></tr>";
                    var str2 = "";
                    for (var i=0; i<ext.length; i++){
                        var check = ext[i]['valor_aplica']=='1' ? 'checked' : '';
                        var disabled = '';

                        str2 += "<tr>" +
                                "<td class='text-left'" + " style='font-weight: normal'>" + ext[i]['nombre_etiqueta'] + "</td>" +
                                "<td class='text-center'>" +
                                "<input tipo='" + ext[i]['tipo'] + "' type='checkbox' id='chk_" + idticket + "_" + ext[i]['idetiquetas'] + "' " +
                                "name='chkAplicaEntregable[]' " +
                                "value='" + ext[i]['idetiquetas'] + "' " +
                                "id_ticket_entregable='" + ext[i]['idticket'] + "' " +
                                "valor_texto='" + ext[i]['valor'] + "' " +
                                "valor_old='" + ext[i]['valor_aplica'] + "' " + disabled + " " +
                                check + "></td>" +
                                "</tr>";
                    }
                    if (str2!=""){
                        $('#bodyTableEntregables').append(strOther + str2);
                    }

                    $('#divLoadingModal').hide();
                    $('#divLoadingModal').html('');
                    $('#btnSaveSelectDeliverables').prop('disabled', false);
                }else{
                    $('#divLoadingModal').hide();
                    $('#divLoadingModal').html('');
                    $('#btnSaveSelectDeliverables').prop('disabled', false);
                    return false;
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                $('#divLoadingModal').hide();
                $('#divLoadingModal').html('');
                $('#bodyTableEntregables').empty();
                $('#btnSaveSelectDeliverables').prop('disabled', false);
            }
        });

        $("#modalSelectDeliverables").modal('show');
    }

    $(".validarMasivo").live('click', function () {
        var max_num_validation = 1000;
        //var idprocesos = $("li.active").attr("idprocesos");
        var idprocesos = $("#proyecto").val();
        //console.log(idprocesos);
        var idTbody = 'tbody_' + idprocesos;
        var elem = '#' + idTbody + ' input[name=chkValidar_' + idprocesos + ']:checked';
        var n = 0;
        console.log('proceso: ' + idprocesos);
        var arr = [];
        $(elem).each(function(){
            n+=1;
        });

        if (n > 0 && n<= max_num_validation){
            $('#txtProcesoBatch').val(idprocesos);
            $('#txtPwdBatch').val('');
            hideControls(false);
            $('#div_batch_valid_initializing').css('display','none');
            $('#sending').css('display','none');
            lockButtons(false);
            $("#modalDetailBatch").modal('show');
        }else if (n<=0){
            alert('No ha seleccionado ítems a validar!!!');
        }else if(n>max_num_validation){
            alert('El Nro. máximo de ítems a seleccionar es ' + max_num_validation + '.');
        }
    });

    $('.validarMasivoATP').live("click", function () {
        var idproyectos = {{ idproyectos }};
        //var idprocesos = $("li.active").attr("idprocesos");
        var idprocesos = $("#proyecto").val();
        $('#txtProyecto').val(idproyectos);
        $('#txtProceso').val(idprocesos);
        $('#msjFileUpload').empty().hide();
        $('#modalfileUpload').modal('show');
    });

    $('.validarMasivoVL').live("click", function () {
        var idproyectos = {{ idproyectos }};
        //var idprocesos = $("li.active").attr("idprocesos");
        var idprocesos = $("#proyecto").val();
        $('#txtProyecto').val(idproyectos);
        $('#txtProceso').val(idprocesos);
        $('#msjFileUpload').empty().hide();
        $('#modalfileUploadVL').modal('show');
    });

    $("#saveBatchValidation").live('click', function (){
        //var idprocesos = $("li.active").attr("idprocesos");
        var idprocesos = $("#proyecto").val();
        //var groupQuery = $("li.active").attr("gruopquery");
        //var headerId = $("li.active").attr("headerId");
        var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
        var headerId = $("#proyecto").find('option:selected').data('headerid');
        console.log(groupQuery,headerId);
        console.log($("#proyecto").find('option:selected'));
        var tagfile = $("#proyecto").find('option:selected').data('tagfile');//$("li.active").attr("tagFile");
        var idd = $("#proyecto").find('option:selected').data('idd');//$("li.active").attr("idd");
        console.log(tagfile,idd);
        var cmbProy = $("#proyecto").select2("data");
        var nombre_proyecto = cmbProy['text'];
        var idregion = id_region_global;
        var idTbody = 'tbody_' + idprocesos;
        var elem = '#' + idTbody + ' input[name=chkValidar_' + idprocesos + ']:checked';
        var pass = $('#txtPwdBatch').val();

        /*console.log('idproceso: ' + idprocesos);
        console.log('groupQuery: ' + groupQuery);
        console.log('headerId: ' + headerId);
        console.log('tagfile: ' + tagfile);
        console.log('idd: ' + idd);
        console.log('cmbProy: ' + cmbProy);
        console.log('nombre_proyecto: ' + nombre_proyecto);
        console.log('idregion: ' + id_region_global);
        console.log('dTbody: ' + idTbody);
        console.log('elem: ' + elem);*/
        //return false;

       var arr = [];
        $(elem).each(function(){
            var arrDatos = {};
            arrDatos = {
                id_ticket: $(this).attr('idT'),
                id_estado: $(this).attr('idestado')
             };
             arr.push(arrDatos);
        });

        if (arr.length > 0){
            $.confirm({
                icon: 'glyphicon glyphicon-question-sign',
                title: 'Validación de Sitios',
                content: arr.length + ' ítems a procesar. ¿Desea validar?',
                confirmButton: 'Si',
                cancelButton: 'No',
                confirmButtonClass: 'btn-success',
                cancelButtonClass: 'btn-default',
                confirm: function () {
                    hideControls(true);
                    $('#div_batch_valid_initializing').css('display','block');
                    showInitializing('loading','Inicializando el proceso de validación...');
                    initProgressBar({'num_registros':0, 'registros_procesados':0, 'percentage':0.00},false);
                    lockButtons(true);
                    $.ajax({
                        type: 'POST',
                        url: "{{ path('reporteappenate_saveBatchJobValidation',{'idproyectos':idproyectos,'idmodule':idmodule}) }}",
                        data: {
                            'etapa': 'initializing',
                            'arr_data': JSON.stringify(typeof(arr) === 'object' ? Object.values(arr) : arr),
                            'url': '{{ app.request.pathinfo }}',
                            'ruta': "{{ app.request.get('_route') }}",
                            'idproyectos': {{ idproyectos }},
                            'idmodule': {{ idmodule }},
                            'idprocesos' : idprocesos,
                            'idgroupquery': groupQuery,
                            'idheader': headerId,
                            'tagfile':  tagfile,
                            'idd': idd,
                            'nombreproyecto':  nombre_proyecto,
                            'idregion': idregion,
                            'pwd': pass
                        },
                        dataType: 'json',
                        success: function (response) {
                            switch (response.status){
                                case 'success':
                                    console.log(response);
                                    showInitializing('success','Inicialización de Validación completada!!!');
                                    msjInfoValidacion(response.data);
                                    initProgressBar(response.data,true);
                                    executeValidation(response.data);
                                    break;
                                case 'error':
                                    console.log(response);
                                    if (response.msj=='Password Incorrecto'){
                                        hideControls(false);
                                        $('#div_batch_valid_initializing').css('display','none');
                                        $('#sending').css('display','none');
                                        lockButtons(false);
                                        swal({title: 'Error', text: response.msj, type: "error"})
                                    }else{
                                        screenMsgBox("#modalDetailBatch", "Error", response.msj, "error");
                                    }
                                    break;
                                case 'warning':
                                    console.log(response);
                                    var region = $("#region").find("option[value='" + response.data.id_region + "']").text();
                                    showInitializing('warning',response.msj +
                                            "Proyecto: " + response.data.nombre_proyecto + " " + region + ".");
                                    msjInfoValidacion(response.data);
                                    initProgressBar(response.data,true);
                                    executeValidation(response.data);
                                    break;
                            }
                        },
                        error: function (jqXHR, textStatus, errorThrown) {
                            screenMsgBox("#modalDetailBatch", "Error", "Errores al Inicializar Validación", "error");
                        }
                    });
                },
                cancel: function () {
                    $.isLoading("hide");
                    // $.alert('Cancel!');
                }
            });
        }else{
            alert('No seleccionó ítems a validar!!!');
            $("#modalDetailBatch").modal('hide');
        }
    });

    function initCmbValExtra(idElement, value){
        if (value=='N/A'){
            $('#' + idElement).empty().append("<option value='N/A'>N/A</option>").val(value);
        }else{
            var lst = "<option value=''>SELECT</option>" +
                      "<option value='SI'>SI</option>" +
                      "<option value='NO'>NO</option>" +
                      "<option value='NO OK'>NO OK</option>";
            $('#' + idElement).empty().append(lst);
            $('#' + idElement).val(value);
        }
    }

    $(".btnValExtra").live('click', function(){
        var idticket = $(this).data('idticket');
        var valueAlarm = $(this).data('val_alarmas');
        var valueBaseline = $(this).data('val_baseline');
        var valueSRS = $(this).data('val_srs');
        var valueB158 = $(this).data('val_b158');
        var commentAlarm = $(this).data('com_alarmas');
        var respAlarm = $(this).data('resp_alarmas');
        var commentBaseline = $(this).data('com_baseline');
        var respBaseline = $(this).data('resp_baseline');
        var commentSRS = $(this).data('com_srs');
        var respSRS = $(this).data('resp_srs');
        var commentB158 = $(this).data('com_b158');
        var respB158 = $(this).data('resp_b158')

        $('#valExtra_txtIdTicket').val(idticket);
        //$('#valExtra_chkOldAlarmas').val(valueAlarm);
        $('#valExtra_cmbOldAlarmas').val(valueAlarm);
        //$('#valExtra_chkOldBaseline').val(valueBaseline);
        $('#valExtra_cmbOldBaseline').val(valueBaseline);
        //$('#valExtra_chkOldSRS').val(valueSRS);
        $('#valExtra_cmbOldSRS').val(valueSRS);
        $('#valExtra_cmbOldB158').val(valueB158);
        $('#valExtra_txtOldAlarmas').val(commentAlarm);
        $('#valExtra_txtOldBaseline').val(commentBaseline);
        $('#valExtra_txtOldSRS').val(commentSRS);
        $('#valExtra_txtOldB158').val(commentB158);

        //$('#chkValExtraAlarmas').prop("checked", valueAlarm=='SI').prop("disabled", valueAlarm=='N/A');
        initCmbValExtra('cmbValExtraAlarmas',valueAlarm);
        $('#txtValExtraAlarmas').val(commentAlarm).prop("disabled", valueAlarm=='N/A');
        $('#txtValExtraAlarmasResp').val(respAlarm).prop("disabled", valueAlarm=='N/A');

        //$('#chkValExtraBaseline').prop("checked", valueBaseline=='SI').prop("disabled", valueBaseline=='N/A');
        initCmbValExtra('cmbValExtraBaseline',valueBaseline);
        $('#txtValExtraBaseline').val(commentBaseline).prop("disabled", valueBaseline=='N/A');
        $('#txtValExtraBaselineResp').val(respBaseline).prop("disabled", valueBaseline=='N/A');

        //$('#chkValExtraSRS').prop("checked", valueSRS=='SI').prop("disabled", valueSRS=='N/A');
        initCmbValExtra('cmbValExtraSRS',valueSRS);
        $('#txtValExtraSRS').val(commentSRS).prop("disabled", valueSRS=='N/A');
        $('#txtValExtraSRSResp').val(respSRS).prop("disabled", valueSRS=='N/A');

        initCmbValExtra('cmbValExtraB158',valueB158);
        $('#txtValExtraB158').val(commentB158).prop("disabled", valueB158=='N/A');
        $('#txtValExtraB158Resp').val(respB158).prop("disabled", valueB158=='N/A');

        //$('#chkValExtraAll').prop("checked", valueAlarm=='SI' && valueBaseline=='SI' && valueSRS=='SI');

        $("#modalValidacionExtra").modal('show');
    });

    $("#btnSaveValidacionExtra").live('click', function (){
        var idproyectos = {{ idproyectos }};
        var idticket = $('#valExtra_txtIdTicket').val();
        //var valueAlarm = $('#chkValExtraAlarmas').is(':disabled') ? 'N/A' : $('#chkValExtraAlarmas').is(':checked') ? 'SI':'NO';
        var valueAlarm = $('#cmbValExtraAlarmas').val();
        //var valueBaseline = $('#chkValExtraBaseline').is(':disabled') ? 'N/A' : $('#chkValExtraBaseline').is(':checked') ? 'SI':'NO';
        var valueBaseline = $('#cmbValExtraBaseline').val();
        //var valueSRS = $('#chkValExtraSRS').is(':disabled') ? 'N/A' : $('#chkValExtraSRS').is(':checked') ? 'SI':'NO';
        var valueSRS = $('#cmbValExtraSRS').val();
        var valueB158 = $('#cmbValExtraB158').val();
        var commentAlarm = $('#txtValExtraAlarmas').val();
        var respAlarm = $('#txtValExtraAlarmasResp').val();
        var commentBaseline = $('#txtValExtraBaseline').val();
        var respBaseline = $('#txtValExtraBaselineResp').val();
        var commentSRS = $('#txtValExtraSRS').val();
        var respSRS = $('#txtValExtraSRSResp').val();
        var commentB158 = $('#txtValExtraB158').val();
        var respB158 = $('#txtValExtraB158Resp').val();
        var arr = [];

        arrDatos = {
            id_etiqueta: $('#cmbValExtraAlarmas').data('etiqueta'),
            checked_old: $('#valExtra_cmbOldAlarmas').val(),
            checked_new: valueAlarm,
            id_etiqueta_comment: $('#txtValExtraAlarmas').data('idvalue'),
            comment_old: $('#valExtra_txtOldAlarmas').val(),
            id_etiqueta_resp: $('#txtValExtraAlarmasResp').data('idvalue'),
            comment_new: commentAlarm,
            resp_new: respAlarm
        };
        arr[0] = arrDatos;
        arrDatos = {
            id_etiqueta: $('#cmbValExtraBaseline').data('etiqueta'),
            checked_old: $('#valExtra_cmbOldBaseline').val(),
            checked_new: valueBaseline,
            id_etiqueta_comment: $('#txtValExtraBaseline').data('idvalue'),
            comment_old: $('#valExtra_txtOldBaseline').val(),
            comment_new: commentBaseline,
            id_etiqueta_resp: $('#txtValExtraBaselineResp').data('idvalue'),
            resp_new: respBaseline
        };
        arr[1] = arrDatos;
        arrDatos = {
            id_etiqueta: $('#cmbValExtraSRS').data('etiqueta'),
            checked_old: $('#valExtra_cmbOldSRS').val(),
            checked_new: valueSRS,
            id_etiqueta_comment: $('#txtValExtraSRS').data('idvalue'),
            comment_old: $('#valExtra_txtOldSRS').val(),
            comment_new: commentSRS,
            id_etiqueta_resp: $('#txtValExtraSRSResp').data('idvalue'),
            resp_new: respSRS
        };
        arr[2] = arrDatos;

        arrDatos = {
            id_etiqueta: $('#cmbValExtraB158').data('etiqueta'),
            checked_old: $('#valExtra_cmbOldB158').val(),
            checked_new: valueB158,
            id_etiqueta_comment: $('#txtValExtraB158').data('idvalue'),
            comment_old: $('#valExtra_txtOldB158').val(),
            id_etiqueta_resp: $('#txtValExtraB158Resp').data('idvalue'),
            resp_new: respB158
        };
        arr[3] = arrDatos;

        if (arr[0]['checked_new']=='' || arr[1]['checked_new']=='' || arr[2]['checked_new']=='' || arr[3]['checked_new']==''){
            alert('Seleccione un valor de la lista de opciones!!!');
            return false;
        }else if (arr[0]['checked_old']==arr[0]['checked_new'] && arr[0]['comment_old']==arr[0]['comment_new']
           && arr[1]['checked_old']==arr[1]['checked_new'] && arr[1]['comment_old']==arr[1]['comment_new']
           && arr[2]['checked_old']==arr[2]['checked_new'] && arr[2]['comment_old']==arr[2]['comment_new']
           && arr[3]['checked_old']==arr[3]['checked_new'] && arr[3]['comment_old']==arr[3]['comment_new']){
            alert('No se han detectado cambios!!!');
            return false;
        }else{
            $.confirm({
                icon: 'glyphicon glyphicon-question-sign',
                title: 'Validación Extra',
                content: '¿Desea grabar los cambios?',
                confirmButton: 'Si',
                cancelButton: 'No',
                confirmButtonClass: 'btn-success',
                cancelButtonClass: 'btn-default',
                confirm: function () {
                    $.isLoading({text: "Grabando los cambios..." });
                    $.ajax({
                        type: 'POST',
                        url: "{{path('insertTicketDatosExtraDbtt',{'idproyectos':idproyectos})}}",
                        data: {
                            'arr_data': JSON.stringify(typeof(arr) === 'object' ? Object.values(arr) : arr),
                            'idproyectos': {{ idproyectos }},
                            'idticket' : idticket
                        },
                        dataType: 'json',
                        success: function (response) {
                            switch (response.status){
                                case 'ok':
                                    $.isLoading("hide");
                                    $('#modalValidacionExtra').modal('hide');
                                    swal("Información","Validación Extra Procesada!").then(function(){
                                        refrescarValoresExtra(response.idticket,response.data);
                                    });
                                    break;

                                case 'error':
                                    $.isLoading("hide");
                                    $('#modalValidacionExtra').modal('hide');
                                    swal("Información","Error en Validación Extra!!!");
                                    //var groupQuery = $("li.active").attr("gruopquery");
                                    //var headerId = $("li.active").attr("headerId");
                                    var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                                    var headerId = $("#proyecto").find('option:selected').data('headerid');
                                    getReporte(groupQuery, headerId);
                                    break;
                                default:
                                    $.isLoading("hide");
                                    $('#modalValidacionExtra').modal('hide');
                                    swal("Información","Error en Validación Extra!!!");
                                    var groupQuery = $("li.active").attr("gruopquery");
                                    var headerId = $("li.active").attr("headerId");
                                    getReporte(groupQuery, headerId);
                                    break;
                            }
                        },
                        error: function (jqXHR, textStatus, errorThrown) {
                            $.isLoading("hide");
                            $('#modalValidacionExtra').modal('hide');
                            swal("Oops!!!", "Errores encontrados").then(function(){
                                $.isLoading({text: "Refrescando datos..." });
                                //var groupQuery = $("li.active").attr("gruopquery");
                                //var headerId = $("li.active").attr("headerId");
                                var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
                                var headerId = $("#proyecto").find('option:selected').data('headerid');
                                getReporte(groupQuery, headerId);
                            });
                        }
                    });
                },
                cancel: function () {
                    $.isLoading("hide");
                }
            });
        }

    });

    function getListEtiquetas(){
        var etiquetas =$("#proyecto").find('option:selected').data("etiquetas");  //$("li.active").data("etiquetas");
        if (etiquetas == ''){
            return ''
        }else{
            var lst = "";
            if (etiquetas){
                for (var i=0; i<etiquetas.length; i++){
                    lst += "," + etiquetas[i].idetiquetas;
                }
                return lst.length > 0 ? lst.substring(1) : lst;
            }else{
                return ''
            }
        }
    }

    function refrescarValoresExtra(idticket, arr) {
        //var idprocesos = $("li.active").attr("idprocesos");
        var idprocesos = $("#proyecto").val();
        var idDOM = '#btnValExtra_' + idprocesos + '_' + idticket;
        var keyTable = '.table_' + idprocesos;
        $(idDOM).data('val_alarmas', arr[0]['checked_new']);
        $(idDOM).data('com_alarmas', arr[0]['checked_new'] == 'SI' ? arr[0]['comment_new'] : '');
        $(idDOM).data('val_baseline', arr[1]['checked_new']);
        $(idDOM).data('com_baseline', arr[1]['checked_new'] == 'SI' ? arr[1]['comment_new'] : '');
        $(idDOM).data('val_srs', arr[2]['checked_new']);
        $(idDOM).data('com_srs', arr[2]['checked_new'] == 'SI' ? arr[2]['comment_new'] : '');
        $(idDOM).data('val_b158', arr[3]['checked_new']);
        $(idDOM).data('com_b158', arr[3]['checked_new'] == 'SI' ? arr[3]['comment_new'] : "");

        var currentRow = $(keyTable).find('#' + idticket);
        var posAlarm = $(keyTable).find('.ALARMAS_VALIDADAS').index();
        var posBaseline = $(keyTable).find('.BASELINE_VALIDADO').index();
        var posSRS = $(keyTable).find('.SRS_VALIDADO').index();
        var posB158 = $(keyTable).find('.B158_VALIDADO').index();

        currentRow.find("td:eq(" + posAlarm + ")").text(arr[0]['checked_new']);
        currentRow.find("td:eq(" + posBaseline + ")").text(arr[1]['checked_new']);
        currentRow.find("td:eq(" + posSRS + ")").text(arr[2]['checked_new']);
        //currentRow.find("td:eq(" + posB158 + ")").text(arr[3]['checked_new']);
        var resort = "";
        var callback = function(table) { /* do something */ };
        $(".table1").trigger("updateCell",[this, resort, callback]);
    }

    function showInitializing(tipo,msj){
        $('#img_initializing_success').css("display", "none");
        $('#img_initializing_error').css("display", "none");
        $('#img_initializing_warning').css("display", "none");
        $('#img_initializing_loading').css("display", "none");
        $('#img_initializing_' + tipo).css("display", "inline-block");
        $('#lbl_initialize').html(msj);
    }

    function hideControls(flag){
        $('#divPwd').css("display", flag ? "none" : "block");
    }

    function msjInfoValidacion(data){
        var msj = $('#lbl_initialize').html();
        var region = $("#region").find("option[value='" + data.id_region + "']").text();
        msj += "<br><span>Procesando validación para:<br>" +
                "<strong>Proyecto: " + data.nombre_proyecto + " " + region + ". [" +
                data.num_registros + " Sitios]</strong></span>";
        $('#lbl_initialize').html(msj);
    }

    function initProgressBar(data, show){
        if (show){$('#sending').show();}else{$('#sending').hide();}
        $('#done').text(data.registros_procesados);
        $('#total').text(data.num_registros);
        $('#lblCurrentAction').text('Procesando...');
        //reset progress bar
        $('.progress-bar').css('width', data.percentage+'%');
        $('.progress-bar').text(data.percentage+'%');
        $('.progress-bar').attr('data-progress', data.percentage);
    }

    function refreshProgressBar(data){
        $('#lblCurrentAction').text('Procesando...');
        $('.progress-bar').css('width', data.percentage+'%');
        $('.progress-bar').text(data.percentage+'%');
        $('.progress-bar').attr('data-progress', data.percentage);

        $('#done').text(data.registros_procesados);
        $('#total').text(data.num_registros);
    }

    function lockButtons(flag){
        $('#saveBatchValidation').attr('disabled', flag);
        $('#cancelBatchValidation').attr('disabled', flag);
    }

    function screenMsgBox(modal, title, text, icon){
        $.isLoading("hide");
        $(modal).modal('hide');
        swal(title, text, icon).then(function(){
            $.isLoading({text: "Recargando datos..." });
            //var groupQuery = $("li.active").attr("gruopquery");
            //var headerId = $("li.active").attr("headerId");
            var groupQuery = $("#proyecto").find('option:selected').data('groupquery');
            var headerId = $("#proyecto").find('option:selected').data('headerid');
            getReporte(groupQuery, headerId);
        });
    }

    function executeValidation(datos){
        if (datos.items_procesados == 0) {
            initProgressBar(datos);
        }
        $.ajax({
            type: 'POST',
            url: "{{ path('reporteappenate_saveBatchJobValidation',{'idproyectos':idproyectos,'idmodule':idmodule}) }}",
            data: {
                'etapa': 'processing',
                'id_validation': datos.id_validation,
                'registros_procesados': datos.registros_procesados,
                'num_registros': datos.num_registros,
                'offset': datos.offset
            },
            dataType: 'json',
            success: function (response) {
                switch (response.status){
                    case 'success':
                        console.log(response);
                        refreshProgressBar(response.data);
                        var d = response.data;
                        if (d.num_registros == d.registros_procesados){
                            console.log('PROCESO COMPLETADO');
                            $('#lblCurrentAction').text('Ejecutando tareas finales...');
                            endingValidation(d);
                        }else{
                            executeValidation(d);
                        }
                        break;
                    case 'error':
                        console.log(response);
                        screenMsgBox("#modalDetailBatch", "Error", response.msj, "error");
                        break;
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                screenMsgBox("#modalDetailBatch", "Error", "Error en el procesamiento de la Validación", "error");
            }
        });
    }

    function endingValidation(datos){
        $.ajax({
            type: 'POST',
            url: "{{ path('reporteappenate_saveBatchJobValidation',{'idproyectos':idproyectos,'idmodule':idmodule}) }}",
            data: {
                'etapa': 'ending',
                'id_validation': datos.id_validation,
                'registros_procesados': datos.registros_procesados,
                'num_registros': datos.num_registros,
                'offset': datos.offset
            },
            dataType: 'json',
            success: function (response) {
                switch (response.status){
                    case 'success':
                        console.log(response);
                        //$('#end-process').css('display','block');
                        screenMsgBox("#modalDetailBatch", "Info", "Validación Masiva Completada!!!", "success");
                        lockButtons(false);
                        break;
                    case 'error':
                        console.log(response);
                        screenMsgBox("#modalDetailBatch", "Error", response.msj, "error");
                        lockButtons(false);
                        break;
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                screenMsgBox("#modalDetailBatch", "Error", "Error finalizando la Validación", "error");
                lockButtons(false);
            }
        });
    }
   /*
   $("#saveBatchValidation").live('click', function (){
        var idprocesos = $("li.active").attr("idprocesos");
        var idTbody = 'tbody_' + idprocesos;
        var elem = '#' + idTbody + ' input[name=chkValidar_' + idprocesos + ']:checked';
        var pass = $('#txtPwdBatch').val();
        var arr = [];
        $(elem).each(function(){
            var arrDatos = {};
            arrDatos = {
                id_ticket: $(this).attr('idT'),
                id_estado: $(this).attr('idestado'),
                idproyectos: ,
                idprocesos: idprocesos,
                pwd: pass
            };
            arr.push(arrDatos);
        });

        if (arr.length > 0){
            $.confirm({
                icon: 'glyphicon glyphicon-question-sign',
                title: 'Validación de Sitios',
                content: arr.length + ' ítems a procesar. ¿Desea validar?',
                confirmButton: 'Si',
                cancelButton: 'No',
                confirmButtonClass: 'btn-success',
                cancelButtonClass: 'btn-default',
                confirm: function () {
                    procesarValidacionMasiva(arr,"");
                },
                cancel: function () {
                    $.isLoading("hide");
                    // $.alert('Cancel!');
                }
            });
        }else{
            alert('No seleccionó ítems a validar!!!');
            $("#modalDetailBatch").modal();
        }
    });

    function procesarValidacionMasiva(arrData,url){
        var numRegs = arrData.length;
        for (var i=0; i<numRegs; i++){
            $.when(sendDataToValidate(arrData[i],url, i+1, numRegs)).then(refreshProgressBar);
        }
    };
    function sendDataToValidate(data,url, pos, total){
        $.ajax({
            type: 'POST',
            url: url,
            data: {
                'arr_data': JSON.stringify(typeof(data) === 'object' ? Object.values(data) : data)
            },
            dataType: 'json',
            success: function (response) {
                switch (response.status){
                    case 'ok':

                        break;
                    case 'error':

                        break;
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {

            }
        });
    }

    function refreshProgressBar(pos, total){
        var percent = Math.round((pos * 100)/total);
        if (pos == 0) {
            $('#start_form').hide();
            $('#sending').show();
            $('#sended').text(0);
            $('#total').text(total);

            //reset progress bar
            $('.progress-bar').css('width', '0%');
            $('.progress-bar').text('0%');
            $('.progress-bar').attr('data-progress', '0');
        }
        $('.progress-bar').css('width', percent + '%');
        $('.progress-bar').text(percent + '%');
        $('.progress-bar').attr('data-progress', percent);

        $('#done').text(response.executed);
        $('.execute-time').text(response.execute_time);

        if (percentage == 100) {
            $('.end-process').show();
        } else {

        }
    }
    */


</script>

<div class="container-fluid">
    <div class="row">
        <div class="col-lg-3 col-md-3" id="parametros" >
            <select  class="js-example-basic-single" id="proyecto">
                <option value="">Seleccione Proyecto</option>
                {% for header in headers%}
                    <option value="{{header.idprocesos}}" data-alias="{{ header.alias }}"
                            data-headerid="{{ header.id }}" data-groupquery="{{ header.grupo_query }}"
                            data-idd="{{ header.folder_id }}"
                            data-class="{{ header.class }}" data-tagfile="{{ header.tagFile }}">{{ header.nombre }}</option>
                {% endfor %}
            </select>
        </div>
        <div class="col-lg-3 col-md-3" id="parametros" >
            <select  class="js-example-basic-single" id="region">
                <option value="">Seleccione Región</option>
                <option value="24">Región 1</option>
                <option value="25">Región 2</option>
                <option value="26">Región 3</option>
                <option value="27">Región 4</option>
                <option value="29">Región 6</option>
                <option value="32">Región 9</option>
            </select>
        </div>
        <div class="col-lg-3 col-md-3" id="parametros" >
            <div class="form-group">
                <input type="text" class="js-example-basic-single" id="txtSitio" name="txtSitio[]" value="" maxlength="20" placeholder="ID">
            </div>
            {#<select  class="js-example-basic-single" id="txtSitio" style="width: 100%">

            </select>#}
        </div>
        <div class="col-lg-2 col-md-2" id="parametros" >
            <select  class="js-example-basic-single" id="asignado">
                <option value="">TODOS</option>
                <option value="{{user}}">ASIGNADOS</option>
            </select>
        </div>
        <div class="col-lg-1 col-md-1" id="parametros" >
            <button class="btn btn-primary" id="generar">{{'ticketDetail.boton.generar' | trans}}</button>
        </div>
    </div>


    {#VIEJO#}
    <div class="row">
        <div class="col-lg-8 col-md-12">
            <h1 class="text-right text-primary"><i class="fa fa-file-text-o"></i> Validacion O&M Telcel </h1>
        </div>
        {% if identity is not empty %}
            <div class=" pull-right col-lg-pull-2" style="">
                <div class="col-lg-12">
                    <img id="logo" src="{{ asset( identity.pathLogo ) }}"  width="350" height="65">
                    <p class="text-center" style="font-size: 14pt;font-weight: bold;">{{ identity.alias }}</p>
                </div>
            </div>
        {% endif %}
    </div>
    <div class="row">
    </div>
    <div class="container-fluid" id="inicio" style="">

        <div class="tab-content" style="margin-top: 20px;">
            <div id="_summary" class="tab-pane fade in active">
                <div class="row">
                    <div class="col-lg-4 col-md-6">
                        <div class="panel panel-red">
                            <div class="panel-heading">
                                <div class="row">
                                    <div class="col-xs-3">
                                        <i class="fa fa-exclamation fa-5x"></i>
                                    </div>
                                    <div class="col-xs-9 text-right">
                                        <div id="rechazado" class="huge">0</div>
                                        <div>Rechazados </div>
                                    </div>
                                </div>
                            </div>
                            <a href="#">
                                <div class="panel-footer">
                                    <span class="pull-left">View Details</span>
                                    <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                    <div class="clearfix"></div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-6">
                        <div class="panel panel-yellow">
                            <div class="panel-heading">
                                <div class="row">
                                    <div class="col-xs-3">
                                        <i class="fa fa-exclamation fa-5x"></i>
                                    </div>
                                    <div class="col-xs-9 text-right">
                                        <div id="porValidar" class="huge">0</div>
                                        <div>Por Validar </div>
                                    </div>
                                </div>
                            </div>
                            <a href="#">
                                <div class="panel-footer">
                                    <span class="pull-left">View Details</span>
                                    <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                    <div class="clearfix"></div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-6">
                        <div class="panel panel-green">
                            <div class="panel-heading">
                                <div class="row">
                                    <div class="col-xs-3">
                                        <i class="fa fa-check fa-5x"></i>
                                    </div>
                                    <div class="col-xs-9 text-right">
                                        <div id="validado" class="huge">0</div>
                                        <div>Validados</div>
                                    </div>
                                </div>
                            </div>
                            <a href="#">
                                <div class="panel-footer">
                                    <span class="pull-left openModal validado">View Details</span>
                                    <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                    <div class="clearfix"></div>
                                </div>
                            </a>
                        </div>
                    </div>
                    {# <div class="col-lg-3 col-md-6">
                         <div class="panel panel-yellow">
                             <div class="panel-heading">
                                 <div class="row">
                                     <div class="col-xs-3">
                                         <i class="fa fa-shopping-cart fa-5x"></i>
                                     </div>
                                     <div class="col-xs-9 text-right">
                                         <div class="huge">124</div>
                                         <div>New Orders!</div>
                                     </div>
                                 </div>
                             </div>
                             <a href="#">
                                 <div class="panel-footer">
                                     <span class="pull-left">View Details</span>
                                     <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                     <div class="clearfix"></div>
                                 </div>
                             </a>
                         </div>
                     </div>#}
                    {# <div class="col-lg-3 col-md-6">
                         <div class="panel panel-red">
                             <div class="panel-heading">
                                 <div class="row">
                                     <div class="col-xs-3">
                                         <i class="fa fa-support fa-5x"></i>
                                     </div>
                                     <div class="col-xs-9 text-right">
                                         <div class="huge">13</div>
                                         <div>Support Tickets!</div>
                                     </div>
                                 </div>
                             </div>
                             <a href="#">
                                 <div class="panel-footer">
                                     <span class="pull-left">View Details</span>
                                     <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                                     <div class="clearfix"></div>
                                 </div>
                             </a>
                         </div>
                     </div>#}
                </div>
                {#<div class="row">



                    <div class="col-lg-6" id="chart1">

                    </div>


                    <div class="col-lg-6" id="chart2">
                    </div>

                </div>#}
                <div class="row">
                    <a  class="reset"><i class="fa fa-eraser" aria-hidden="true"></i></a>
                    <ul class="nav nav-pills nav-justified">
                        {% for header in headers%}
                            <li idprocesos="{{header.idprocesos}}" headerId= "{{ header.id }}"
                                gruopQuery="{{ header.grupo_query }}" class="{{ header.class }} mainTab"
                                idd="{{ header.folder_id }}"
                                tagfile="{{ header.tagFile }}"><a  data-toggle="tab" href="#_{{ header.alias }}"><strong>{{ header.nombre }}</strong></a></li>
                        {% endfor %}
                    </ul>
                    <div class="tab-content" style="margin-top: 20px;">
                        {% for header in headers%}
                            <div id="_{{ header.alias }}" class="tab-pane fade in {{ header.class }}">
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="btn-group pull-right" role="group" aria-label="..." style="width: 300px;" >
                                            {% if is_granted('ROLE_VALIDACION_CLIENTE_1') %}
                                            {% if is_granted('ROLE_VALIDACION_CLIENTE_2') %}
                                            <button class="btn btn-success validarMasivo" type="button" aria-label="Validar" title="Validación Masiva">
                                                <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>
                                                Validar
                                            </button>
                                            {% if header.idprocesos==115 or header.idprocesos==129 or header.idprocesos==155 or header.idprocesos==160 or header.idprocesos==506 or header.idprocesos==513 or header.idprocesos==514 or header.idprocesos==515 %}
                                            <button class="btn btn-primary validarMasivoATP" type="button" aria-label="Validar ATP" title="Validación Masiva ATP">
                                                    <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>
                                                    Validar ATPs
                                            </button>
                                          <!--   <button class="btn btn-warning validarMasivoVL" type="button" aria-label="Validar ATP" title="Validación Masiva Videollamadas">
                                                    <span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span>
                                                    Validar Videollamadas
                                            </button> -->
                                            {% endif %}
                                            {% endif %}
                                            {% endif %}
                                            <form id="formExport{{ header.alias }}"  action="{{ path('exportReporte',{'idproyectos':idproyectos}) }}" method="POST">
                                                <input type="hidden" class="idReporte" name="idReporte" value="{{ header.id_reporte_export }}">
                                            </form>
                                            <a idForm="formExport{{ header.alias }}"class="export btn btn-default" href="{{ path('exportReporte',{'idproyectos':idproyectos}) }}?idReporte={{ header.id_reporte_export }}" >
                                                <img src={{ asset("images/xls.png")}} width="16px"> XLS</a>
                                        </div>
                                    </div>
                                </div>


                                <div class="row double-scroll reporte1" id="{{ header.target_report }}" style="overflow: scroll; height: 70vh;">


                                </div>

                                <div id="pager" class="pager" style="display: none;text-align: center; ">
                                    <form>
                                        <img src="{{asset('tablesorter-master/addons/pager/icons/first.png')}}" class="first"/>
                                        <img src="{{asset('tablesorter-master/addons/pager/icons/prev.png')}}" class="prev"/>

                                        <img src="{{asset('tablesorter-master/addons/pager/icons/next.png')}}" class="next"/>
                                        <img src="{{asset('tablesorter-master/addons/pager/icons/last.png')}}" class="last"/>
                                        <span class="pagedisplay"></span>
                                        <select class="pagesize" title="Select page size">
                                            <option selected="selected" value="1000">1000</option>
                                            <option  value="500">500</option>
                                            <option  value="100">100</option>

                                        </select>
                                    </form>
                                </div>
                            </div>

                        {% endfor %}

                    </div> <!-- FIN DIV TAB -->
                    {# <div class="btn-group pull-right" role="group" aria-label="..." style="margin-right: 50px">
                         <form id="formExport"  action="{{ path('exportReporte',{'idproyectos':idproyectos}) }}" method="POST">
                             <input type="hidden" id="idReporte" name="idReporte" value="265">
                         </form>
                         <a id="export" href="{{ path('exportReporte',{'idproyectos':idproyectos}) }}?idReporte=265" > <img src={{ asset("images/xls.png")}} width="24px"> XLS</a>

                     </div>#}




                </div> <!-- fin fila -->



            </div>

        </div>

    </div>



    <div class="modal fade" id="modalDetail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header  bg-primary">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h2 class="modal-title text-center" id="myModalLabel"> Validacion de Sitio</h2>
                </div>
                <div class="modal-body">

                    <form id="formValidacion" action="{{ path('reporteappenate_validateSiteNewVersion',{'idproyectos':idproyectos,'idmodule':idmodule}) }}" method="POST">

                        <div class="col-lg-8">
                            <label>Clave de acceso</label>
                            <input id="password" name="password" type="password" class="form-control"/>
                            <input id="idestado" name="idestado" type="hidden" value=""/>
                            <input id="idticket" name="idticket" type="hidden" />
                            <input id="idprocesoGeneral" name="idproceso" type="hidden" />
                        </div>


                    </form>


                </div>
                <div class="modal-footer">
                    <button id="savePlan" type="button" class="btn btn-default"><i class="fa fa-lg fa-save text-primary"></i></button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-lg fa-times text-danger"></i></button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalRechazo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <form name="rechazo" action="{{ path('reporteappenate_rechazarSite',{'idproyectos':idproyectos,'idmodule':idmodule}) }}">
                    <input type="hidden" name="idestado" value="50">
                    <input id="idticketRechazo" type="hidden" name="idticket" >
                    <div class="modal-header  bg-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h2 class="modal-title text-center" id="myModalLabel"> Rechazo de Sitio</h2>
                    </div>
                    <div class="modal-body">
                        <div class="pull-right">
                            <button class="btn btn-success clone" element="primeraFila" target="materialesContainer"><i class="fa fa-lg fa-plus"></i></button>
                        </div>
                        <div id="materialesContainer">
                            <div class="row" id="primeraFila" style="margin-top:8px">
                                <div class="col-lg-1" style="display: none">
                                    <label>Descripcion</label>
                                    <select  class="descripcion_repuesto form-control" name="descripcion_repuesto[]">
                                        <option></option>
                                    </select>
                                </div>
                                <div class="col-lg-4">
                                    <label>Entregable</label>
                                    <select required  class="repuesto form-control" name="repuesto[]">
                                        <option></option>
                                    </select>
                                </div>
                                <div class="col-lg-6">
                                    <label>Comentario</label>
                                    <textarea required class="comentario form-control" name="comentario[]"></textarea>
                                </div>
                            </div><!-- fila 1 -->
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button id="saveRechazo" type="submit" class="btn btn-default"><i class="fa fa-lg fa-save text-primary"></i></button>
                        <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-lg fa-times text-danger"></i></button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="modal fade" id="detalle" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header  bg-primary">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h2 class="modal-title text-center" id="myModalLabel"> Validacion de Sitio</h2>
                </div>
                <div class="modal-body">

                </div>


                <div class="modal-footer">

                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-lg fa-times text-danger"></i></button>
                </div>

            </div>


        </div>
    </div>

    <div class="modal fade" id="modalGestion" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <form id="formGestion" name="formGestion" action="{{ path('reporteappenate_gestionSite',{'idproyectos':idproyectos,'idmodule':idmodule}) }}" method="POST">

                    <div class="modal-header  bg-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h2 class="modal-title text-center" id="myModalLabel"> Gestion de Sitio</h2>
                    </div>
                    <div class="modal-body">


                        <div class="col-lg-8">
                            <label>Gestion Sitio</label>
                            <select name="gestion" id="gestion" required class="form-control">
                                <option></option>
                                <option value="SI">SI</option>
                                <option value="NO">NO</option>
                                <option value="NA">NA</option>
                            </select>

                            <input id="idestadoGestion" name="entregable_id" type="hidden" value="156"/>
                            <input id="idticketGestion" name="idticket" type="hidden" />
                        </div>




                    </div>
                    <div class="modal-footer">
                        <button id="saveGestion" type="submit" class="btn btn-default"><i class="fa fa-lg fa-save text-primary"></i></button>
                        <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-lg fa-times text-danger"></i></button>


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

        </div>
    </div>

    <div class="modal fade" id="modalRechazoVideo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <form name="rechazoVideo" action="{{ path('reporteappenate_rechazarSite',{'idproyectos':idproyectos,'idmodule':idmodule}) }}">
                    <input type="hidden" name="idestado" value="50">
                    <input id="idticketRechazoVideo" type="hidden" name="idticket" >
                    <div class="modal-header  bg-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h2 class="modal-title text-center" id="myModalLabel"> Rechazo de Sitio</h2>
                    </div>
                    <div class="modal-body">

                        <div id="materialesContainerVideo">
                            <div class="row" id="primeraFila" style="margin-top:8px">

                                <div class="col-lg-4">
                                    <label>Entregable</label>
                                    <select required  class="repuestoVideo form-control" name="repuesto[]">
                                        <option value="16564">ATP - RSA VIDEO CHECKLIST</option>

                                    </select>
                                </div>
                                <div class="col-lg-6">
                                    <label>Comentario</label>
                                    <textarea required class="comentarioVideo form-control" name="comentario[]"></textarea>
                                </div>
                            </div><!-- fila 1 -->
                        </div>




                    </div>
                    <div class="modal-footer">
                        <button id="saveRechazoVideo" type="submit" class="btn btn-default"><i class="fa fa-lg fa-save text-primary"></i></button>
                        <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-lg fa-times text-danger"></i></button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalSelectDeliverables" tabindex="-1" role="dialog" aria-labelledby="modalSelectDeliverables">
        <div class="modal-dialog modal-md" role="document">
            <div class="modal-content">
                <div class="modal-header bg-primary">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h2 class="modal-title text-center" id="ModalTitleSelectDeliverables">
                        <span class="glyphicon glyphicon-list" aria-hidden="true"></span> Excluir Entregables
                    </h2>
                </div>

                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12">
                            <div id="divLoadingModal" class="alert alert-warning" role="alert">

                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <form id='frmSelectEntregable'>
                                <input type="hidden" id="txtIdTicket">
                                <table class="table table-condensed table-striped table-responsive" style="width: 100%">
                                    <thead>
                                    <tr class="info">
                                        <th class="text-left">Reporte</th>
                                        <th class="text-center">No Aplica</th>
                                    </tr>
                                    </thead>
                                    <tbody id="bodyTableEntregables">

                                    </tbody>
                                </table>
                            </form>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button id="btnSaveSelectDeliverables" type="button" class="btn btn-default">
                        <i class="fa fa-lg fa-save text-success"></i>
                    </button>
                    <button id="btnCloseSelectDeliverables" type="button" class="btn btn-default" data-dismiss="modal">
                        <i class="fa fa-lg fa-times text-danger"></i>
                    </button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalDetailBatch" tabindex="-1" role="dialog" aria-labelledby="BatchValidationModal">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header  bg-primary">
                    {#<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>#}
                    <h2 class="modal-title text-center" id="modalDetailBatchTitle"> Validación de Sitios</h2>
                </div>
                <div class="modal-body">
                    <div id="divPwd" class="row">
                        <div class="col-md-2"></div>
                        <div class="col-md-8">
                            <label>Clave de acceso</label>
                            <input id="txtPwdBatch" name="txtPwdBatch" type="password" class="form-control"/>
                            <input id="txtProcesoBatch" name="txtProcesoBatch" type="hidden" />
                        </div>
                        <div class="col-md-2"></div>
                    </div><div class="row"></div>
                    <div id="div_batch_valid_initializing" class="row">
                        <div class="col-lg-12 table-responsive">
                            <table class="table table-condensed">
                                <tr>
                                    <td style="width: 24px" class="text-center">
                                        <span id="img_initializing_loading"><img src="{{ asset('img/loading.gif' ) }}"  width="16" height="16"></span>
                                        <span id="img_initializing_success" class="glyphicon glyphicon-ok" aria-hidden="true"></span>
                                        <span id="img_initializing_error" class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                                        <span id="img_initializing_warning" class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
                                    </td>
                                    <td class="text-left" style="font-weight: normal">
                                        <span id="lbl_initialize">Inicializando...</span>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div class="row">
                        <div id="sending" class="col-lg-12" style="display:none">
                            <h3 id="lblCurrentAction">Procesando...</h3>
                            <div class="progress">
                                <div class="progress-bar progress-bar-success progress-bar-striped active"
                                     role="progressbar"
                                     aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
                                     data-progress="0" style="width: 0%;">
                                    0%
                                </div>
                            </div>
                            <div class="counter-sending text-center">
                                (<span id="done">0</span> ítems procesados / <span id="total">0</span> ítems en total)
                            </div>

                            {#<div class="execute-time-content">
                                Tiempo transcurrido: <span class="execute-time">0 segundos</span>
                            </div>#}

                            <div id="end-process" class="end-process text-center" style="display:none;">
                                <div class="alert alert-success">El proceso ha sido completado.</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button id="saveBatchValidation" type="button" class="btn btn-default"><i class="fa fa-lg fa-save text-primary"></i></button>
                    <button id="cancelBatchValidation" type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-lg fa-times text-danger"></i></button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modalValidacionExtra" tabindex="-1" role="dialog" aria-labelledby="modalValidacionExtra">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header bg-primary">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h2 class="modal-title text-center" id="ModalTitleValOtros">
                        <span class="glyphicon glyphicon-check" aria-hidden="true"></span> Validación Extra
                    </h2>
                </div>

                <div class="modal-body">
                    <div class="container-fluid">
                        <form id='frmSelectValidacionExtra'>
                        <input type="hidden" id="valExtra_txtIdTicket" value="">
                        <input type="hidden" id="valExtra_chkOldAlarmas" value="">
                        <input type="hidden" id="valExtra_cmbOldAlarmas" value="">
                        <input type="hidden" id="valExtra_chkOldBaseline" value="">
                        <input type="hidden" id="valExtra_cmbOldBaseline" value="">
                        <input type="hidden" id="valExtra_chkOldSRS" value="">
                        <input type="hidden" id="valExtra_cmbOldSRS" value="">
                        <input type="hidden" id="valExtra_chkOldB158" value="">
                        <input type="hidden" id="valExtra_cmbOldB158" value="">
                        <input type="hidden" id="valExtra_txtOldAlarmas" value="">
                        <input type="hidden" id="valExtra_txtOldBaseline" value="">
                        <input type="hidden" id="valExtra_txtOldSRS" value="">
                        <input type="hidden" id="valExtra_txtOldB158" value="">
                        <table class="table table-condensed table-striped table-responsive">
                            <tbody id="bodyTableValExtra" style="font-weight: normal">
                                {#<tr class="info">
                                    <td class="text-center" nowrap="nowrap">
                                        <input type="checkbox" id="chkValExtraAll">
                                    </td>
                                    <td class="text-left" nowrap="nowrap" style="width: 26%">
                                        <strong>TODOS</strong><br>
                                    </td>
                                    <td class="text-left"></td>
                                </tr>#}
                                <tr>
                                    <td class="text-center" nowrap="nowrap" style="width: 130px;">
                                        {#<input type="checkbox" id="chkValExtraAlarmas" value="212" class="chkValExtraStyle">#}
                                        <select id="cmbValExtraAlarmas"  class="form-control"  data-etiqueta="212">
                                            <option value="">SELECT</option>
                                            <option value="SI">SI</option>
                                            <option value="NO">NO</option>
                                            <option value="NO OK">NO OK</option>
                                            <option value="N/A">N/A</option>
                                        </select>
                                    </td>
                                    <td class="text-left" nowrap="nowrap">
                                        <label class="form-control">ALARMAS EXTERNAS</label>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="236" placeholder="Comentarios..." rows="3"
                                                  id="txtValExtraAlarmas" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="272" placeholder="Responsable..." rows="3"
                                                  id="txtValExtraAlarmasResp" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="text-center" nowrap="nowrap">
                                        {#<input type="checkbox" id="chkValExtraBaseline" value="213" class="chkValExtraStyle">#}
                                        <select id="cmbValExtraBaseline" class="form-control"  data-etiqueta="213">
                                            <option value="">SELECT</option>
                                            <option value="SI">SI</option>
                                            <option value="NO">NO</option>
                                            <option value="NO OK">NO OK</option>
                                            <option value="N/A">N/A</option>
                                        </select>
                                    </td>
                                    <td class="text-left" nowrap="nowrap">
                                        <label class="form-control">BASELINE</label>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="237" placeholder="Comentarios..." rows="3"
                                                  id="txtValExtraBaseline" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="273" placeholder="Responsable..." rows="3"
                                                  id="txtValExtraBaselineResp" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="text-center" style="width:20px;padding-left: 2px;padding-right: 2px;" nowrap="nowrap">
                                        {#<input type="checkbox" id="chkValExtraSRS" value="214" class="chkValExtraStyle">#}
                                        <select id="cmbValExtraSRS"  class="form-control" data-etiqueta="214">
                                            <option value="">SELECT</option>
                                            <option value="SI">SI</option>
                                            <option value="NO">NO</option>
                                            <option value="NO OK">NO OK</option>
                                            <option value="N/A">N/A</option>
                                        </select>
                                    </td>
                                    <td class="text-left" nowrap="nowrap">
                                        <label class="form-control">SRS</label>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="238" placeholder="Comentarios..." rows="3"
                                                 id="txtValExtraSRS" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="274" placeholder="Responsable..." rows="3"
                                                  id="txtValExtraSRSResp" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="text-center" style="width:20px;padding-left: 2px;padding-right: 2px;" nowrap="nowrap">
                                        <select id="cmbValExtraB158"  class="form-control" data-etiqueta="239">
                                            <option value="">SELECT</option>
                                            <option value="SI">SI</option>
                                            <option value="NO">NO</option>
                                            <option value="NO OK">NO OK</option>
                                            <option value="N/A">N/A</option>
                                        </select>
                                    </td>
                                    <td class="text-left" nowrap="nowrap">
                                        <label class="form-control">B158</label>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="240" placeholder="Comentarios..." rows="3"
                                                  id="txtValExtraB158" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                    <td>
                                        <textarea data-idvalue="275" placeholder="Responsable..." rows="3"
                                                  id="txtValExtraB158Resp" maxlength="255" class="form-control">
                                        </textarea>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        </form>
                    </div>
                </div>

                <div class="modal-footer">
                    <button id="btnSaveValidacionExtra" type="button" class="btn btn-default">
                        <i class="fa fa-lg fa-save text-success"></i>
                    </button>
                    <button id="btnCloseValidacionExtra" type="button" class="btn btn-default" data-dismiss="modal">
                        <i class="fa fa-lg fa-times text-danger"></i>
                    </button>
                </div>
            </div>
        </div>
    </div>

    {#<div class="modal fade" id="modalValidacionATPs" tabindex="-1" role="dialog" aria-labelledby="modalValidacionATPs">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header bg-primary">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h2 class="modal-title text-center" id="ModalTitleValATPs">
                        <span class="glyphicon glyphicon-check" aria-hidden="true"></span> Validación ATPs
                    </h2>
                </div>

                <div class="modal-body">
                    <div class="container-fluid">
                        <form id='frmSelectValidacionATPs'>
                            <input type="hidden" id="valATPs_txtIdProyecto" value="">
                            <input type="hidden" id="valATP_txtIdProceso" value="">

                        </form>
                        <div class="row">
                            <div class="col-md-12">
                                <input id="fileToUpload" type="file" name="file" class="file-loading">
                                <small id="msjFileTypes" class="form-text text-muted"></small>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="modal-footer">
                    <button id="btnSaveValidacionExtra" type="button" class="btn btn-default">
                        <i class="fa fa-lg fa-save text-success"></i>
                    </button>
                    <button id="btnCloseValidacionExtra" type="button" class="btn btn-default" data-dismiss="modal">
                        <i class="fa fa-lg fa-times text-danger"></i>
                    </button>
                </div>
            </div>
        </div>
    </div>#}

    <div class="modal fade" id="modalfileUpload" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header  bg-primary">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h2 class="modal-title" id="myModalLabel">
                        <i class="fa fa-upload"></i> Validación ATPs: Procesar Archivo
                    </h2>
                </div>

                <div class="modal-body">
                    <div class="row">
                        <input id="txtProyecto" type="hidden" value="">
                        <input id="txtProceso" type="hidden" value="">
                        <div class="col-md-12">
                            <a class="btn btn-warning" role="button" href="{{ asset('Template_Validacion_ATP.xlsx') }}"
                               download="Template_Validacion_ATP.xlsx" style="float: left;" title="Template Validación ATPs">
                                <img src={{ asset("images/xls.png")}} width="24px"> Descargar Template
                            </a>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">&nbsp;</div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <input id="fileToUpload" type="file" name="file" class="file-loading">
                            <small id="msjFileTypes" class="form-text text-muted"></small>
                        </div>
                    </div>
                    <div class="row">&nbsp;</div>
                    <div class="row">
                        <div id="msjFileUpload" class="col-md-12">

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

                <div class="modal-footer">
                    <button id="closemodal" type="button" class="btn btn-default" data-dismiss="modal">
                        <i class="fa fa-lg fa-times text-danger"></i>
                    </button>
                </div>

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

    <div class="modal fade" id="modalfileUploadVL" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header  bg-primary">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h2 class="modal-title" id="myModalLabel">
                        <i class="fa fa-upload"></i> Validación Videollamdas: Procesar Archivo
                    </h2>
                </div>

                <div class="modal-body">
                    <div class="row">
                        <input id="txtProyecto" type="hidden" value="">
                        <input id="txtProceso" type="hidden" value="">
                        <div class="col-md-12">
                            <a class="btn btn-warning" role="button" href="{{ asset('Template_Validacion_Videollamadas.xlsx') }}"
                               download="Template_Validacion_Videollamadas.xlsx" style="float: left;" title="Template Validación Videollamdas">
                                <img src={{ asset("images/xls.png")}} width="24px"> Descargar Template
                            </a>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">&nbsp;</div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <input id="fileToUploadVL" type="file" name="file" class="file-loading">
                            <small id="msjFileTypes" class="form-text text-muted"></small>
                        </div>
                    </div>
                    <div class="row">&nbsp;</div>
                    <div class="row">
                        <div id="msjFileUploadVL" class="col-md-12">

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

                <div class="modal-footer">
                    <button id="closemodal" type="button" class="btn btn-default" data-dismiss="modal">
                        <i class="fa fa-lg fa-times text-danger"></i>
                    </button>
                </div>

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

    {% endblock %}