@extends('layout.master')
@section('parentPageTitle', 'Perfil')
@section('title', 'Editar perfil')
@section('page-style')
    <link rel="stylesheet" href="{{asset('assets/plugins/jquery-datatable/dataTables.bootstrap4.min.css')}}">
    <link rel="stylesheet" href="{{asset('assets/jquery-ui.css')}}">
    <link rel="stylesheet" href="{{asset('assets/plugins/bootstrap-select/css/bootstrap-select.css')}}">
@stop

@section('content')

    <div class="row clearfix">
        <!-- <div class="col-md-1"></div>
        <div class="col-md-1"></div>
        <div class="col-md-1"></div>
        <div class="col-lg-8 col-md-8 col-sm-8">-->
            <div class="col-md-12 d-flex justify-content-center">
            <div class="card">
               
                <div class="body">

                    <div class="navbar-header d-flex justify-content-left align-items-left ml-0 p-1" align="left">
                        <big style="color: black;font-size: 25px;"class="">@yield('title')</big>
                    </div>

                    <div class="navbar-header d-flex justify-content-left align-items-left ml-0 p-1" align="left">
                       <p class="" style="color:#FF0000" ><small>* Son campos obligatorios.</small></p>
                    </div>

                    

                    </br>
                    <form action="" id="formEditarPerfil" method="post">

                        {{ csrf_field() }}

                         <input type="hidden" id="idperfil" name="idperfil" value="{{$data[0]->id}}">

                         <input type="hidden" id="tipoperfil" name="tipoperfil" value="{{$data[0]->tipoperfil}}">

                          <input type="hidden" id="idrol" name="idrol" value="{{$data[0]->rol_id}}">

                          <input type="hidden" id="nombreperfilmodificado" name="nombreperfilmodificado" value="{{$data[0]->nombreperfil}}">


                        <div class="row clearfix">

                            <div class="col-sm-2">                                
                                <div class="d-flex justify-content-left align-items-left ml-0 p-2" align="left">
                                    Tipo rol
                                </div>
                            </div>                             
                            <div class="col-sm-4">
                                  <div class="form-group">
                                    <input type="text" id="nombrerol" name="nombrerol" class="form-control" autocomplete="off" value="{{$data[0]->nombrerol}}" disabled="">
                                  </div>  
                            </div> 

                            <div class="col-sm-2">                                
                                <div class="d-flex justify-content-left align-items-left ml-0 p-2" align="left">
                                    Tipo funcionario *
                                </div>
                            </div>                             
                            <div class="col-sm-4">
                                  <div class="form-group">
                                    <input type="text" id="tipofuncionario" name="tipofuncionario" class="form-control" autocomplete="off" value="{{$data[0]->nombre}}" style="text-transform:uppercase" disabled="">
                                  </div>  
                            </div> 

                            <div class="col-sm-2">                                
                                <div class="d-flex justify-content-left align-items-left ml-0 p-2" align="left">
                                    Nombre perfil
                                </div>
                            </div>                             
                            <div class="col-sm-4">
                                  <div class="form-group">
                                    <input type="text" id="nombreperfil" name="nombreperfil" class="form-control" autocomplete="off" value="{{$data[0]->nombreperfil}}" style="text-transform:uppercase;">
                                  </div>  
                            </div> 

                        </div>

                        <div class="row clearfix">

                            <div class="col-sm-2" style="margin-top:-1%;">                                
                                  <div class="d-flex justify-content-left align-items-left ml-0 p-2">
                                      <label>Minutos inactividad *</label>
                                  </div>
                            </div>                                
                                
                            <div class="col-sm-4">
                                  <div class="form-group">
                                      <input type="text" id="minutossession" name="minutossession" class="form-control" autocomplete="off" required placeholder="Minutos cierre sesión"  maxlength="3" value="{{$tiemposesion}}">
                                  </div>
                            </div>

                            <div class="" style="margin-left:2%;">
                                  <label style="margin-top: 7px;color:#FF0000;">(Tiempo minimo 3 minutos)</label>
                            </div> 

                        </div>

                        <h4 style="margin-top:2%;"" align="center">&nbsp;&nbsp;&nbsp;&nbsp;Acceso m&oacute;dulos</h4>
                        <div class="tab-content m-t-10">
                        <div class="tab-pane table-responsive active" id="All" style="overflow-x: hidden;">
                            <table class="table m-b-0 table-hover" id="tablaaccesomodulos" name="tablaaccesomodulos">
                                <thead>
                                    <tr class="ui-widget-header">    

                                        <th> </th>                                
                                        <th>Nombre</th>
                                        <th>Estado</th>
                                    </tr>
                                </thead>
                                
                            </table>
                        </div>

                    </div>

                    </br>
                    </br>

                    <div class="row clearfix" align="right">          
                        <div class="col-sm-12">
                            <button style="border-color:#18ce0f; color:#18ce0f;" type="button" class="btn btn-default btn-round btn-simple" id="btnEditar" name="btnEditar">Grabar</button>
                            <button style="border-color:#FF3636; color:#FF3636;"type="button"  id="btnCancelarEditar" class="btn btn-default btn-round btn-simple">Cancelar</button>
                            
                        </div>
                    </div>

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

    <div id="dialog_alerta" title="{{config('maestro.nombresistema')}}">
        <p id=dialog_texto align="center"></p>
    </div>
