@extends('layouts.user')
@section('title')
    Withdraw {{$account->blockchain_name}}
@endsection

@section('content')


    <div class="nk-content nk-content-fluid">
        <div class="container-xl wide-lg">
            <div class="nk-content-body">
                <div class="buysell wide-xs m-auto">

                    <div class="buysell-title text-left">
                        <h3 class="title"><a href="#" onclick="history.go(-1)" class="btn btn-icon btn-trigger nk-chat-hide ms-n1  "><em class="icon ni ni-arrow-left "></em></a>   Withdraw {{$account->blockchain_name}}!</h3>
                    </div><!-- .buysell-title -->
                    <div class="buysell-block">
                        <form  class="buysell-form" method="post" id="processWithdraw">
                            @csrf
                            <input type="hidden" name="type" value="g"/>
                            <div class="buysell-field form-group">
                                <div class="form-label-group">
                                    <label class="form-label">Withdraw to </label>
                                </div>
                                <input type="hidden" value=""  id="cryto_rate">
                                <select id="select-crypto" class="form-control selected_crypto" name="coin" style="width: 200px;">
                                    <option value="" data-min="">Select Withdraw Type</option>


                                        <option value="1">Refer2Trade Users - Free </option>
                                        <option value="2">External Address </option>

                                </select>

                            </div><!-- .buysell-field -->

                            <div class="buysell-field form-group" id="receiver_phone" style="display:none">
                                <div class="form-label-group">
                                    <label class="form-label" for="buysell-amount">Refer2Trade Receiver Email Address</label>
                                </div>
                                <div class="form-control-group">
                                    <input type="text" class="form-control form-control-lg form-control-number" id="email_address" name="email_address" placeholder="Refer2Trade Receiver Email Address">

                                </div>

                                <div class="form-note-group">
                                    <span class="buysell-min form-note-alt">Transaction Charges: <span >Free</span></span>

                                </div>
                            </div><!-- .buysell-field -->
                            <div class="buysell-field form-group" id="receiver_address" style="display:none">
                                <div class="form-label-group">
                                    <label class="form-label" for="buysell-amount">Receiver Wallet Address</label>
                                </div>
                                <div class="form-control-group">
                                    <input type="text" class="form-control form-control-lg form-control-number" id="address" name="address" placeholder="Receiver Wallet {{$account->blockchain_name}} Address">

                                </div>
                                <div class="form-note-group">
                                    <span class="buysell-min form-note-alt">Transaction Charges: <span id="min_trade">{{$account->coin->transaction_charges}}</span> USD</span>

                                </div>
                            </div><!-- .buysell-field -->
                            <div class="buysell-field form-group">
                                <div class="form-label-group">
                                    <label class="form-label" for="buysell-amount">Amount</label>
                                </div>
                                <div class="form-control-group">
                                    <input type="number" class="form-control form-control-lg form-control-number" id="amount" name="amount" placeholder="2000" required>
                                    <div class="form-dropdown">
                                        <div class="text">USD</div>

                                    </div>
                                </div>
                                <div class="form-note-group">
                                    <span class="buysell-min form-note-alt">Account Balance: <span id="min_trade">{{$account->availableBalance.$account->blockchain_code. ' ('.$account->availableBalanceUSD}}</span> USD)</span>
                                    <span class="buysell-min form-note-alt">Minimum Withdraw: <span id="min_trade">{{$account->coin->minimum_withdraw}}</span> USD</span>

                                </div>
                            </div><!-- .buysell-field -->


                            <div class="buysell-field form-action">
                                <button class="btn btn-lg btn-block  btn-primary" type="button" id="loading-btn" disabled style="display: none">
                                    <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>            <span>Loading...</span>        </button>


                                <button type="submit" class="btn btn-lg btn-block btn-primary" id="btn-submit">Process Withdraw</button>
                            </div><!-- .buysell-field -->

                        </form><!-- .buysell-form -->
                    </div><!-- .buysell-block -->
                </div><!-- .buysell -->
            </div>
        </div>
    </div>
@include("user.crypto._preview-withdraw_modal")
@endsection

