<x-app-layout>
  <x-slot name="header">
    <h1 class="page-header-title">
      <div class="page-header-icon"><i class="fas fa-users-cog"></i></div>
      Ruoli e Permessi
    </h1>
    <div class="page-header-subtitle">Elenco di ruoli e permessi che puoi assegnare agli utenti</div>
  </x-slot>

  <style>
  thead input{
    width: 100%;
  }
  thead select{
    width: 100%;
  }
  </style>

  <div class="container">
    <div class="row">
      <div class="col-xxl-6 col-xl-6 mb-4">
        <div class="card h-100">
          <div class="card-body h-100  justify-content-center">
            @if(Session::has('flash_message'))
            <div class="alert alert-success">
              {{ Session::get('flash_message') }}
            </div>
            @endif

            {{$dataTable_role->table()}}
          </div>
        </div>
      </div>

      <div class="col-xxl-6 col-xl-6 mb-4">
        <div class="card h-100">
          <div class="card-body h-100 " id="div_permessi">

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


    </div>
  </div>

</x-app-layout>



{{$dataTable_role->scripts()}}
<script>


$(document).ready(function(){
  $.ajaxSetup({
    headers: {
      'X-CSRF-TOKEN': '{{csrf_token()}}'
    }
  });

  $('button').removeClass('dt-button');
  $("#dataTable_role").attr('width', '100%');

  // Editor Inline
  // $("#dataTable_role").on('dblclick', 'tbody td', function (e) {
  //   if("{{ !Auth::user()->can('edit-roles-permissions') }}") return;
  //   window.LaravelDataTables["dataTable_role-editor"].inline(this, {
  //     onBlur: 'submit',
  //     submit: 'allIfChanged'
  //   });
  // });

  // Editor edit
  $("#dataTable_role").on('click', 'a#editor_edit', function (e) {
    e.preventDefault();
    if("{{ !Auth::user()->can('edit-roles-permissions') }}") return;
    window.LaravelDataTables["dataTable_role-editor"].edit( $(this).closest('tr'), {
      title: 'Modifica',
      buttons: 'Aggiorna'
    });
  });

  // Editor delete
  $("#dataTable_role").on('click', 'a#editor_delete', function (e) {
    e.preventDefault();
    if("{{ !Auth::user()->can('remove-roles-permissions') }}") return;
    window.LaravelDataTables["dataTable_role-editor"].remove( $(this).closest('tr'), {
      title: 'Cancella record',
      message: 'Sei sicuro di voler eliminare il record selezionato?',
      buttons: 'Cancella record'
    } );
  } );


});

function load_permessi(role_id){
  $("#div_permessi").load("{!! url('permissions?role_id="+role_id+"') !!}");
}

function load_utenti(role_id){
  $("#div_permessi").load("{!! url('roles/user?role_id="+role_id+"') !!}");
}

function convertToSlug(text)
{
    return text
        .toLowerCase()
        .replace(/ /g,'-')
        .replace(/[^\w-]+/g,'')
        ;
}


</script>
