@extends('fragments.fullTemplate')
@php
    $id_usuario = session('id_usuario');
    if (! session('id_usuario')) {
            header('location: /');
            die();
    }
@endphp
@section('contenido')
    <div class="ui big breadcrumb">
        <div class="section">Sistema</div>
        <i class="right chevron icon divider"></i>
        <div class="active section">Áreas</div>
        <i class="right chevron icon divider"></i>
        <div class="active section">Roles</div>
    </div>

    <div class="ui divider"></div>
    <div data-module-notifications-anchor></div>
    <div class="content">
        <div class="col-lg-12 col-md-12 col-sm-12">
            @if (session()->has('success'))
                <div class="alert alert-success text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('success') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if (session()->has('warning'))
                <div class="alert alert-warning text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('warning') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if (session()->has('error'))
                <div class="alert alert-danger text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('error') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if (count($errors) > 0)
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <strong>¡Error!</strong> Revise los campos obligatorios.<br><br>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
        </div>
    </div>
    <button class="ui button fluid primary create_modal_usuario">
        <i class="plus icon"></i> Nuevo Rol
    </button>    

    <div class="ui divider"></div>

    <div class="sx-autorender">
        <div class="sx-scroll-x">
            <table id="lang-dt" class="ui celled table unstackable">
                <thead>
                    <tr>
                        <th>Rol</th>
                        
                        <th class="collapsing">Acciones</th>
                    </tr>
                </thead>
                <tbody>
                    @if($roles->count())
                    @foreach ($roles as $rol)
                        <tr>
                            <td>{{ $rol->tipo_usuario }}</td>
                            
                            
                            <td>
                                <div class="ui tiny icon buttons">
                                    @if($area->sin_edicion != 1 || $id_usuario == 3)
                                    @include('fragments.buttons.modificar', [
                                        "class" =>['edit'],
                                        "attrs" =>[
                                            'id' => 'rol_'.$rol->id_tipo_usuario,
                                            'data-id' => $rol->id_tipo_usuario
                                        ]
                                    ])

                                    @include('fragments.buttons.eliminar', [
                                        "class" =>['eliminar'],
                                        "attrs" =>[
                                            'id' => 'usuario'.$rol->id_tipo_usuario,
                                            'data-id' => $rol->id_tipo_usuario,
                                            'data-nombre_completo' => $rol->tipo_usuario
                                        ]
                                    ])
                                    @endIf
                                    
                                </div>
                            </td>
                        </tr>
                    @endforeach
                    @else
                    <tr>
                        <td colspan="8">No se encontraron registros</td>
                    </tr>
                    @endif
                </tbody>
            </table>
            {{-- $usuarios->links("pagination::bootstrap-4") --}}
        </div>
    </div>
    @include('fragments.back', ['url' => 'areas'])
    @include('Roles.create_modal')
    @include('Roles.modify_modal')
    @include('Roles.delete_modal')
    <script>
        $(document).on('click','.create_modal_usuario',function(){
            $('#create_modal').modal('show'); 
        });
    </script>
   
    <script>
        var resultData = {};
        $(document).ready(function(){
            $('a.edit').on('click', function(){
                showLoader();
                id_tipo_usuario = $(this).data('id');
                $.ajax({
                    url:"{{url('areas/'.$id_area.'/roles/show')}}",
                    method:"POST",
                    data:{'id_tipo_usuario': id_tipo_usuario, '_token': _token = $('input[name="_token"]').val()},
                    success:function(response){
                        hideLoader();
                        result = JSON.parse(response); 
                        resultData = result.data;
                        $('#modify_modal').modal('show');
                    },
                    error: function(xhr, status, error) {
                        hideLoader();
                    }
                })

            });
        });
        
        $('#modify_modal').on('show.bs.modal', function () {
            
            $("#modal-form-modify :input").each(function(){
                
                input = $(this).attr('id'); // This is the jquery object of the input, do what you will
                //console.log(input);
                if(input in resultData['rol']){
                    $('#modal-form-modify #'+input).val(resultData['rol'][input]);
                }
            });

            $('#modal-form-modify .custom-control-input').prop('checked', false);
    
            $.each(resultData['modulos'], function(key, value_modulos) {
                        
                var id_modulo = value_modulos['id_modulo'];
                
                if (value_modulos['altas'] == 1) {
                    $('#modal-form-modify #switch_modulo_'+id_modulo).prop('checked', true);
                }else{
                    $('#modal-form-modify #switch_modulo_'+id_modulo).prop('checked', false);
                }
                if (value_modulos['crear'] == 1) {
                    $('#modal-form-modify #check_crear_'+id_modulo).prop('checked', true);
                }else{
                    $('#modal-form-modify #check_crear_'+id_modulo).prop('checked', false);
                }
                if (value_modulos['actualizar'] == 1) {
                    $('#modal-form-modify #check_actualizar_'+id_modulo).prop('checked', true);
                }else{
                    $('#modal-form-modify #check_actualizar_'+id_modulo).prop('checked', false);
                }
                if (value_modulos['eliminar'] == 1) {
                    $('#modal-form-modify #check_eliminar_'+id_modulo).prop('checked', true);
                }else{
                    $('#modal-form-modify #check_eliminar_'+id_modulo).prop('checked', false);
                }
                if (value_modulos['ver'] == 1) {
                    $('#modal-form-modify #check_ver_'+id_modulo).prop('checked', true);
                }else{
                    $('#modal-form-modify #check_ver_'+id_modulo).prop('checked', false);
                }

                if (value_modulos['administrador'] == 1) {
                    $('#modal-form-modify #check_administrador_'+id_modulo).prop('checked', true);
                }else{
                    $('#modal-form-modify #check_administrador_'+id_modulo).prop('checked', false);
                }

                if (value_modulos['gerente'] == 1) {
                    $('#modal-form-modify #check_gerente_'+id_modulo).prop('checked', true);
                }else{
                    $('#modal-form-modify #check_gerente_'+id_modulo).prop('checked', false);
                }
                
            });

            if (typeof syncRolesPermisosExclusivos === 'function') {
                syncRolesPermisosExclusivos('#modify_modal');
            }

           
             
        });
    </script>
    <script>
        $(document).on('click','.eliminar',function(){
            var id=$(this).attr('data-id');
            var nombre_completo=$(this).attr('data-nombre');
           
            $('#modal-form-delete input#id').val(id);
            $('#modal-form-delete #nombre').html(nombre_completo);

            $('#delete_modal').modal('show'); 
        });
    </script>
    <script src="{{ url('assets/js/roles/index.js') }}"></script>
@endsection