@push("script")
    <script>
        (function () {
            callApi("GET", "{{ route('api.dashboard.index') }}", [], function (req) {
                if(req.status){
                    $('.jumlah-user').html(req.data.jumlahUser)
                    $('.jumlah-owner').html(req.data.jumlahOwner)
                    $('.jumlah-maid').html(req.data.jumlahMaid)
                    $('.jumlah-job').html(req.data.jumlahJob)
                    $('.jumlah-jobselesai').html(req.data.jumlahJobSelesai)
                }
            })
        })();


        $(document).ready(function () {
            function load_job(params = []) {
                $("table.table").DataTable().destroy()
                $("table.table").DataTable({
                    "deferRender": true,
                    "responsive": true,
                    'serverSide': true,
                    'processing': true,
                    "ordering": false,
                    "ajax": {
                        "url": "{{ route('api.user.admingetkyc') }}",
                        "type": "GET",
                        "data": {
                            "sort": "ASC"
                        },
                        "headers": {
                            "Authorization" : getAuthorization()
                        },
                        "dataSrc": "data"
                    },
                    "columns": [
                        {
                            data: null,
                            render: function (data, type, row, meta) {
                                return meta.row + meta.settings._iDisplayStart + 1 + '.';
                            }
                        },
                        {
                            data: null,
                            render: res => {
                                if (res.role == '3') {
                                    return "Maid"
                                } else {
                                    return "Owner"
                                }
                            }
                        },
                        {
                            data: 'name'
                        },
                        {
                            data: 'email'
                        },
                        {
                            data: null,
                            render: res => {
                                return `<a class="btn btn-sm btn-info mb-1 btn-view-data" data-image_verif="${res.profile.image_verif}" data-ktp="${res.profile.ktp}" href="javascript:void(0);" data-bs-toggle="modal" data-bs-target="#viewModal">
                                            Show
                                        </a>`
                            }
                        },
                        {
                            data: null,
                            render: res => {
                                let btn_edit = ''
                                let btn_delete = ''

                                btn_edit = `<a class="btn btn-sm btn-success mb-1 btn-accept" data-id="${res.id}" data-name="${res.name}" href="javascript:void(0);">
                                                <i class="bx bx-check me-1"></i> Accept
                                            </a>`


                                btn_delete = `<a class="btn btn-sm btn-danger mb-1 btn-reject" data-id="${res.id}" data-name="${res.name}" href="javascript:void(0);">
                                                <i class="bx bx-x me-1"></i> Reject
                                            </a>`


                                    return `
                                        ${btn_edit} <br>
                                        ${btn_delete}
                                    `;
                            }
                        }
                    ]
                });
            }

            load_job();

            $(document).on('click', '.btn-view-data', function () {
                let image_verif = $(this).attr('data-image_verif')
                let ktp = $(this).attr('data-ktp')
                $('#viewModal .view_image_verif').html(`<img src="{{url('')}}${image_verif}" width="100%" height="100%">`)
                $('#viewModal .view_ktp').html(`<img src="{{url('')}}${ktp}" width="100%" height="100%">`)
            })

            $(document).on('click', '.btn-accept', function () {
                data = {
                    user_id: $(this).attr('data-id'),
                    status: 2
                }

                callApi("POST", "{{ route('api.user.adminsetkyc') }}", data, function (req) {
                    pesan = req.message;
                    if (req.error == true) {
                        Swal.fire(
                        'Gagal!',
                        pesan,
                        'error'
                        )
                    }else{
                        Swal.fire(
                        'Berhasil!',
                        pesan,
                        'success'
                        )
                        load_job();
                    }
                })
            })

            $(document).on('click', '.btn-reject', function () {
                data = {
                    user_id: $(this).attr('data-id'),
                    status: 3
                }

                callApi("POST", "{{ route('api.user.adminsetkyc') }}", data, function (req) {
                    pesan = req.message;
                    if (req.error == true) {
                        Swal.fire(
                        'Gagal!',
                        pesan,
                        'error'
                        )
                    }else{
                        Swal.fire(
                        'Berhasil!',
                        pesan,
                        'success'
                        )
                        load_job();
                    }
                })
            })
        })
    </script>
@endpush
