@extends('layouts.user')

@section('main')

@include('layouts.nav')
 


 
    <div class="container-fluid mt--6">
        <div class="content-wrapper">
    <div class="col-md-12">
        <div class="row mt-4">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">{{ $type }} Payment</h5>
                    <div class="row wallet-address">
                        <div class="col-md-8">
                            <p>


                                <br />1. Copy Company Wallet Address or Scan QR Code
                                <br />2. Make Payment to Wallet Address
                                <br />3. Proceed to wallet and make payment( {{ $amount }} {{ Auth::user()->currency }})
                                <br />4. Upload Proof of Payment
                                <br /><br /> Note that payment will be confirmed

                            </p>
                            <br />




 
            @can('BTC')


            <p>Scan QR Code</p>
                            <img src="https://chart.googleapis.com/chart?chs=200x200&cht=qr&chl= {{ $wallet->btc }}" width="200px" />
                            <br /><br />
                            <p> Wallet Address</p>
                            <div class="input-group input-group-alternative">
                                
                                <span class="input-group-text"><i class="fa fa-copy" onclick="CopyBTCWallet()"></i></span>
                                <input type="url" id="myInput" class="form-control" readonly="readonly" id="BTCWallet" name="BTCWallet" value="{{ $wallet->btc }}">
                            </div>
          



     
            @endcan

            
            @can('USDT')
            <img src="https://chart.googleapis.com/chart?chs=200x200&cht=qr&chl= {{ $wallet->usdt }}" width="200px" />
            <br /><br />
            <p> Wallet Address</p>
            <div class="input-group input-group-alternative">
                
                <span class="input-group-text"><i class="fa fa-copy" onclick="CopyBTCWallet()"></i></span>
                <input type="url" id="myInput" class="form-control" readonly="readonly" id="BTCWallet" name="BTCWallet" value="{{ $wallet->btc }}">
            </div>

          
     
            @endcan

            @can('ETH')
            <img src="https://chart.googleapis.com/chart?chs=200x200&cht=qr&chl= {{ $wallet->eth }}" width="200px" />
            <br /><br />
            <p> Wallet Address</p>
            <div class="input-group input-group-alternative">
                
                <span class="input-group-text"><i class="fa fa-copy" onclick="CopyBTCWallet()"></i></span>
                <input type="url" id="myInput" class="form-control" readonly="readonly" id="BTCWallet" name="BTCWallet" value="{{ $wallet->eth }}">
            </div>

          
     
            @endcan

            @can('BTCCASH')
            <img src="https://chart.googleapis.com/chart?chs=200x200&cht=qr&chl= {{ $wallet->cash }}" width="200px" />
            <br /><br />
            <p> Wallet Address</p>
            <div class="input-group input-group-alternative">
                
                <span class="input-group-text"><i class="fa fa-copy" onclick="CopyBTCWallet()"></i></span>
                <input hidden="hidden" type="text" data-val="true" data-val-number="The field Amount must be a number." data-val-required="The Amount field is required." id="Amount" name="Amount" value="{{ $amount }}" />
                <input type="url" id="myInput" class="form-control" readonly="readonly" id="BTCWallet" name="BTCWallet" value="{{ $wallet->btc }}">
            </div>

          
     
            @endcan


           <button onclick="myFunction()" class="btn btn-primary">Copy Wallet Address</button>
          

            <p>
                <br /> Upload Proof of Payment

            </p>
            <div class="form-group">
                <div class="custom-file">
                <form action="{{ route('proof-upload') }}" method="POST" enctype="multipart/form-data">
                    {{ csrf_field() }}
                    {{ method_field('patch') }}
                   
                    
                    <input type="hidden" name="name" value="{{ Auth::user()->name }}">
                    <input type="hidden" name="email" value="{{ Auth::user()->email }}">
                    <input type="hidden" name="user_id" value="{{ Auth::user()->id }}">
            
                    <input type="file" class="custom-file-input" id="customFileLang" name="image">
                </div>
                <div class="text-right mt-4">
                    <input type="submit"  class="btn btn-primary" /><i class="icon-paperplane ml-2"></i>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>


</div>
<script>
   function myFunction() {
       event.preventDefault();
       var copyText = document.getElementById('myInput');
       copyText.select();
       copyText.setSelectionRange(0, 99999)
       document.execCommand("copy");
       alert("Copied the text: " + copyText.value);

   }
</script> 

</div></div></div></div></div></div>


<script>
// Replace YOUR_API_KEY with your actual API key
const API_KEY = '13f7ba3e1ea60e765a62f130622a14b8881dc44360e2fd0d7b53842e1e8595fe';

// Convert the input currency to the output currency
function convert() {
  // Get the input and output elements
  let inputCurrency = document.getElementById('input-currency');
  let inputAmount = document.getElementById('input-amount');
  let outputCurrency = document.getElementById('output-currency');
  let outputAmount = document.getElementById('output-amount');

  // Get the conversion rate from the CryptoCompare API
  fetch(`https://min-api.cryptocompare.com/data/price?fsym=${inputCurrency.value}&tsyms=${outputCurrency.value}&api_key=${API_KEY}`)
    .then(response => response.json())
    .then(data => {
      // Calculate and display the converted amount
      outputAmount.value = (inputAmount.value * data[outputCurrency.value]).toFixed(2);
    })
    .catch(error => {
      // Handle any errors
      console.error(error);
    });
}
</script>

@endsection