@include('front.header')
<!-- Include necessary Razorpay script -->
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>

<form action="{{ route('payment.callback') }}" method="POST">
    @csrf
    <input type="hidden" name="razorpay_order_id" value="{{ $orderId }}">
    
    <button type="submit" id="submitBtn" class="btn btn-primary" style="display: none;">Make Payment Now</button>
</form>

<script>
    var orderId = "{{ $orderId }}";

    var options = {
        key: 'rzp_test_d7lTybqGKtoVvr',
        amount: 50000, // amount in the smallest currency unit (e.g., 50000 for ₹500.00)
        currency: 'INR',
        name: 'ADDITIVE',
        description: 'Payment',
        image: 'https://via.placeholder.com/150',
        order_id: orderId,
        handler: function (response) {
            // Handle success callback
            console.log(response);
        },
        prefill: {
            name: 'John Doe',
            email: 'john@example.com',
            contact: '9999999999'
        }
    };

    var rzp = new Razorpay(options);

    rzp.open();
     document.getElementById('rzp-button').onclick = function (e) {
         rzp.open();
         e.preventDefault();
    }

    $('#submitBtn').click(); // Simulating a click on the submit button

</script>
@include('front.footer')