@stop

@section('page-script')

<script src="{{asset('assets/bundles/datatablescripts.bundle.js')}}"></script>
<script src="{{asset('assets/jquery-ui.js')}}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.13/jquery.mask.min.js"></script>


<script>

var lenguaje = {
    "lengthMenu": "Listar _MENU_ ",
    "zeroRecords": "Aún no tiene registros",
    "info": "Página _PAGE_ de _PAGES_",
    "infoEmpty": "",
    "Search": "Buscar",
    "infoFiltered": "(filtered from _MAX_ total records)",
    "search": "Buscar",
    "zeroRecords": "Sin resultados encontrados",
    "paginate": {
        "first": "Primero",
        "last": "Ultimo",
        "next": "Siguiente",
        "previous": "Anterior"
    }
}

$(function () {

    $("#dialog_alerta").dialog({ autoOpen: false });

    $('#nombre').keypress(function (e) {
        var tecla = document.all ? tecla = e.keyCode : tecla = e.which;
        return !((tecla > 47 && tecla < 58) || tecla == 46);
    });

     
    $('#descripcion').keypress(function (e) {
        var tecla = document.all ? tecla = e.keyCode : tecla = e.which;
        return !((tecla > 47 && tecla < 58) || tecla == 46);
    });

    $("#btnCancelarEditar").click(function(){

        window.location.href = "listadoperfilfuncionario"; 

    });

     $("#minutossession").mask('ZA', {translation: {
      Z: {pattern: /[1-9]/},
      A: {pattern: /[0-9]/, recursive: true}
    }});

    $('#minutossession').keyup(function (e) {

      var largominutossession= $('#minutossession').val().length;
      var blanco="";

      setTimeout(function(){
        
        if(largominutossession==1){

            var valor= Number($("#minutossession").val());

            if(valor<3){
               
                $("#minutossession").val(blanco);
            }
        }

        if(largominutossession>=3){

            var valor= Number($("#minutossession").val());

            //EL VALOR 600 ES EL VALOR DEL LIFETIME
            if(valor>=600){
               
                $("#minutossession").val(blanco);
            }
        }
      
      },5000);

    });

});


$("#btnEditar").click(function(){

   
    var nombreperfil= $("#nombreperfil").val();
    var nombreperfilmodificado = $("#nombreperfilmodificado").val();
    //var descripperfil= $("#descripcion").val();
    var idperfil= $("#idperfil").val();
    var tipoperfil= $("#tipoperfil").val();
    var tipofuncionario= $("#tipofuncionario").val();

    var idrol= $("#idrol").val();

    var tiemposesion=$("#minutossession").val();

    if(nombreperfil==""){

      $( "#dialog_texto" ).empty();
      $( "#dialog_texto" ).append("Debe ingresar el nombre del perfil.");
      $( "#dialog_alerta" ).dialog('open');
      return false;

    }

    if(tiemposesion==""){

      $( "#dialog_texto" ).empty();
      $( "#dialog_texto" ).append("Debe ingresar el tiempo de sesion.");
      $( "#dialog_alerta" ).dialog('open');
      return false;

    }


    if(nombreperfil!=nombreperfilmodificado){

        var nombremodificado="SI";

    }
    else{

        var nombremodificado="NO"; 
    }


    var token = $('meta[name="csrf-token"]').attr('content');

    $.ajax({

        type:'POST',            
        async:false,
        url:'editarperfilfuncionario',
        data:{
            nombreperfil: nombreperfil,
            idperfil: idperfil,
            idrol: idrol,
            tipoperfil: tipoperfil,
            tipofuncionario: tipofuncionario,
            nombremodificado:nombremodificado,
            tiemposesion:tiemposesion

        },
        headers: {'X-CSRF-TOKEN': token},

        success:function(data){

            if (data.mensaje == 'tipoperfilencontrado') {

                $("#dialog_texto").empty();
                $("#dialog_texto").append("Ya existe un perfil con el mismo nombre");
                $("#dialog_alerta").dialog('open');
                return false;
                //limpiardatosisapre();  
            }

            if (data.mensaje == 'actualizado') {

                $("#dialog_texto").empty();
                $("#dialog_texto").append("Los datos del perfil han sido actualizados con exito");
                $("#dialog_alerta").dialog('open');
                setTimeout(function(){
                    window.location.href = "listadoperfilfuncionario";
                },1500); 
               
            }

        }
    });  

});

