@extends('layouts.simple.master')

@section('title', 'Default')

@section('css')

@endsection

@section('style')
<link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/animate.css') }}">
@endsection

@section('breadcrumb-title')
<h3>Deposit</h3>
@endsection

@section('breadcrumb-items')
<li class="breadcrumb-item">Deposit</li>
@endsection

@section('content')
<style>
    @media only screen and (max-width: 768px) {
        .mob-view {
            padding-right: 22px !important;
            width: 100% !important;
            height: 100% !important;
            padding-top: 18px !important;
            font-weight: 600 !important;
        }

        .head {
            font-size: 16px !important
        }
    }
</style>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-8 col-12">
            <div class="card">
                <div class="card-body p-4">
                    <div class="row">
                        <div class="col-md-12">
                            <label for=""><b>Account Type: </b></label><br>
                            <input type="radio" name="" id="" checked>
                            <label for="">Wallet</label>
                        </div>
                        <div class="col-md-12">
                            <label for=""><b>Wallet Number</b></label>
                            <select name="" id="" class="form-control" disabled>
                                <option value="">USD1009 &nbsp;&nbsp; Wallet &nbsp;&nbsp; USD</option>
                                <option value="">USD103 &nbsp;&nbsp; Wallet &nbsp;&nbsp; USD</option>
                                <option value="">USD802 &nbsp;&nbsp; Wallet &nbsp;&nbsp; USD</option>
                            </select>
                        </div>
                        @if (!empty($payment_gateways))
                            @foreach ($payment_gateways as $payment_gateway)
                                @if ($payment_gateway->entity_title == 'Payoneer' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/payoneer.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal()">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'Payeer' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/trans1.jpg') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal()">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'Perfect Money' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/perfectmoney.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal('perfect_money')">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'Skrill' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/skrill.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal()">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'Neteller' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/neteller.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal()">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'Card' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/credit-card.jfif') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal()">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'BTC' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/btc.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal('crypto')">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'ETH' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/ethereum.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal('crypto')">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'LTC' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/ltc.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da" onclick="show_modal('crypto')">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'TRX' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/tron-trx-logo.png') }}" class="mt-3 banner-mb" alt=""
                                            height="110" width="180" style="border:2px solid #ced4da"
                                            onclick="show_modal('crypto')">
                                    </div>
                                @endif
                                @if ($payment_gateway->entity_title == 'USDT' && empty($payment_gateway->entity_description))
                                    <div class="col-md-3 col-6 mt-3">
                                        <img src="{{ asset('assets/04-usdt.png') }}" class="mt-3 banner-mb" alt="" height="110"
                                            width="180" style="border:2px solid #ced4da"
                                            onclick="show_modal('USDT','{{$payment_gateway->id}}')">
                                    </div>
                                @endif
                            @endforeach
                        @endif
                        <div class="col-md-3 col-6 p-t-15 mt-3">
                            <a href="{{ route('client_payment_agents') }}" class="btn btn-primary pt-0 mob-view"
                                style="padding-right: 22px;">
                                <h1 class="head">Payment Agents</h1>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-3 history">
            <div class="card">
                <div class="card-body" style="height: 60rem;">
                    <h3 class="his_heading">History</h3>
                    <button class="btn btn-primary btn-sm history_btn" style="margin-top: 40%;">History</button>
                    @if (!empty($deposit_history))
                            <div class="row" style="position: relative; top: 17%; width: 100%;">
                                <table
                                    style="width: 100%; border-collapse: collapse; overflow-y: scroll; max-height: 30rem; display: block;">
                                    <thead>
                                        <tr>
                                            <th style="border: 2px solid grey; padding: 10px;">Amount</th>
                                            <th style="border: 2px solid grey; padding: 10px;">Status</th>
                                            <th style="border: 2px solid grey; padding: 10px;">Created At</th>
                                        </tr>
                                    </thead>
                                    <tbody style=" max-height: 30rem; overflow-y: auto;">
                                        @foreach ($deposit_history as $row)
                                                            @if($row->user_id == Auth::guard('client')->user()->id)
                                                                                @if (!empty($row->meta_data))
                                                                                                    @php
                                                                                                        $meta_data = json_decode($row->meta_data);
                                                                                                    @endphp
                                                                                @endif
                                                                                @if(!isset($meta_data->type) && empty($meta_data->type))
                                                                                    <tr style="border: 2px solid grey;">
                                                                                        <td style="border: 2px solid grey; padding: 10px;">${{ $row->amount }}</td>
                                                                                        <td style="border: 2px solid grey; padding: 10px;">
                                                                                            @if($row->status == 1)
                                                                                                <span class="badge" style="background-color:#607d8b;">Processing</span>
                                                                                            @elseif($row->status == 2)
                                                                                                <span class="badge badge-warning">Pending</span>
                                                                                            @elseif($row->status == 3)
                                                                                                <span class="badge badge-success">Approve</span>
                                                                                            @elseif($row->status == 4)
                                                                                                <span class="badge badge-danger">Denied</span>
                                                                                            @endif
                                                                                        </td>
                                                                                        <td style="border: 2px solid grey; padding: 10px;">
                                                                                            {{ optional($row->created_at)->format('j M Y') ?? 'N/A' }}
                                                                                        </td>
                                                                                    </tr>
                                                                                @endif
                                                            @endif
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                    @else
                        <p style="text-align: center; margin-top: 100%;">No Deposit History Found</p>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="add_amount" tabindex="-1" role="dialog" aria-labelledby="add_newLabel" aria-hidden="true">
    <div class="modal-dialog modal-md modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="add_newLabel">Enter Amount</h5>
                <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"
                    data-bs-original-title="" title=""></button>
            </div>

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

<script type="text/javascript">
    var session_layout = '{{ session()->get('
    layout ') }}';
</script>
<script>
    function show_modal(condition = '', id = null) {
        $('#add_amount').modal('show');
        $('#add_amount').find('.modal-body').remove();
        $('#add_amount').find('.modal-footer').remove();

        var html = `<div class="modal-body">
                <div class="row">
                    <div class="col-md-12 mb-2">
                        <label for="">Amount</label>
                        <input type="number" name="" id="" class="form-control">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Deposit Now</button>
                <button class="btn btn-danger" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Cancel</button>
            </div>`;
        if (condition == 'perfect_money') {


            html = `
            <form action="https://perfectmoney.com/api/step1.asp" id="perfectmoney_from" method="POST">
                <input type="hidden" name="PAYEE_ACCOUNT" value="{{ $perfectmoney['meta_data']['pm_uid'] ?? '' }}">
                <input type="hidden" name="PAYEE_NAME" value="{{ $perfectmoney['meta_data']['pm_companyname'] ?? '' }}">
                <input type="hidden" name="PAYMENT_ID" class="paymentid" value="">
                <input type="hidden" name="PAYMENT_UNITS" value="{{ env('PM_UNITS') }}">
                <input type="hidden" name="STATUS_URL" value="">
                <input type="hidden" name="PAYMENT_URL" value="{{ route('pm_success') }}">
                <input type="hidden" name="PAYMENT_URL_METHOD" value="GET">
                <input type="hidden" name="NOPAYMENT_URL" value="{{ route('pm_fail') }}">
                <input type="hidden" name="NOPAYMENT_URL_METHOD" value="GET">
                <input type="hidden" name="SUGGESTED_MEMO" value="">
                <input type="hidden" name="BAGGAGE_FIELDS" value="">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12 mb-2">
                            <label for="">Amount</label>
                            <input type="number" name="PAYMENT_AMOUNT" class="form-control" min="10" max="99999">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-primary" type="button" onclick="depositPMRequst();">Deposit Now</button>
                    <button class="btn btn-danger" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Cancel</button>
                </div>
            </form>
            `;
        }
        if (condition == 'payeer') {
            html = `
            <form  method="post" action="https://payeer.com/merchant/">
                <input type="hidden" name="m_shop" value="">
                <input type="hidden" name="m_orderid" value="">
                <input type="hidden" name="m_amount" value="">
                <input type="hidden" name="m_curr" value="">
                <input type="hidden" name="m_desc" value="">
                <input type="hidden" name="m_sign" value="">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12 mb-2">
                            <label for="">Amount</label>
                            <input type="number" name="PAYMENT_AMOUNT" class="form-control" min="10" max="99999">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-primary" type="button" onclick="depositPMRequst();">Deposit Now</button>
                    <button class="btn btn-danger" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Cancel</button>
                </div>
            </form>
            `;

        }
        if (condition == 'crypto') {
            html = `
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12 mb-2">
                            <input type="hidden" name="meta_data[crypto_gateways]">
                            <input type="hidden" name="meta_data[blockchain_network]">
                        <label>Payment Gateways</label>
                        <select class="form-control" id="" onchange="show_gateways(this);change_sg_val(this)">
                        <option value="2">BTC</option>
                        <option value="">ETH</option>
                        <option value="">LTC</option>
                        <option value="">TRX</option>
                        <option value="1">USDT</option>
                        </select>
                        </div>
                        <div class="col-md-12 mb-2">
                            <label>Address</label>
                            <input type="text" name="meta_data[address]" class="form-control" required>
                        </div>                        
                        <div class="col-md-12 mb-2">
                            <label>Blockchain / Network</label>
                            <select id="blockchain" class="form-control" onchange="change_bk_val(this)">
                            <option value="1">TRC20</option>
                            <option value="2">ERC20</option>
                            </select>
                        </div>
                                                <div class="col-md-12 mb-2">
                            <label for="">Amount</label>
                            <input type="number" name="amount" class="form-control" min="10" max="99999">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-primary" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Deposit Now</button>
                    <button class="btn btn-danger" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Cancel</button>
                </div>
            `
        }
        if (condition == 'USDT') {
            html = `<form  method="post" action="{{route('USDTDeposit')}}">
            @csrf
                <div class="modal-body">
                    <div class="row">
                <div class="col-md-12 mb-2">
            <input type="hidden" name="meta_data[crypto_gateways]" value="USDT">
            <input type="hidden" name="meta_data[blockchain_network]" value="TRC20">
            <input type="hidden" name="gateway_type" >
            <label>Payment Gateways</label>
                        <select class="form-control" id="" onchange="show_gateways(this);change_sg_val(this)" disabled>
                        <option value="1">USDT</option>
                        </select>
                        </div>
                        <div class="col-md-12 mb-2">
                            <label>Address</label>
                            <input type="text" name="meta_data[address]" class="form-control" required>
                        </div>                        
                        <div class="col-md-12 mb-2">
                            <label>Blockchain / Network</label>
                            <select id="blockchain" class="form-control" onchange="change_bk_val(this)">
                            <option value="1">TRC20</option>
                            <option value="2">ERC20</option>
                            </select>
                        </div>
                                                <div class="col-md-12 mb-2">
                            <label for="">Amount</label>
                            <input type="number" name="amount" class="form-control" min="10" max="99999">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-primary" type="submit" >Deposit Now</button>
                    <button class="btn btn-danger" type="button" data-bs-dismiss="modal" data-bs-original-title="" title="">Cancel</button>
                </div> 
                </form>`

        }
        $('#add_newLabel').text(condition);
        $('#add_amount').find('.modal-content').append(html);
        if (id) {
            $('input[name="gateway_type"]').val(id);
        }

    }

    function depositPMRequst() {
        $.ajax({
            type: "POST",
            url: "{{ route('pm_request') }}",
            async: false,
            data: $('#perfectmoney_from').serialize(), // Corrected 'searilize' to 'serialize'
            dataType: "json",
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') // Adding CSRF token
            },
            success: function (response) {
                if (response.status) {
                    $('#perfectmoney_from').find('.paymentid').val(response.payment_request_id);
                    $('#perfectmoney_from').submit();
                }
            },
            error: function (xhr, status, error) {
                alert(error)
            }
        });

    }

    function change_sg_val(obj) {
        var val = $(obj).find('option:selected').text();
        $('input[name="meta_data[crypto_gateways]"]').val(val)
        change_bk_val($('#blockchain'))
    }

    function change_bk_val(obj) {
        var val = $(obj).find('option:selected').text();
        $('input[name="meta_data[blockchain_network]"]').val(val)
    }

    function show_gateways(obj) {
        var val = $(obj).val();
        var option_html = ''
        if (val == 1) {
            $('#blockchain').attr('disabled', false);
            option_html = `<option value="1">TRC20</option>
                            <option value="2">ERC20</option>`;
            $('#blockchain').html(option_html);
        } else if (val == 2) {
            $('#blockchain').attr('disabled', false);
            option_html = `<option value="3">Bitcoin</option>
                            <option value="2">ERC20</option>`;
            $('#blockchain').html(option_html);
        } else {
            $('#blockchain').attr('disabled', true);
            $('#blockchain').html('');
        }
    }
    $(document).ready(function () {
        var $withdrawInput = $('input[name="amount"]');
        var $depositInput = $('input[name="PAYMENT_AMOUNT"]');

        $withdrawInput.on('input', function () {
            if (this.validity.rangeUnderflow) {
                this.setCustomValidity("Minimum Deposit Limit is $10.");
            } else {
                this.setCustomValidity("");
            }
            if (this.validity.rangeOverflow) {
                this.setCustomValidity("Maximum Deposit Limit is $99999.");
            } else {
                this.setCustomValidity("");
            }
        });
        $depositInput.on('input', function () {
            if (this.validity.rangeUnderflow) {
                this.setCustomValidity("Minimum Deposit Limit is $10.");
            } else {
                this.setCustomValidity("");
            }
            if (this.validity.rangeOverflow) {
                this.setCustomValidity("Maximum Deposit Limit is $99999.");
            } else {
                this.setCustomValidity("");
            }
        });
    });
</script>
@endsection

@section('script')
<script src="{{ asset('assets/js/chart/apex-chart/moment.min.js') }}"></script>
<script src="{{ asset('assets/js/notify/bootstrap-notify.min.js') }}"></script>
<script src="{{ asset('assets/js/dashboard/default.js') }}"></script>
<script src="{{ asset('assets/js/notify/index.js') }}"></script>
<script src="{{ asset('assets/js/typeahead/handlebars.js') }}"></script>
<script src="{{ asset('assets/js/typeahead/typeahead.bundle.js') }}"></script>
<script src="{{ asset('assets/js/typeahead/typeahead.custom.js') }}"></script>
<script src="{{ asset('assets/js/typeahead-search/handlebars.js') }}"></script>
<script src="{{ asset('assets/js/typeahead-search/typeahead-custom.js') }}"></script>
<script src="{{ asset('assets/js/height-equal.js') }}"></script>
<script src="{{ asset('assets/js/animation/wow/wow.min.js') }}"></script>
@endsection