@extends('frontend.layout.master')

@section('content')
<div class="container">

    <h3>Admin Permissions</h3>

    <form method="POST" action="{{ route('permissions.bulk') }}">
        @csrf
        
        <button name="action" value="true" class="btn btn-success btn-sm">
            Enable Selected
        </button>
        
        <button name="action" value="false" class="btn btn-danger btn-sm">
            Disable Selected
        </button>
        
        <table class="table table-bordered mt-2">
            <thead>
                <tr>
                    <th><input type="checkbox" onclick="toggleAll(this)"></th>
                    <th>Permission Name</th>
                    <th>For</th>
                    <th>Status</th>
                </tr>
            </thead>
            <tbody>
                @foreach($permissions as $permission)
                    <tr>
                        <td>
                            <input type="checkbox" name="ids[]" value="{{ $permission->id }}">
                        </td>
                        <td>{{ $permission->permission }}</td>
                        <td>{{ $permission->for }}</td>
                        <td><label for="status" class="badge  {{ ($permission->status == 'true') ? 'badge-success' : 'badge-danger' }}">{{ $permission->status }}</label></td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </form>

    {{ $permissions->links() }}

</div>

<script>
    function toggleAll(source) {
        document.querySelectorAll('input[name="ids[]"]').forEach(function(cb){
            cb.checked = source.checked;
        });
    }
</script>
@endsection