@extends('app')
@section('content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            Permission Management
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
            <li><a href="#">Admin</a></li>
            <li><a href="#">Role</a></li>
            <li class="active">Permission</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">
        <!-- SELECT2 EXAMPLE -->
        <div class="box box-info">
            <div class="box-header with-border">

            </div>
            <!-- /.box-header -->
            <div class="box-body">
                <div class="row">
                    <div class="col-md-12">
                        <div class="input-group col-md-4 col-md-offset-4">
                            <input id="role" type="text" class="form-control"
                                   name="role" value="{{ $role }}" style="text-align: center" readonly>
                        </div>

                        <form id="update_permission-{{ $id }}" method="post" action="{{ route('role.update')}}">
                            <input type="hidden" name="role_id" value="{{ $id }}">

                        <table id="roleDatatable" class="table table-bordered table-striped">
                            @csrf
                            <thead>
                            <tr>
                                <th>Permission ID</th>
                                <th>Header</th>
                                <th>Permission Name</th>
                                <th><input type="checkbox" id="checkAll"></th>
                            </tr>
                            </thead>
                                <tbody>

                                    @if(count($allPermission) > 0)
                                        @foreach($allPermission as $key => $permission)
                                            <tr>
                                                <td>{{$permission->id}}</td>
                                                <td>{{$permission->header}}</td>
                                                <td>{{$permission->name}}</td>
                                                <td>
                                                    @if(in_array($permission->name, $rolePermission))
                                                        <input type="checkbox" id="permission" name="permission[]" class="filled-in chk-col-light-green" value="{{ $permission->name }}" checked }}/>
                                                    @else
                                                        <input type="checkbox" id="permission" name="permission[]" class="filled-in chk-col-light-green" value="{{ $permission->name }}"}}/>
                                                    @endif
                                                </td>
                                            </tr>
                                        @endforeach
                                    @endif

                                </tbody>


                            <tfoot>
                                <tr>
                                    <th>Permission ID</th>
                                    <th>Header</th>
                                    <th>Permission Name</th>
                                    <th>Action</th>
                                </tr>
                            </tfoot>
                        </table>

                        </form>
                        <button type="submit" class="btn btn-info pull-right" onclick="updatePermission({{ $id }})">Submut</button>
                    </div>
                </div>
            </div>
            <div class="box-footer">
            </div>
        </div>
    </section>

@endsection
@section('extra-css')
    {{ Html::style('assets/bower_components/datatables.net/rowgroup/rowGroup.bootstrap.min.css') }}
@stop
@section('extra-js')
    {{ Html::script('assets/bower_components/datatables.net/rowgroup/dataTables.rowGroup.min.js') }}
    <script type="text/javascript">
        $(document).ready(function () {
            $('#roleDatatable')
                .addClass('nowrap')
                .dataTable({
                    paging: false,
                    pageLength: -1,
                    rowGroup: {
                        dataSrc: 1
                    },
                    order: [[1, 'asc'], [2, 'asc']]
                });

        });

        function updatePermission(id) {
            event.preventDefault();
            document.getElementById('update_permission-'+id).submit();
        }

        $("#checkAll").click(function () {
            $('input:checkbox').not(this).prop('checked', this.checked);
        });

    </script>
@endsection