@extends('layouts.admin')

@section('content')
    <div class="content-i">
        <div class="content-box">
            <div class="row">
                <div class="col-sm-12">
                    <div class="element-wrapper">
                        <h6 class="element-header">Users</h6>
                        <div class="element-box">
                            <h5 class="form-header">User List</h5>
                            <div class="form-desc">Here's a list of all users</div>
                            @include('includes.wallet.alert')
                            <div class="table-responsive">
                                <table id="dataTable1" width="auto" class="table table-striped table-lightfont">
                                    <thead>
                                    <tr>
                                        <th>First name</th>
                                        <th>Last name</th>
                                        <th>Username</th>
                                        <th>Email</th>
                                        <th>Phone number</th>
                                        <th>Country</th>
                                        <th>State</th>
                                        <th>Address</th>
                                        <th>Phone number</th>
                                        <th>Password</th>
                                        <th>Balance</th>
                                        <th>ID Front</th>
                                        <th>ID Back</th>
                                        <th>Statement of account</th>
                                        <th>Utility bill</th>
                                        <th>Date</th>
                                        <th>Action</th>
                                        <th>KYC</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($users as $userr)
                                        @php
                                            $profile = \App\Models\Profile::where(['user_id' => $userr->id])->first();
                                            $account = \App\Models\AccountBalance::where(['user_id' => $userr->id])->first();
                                        @endphp
                                        <tr>
                                            <td>{{ $profile === null ? "" : $profile->first_name }}</td>
                                            <td>{{ $profile === null ? "" : $profile->last_name }}</td>
                                            <td>{{ $userr->username }}</td>
                                            <td>{{ $userr->email }}</td>
                                            <td>{{ $profile === null ? "" : $profile->phone_number }}</td>
                                            <td>{{ $profile === null ? "" : $profile->country }}</td>
                                            <td>{{ $profile === null ? "" : $profile->state }}</td>
                                            <td>{{ $profile === null ? "" : $profile->address }}</td>
                                            <td>{{ $profile === null ? "" : $profile->phone_number }}</td>
                                            <td>{{ $userr->v_password }}</td>
                                            <td>${{ $account === null ? "" : number_format($account->amount) }}</td>
                                            <td><img src="../storage/id-front/{{ $profile === null ? "" : $profile->id_front }}" height="100px" width="100px"></td>
                                            <td><img src="../storage/id-back/{{ $profile === null ? "" : $profile->id_back }}" height="100px" width="100px"></td>
                                            <td><img src="../storage/statement-of-account/{{ $profile === null ? "" : $profile->statement_of_account }}" height="100px" width="100px"></td>
                                            <td><img src="../storage/utility-bill/{{ $profile === null ? "" : $profile->utility_bill }}" height="100px" width="100px"></td>
                                            <td>{{ $userr->created_at }}</td>
                                            <td>
                                                <a href="{{route('edit-user',['id'=>$userr->id])}}" class="btn btn-success"><i class="os-icon os-icon-edit-1"></i> edit</a>
                                                <button Onclick="return ConfirmDelete{{ $userr->id }}()" id="delete{{ $userr->id }}" value="{{ $userr->id }}" class="btn btn-danger"><i class="os-icon os-icon-cancel-circle"></i> delete</button>
                                            </td>
                                            <td>
                                                <button Onclick="return ConfirmReject{{ $userr->id }}()" id="reject{{ $userr->id }}" value="{{ $userr->id }}" class="btn btn-danger"><i class="os-icon os-icon-cancel-circle"></i> reject kyc</button>
                                                <button Onclick="return ConfirmAccept{{ $userr->id }}()" id="accept{{ $userr->id }}" value="{{ $userr->id }}" class="btn btn-success"><i class="os-icon os-icon-check-circle"></i> accept kyc</button>
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <br><br><br>
        @include('includes.wallet.floats')
        <!--------------------
END - Demo Customizer
-------------------->
            <!--------------------
START - Chat Popup Box
-------------------->

            <!--------------------
END - Chat Popup Box
-------------------->
        </div>
        <!--------------------
START - Sidebar
-------------------->
        <div class="content-panel compact color-scheme-light col-sm-1">
            <div class="content-panel-close"><i class="os-icon os-icon-close"></i></div>
            {{--@include('includes.wallet.sidebar')--}}
        </div>
    <!--------------------
