@extends('user.layouts.app')

@section('content')

<input type="hidden" name="_token" id="_token" value="{{csrf_token()}}">

    <div class="card card-default">
                            <div class="card-header">
                                Laravel - Razorpay Payment Gateway Integration
                            </div>
  
                            <!-- <div class="card-body text-center">
                                <form action="{{ route('razorpay.payment.store') }}" method="POST" >
                                    @csrf
                                    <script src="https://checkout.razorpay.com/v1/checkout.js"
                                            data-key="{{ env('RAZORPAY_KEY') }}"
                                            data-amount="1000"
                                            data-buttontext="Pay 10 INR"
                                            data-name="ItSolutionStuff.com"
                                            data-description="Rozerpay"
                                            data-image="/img/web_logo.png"
                                            data-prefill.name="name"
                                            data-prefill.email="email"
                                            data-theme.color="#ff7529">
                                    </script>
                                </form>
                            </div> -->

                                <div class="row" >
                                        <div class="col-12" style="margin-top:25px">
                                            <button type="button" class="btn btn-success btn-lg proceedToPay" style="width:100%"  id="rzp-button1" >
                                                                    <span class="btn-text">Place Order</span>
                                                                    <span class="btn-hover-text">Proceed to Pay</span>
                                            </button>

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

           <script>

                var options = {
                    "key": "{{ env('RAZORPAY_KEY') }}", // Enter the Key ID generated from the Dashboard
                    "amount": '', // Amount is in currency subunits. Default currency is INR. Hence, 50000 refers to 50000 paise
                    "currency": "INR",
                    "name": "{{ env('APP_NAME') }}",
                    "description": "Test Transaction",
                    "image": "/img/web_logo.png",
                    "callback_url": "",
                    "prefill": {
                        "name": "",
                        "email": "",
                        "contact": ""
                    },
                    "notes": {
                        "address": "Razorpay Corporate Office"
                    },
                    "theme": {
                        "color": "#FCB941"
                    }
                };

                document.getElementById('rzp-button1').onclick = function (e) {
                    var amt =10;
                    var sub_total = 10;
                    var handling = 1;
                    var shipping = 2;
                    var gst_status = 1;
                    var add_id = 1;
                    options['amount'] = 10;
                    params = "total_amt=" + amt + "&tax_status=" + gst_status + "&address_id=" + add_id + "&sub_total=" + sub_total + "&handling=" + handling + "&shipping=" + shipping;
                    options['callback_url'] = "/order-status?" + params;
                    options['prefill']['name'] = $("#fullName_" + add_id).html();
                    options['prefill']['email'] = $("#email_" + add_id).html();
                    options['prefill']['contact'] = $("#contact_" + add_id).html();
                    var rzp1 = new Razorpay(options);
                    rzp1.open();
                    e.preventDefault();
                }
           </script>        
@endsection