@extends('layouts.admin')
@section('title', 'Users')
@section('content')

    <section class="content-header">
        <h1>Users</h1>
    </section>

    <section class="content">
        <div class="box box-default">
            <div class="box-header with-border">
                <h3 class="box-title">List User</h3>
            </div>
            <div class="box-body">
                <div class="row" style="margin-bottom: 10px">
                    <div class="col-lg-12">
                        <div style="text-align: right;">
                            <label>
                                <input type="text" class="form-control" placeholder="Search..." id="generalSearch">
                            </label>
                        </div>
                    </div>
                </div>
                <div class="table-responsive">
                    <table class="table table-striped" id="users_table" style="overflow-x: auto !important;width: 100% !important;">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Name</th>
                                <th>Role</th>
                                <th>Permission</th>
                                <th>Status</th>
                                <th>BSH Status</th>
                                <th>eKasih Status</th>
                                <th>LHDN Status</th>
                                <th>Status Rekod</th>
                                <th>Email Verified</th>
                                <th>Created At</th>
                                <th>Options</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
        <a href="{{url('superadmin/users/add')}}" class="btn btn-primary">
            <i class="fa fa-user-plus"></i> Add User
        </a>
    </section>

@endsection

@section('footerScripts')
    <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
    <script>
        $(document).ready(function() {
            $('#users_table').dataTable({
                scrollX: true,
                processing: true,
                paging: true,
                pageLength: 20,
                lengthChange: false,
                serverSide: true,
                ajax: {
                    url:'{{ url('superadmin/users/list') }}'
                },
                searching: false,
                language: {
                    emptyTable: "Tiada Data"
                },
                columns: [
                    { data: 'id', name: 'id' },
                    { data: 'name', name: 'name' },
                    { data: 'role', name: 'role' },
                    { data: 'permissions', name: 'permissions' },
                    { data: 'status', name: 'status' },
                    { data: 'bsh_status', name: 'bsh_status' },
                    { data: 'ekasih_status', name: 'ekasih_status' },
                    { data: 'lhdn_status', name: 'lhdn_status' },
                    { data: 'myidentity_status', name: 'myidentity_status' },
                    { data: 'email_verified_at', name: 'email_verified_at' },
                    { data: 'created_at', name: 'created_at' },
                    { data: 'action', name: 'action', orderable: false, searchable: false }
                ],
            });

            var timer;
            $("#generalSearch").on("keyup", function() {
                clearTimeout(timer);
                var ms = 2000;
                
                var q = $(this).val();

                if (q.length > 2 || q.length == 0) {
                    timer = setTimeout(function() {
                        $('#users_table').dataTable().fnDestroy();
                        $('#users_table').dataTable({});
                        $('#users_table').dataTable().fnDestroy();
                        $('#users_table').dataTable({
                            scrollX: true,
                            processing: true,
                            paging: true,
                            pageLength: 20,
                            lengthChange: false,
                            serverSide: true,
                            ajax: {
                                url:'{{ url('superadmin/users/list') }}',
                                data:{ q }
                            },
                            searching: false,
                            language: {
                                emptyTable: "Tiada Data"
                            },
                            columns: [
                                { data: 'id', name: 'id' },
                                { data: 'name', name: 'name' },
                                { data: 'role', name: 'role' },
                                { data: 'permissions', name: 'permissions' },
                                { data: 'status', name: 'status' },
                                { data: 'bsh_status', name: 'bsh_status' },
                                { data: 'ekasih_status', name: 'ekasih_status' },
                                { data: 'lhdn_status', name: 'lhdn_status' },
                                { data: 'myidentity_status', name: 'myidentity_status' },
                                { data: 'email_verified_at', name: 'email_verified_at' },
                                { data: 'created_at', name: 'created_at' },
                                { data: 'action', name: 'action', orderable: false, searchable: false }
                            ],
                        });
                    }, ms);
                }
            });
        });

        function disableUser(user_id){
            $.confirm({
                title: 'Disable User',
                content: 'Are you sure want to disable this user?',
                buttons: {
                    cancel: function () {
                        
                    },
                    somethingElse: {
                        text: 'DISABLED',
                        btnClass: 'btn-warning',
                        keys: ['enter', 'shift'],
                        action: function(){
                            $.ajax({
                                url: "{{url('')}}/superadmin/users/"+user_id+"/disable",
                                type: "POST",
                                data: "_token={{csrf_token()}}&user_id="+user_id,
                                success: function(response) {
                                    if(response.status == 'success') {
                                        location.reload();
                                    } else {
                                        $.alert(response.message);
                                    }
                                },
                                error: function(response) {
                                    $.alert(response.message);
                                }
                            });
                        }
                    }
                }
            });
        }

        function enableUser(user_id){
            $.confirm({
                title: 'Restore User',
                content: 'Are you sure want to restore this user?',
                buttons: {
                    cancel: function () {
                        
                    },
                    somethingElse: {
                        text: 'RESTORE',
                        btnClass: 'btn-warning',
                        keys: ['enter', 'shift'],
                        action: function(){
                            $.ajax({
                                url: "{{url('')}}/superadmin/users/"+user_id+"/enable",
                                type: "POST",
                                data: "_token={{csrf_token()}}&user_id="+user_id,
                                success: function(response) {
                                    if(response.status == 'success') {
                                        location.reload();
                                    } else {
                                        $.alert(response.message);
                                    }
                                },
                                error: function(response) {
                                    $.alert(response.message);
                                }
                            });
                        }
                    }
                }
            });
        }

        function deleteUser(user_id){
            $.confirm({
                title: 'Delete User',
                content: 'Are you sure want to delete this user?',
                buttons: {
                    cancel: function () {
                        
                    },
                    somethingElse: {
                        text: 'DELETE',
                        btnClass: 'btn-red',
                        keys: ['enter', 'shift'],
                        action: function(){
                            $.ajax({
                                url: "{{url('')}}/superadmin/users/"+user_id+"/delete",
                                type: "POST",
                                data: "_token={{csrf_token()}}&user_id="+user_id,
                                success: function(response) {
                                    if(response.status == 'success') {
                                        $.alert(response.message); 
                                    } else {
                                        $.alert(response.message);
                                    }
                                },
                                error: function(response) {
                                    $.alert(response.message);
                                }
                            });
                        }
                    }
                }
            });
        }
    </script>
@endsection