@php $page = 'deposits' @endphp
@extends('includes.layout')

@section('content')
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>Make Payment</h1>
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="{{ route('dashboard') }}"><i class="fa fa-dashboard"></i> Home</a>
            </li>
            <li class="breadcrumb-item active">Make Payment</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-lg-10 offset-lg-1 col-md-10 offset-md-1">
                <div class="row box">
                    <div class="col-lg-12">
                        <p class="text-center">
                            <small>
                                <img src="{{ asset('dashboard/images/used/box-1.png') }}"><br>
                                <span style="font-size: 30px;" class="black">
                                    <strong>Amount: ${{ number_format($order->amount, 2) }} </strong>
                                </span>
                            </small>
                        </p>
                        <div class="">
                            <h4 class="text-center"> <span>== PAY TO OUR WALLETS ==</span> </h4>
                            @if(optional($order->system_wallet)->type == 'bank')
                            <div class="form-group">
                                <label for="bank_name">Bank Name</label>
                                <div class="input-group my-colorpicker2">
                                    <input type="text" id="bank_name" class="form-control" disabled
                                        value="{{ optional($order->system_wallet)->bank_name }}">
                                    <div class="input-group-addon copy-content"
                                        data-val="{{ optional($order->system_wallet)->bank_name }}">
                                        <i class="fa fa-copy"></i>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="account_name">Account Name</label>
                                <div class="input-group my-colorpicker2">
                                    <input type="text" id="account_name" class="form-control" disabled
                                        value="{{ optional($order->system_wallet)->account_name }}">
                                    <div class="input-group-addon copy-content"
                                        data-val="{{ optional($order->system_wallet)->account_name }}"><i
                                            class="fa fa-copy"></i></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="account_number">Account Number</label>
                                <div class="input-group my-colorpicker2">
                                    <input type="number" id="account_number" class="form-control" disabled
                                        value="{{ optional($order->system_wallet)->account_number }}">
                                    <div class="input-group-addon copy-content"
                                        data-val="{{ optional($order->system_wallet)->account_number }}"><i
                                            class="fa fa-copy"></i></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="swift_code">Swift Code</label>
                                <div class="input-group my-colorpicker2">
                                    <input type="text" id="swift_code" class="form-control" disabled
                                        value="{{ optional($order->system_wallet)->swift_code }}">
                                    <div class="input-group-addon copy-content"
                                        data-val="{{ optional($order->system_wallet)->swift_code }}"><i
                                            class="fa fa-copy"></i></div>
                                </div>
                            </div>
                            @endif
                            @if(optional($order->system_wallet)->type == 'crypto')
                            <div class="form-group">
                                <label for="address">{{ optional($order->system_wallet)->name }} Wallet Address</label>
                                <div class="input-group my-colorpicker2">
                                    <input type="text" id="address" class="form-control" disabled
                                        value="{{ optional($order->system_wallet)->address }}">
                                    <div class="input-group-addon copy-content"
                                        data-val="{{ optional($order->system_wallet)->address }}"><i
                                            class="fa fa-copy"></i></div>
                                </div>
                            </div>
                            <div class="row">
                                @if($order->system_wallet->avatar_url != null)
                                <div class="mb-2 col-lg-12">
                                    <h3 class="text-center">Or</h3>
                                    <center>
                                        <img src="{{ $order->system_wallet->avatar_url }}" alt="{{ env('APP_NAME') }}"
                                            width="250" height="250">
                                    </center>
                                </div>
                                @endif
                            </div>
                            @if($order->system_wallet->name == 'USDT')
                            <h3 class="text-center alert alert-warning text-success">
                                Please for {{$order->system_wallet->name}} transactions, send through the <b>TRC20</b>
                                network, failure to do this might result to loss of funds
                            </h3>
                            @endif
                            @endif
                            <div class="text-center alert alert-warning">
                                <h3 class="text-center">
                                    Do well to make your payment to the {{ optional($order->system_wallet)->type ==
                                    'crypto' ? optional($order->system_wallet)->name.' Wallet' : 'Bank Detail' }}
                                    provided above, failure to adhere to this rule might result to loss of funds.
                                </h3>
                            </div>
                            @if(optional($order->system_wallet)->type == 'crypto')
                            <h4 class="text-center black">
                                <strong>== How to pay with {{ $order->system_wallet->name }} ==</strong>
                            </h4>
                            <ol class="black">
                                <li><strong>Get a Wallet:</strong>&nbsp;First you'll need a {{
                                    $order->system_wallet->name }} wallet – an app that lets you receive, hold, and
                                    spend {{ $order->system_wallet->name }}.</li>
                                <li><strong>Make a payment</strong>:&nbsp;Making a blockchain payment is fast,
                                    convenient, and extremely secure.&nbsp;</li>
                            </ol>
                            @endif
                        </div>
                        <hr>
                    </div>
                    <div class="col-lg-12">
                        <h4 class="text-center black">
                            <strong>== Upload Payment Proof ==</strong>
                        </h4>
                        <form action="{{ route('upload.proof', $order->id ) }}" method="POST"
                            enctype="multipart/form-data">@csrf @method('patch')
                            <div class="form-group">
                                <input type="file" class="form-control" name="thumbnail" id="thumbnail" required>
                            </div>
                            <button class="float-right btn btn-primary" type="submit">Upload Payment</button>
                        </form>
                        <hr>
                    </div>
                    <div class="col-lg-12">
                        <div class="text-center">
                            <strong class="black">
                                <small><img src="{{ asset('dashboard/images/used/ac-7.png') }}"> Status</small>
                                <br>
                                <span class="h2 Pending">{{ Str::ucfirst($order->status) }}</span>
                            </strong>
                            <hr>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
<!-- /.content-wrapper -->
@endsection


@push('scripts')
<script>
    $(document).ready(function() {
            $(".copy-content").click(function() {
                var dataVal = $(this).attr('data-val');
                var $tempInput = $('<input>');
                $('body').append($tempInput);
                $tempInput.val(dataVal).select();
                document.execCommand('copy');
                $tempInput.remove();
                alert('Copied to clipboard: ' + dataVal);
            });
        });
</script>
@endpush