@extends('layouts.app')

@section('title', 'Permissions')

@section('content')
<div class="container-fluid">
  @include('partials._flash')

  <div class="row mb-3">
    <div class="col-md-8">
      <h4 class="mb-0">Permissions</h4>
    </div>
    @can('create permissions')
      <div class="col-md-4 text-end">
        <a href="{{ route('permissions.create') }}" class="btn btn-primary">
          <i class="bi bi-plus-lg"></i> Create Permission
        </a>
      </div>
    @endcan
  </div>

  <div class="card">
    <div class="card-header d-flex justify-content-between align-items-center">
      <form class="row g-2 col-md-8" method="GET" action="{{ route('permissions.index') }}">
        <div class="col-auto">
          <input type="text" name="q" value="{{ $q ?? '' }}" class="form-control" placeholder="Search permission or guard">
        </div>

        <div class="col-auto">
          <select name="per_page" class="form-select" onchange="this.form.submit()">
            @foreach([10,15,25,50,100] as $n)
              <option value="{{ $n }}" @if($perPage == $n) selected @endif>{{ $n }} / page</option>
            @endforeach
          </select>
        </div>

        <div class="col-auto">
          <button class="btn btn-outline-secondary" type="submit"><i class="bi bi-search"></i> Search</button>
          <a href="{{ route('permissions.index') }}" class="btn btn-outline-secondary">Reset</a>
        </div>
      </form>

      <div class="col-auto">
        <div class="btn-group">
          <a href="{{ route('permissions.index', array_merge(request()->except('page'), ['sort' => 'name', 'direction' => ($sort == 'name' && $direction == 'asc') ? 'desc' : 'asc'])) }}"
             class="btn btn-sm btn-outline-secondary">Sort Name</a>
        </div>
      </div>
    </div>

    <div class="card-body p-0">
      <div class="table-responsive">
        <table class="table table-hover mb-0">
          <thead class="table-light">
            <tr>
              <th>#</th>
              <th>Name</th>
              <th>Guard</th>
              <th>Created</th>
              <th class="text-end">Actions</th>
            </tr>
          </thead>
          <tbody>
            @forelse ($permissions as $permission)
              <tr>
                <td>{{ $permission->id }}</td>
                <td><a href="{{ route('permissions.show', $permission) }}">{{ $permission->name }}</a></td>
                <td>{{ $permission->guard_name }}</td>
                <td>{{ $permission->created_at->format('Y-m-d') }}</td>
                <td class="text-end">
                  @can('edit permissions')
                    <a href="{{ route('permissions.edit', $permission) }}" class="btn btn-sm btn-outline-primary">
                      <i class="bi bi-pencil"></i>
                    </a>
                  @endcan
                  @can('delete permissions')
                    <button onclick="confirmDelete('{{ route('permissions.destroy', $permission) }}')" class="btn btn-sm btn-outline-danger">
                      <i class="bi bi-trash"></i>
                    </button>
                  @endcan
                </td>
              </tr>
            @empty
              <tr><td colspan="5" class="text-center">No permissions found.</td></tr>
            @endforelse
          </tbody>
        </table>
      </div>

      <div class="card-footer d-flex justify-content-between align-items-center">
        <div>
          Showing {{ $permissions->firstItem() ?? 0 }} to {{ $permissions->lastItem() ?? 0 }} of {{ $permissions->total() }} entries
        </div>
        <div>
          {{ $permissions->links() }}
        </div>
      </div>
    </div>
  </div>

  @include('partials._delete_modal')
</div>
@endsection