@extends('user_dashboard.layouts.app')
@section('content')
    @push('css')
        <style>
            .faq-accordion .accordion-item .accordion-body p {
                padding-bottom: 10px;
                margin-top: 0px;
                color: #fff;
            }

            .input-newsletter {
                border: none;
                height: 48px;
                padding: 15px;
                border-radius: 5px;
                outline: 0;
                color: var(--paragraph-color);
            }
        </style>
    @endpush

    @if ($current_plan->plan->priority < $plan->priority)
        @php
            if (isset($current_plan->plan->upgrade_amount[$plan->priority - $current_plan->plan->priority - 1])) {
                $amount = $current_plan->plan->upgrade_amount[$plan->priority - $current_plan->plan->priority - 1];
            } else {
                $amount = 0;
            }
        @endphp
    @endif

    <div class="rbt-dashboard-area mt--30 mb--50">
        <div class="container-fluid">
            <div class="row g-5">
                <div class="col-lg-3">
                    @include('user_dashboard.layouts.sidebar')
                </div>
                <div class="col-lg-9">
                    <div class="rbt-dashboard-content bg-color-white rbt-shadow-box mb--10">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="section-title">
                                    <h3 class="rbt-title-style-style">Plan</h3>
                                </div>
                            </div>
                        </div>

                        <div class="faq-area ptb-100 bgclr">
                            <div class="container">
                                <div class="section-title text-center">
                                    <h5>Complete Your Order</h5>
                                    <span class="animate-border"></span>
                                </div>
                                <div class="row">
                                    <div class="col-lg-6 col-md-12">
                                        <div class="section-title mb-4 mt-2">
                                            <h5>Your Order Details</h5>
                                        </div>
                                        <table class="table summery-table">
                                            <tbody>
                                                <tr>
                                                    <th>{{ $plan->title }} </th>
                                                    <td>₹ {{ $amount }}/-</td>
                                                </tr>
                                                <tr>
                                                    <th>Order Total</th>
                                                    <td>₹ {{ $amount }}/-</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="col-lg-6 col-md-12 mt-2 mb-3">
                                        {{-- @if(in_array('phonepe',$payment_getway))
                                            <div class="single-method">
                                                <input type="radio" id="atm_card" name="payment-method" value="phonepe">
                                                <label for="atm_card">PhonePe<br> <small style="font-size:10px;font-weight:500;">Add and secure cards as per RBI guidelines</small></label>
                                                <p data-method="phonepe">
                                                    <a class="rbt-btn btn-sm btn-gradient radius-round  btn-sm text-center" onclick="phonepeInitialization()">
                                                        <span class="icon-reverse-wrapper">
                                                            <span class="btn-text">Continue</span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                        </span>
                                                    </a>
                                                </p>
                                            </div>
                                        @endif --}}

                                        {{-- @if(in_array('razorpay',$payment_getway))
                                            <div class="single-method">
                                                <input type="radio" id="razorpay" name="payment-method" value="razorpay">
                                                <label for="razorpay">Razorpay</label>
                                                <p data-method="razorpay">
                                                    <a class="rbt-btn btn-sm btn-gradient radius-round  btn-sm text-center" onclick="razorpayInitialization()">
                                                        <span class="icon-reverse-wrapper">
                                                            <span class="btn-text">Continue</span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                        </span>
                                                    </a>
                                                </p>
                                            </div>
                                        @endif --}}

                                        {{-- @if(in_array('instamojo',$payment_getway))
                                            <div class="single-method">
                                                <input type="radio" id="instamojo" name="payment-method" value="instamojo">
                                                <label for="instamojo">Instamojo</label>
                                                <p data-method="instamojo">
                                                    <a class="rbt-btn btn-sm btn-gradient radius-round  btn-sm text-center" href="#">
                                                        <span class="icon-reverse-wrapper">
                                                            <span class="btn-text">Continue</span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                        </span>
                                                    </a>
                                                </p>
                                            </div>
                                        @endif --}}

                                        {{-- @if(in_array('cosmofeed',$payment_getway))
                                            <div class="single-method">
                                                <input type="radio" id="cosmofeed" name="payment-method" value="cosmofeed">
                                                <label for="cosmofeed">Cosmofeed</label>
                                                <p data-method="cosmofeed">
                                                    <a class="rbt-btn btn-sm btn-gradient radius-round  btn-sm text-center" href="#">
                                                        <span class="icon-reverse-wrapper">
                                                            <span class="btn-text">Continue</span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                        </span>
                                                    </a>
                                                </p>
                                            </div>
                                        @endif --}}

                                        @if(in_array('qr_code',$payment_getway))
                                            <div class="single-method">
                                                <input type="radio" id="qr_code" name="payment-method" value="qr_code">
                                                <label for="qr_code"><img src="{{ asset('frontend/images/UPI.gif') }}" alt="" width="25px"> QR Code <br><small style="font-size:10px;font-weight:500;">Pay by any UPI app</small></label>
                                                <p data-method="qr_code">
                                                    <form action="{{route('user.qr.payment',$plan->id)}}" id="qr-payment-form" method="POST">
                                                        @csrf
                                                    </form>
                                                    <a class="rbt-btn btn-sm btn-gradient radius-round  btn-sm text-center" onclick="$('#qr-payment-form').submit()">
                                                        <span class="icon-reverse-wrapper">
                                                            <span class="btn-text">Continue</span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                        </span>
                                                    </a>
                                                </p>
                                            </div>
                                        @endif

                                        {{-- @if(in_array('wallet',$payment_getway))
                                            <div class="single-method">
                                                <input type="radio" id="wallet" name="payment-method" value="wallet">
                                                <label for="wallet"><img src="{{ asset('frontend/images/UPI.gif') }}" alt="" width="25px"> Wallet</label>
                                                <p data-method="wallet">
                                                    <a class="rbt-btn btn-sm btn-gradient radius-round  btn-sm text-center" href="#">
                                                        <span class="icon-reverse-wrapper">
                                                            <span class="btn-text">Continue</span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                            <span class="btn-icon"><i class="feather-arrow-up-right"></i></span>
                                                        </span>
                                                    </a>
                                                </p>
                                            </div>
                                        @endif --}}

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

    @push('js')
    <script src="https://checkout.razorpay.com/v1/checkout.js"></script>

    <script>
        $('[name="payment-method"]').on('click', function () {
            var $value = $(this).attr('value');
            $('.single-method p').slideUp();
            $('[data-method="' + $value + '"]').slideDown();
        })
    </script>

    <script>

        @if(in_array('phonepe',$payment_getway))
            function phonepeInitialization(){
                $.ajax({
                    type: 'POST',
                    url: "{{route('phonepe.initialization')}}",
                    data: {
                        _token: "{{ csrf_token() }}",
                        error_log_id: "1"
                    },
                    success: function(data) {
                        console.log(data);
                    }
                });
            }
        @endif

        @if(in_array('razorpay',$payment_getway))
            function razorpayInitialization(){
                $.ajax({
                    type: 'POST',
                    url: "{{route('razorpay.initialization')}}",
                    data: {
                        _token: "{{ csrf_token() }}",
                        error_log_id: "1"
                    },
                    success: function(data) {
                        payRazor(data.error_log.order_id)
                    }
                });
            }

            //Razorpay
            function payRazor(order_id) {
                $(window).scrollTop(0);
                $('#loading_div').show()
                var options ={
                    "key": "{{env('RAZORPAY_KEY')}}",
                    "name": "{{config('app.name')}}",
                    "description": "Purchase Plan",
                    "image": "{{asset('backend/img/logo.png')}}",
                    "order_id": order_id,
                    "handler": function(response){
                        $.ajax({
                            type    :   'POST',
                            url     :   "{{ route('razorpay.payment') }}",
                            data    :   {
                                _token              :   "{{csrf_token()}}",
                                error_id            :   "1",
                                razorpay_payment_id :   response.razorpay_payment_id
                            },
                            success: function(data) {
                                window.location.replace(data.route);
                            },error: function(request, status, error) {
                                window.location.replace("{{route('index')}}");
                            }
                        });
                    },"prefill": {
                        "email"     :   "test@gmail.com",
                        "contact"   :   "9999999999",
                    },"theme":{
                        "color": "#4553c8db"
                    },"modal": {
                        "ondismiss": function() {
                            $('.loader').hide();
                        }
                    }
                };
                var rzp1 = new Razorpay(options);
                rzp1.open();
            }
        @endif

    </script>
    @endpush
@endsection