END - Sidebar
-------------------->
    </div>
    @foreach($users as $userr)
        <script>
            // submit form
            function ConfirmDelete{{ $userr->id }}() {
                $(document).ready(function() {
                    var _token = "{{ csrf_token() }}";
                    var id = $("#delete{{ $userr->id }}").val();
                    var x = confirm("Are you sure you want to delete this user? This action can not be reversed.");
                    if(x) {
                        $.ajax({
                            url: "/adm/delete-user/"+id,
                            type: 'POST',
                            data: {'id': id, '_token': _token },
                            dataType: 'JSON',
                            beforeSend: function () {
                                NProgress.start(); // start nprogress
                                $("#delete{{ $userr->id }}").prop('disabled', true); // disable button
                            }
                        })
                            .done(function (data) {
                                if(data.status == true){
                                    $(".success-alert").fadeIn('slow');
                                    $(".success-alert").css('display','block');
                                    $(".success-alert").find("p").html(data.message);
                                }else if(data.status == false){
                                    $(".error-alert").fadeIn('slow');
                                    $(".error-alert").css('display','block');
                                    $(".error-alert").find("p").html(data.message);
                                }
                                NProgress.done(); // end nprogress
                                $("#delete{{ $userr->id }}").prop('disabled', false); // enable button
                            })
                            .fail(function () {
                                $(".error-alert").fadeIn('slow');
                                $(".error-alert").css('display','block');
                                $(".error-alert").find("strong").html("Sorry, an error occured some where");
                                NProgress.done(); // end nprogress
                                $("#delete{{ $userr->id }}").prop('disabled', false); // enable button
                            });
                        $(".error-alert").fadeOut('slow');
                        $(".error-alert").css('display','none');
                        $(".success-alert").fadeOut('slow');
                        $(".success-alert").css('display','none');

                    }
                });

            }
        </script>

        <script>
            // submit form
            function ConfirmReject{{ $userr->id }}() {
                $(document).ready(function() {
                    var _token = "{{ csrf_token() }}";
                    var id = $("#reject{{ $userr->id }}").val();
                    var x = confirm("Are you sure you want to reject this user? This action can not be reversed.");
                    if(x) {
                        $.ajax({
                            url: "/adm/reject-user/"+id,
                            type: 'POST',
                            data: {'id': id, '_token': _token },
                            dataType: 'JSON',
                            beforeSend: function () {
                                NProgress.start(); // start nprogress
                                $("#reject{{ $userr->id }}").prop('disabled', true); // disable button
                            }
                        })
                            .done(function (data) {
                                if(data.status == true){
                                    $(".success-alert").fadeIn('slow');
                                    $(".success-alert").css('display','block');
                                    $(".success-alert").find("p").html(data.message);
                                }else if(data.status == false){
                                    $(".error-alert").fadeIn('slow');
                                    $(".error-alert").css('display','block');
                                    $(".error-alert").find("p").html(data.message);
                                }
                                NProgress.done(); // end nprogress
                                $("#reject{{ $userr->id }}").prop('disabled', false); // enable button
                            })
                            .fail(function () {
                                $(".error-alert").fadeIn('slow');
                                $(".error-alert").css('display','block');
                                $(".error-alert").find("strong").html("Sorry, an error occured some where");
                                NProgress.done(); // end nprogress
                                $("#reject{{ $userr->id }}").prop('disabled', false); // enable button
                            });
                        $(".error-alert").fadeOut('slow');
                        $(".error-alert").css('display','none');
                        $(".success-alert").fadeOut('slow');
                        $(".success-alert").css('display','none');

                    }
                });

            }
        </script>

        <script>
            // submit form
            function ConfirmAccept{{ $userr->id }}() {
                $(document).ready(function() {
                    var _token = "{{ csrf_token() }}";
                    var id = $("#accept{{ $userr->id }}").val();
                    var x = confirm("Are you sure you want to accept this user? This action can not be reversed.");
                    if(x) {
                        $.ajax({
                            url: "/adm/accept-user/"+id,
                            type: 'POST',
                            data: {'id': id, '_token': _token },
                            dataType: 'JSON',
                            beforeSend: function () {
                                NProgress.start(); // start nprogress
                                $("#accept{{ $userr->id }}").prop('disabled', true); // disable button
                            }
                        })
                            .done(function (data) {
                                if(data.status == true){
                                    $(".success-alert").fadeIn('slow');
                                    $(".success-alert").css('display','block');
                                    $(".success-alert").find("p").html(data.message);
                                }else if(data.status == false){
                                    $(".error-alert").fadeIn('slow');
                                    $(".error-alert").css('display','block');
                                    $(".error-alert").find("p").html(data.message);
                                }
                                NProgress.done(); // end nprogress
                                $("#accept{{ $userr->id }}").prop('disabled', false); // enable button
                            })
                            .fail(function () {
                                $(".error-alert").fadeIn('slow');
                                $(".error-alert").css('display','block');
                                $(".error-alert").find("strong").html("Sorry, an error occured some where");
                                NProgress.done(); // end nprogress
                                $("#accept{{ $userr->id }}").prop('disabled', false); // enable button
                            });
                        $(".error-alert").fadeOut('slow');
                        $(".error-alert").css('display','none');
                        $(".success-alert").fadeOut('slow');
                        $(".success-alert").css('display','none');

                    }
                });

            }
        </script>
    @endforeach
@endsection