function cambiarEstado(id,estado,btn_id){

    event.preventDefault(); // Evita el comportamiento predeterminado del enlace

    var rol= $("#idrol").val();
    var idperfil= $("#idperfil").val();
    
    var token = $('meta[name="csrf-token"]').attr('content');
    var url='ajax_cambiar_estado';
    var enviarData={"id" : id, "estado" : estado, "rol": rol, "idperfil": idperfil};

    $.ajax({
        type:'POST',
        url: url,
        data: enviarData,
        headers: {
            'X-CSRF-TOKEN': token
        },
        success:function(data){
            if(data==1){
                $("#"+btn_id).text("Activo");
                $("#"+btn_id).removeClass();
                $("#"+btn_id).addClass('tag badge badge-default');
                $("#"+btn_id).css({'border-color':'#18ce0f','color':'#18ce0f'});
                $("#"+btn_id).attr("onclick", "cambiarEstado('"+id+"', '1', '"+btn_id+"')");
            }else{
                $("#"+btn_id).text("Inactivo");
                $("#"+btn_id).removeClass();
                $("#"+btn_id).addClass('tag badge badge-default');
                $("#"+btn_id).css({'border-color':'#FF3636','color':'#FF3636'});
                $("#"+btn_id).attr("onclick", "cambiarEstado('"+id+"', '0', '"+btn_id+"')");
            }

            $("#dialog_texto").empty();
            $("#dialog_texto").append("Acceso cambiado con exito");
            $("#dialog_alerta").dialog('open');
            
            setTimeout(function(){
              $("#dialog_alerta").dialog('close');
            },1500); 

        }
    });
    
}

function listaraccesomodulos() {

    var route = "{{route('perfil.listaraccesomodulos')}}";

    var rol= $("#idrol").val();
    var idperfil= $("#idperfil").val();
    

    var eliminartabla = jQuery('#tablaaccesomodulos').dataTable().fnDestroy();
    var recargartabla = jQuery('#tablaaccesomodulos').dataTable({
        
        "aoColumnDefs": [{ "bVisible": false, "aTargets": [0] }],
        "lengthMenu": [50],
        "pageLength": 50,
        "ajax": {
            method:'post',
            url: route,
            headers:{
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            "data": function(data) {
               data.rol = rol;
               data.idperfilorigen = idperfil;
            }

        },
        
        columns: [

            {
                name: 'id',
                data: 'id'
            },
            
            {
                name: 'descripcion',
                data: 'descripcion'
            },

            {   
                className: 'text-left',
                data:'id',
                
                render: function (data,type,row) {
                   
                    var estado= row.estado; 

                    if (estado == 0){

                      var boton = '<tr class="identificador" data-id="' + data + '">'+'<a href="#" id="'+ data + '" name="' + data + '" class="tag badge badge-suc" style="border-color:#FF3636; color:#FF3636;" onclick="cambiarEstado('+data+','+estado+','+data+')">Inactivo</a> </tr>'
                    }

                    if (estado == 1){
                      
                      var boton = '<tr class="identificador" data-id="' + data + '">'+'<a href="#" id="' + data + '" name="' + data + '" class="tag badge badge-default" style="border-color:#18ce0f;color:#18ce0f;" onclick="cambiarEstado('+data+','+estado+','+data+')">Activo</a></tr>'
                    }

                    return ''+boton+'';  
                }
            }
            
        ],

        "columnDefs": [
             
            { "orderable": false, "targets": 1},
           
             
        ],

        language: lenguaje

    });

}


$(document).ready(function() {

    
    listaraccesomodulos();
     

} );
  
</script>
@stop