@extends('layouts.admin')

@section('content')
    <div class="row mb-3">
        <div class="col-md-6">
            <h4>User Level</h4>
        </div>
        <div class="col-md-6 text-right">
            <button class="btn btn-primary" type="button" onclick="info_user_level()">Tambah</button>
        </div>
    </div>
    <div class="card">
        <div class="card-body">
            <div id="info_user_level"></div>
            <div id="table_user_level"></div>
        </div>
    </div>
@endsection

@push('modals')
    <div class="modal fade" id="modal_member" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Hak Akses</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div id="data_hak_akses"></div>
                </div>
            </div>
        </div>
    </div>
@endpush

@push('scripts')
    <script>
        let _token = '{{ csrf_token() }}', paginate = 10, selected_page = 1;
        let $info_user_level = $('#info_user_level'),
            $table_user_level = $('#table_user_level');

        let search_user_level = (page = 1) => {
            if (page.toString() === '+1') selected_page++;
            else if (page.toString() === '-1') selected_page--;
            else selected_page = page;

            $.post("{{ route('admin.user_level.search') }}?page=" + selected_page, {
                _token, paginate
            }, (result) => {
                $table_user_level.html(result);
            }).fail((xhr) => {
                $table_user_level.html(xhr.responseText);
            });
        }

        let info_user_level = (id = '') => {
            $.post("{{ route('admin.user_level.info') }}", {
                _token, id
            }, (result) => {
                $info_user_level.html(result);
            }).fail((xhr) => {
                $info_user_level.html(xhr.responseText);
            });
        }

        let $modal_member = $('#modal_member'),
            $data_hak_akses = $('#data_hak_akses');
        let hak_akses_user_level = (id) => {
            $.post("{{ route('admin.user_level.hak_akses') }}", {
                _token, id
            }, (result) => {
                $data_hak_akses.html(result);
                $modal_member.modal('show');
            }).fail((xhr) => {
                $data_hak_akses.html(xhr.responseText);
                $modal_member.modal('show');
            });
        }

        let init_user_level = () => {
            search_user_level(selected_page);
            $info_user_level.html('');
        }

        init_form_element();
        init_user_level();
    </script>
@endpush