@extends('layouts.admin')

@section('title')
   @lang('Deposits')
@endsection

@section('breadcrumb')
 <section class="section">
    <div class="section-header">
        <h1>@lang('Approve Crypto Trades Payout')</h1>

    </div>
</section>
@endsection

@section('content')
    <script>
        function reconfirm(address, coin, id) {
            //  e.preventDefault();
            //  alert('Hid');
            var submitBtn = $('#submit'+id);
            var loadingBtn = $('#loading-btn'+id);

            //var formData = $('.buysell-form').serialize();

            //var selectedCrypto = $(this).find('option:selected');
            var address =address; //$(this).data('address');
            var coin =coin;// $(this).data('coin');
         //   var coin =id;// $(this).data('coin');

            loadingBtn.show();
            submitBtn.hide();
            $.ajax({
                url: "{{route('admin.crypto.confirm')}}",
                type: "POST",
                data: {'address': address, 'coin': coin, 'order_id':id},
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function (response) {
                    console.log(response)
                    //  showError(response);
                    loadingBtn.hide();
                    submitBtn.show();
                    if (!(response.confirmed)) {
                        showAlert(response.message + " error", 'error')
                    } else {
                        showAlert(response.vout + ' Payment Received', 'success')
                    }
                    // console.log(response);
                    // window.location.href = "{{url('user/crypto/track-payment')}}"+"/"+response.data;
                },
                error: function (xhr, status, error) {

                    console.log(xhr.responseJSON.message);
                    loadingBtn.hide();
                    submitBtn.show();
                    showAlert(xhr.responseJSON.message, 'error');

                }
            })
        }
    </script>
<div class="row">
    <div class="col-12 col-md-12 col-lg-12">
        <div class="card">
            <div class="card-header d-flex justify-content-end">
                <form action="" class="d-flex flex-wrap justify-content-end">
                    <div class="form-group m-1 flex-grow-1">
                     <select class="form-control" onChange="window.location.href=this.value">
                         <option value="{{filter('status','')}}">@lang('All Trades')</option>

                         <option value="{{filter('status','pending')}}" {{request('status')=='Pending'?'selected':''}}>@lang('Pending Trades')</option>

                         <option value="{{filter('status','completed')}}" {{request('status')=='Completed'?'selected':''}}>@lang('Completed Trades')</option>

                         <option value="{{filter('status','rejected')}}" {{request('status')=='Accepted'?'selected':''}}>@lang('Accepted Trades')</option>
                     </select>
                    </div>

                     <div class="form-group m-1 flex-grow-1">
                         <div class="input-group">
                             <input type="text" class="form-control" name="search" value="{{$search ?? ''}}" placeholder="@lang('Transaction ID')">
                             <div class="input-group-append">
                                 <button class="input-group-text btn btn-primary text-white" id="my-addon"><i class="fas fa-search"></i></button>
                             </div>
                         </div>
                     </div>
                </form>
            </div>
            <div class="card-body text-center">
                <div class="table-responsive">
                    <table class="table table-striped">
                        <tr>
                            <th>@lang('Reference ID')</th>
                            <th>@lang('User')</th>
                            <th>@lang('Descriptions')</th>
                            <th>@lang('Amount Credited')</th>
                            <th>@lang('Action')</th>
                        </tr>
                        @forelse ($trades as $trade)
                            <tr>

                                <td data-label="@lang('Reference ID')">
                                    {{$trade->order_id}}
                                </td>
                                <td class="text-left" >
                                    {{$trade->name}}<br>
                                    {{$trade->phone}}
                                </td>
                                <td class="text-left" >

                                    <b>Amount Received:</b>  {{number_format($trade->deducted_asset_amount, 8)}}{{$trade->pay_currency}} - ${{$trade->deducted_asset_amount_usd}}<br>
                                    <b>Payout Amount:</b> {{toMoney($trade->converted_amount, 2)}}<br>
                                    <b>Refer Bonus Payout Amount:</b> {{toMoney($trade->refer_bonus, 2)}}<br>
                                    <b>Rate:</b> {{toMoney($trade->rate, 2)}}<br>







                                    @if($trade->payment_status=='Payment Received')
                                        <span class="tb-odr-status">
                                                                <span class="badge badge-success">PAYMENT RECEIVED</span>
                                                            </span>

                                    @elseif($trade->payment_status=='Credited')
                                        <span class="tb-odr-status">
                                                                <span class="badge badge-primary">CREDITED</span>
                                                            </span>
                                    @else
                                        <span class="tb-odr-status">
                                                                <span class="badge badge-danger">{{$trade->payment_status}}</span>
                                                            </span>
                                    @endif
                                    <button class="btn btn-sm btn-primary" type="button" id="loading-btn{{$trade->order_id}}" disabled style="display: none">
                                        <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>            <span>Loading...</span>        </button>
                                    <button class="btn btn-sm btn-primary" id="submit{{$trade->order_id}}" onclick="reconfirm('{{$trade->pay_address}}','{{$trade->pay_currency}}','{{$trade->order_id}}')" data-address="{{$trade->pay_address}}" data-coin="{{$trade->pay_currency}}">Reconfirm Payment</button>

                                </td>
                                <td class="text-left" >
                                    {{toMoney($trade->converted_amount, 2)}}<br>

                                    @if($trade->fund_wallet_status=='Approved')
                                        <span class="tb-odr-status">
                                                                <span class="badge badge-info">Approved Payout</span>
                                                            </span>

                                    @elseif($trade->fund_wallet_status=='Rejected')
                                        <span class="tb-odr-status">
                                                                <span class="badge badge-danger">Rejected</span>
                                                            </span>
                                    @else
                                        <span class="tb-odr-status">
                                                                <span class="badge badge-info">Pending Approval</span>
                                                            </span>
                                    @endif

                                </td> <td class="text-left" >


                                    <div class="align-items-center justify-content-end justify-content-lg-center">

                                        <a href="javascript:void()" class="btn btn-primary approve btn-sm" data-id="{{$trade->id}}" data-toggle="tooltip" title="@lang('Approve')"><i class="fas fa-check"></i></a>
                                        <a href="javascript:void()" class="btn btn-danger reject btn-sm m-1" data-id="{{$trade->id}}"data-toggle="tooltip" title="@lang('Reject')"><i class="fas fa-ban"></i></a>
                                    </div>
                                </td>




                            </tr>
                        @empty

                            <tr>
                                <td class="text-center" colspan="100%">@lang('No Data Found')</td>
                            </tr>

                        @endforelse
                    </table>
                </div>
            </div>
            @if ($trades->hasPages())
                {{ $trades->links() }}
            @endif
        </div>
    </div>
