@include('layouts.header')

<main class="mar">
<div class="mb-4 pb-4"></div>

<h3 class="text-center mb-3">Review Your Details</h3>
<p class="text-center mb-5">Please make sure the spelling of your name and email, all other details match those your checkout details.<br> Mistakes can not be corrected later after the proceed to payment. </p>

<section class="login-register container mb-5 bodr">

<div>
 
    <div class="check-details"><b>Email :</b> {{ session('billing_email') ?? ''}}</div>
    <div class="check-details"><b>Name :</b> {{ session('billing_name') ?? ''}}</div>
    <div class="check-details"><b>Mobile :</b> +91 {{ session('billing_phone') ?? ''}}</div>
    <div class="check-details"><b>Amount :</b> ₹{{ session('total') ?? ''}}</div>
</div>

<button id="pay-btn" class="btn btn-primary btn-checkout heightss">Proceed To Payment</button>

</section>
<div class="mb-4 pb-4"></div>
</main>


@include('layouts.footer')
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script>
document.getElementById('pay-btn').onclick = async function () {
    const amount = {{ session('total', 0) }} // Convert to paise
    const BASE_URL = "{{ env('APP_URL') }}";

    const res = await fetch(BASE_URL + '/razorpay/order', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': '{{ csrf_token() }}'
        },
        body: JSON.stringify({ amount: amount }) // Rs. 500
    });

    const data = await res.json();
    console.log(data);
    

    const options = {
        key: data.key,
        amount: data.amount,
        currency: data.currency,
        name: "Griffin",
        description: "Test Transaction",
        order_id: data.order_id,
        handler: function (response) {
            // send to backend
            fetch(BASE_URL + '/razorpay/verify', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                body: JSON.stringify(response)
            })
            .then(res => res.json())
            .then(result => {
                
                if (result.status === 'success') {
                    const successUrl = `${BASE_URL}/payment/success/${result.order_id}`;
                    window.location.href = successUrl;

                } else {
                    const failureUrl = `${BASE_URL}/payment/failure/${result.order_id}`;
                    window.location.href = failureUrl;                                    
                }
            });
        }
    };

    const rzp = new Razorpay(options);
    rzp.open();
}
</script>