@extends('layouts.user')

@section('content')

<section>

    <div class="container text-center mt-5">

        <h3>Redirecting to Razorpay...</h3>

        <form id="razorpay-form" action="{{ route('razorpay.callback') }}" method="POST">

            @csrf

        </form>

    </div>

</section>



<script src="https://checkout.razorpay.com/v1/checkout.js"></script>

<script>

    var options = {

        "key": "{{ env('RAZORPAY_KEY') }}",

        "amount": "{{ $data['final_total']*100 }}",

        "currency": "INR",

        "name": "{{ $data['name'] }}",

        "description": "Order Payment",

        "order_id": "{{ $data['order_id'] }}",

        "handler": function (response){

            var form = document.getElementById('razorpay-form');



            var input1 = document.createElement('input');

            input1.type = 'hidden';

            input1.name = 'razorpay_payment_id';

            input1.value = response.razorpay_payment_id;

            form.appendChild(input1);



            var input2 = document.createElement('input');

            input2.type = 'hidden';

            input2.name = 'razorpay_signature';

            input2.value = response.razorpay_signature;

            form.appendChild(input2);



            form.submit();

        },

        "prefill": {

            "name": "{{ $data['name'] }}",

            "email": "{{ $data['email'] }}",

            "contact": "{{ $data['contact'] }}"

        },

        "theme": {

            "color": "#528FF0"

        }

    };



    var rzp1 = new Razorpay(options);

    rzp1.open();

</script>

@endsection