</div>

<div id="approveModal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form action="{{route('admin.crypto.approve.payout')}}" id="approvePayoutForm" method="POST">
            @csrf
            <input type="hidden" name="id">
            <div class="modal-content">
                <div class="modal-body">
                    <h6 class="mt-3">@lang('Are you sure to approve?')</h6>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-dark" data-dismiss="modal">@lang('Close')</button>
                    <button type="submit" class="btn btn-primary">@lang('Confirm')</button>
                </div>
            </div>
        </form>
    </div>
</div>
<div id="rejectModal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form action="{{route('admin.crypto.reject.payout')}}"  method="POST">
            @csrf
            <input type="hidden" name="id">
            <div class="modal-content">
                <div class="modal-body">
                    <h6 class="mt-3">@lang('Are you sure to reject?')</h6>

                    <div class="form-group">
                        <label>@lang('Reject Reasons')</label>
                        <textarea name="reject_reason" class="form-control mt-2"  rows="5"></textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-dark" data-dismiss="modal">@lang('Close')</button>
                    <button type="submit" class="btn btn-danger">@lang('Confirm')</button>
                </div>
            </div>
        </form>
    </div>
</div>
@endsection

@push('script')
    <script>
        'use strict';
        $('.approve').on('click',function () {
            $('#approveModal').find('input[name=id]').val($(this).data('id'))
            $('#approveModal').modal('show')
        })
        $('.reject').on('click',function () {
            $('#rejectModal').find('input[name=id]').val($(this).data('id'))
            $('#rejectModal').modal('show')
        })


        $('#approvePayoutForm').on('submit', function(e) {
            e.preventDefault();

            var form = $(this);
            var id = form.find('input[name="id"]').val();
            var submitButton = form.find('button[type="submit"]');

            $.ajax({
                type: 'POST',
                url: '{{ route("admin.crypto.approve.payout") }}',
                data: {
                    _token: '{{ csrf_token() }}',
                    id: id
                },
                beforeSend: function() {
                    // Disable the submit button
                    submitButton.prop('disabled', true);
                },
                success: function(response) {
                    // Handle the successful response
                  showAlert(response.message,'success');
                    $('#approveModal').modal('hide');
                    location.reload();


                    // Hide the modal or perform any other necessary actions
                },
                error: function(xhr, status, error) {
                    // Handle the error response
                   // console.error(error);
                    showAlert(response.message,'error');
                    //$('#approveModal').modal('hide');
                   // location.reload();
                    // Show an error message or perform any other necessary actions
                },
                complete: function() {
                    // Re-enable the submit button
                    submitButton.prop('disabled', false);
                }
            });
        });
    </script>
@endpush