feat: integrate North Embedded Checkout for bidder payments

resources/views/mywinnings_results.blade.php

@@ -8,6 +8,24 @@
         <div class="panel-heading">Winnings for Bidder #{{ $bidder->bidder_assigned_number }} - {{ $bidder->bidder_fname }} {{ $bidder->bidder_lname }}</div>
 
         <div class="panel-body">
+          @if (isset($error))
+            <div class="alert alert-danger">
+              {{ $error }}
+            </div>
+          @endif
+
+          @if (session('error'))
+            <div class="alert alert-danger">
+              {{ session('error') }}
+            </div>
+          @endif
+
+          @if (session('success'))
+            <div class="alert alert-success">
+              {{ session('success') }}
+            </div>
+          @endif
+
           @if($winnings->count() > 0)
             <table class="table table-striped">
               <thead>
@@ -33,6 +51,16 @@
                 </tr>
               </tfoot>
             </table>
+
+            @if(!$is_checked_out)
+              <div class="text-right">
+                <a href="{{ route('north.checkout', ['bidder_id' => $bidder->idbidders]) }}" class="btn btn-success btn-lg">Pay Now with Credit Card</a>
+              </div>
+            @else
+              <div class="alert alert-success text-center">
+                <strong>Checked Out!</strong> Your payment has been processed.
+              </div>
+            @endif
           @else
             <p>No winning bids found for this bidder number.</p>
           @endif

resources/views/north_checkout.blade.php

@@ -0,0 +1,74 @@
+@extends('layouts.app')
+
+@section('content')
+<div class="container">
+    <div class="row">
+        <div class="col-md-8 col-md-offset-2">
+            <div class="panel panel-default">
+                <div class="panel-heading">Checkout for Bidder #{{ $bidder->bidder_assigned_number }}</div>
+
+                <div class="panel-body">
+                    <h4>Total Amount Due: ${{ number_format($total_cost, 2) }}</h4>
+                    <hr>
+                    
+                    <div id="checkout-container">
+                        <div class="text-center">
+                            <p>Loading secure checkout...</p>
+                            <div class="spinner-border" role="status">
+                                <span class="sr-only">Loading...</span>
+                            </div>
+                        </div>
+                    </div>
+
+                    <hr>
+                    <div class="text-center">
+                        <a href="/mywinnings?bidder_number={{ $bidder->bidder_assigned_number }}" class="btn btn-default">Cancel and Return</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script src="https://checkout.north.com/checkout.js"></script>
+<script>
+    document.addEventListener('DOMContentLoaded', async () => {
+        const bidderId = "{{ $bidder->idbidders }}";
+        const csrfToken = "{{ csrf_token() }}";
+
+        try {
+            // Create a checkout session
+            const response = await fetch(`/north/session/${bidderId}`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'X-CSRF-TOKEN': csrfToken
+                }
+            });
+
+            const data = await response.json();
+
+            if (data.error) {
+                document.getElementById('checkout-container').innerHTML = `<div class="alert alert-danger">${data.error}</div>`;
+                return;
+            }
+
+            const sessionToken = data.sessionToken;
+
+            // Initialize North Checkout
+            // The global 'checkout' object is provided by checkout.js
+            await checkout.mount(sessionToken, 'checkout-container');
+
+            // Handle completion
+            checkout.onPaymentComplete((result) => {
+                // Redirect to verify the payment on the server
+                window.location.href = `/north/verify/${bidderId}?sessionToken=${sessionToken}`;
+            });
+
+        } catch (error) {
+            console.error('Checkout Error:', error);
+            document.getElementById('checkout-container').innerHTML = '<div class="alert alert-danger">An error occurred while initializing checkout. Please try again.</div>';
+        }
+    });
+</script>
+@endsection