test payment

app/views/foodcourt/qrpay/test_payment.html.erb

@@ -2,42 +2,41 @@
 
 <script>
 document.addEventListener('DOMContentLoaded', () => {
-  const ws = new WebSocket("wss://juicecorner-0mo.sx-fc.app/cable")
+  const status = $('#status');
+  const amountToReceive = 500;
 
-  ws.onopen = () => {
+  // Create Action Cable consumer
-    console.log("WS Connected");
+  const cable = ActionCable.createConsumer("wss://juicecorner-0mo.sx-fc.app/cable");
-    ws.send(JSON.stringify({
+
-      command: "subscribe",
+  // Subscribe to channel
-      identifier: JSON.stringify({
+  const subscription = cable.subscriptions.create(
-        channel: "TestChannel"
+    {
-      })
+      channel: "TestChannel",
-    }))
+      receipt_no: "0101234123456789012"
-    document.getElementById('status').textContent = 'Waiting for payment...'
+    },
+    {
+      connected() {
+        console.log("Nagato channel connected");
+      },
+
+      received(data) {
+        console.log("Received:", data);
+
+        if (data.status === "PAY_SUCCESS") {
+          this.handlePaymentSuccess();
         }
+      },
 
-  ws.onmessage = (e) => {
+      handlePaymentSuccess() {
-    const msg = JSON.parse(e.data)
+        status.html(`
-    console.log("Received:", msg)
+          <div class="payment-success text-center">
-
+            <i class="material-icons" style="font-size: 50px; color: #4CAF50;">check_circle</i>
-    // Handle subscription confirmation
+            <h3 class="m-t-20" style="color: #4CAF50;">Payment Successful!</h3>
-    if(msg.type === "confirm_subscription") {
+            <p>Amount Received: ${amountToReceive}</p>
-      console.log("Successfully subscribed!")
+          </div>
-      return
+        `);
-    }
-
-    // Handle payment success
-    if(msg?.message?.status === "PAY_SUCCESS") {
-      document.getElementById('status').innerHTML = `
-        <h3 style="color: green;">Payment Received!</h3>
-        <p>Amount: ${msg.message.amount} ${msg.message.currency}</p>
-      `
-      ws.close()
       }
     }
-
+  );
-  ws.onerror = (e) => {
-    console.error("WS Error:", e)
-    document.getElementById('status').textContent = 'Connection failed'
-  }
 })
 </script>