@push('script')

    <script>
        $(document).ready(function() {
            $('#select-crypto').change(function() {
              //  alert($(this).val());
                var selectedValue = $(this).val();

                if (selectedValue === '1') {
                    $('#receiver_address').hide().removeAttr('required');
                    $('#receiver_phone').show().attr('required', true);
                } else if (selectedValue === '2') {
                    $('#receiver_address').show().attr('required', true);
                    $('#receiver_phone').hide().removeAttr('required');
                } else {
                    $('#receiver_address').hide().removeAttr('required');
                    $('#receiver_phone').hide().removeAttr('required');
                }
            });
        });
    </script>
    <script>
        'use strict';

        $('#select-crypto').select2();
        $('.select2-container--default .select2-selection--single').css({
            'height': '40px'
        });

        $('#processWithdraw').on('submit', function(e) {
            e.preventDefault();
            var form = $(this);
            var amount = form.find('input[name="amount"]').val()
            var address = form.find('input[name="address"]').val()
            var withdrawType =   $("#select-crypto").val();
            var email_address =   $("#email_address").val();




            var submitButton = form.find('button[type="submit"]');
            submitButton.html('Loading...');
            if(withdrawType==""){
                showAlert('Please Select Withdraw Type','error');
                return;
            }

            if(amount ==""){
                showAlert('Please Specify Amount','error');
                return;
            }
            if(address =="" && withdrawType=="2"){
                showAlert('Please Recipient Address','error');
                return;
            }
            if(email_address =="" && withdrawType=="1"){
                showAlert('Please Recipient Email Address','error');
                return;
            }

            submitButton.prop('disabled', true);
            $.ajax({
                type: 'POST',
                url: '{{route('user.crypto.post-withdraw-asset',$account->virtual_account_id)}}',
                data: {
                    _token: '{{ csrf_token() }}',
                    amount:amount, address:address, type:'g',
                    withdraw_type:withdrawType, email_address:email_address
                },
                beforeSend: function() {
                    // Disable the submit button

                },
                success: function(response) {
                    // Handle the successful response
                    // showAlert(response.message,'success');
                    submitButton.prop('disabled', false);
                    submitButton.html('Process Withdraw');

                    $("#receiverAddress").html(response.recipient);
                    $("#wamount").html("$"+amount);

                    $(".pm-currency").append(response.value);
                   if(withdrawType=="1") {
                       $("#wtype").append('Withdraw to Refer2Trade Users');
                   }else if(withdrawType=="2"){
                       $("#wtype").append('Withdraw to External Address');
                   }


                  //  var gasFees =  $("#gas");
                    // gasFees.append('<option value="'+response.slow+'">Slow Network ('+response.slow+'{{$asset}})</option>');
                    $('#modalPreviewWithdraw').modal('show');
                    //  location.reload();


                    // Hide the modal or perform any other necessary actions
                },
                error: function(xhr, status, error) {
                    // Handle the error response
                     //console.error();
                   // console.log(xhr);
                    showAlert(xhr.responseJSON.message,'error');
                    submitButton.prop('disabled', false);
                    submitButton.html('Process Withdraw');
                    //$('#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);
                    submitButton.html('Process Withdraw');
                }
            });
        });
        $('.confirmBtn').on('click', function(e) {
            e.preventDefault();
            //var form = $(this);
            var amount = $("#amount").val();
            var address =$("#address").val();
            var withdrawType =   $("#select-crypto").val();
            var email_address =   $("#email_address").val();


            var pass = $('#password').val();

           // console.log(networkFees);



            var submitButton = $(".confirmBtn");
            submitButton.html('Loading...');
            if(withdrawType==""){
                showAlert('Please Select Withdraw Type','error');
                return;
            }

            if(amount ==""){
                showAlert('Please Specify Amount','error');
                return;
            }
            if(address ==""){
                showAlert('Please Specify Recipient Address','error');
                return;
            }
            if(pass ==""){
                showAlert('Please Add Your Password','error');
                return;
            }

            if(address =="" && withdrawType=="2"){
                showAlert('Please Recipient Address','error');
                return;
            }
            if(email_address =="" && withdrawType=="1"){
                showAlert('Please Recipient Email Address','error');
                return;
            }
            submitButton.prop('disabled', true);
            $.ajax({
                type: 'POST',
                url: '{{ route("user.crypto.post-withdraw-asset", $asset) }}',
                data: {
                    _token: '{{ csrf_token() }}',
                    amount: amount,
                    address:address,
                    type:'a',
                    password:pass,
                    withdraw_type:withdrawType,
                    email_address:email_address


                },
                beforeSend: function() {
                    // Disable the submit button

                },
                success: function(response) {
                    // Handle the successful response
                    // showAlert(response.message,'success');
                    submitButton.prop('disabled', false);
                    submitButton.html('Confirm Withdraw');
                    showAlert('Withdraw successful with trxId: '+response.id+" View in explorer",'success');
                    // location.reload();


                    // Hide the modal or perform any other necessary actions
                },
                error: function(xhr, status, error) {
                    // Handle the error response

                    submitButton.prop('disabled', false);
                    submitButton.html('Confirm Withdraw');
                    showAlert(xhr.responseJSON.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