@extends('layout.master')
@section('parentPageTitle', 'Modulos')
@section('title', 'Asignar modulo a un rol')
@section('page-style')
    <link rel="stylesheet" href="{{asset('assets/plugins/bootstrap-select/css/bootstrap-select.css')}}">
    <link rel="stylesheet" href="{{asset('assets/jquery-ui.css')}}">
    <link rel="stylesheet" href="{{asset('assets/bootstrap.min.css')}}">
    <style type="text/css">
    .caret{    
        display: none;
    }
    </style>
@stop

@section('content')
    

    <div class="row clearfix">
        <div class="col-lg-12 col-md-12 col-sm-12">
            <div class="card">
                <!-- <div class="header">
                    <h2 align="center"><strong>Asignar modulo a un rol</strong></h2>

                </div> -->
                <div class="body">
                    <form action="{{ route('modulos.registrar_modulo_rol') }}" id="formAsignarRol" method="post">

                        
                        {{ csrf_field() }}

                        <div class="row clearfix">
                            <div class="col-sm-1"></div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                    
                                        Rol
                                </div>
                            </div>    
                            <div class="col-sm-5">                                
                                <div class="form-group">
                                    <select id="rol" name="rol" required>
                                        <option value="">Seleccionar Rol</option>
                                        @foreach ($roles as $rol)                                            
                                            <option value="{{ $rol->id }}">{{ $rol->nombre }}</option>
                                        @endforeach 
                                    </select> 
                                </div>
                            </div>                                           
                        </div>

                        <div class="row clearfix">
                            <div class="col-sm-1"></div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                        Tipo perfil
                                </div>
                            </div>    
                            <div class="col-sm-5">                                
                                <div class="form-group">
                                    <select id="tipoperfil" name="tipoperfil" required disabled="">
                                        <option value="0">Seleccionar tipo perfil</option>
                                        
                                    </select> 
                                </div>
                            </div>                                           
                        </div>

                        <div class="row clearfix">
                            <div class="col-sm-1"></div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                        Modulo
                                </div>
                            </div>    
                            <div class="col-sm-5">                                
                                <div class="form-group">
                                    <select id="modulo" name="modulo" required disabled="">
                                        <option value="0">Seleccionar modulo</option>
                                        
                                    </select> 
                                </div>
                            </div>                                           
                        </div>


                        <div class="row clearfix">
                            <div class="col-sm-1"></div>
                            <div class="col-sm-2">
                                <div class="form-group">
                                        Descripción
                                </div>
                            </div>    
                            <div class="col-sm-5">                                
                                <div class="form-group">
                                    <input type="text" placeholder="Descripción" id="descripcion" name="descripcion" class="form-control" autocomplete="off" required>
                                </div>
                            </div>  
                                          
                        </div>

                                         

                        <div class="row clearfix" align="right">          
                            <div class="col-sm-12">
                                <button type="submit" class="btn btn-primary btn-round">Registrar</button>
                                <button type="button" class="btn btn-default btn-round btn-simple" onclick="window.history.back()">Cancelar</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>




@stop

@section('page-script')

<script src="{{asset('assets/jquery-ui.js')}}"></script>
<script src="{{asset('assets/bootstrap.min.js')}}"></script>
<script> 

function eliminar(id){
    var r = confirm("Confirma eliminar");
    if (r == true) {
        var token = $('meta[name="csrf-token"]').attr('content');
        var url='eliminar';
        var data={"id" : id};

        $.ajax({
            type:'POST',
            url: url,
            data: data,
            headers: {
                'X-CSRF-TOKEN': token
            },
            success:function(data){
                //alert(data);
                //redirect('roles/listado-roles');
                window.location.href = "listado";
            }
        });
    }                 
}



var arrayModulos = null;


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

    //$("#tipoperfil").attr("disabled", "disabled");
    //$("#modulo").attr("disabled", "disabled");

    if($(this).val()>0){

        var token = $('meta[name="csrf-token"]').attr('content');
        var url='ajax_obtener_tipoperfil';
        var rol_elegido = $(this).val();
        var data={"id" : rol_elegido};

        $.ajax({
            type:'POST',
            url: url,
            data: data,
            headers: {
                'X-CSRF-TOKEN': token
            },
            success:function(data){

                console.log(data)
                
                var opciones="<option value=''>Seleccionar tipo perfil</option>";
                if(data.length>0){

                    for (var m = 0; m < data.length; m++) {

                      opciones = opciones + "<option value='"+data[m].id+"'>"+data[m].nombre+"</option>";


                    }
                }

                $("#tipoperfil").removeAttr('disabled');
                $("#tipoperfil").empty();
                $("#tipoperfil").append(opciones).selectpicker('refresh');
                    
            }
        });    
    }

    
});

$( "#tipoperfil" ).change(function() {
    if($(this).val()>0){

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

        var token = $('meta[name="csrf-token"]').attr('content');
        var url='ajax_obtener_modulos';
        var tipoperfil_elegido = $(this).val();
        var data={
            "tipoperfil" : tipoperfil_elegido,
            "rol" : rol
        };

        $.ajax({
            type:'POST',
            url: url,
            data: data,
            headers: {
                'X-CSRF-TOKEN': token
            },
            success:function(data){

                console.log(data)
                
                var opciones="<option value=''>Seleccionar modulo</option>";
                if(data.length>0){

                 for (var m = 0; m < arrayModulos.length; m++) {
                    var asd=0;
                    
                    for (var n = 0; n < data.length; n++) {
                        
                        if(arrayModulos[m].id==data[n].modulo_id){
                            asd=1;
                        }
                    }
                    if(asd==0){
                       
                        opciones = opciones + "<option value='"+arrayModulos[m].id+"'>"+arrayModulos[m].nombre+"</option>";
                    }
                    
                }

                }else{
                    for (var m = 0; m < arrayModulos.length; m++) {
                        opciones = opciones + "<option value='"+arrayModulos[m].id+"'>"+arrayModulos[m].nombre+"</option>";                        
                    }
                }

                $("#modulo").removeAttr('disabled');
                $("#modulo").empty();
                $("#modulo").append(opciones).selectpicker('refresh');
               
                    
            }
        });  
        //$('#sucursal option:not(:selected)').attr('disabled',true);
 
    }

    
});

</script>
@stop