check payment status is not working if the ws server is down
This commit is contained in:
aungthetkhaing
@@ -253,140 +253,151 @@
|
||||
|
||||
<script defer type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
const $paymentWaiting = $('.payment-waiting');
|
||||
const amountToReceive = <%= number_with_precision(@sale_data.grand_total, precision: precision.to_i) %>;
|
||||
const receiptNo = $('#receipt_no').text();
|
||||
let paymentProcessed = false;
|
||||
let fallbackTimeout;
|
||||
const $paymentWaiting = $('.payment-waiting');
|
||||
const amountToReceive = <%= number_with_precision(@sale_data.grand_total, precision: precision.to_i) %>;
|
||||
const receiptNo = $('#receipt_no').text();
|
||||
let paymentProcessed = false;
|
||||
let fallbackTimeout;
|
||||
let connected = false;
|
||||
|
||||
function handlePaymentSuccess(){
|
||||
if(paymentProcessed) return;
|
||||
paymentProcessed = true;
|
||||
clearTimeout(fallbackTimeout);
|
||||
$('#cancel-btn').hide();
|
||||
$paymentWaiting.html(`
|
||||
<img src="/image/mmqr.webp" alt="MMQR Payment" style="max-width: 120px; margin-bottom: 10px;">
|
||||
<div class="payment-success text-center">
|
||||
<i class="material-icons" style="font-size: 50px; color: #4CAF50;">check_circle</i>
|
||||
<h3 class="m-t-20" style="color: #4CAF50;">Payment Successful!</h3>
|
||||
<p>Amount Received: ${amountToReceive}</p>
|
||||
</div>
|
||||
`);
|
||||
function handlePaymentSuccess() {
|
||||
if (paymentProcessed) return;
|
||||
paymentProcessed = true;
|
||||
clearTimeout(fallbackTimeout);
|
||||
$('#cancel-btn').hide();
|
||||
$paymentWaiting.html(`
|
||||
<img src="/image/mmqr.webp" alt="MMQR Payment" style="max-width: 120px; margin-bottom: 10px;">
|
||||
<div class="payment-success text-center">
|
||||
<i class="material-icons" style="font-size: 50px; color: #4CAF50;">check_circle</i>
|
||||
<h3 class="m-t-20" style="color: #4CAF50;">Payment Successful!</h3>
|
||||
<p>Amount Received: ${amountToReceive}</p>
|
||||
</div>
|
||||
`);
|
||||
|
||||
$.ajax({
|
||||
url: '/foodcourt/qrpay/process_payment',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
headers: {
|
||||
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
data: JSON.stringify({ sale_id: "<%= @sale_data.sale_id %>" }),
|
||||
success: (data) => {
|
||||
if (data.status) {
|
||||
customer_display_view({
|
||||
msg: "Payment Successful",
|
||||
paid_amount: amountToReceive,
|
||||
receipt_no: receiptNo
|
||||
}, "pay_success");
|
||||
|
||||
setTimeout(() => {
|
||||
window.location.href = "/";
|
||||
}, 2000);
|
||||
}
|
||||
},
|
||||
error: (xhr, status, error) => {
|
||||
console.log("Error:", error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function checkPaymentStatus() {
|
||||
$.ajax({
|
||||
url: '/foodcourt/qrpay/check_payment_status',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
headers: {
|
||||
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
data: JSON.stringify({ receipt_no: receiptNo }),
|
||||
success: function(response) {
|
||||
if (response.status === "PAY_SUCCESS") {
|
||||
handlePaymentSuccess();
|
||||
} else if (response.status === "CONFIG_ERROR") {
|
||||
clearTimeout(fallbackTimeout);
|
||||
} else {
|
||||
if (!paymentProcessed) {
|
||||
fallbackTimeout = setTimeout(checkPaymentStatus, 5000);
|
||||
}
|
||||
}
|
||||
},
|
||||
error: function() {
|
||||
if (!paymentProcessed) {
|
||||
fallbackTimeout = setTimeout(checkPaymentStatus, 5000);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const cable = ActionCable.createConsumer("wss://juicecorner-0mo.sx-fc.app/cable");
|
||||
|
||||
const subscription = cable.subscriptions.create(
|
||||
{
|
||||
channel: "NagatoChannel",
|
||||
receipt_no: receiptNo
|
||||
$.ajax({
|
||||
url: '/foodcourt/qrpay/process_payment',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
headers: {
|
||||
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
{
|
||||
connected() {
|
||||
data: JSON.stringify({ sale_id: "<%= @sale_data.sale_id %>" }),
|
||||
success: (data) => {
|
||||
if (data.status) {
|
||||
customer_display_view({
|
||||
msg: "Payment Successful",
|
||||
paid_amount: amountToReceive,
|
||||
receipt_no: receiptNo
|
||||
}, "pay_success");
|
||||
|
||||
setTimeout(() => {
|
||||
window.location.href = "/";
|
||||
}, 2000);
|
||||
}
|
||||
},
|
||||
error: (xhr, status, error) => {
|
||||
console.log("Error:", error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function checkPaymentStatus() {
|
||||
$.ajax({
|
||||
url: '/foodcourt/qrpay/check_payment_status',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
headers: {
|
||||
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
data: JSON.stringify({ receipt_no: receiptNo }),
|
||||
success: function(response) {
|
||||
if (response.status === "PAY_SUCCESS") {
|
||||
handlePaymentSuccess();
|
||||
} else if (response.status === "CONFIG_ERROR") {
|
||||
clearTimeout(fallbackTimeout);
|
||||
} else if (!paymentProcessed) {
|
||||
fallbackTimeout = setTimeout(checkPaymentStatus, 5000);
|
||||
}
|
||||
},
|
||||
error: function() {
|
||||
if (!paymentProcessed) {
|
||||
fallbackTimeout = setTimeout(checkPaymentStatus, 5000);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// ----- WebSocket Setup -----
|
||||
const cable = ActionCable.createConsumer("wss://juicecorner-0mo.sx-fc.app/cable");
|
||||
|
||||
const subscription = cable.subscriptions.create(
|
||||
{
|
||||
channel: "NagatoChannel",
|
||||
receipt_no: receiptNo
|
||||
},
|
||||
{
|
||||
connected() {
|
||||
console.log("Nagato channel connected");
|
||||
connected = true;
|
||||
fallbackTimeout = setTimeout(checkPaymentStatus, 30000);
|
||||
},
|
||||
},
|
||||
|
||||
received(data) {
|
||||
console.log("Received:", data);
|
||||
if (data.status === "PAY_SUCCESS" && !paymentProcessed) {
|
||||
clearTimeout(fallbackTimeout);
|
||||
handlePaymentSuccess();
|
||||
}
|
||||
},
|
||||
received(data) {
|
||||
console.log("Received:", data);
|
||||
if (data.status === "PAY_SUCCESS" && !paymentProcessed) {
|
||||
clearTimeout(fallbackTimeout);
|
||||
handlePaymentSuccess();
|
||||
}
|
||||
},
|
||||
|
||||
disconnected() {
|
||||
console.log("Nagato channel disconnected");
|
||||
disconnected() {
|
||||
console.log("Nagato channel disconnected");
|
||||
if (!paymentProcessed) {
|
||||
fallbackTimeout = setTimeout(checkPaymentStatus, 30000);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
function customer_display_view(data, status) {
|
||||
$.post('/foodcourt/customer_view', {
|
||||
data: data,
|
||||
status: status
|
||||
}, function(result) {
|
||||
}, 'json');
|
||||
}
|
||||
);
|
||||
|
||||
$('#cancel-btn').on('click', function(e) {
|
||||
const postData = {
|
||||
sale_id: "<%= @sale_data.sale_id %>"
|
||||
};
|
||||
// Fallback if WebSocket doesn't connect within 5 seconds
|
||||
setTimeout(() => {
|
||||
if (!connected) {
|
||||
console.warn("WebSocket failed to connect — falling back to polling.");
|
||||
checkPaymentStatus(); // start polling
|
||||
}
|
||||
}, 5000);
|
||||
|
||||
$.ajax({
|
||||
url: '/foodcourt/qrpay/cancel',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
headers: {
|
||||
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
data: JSON.stringify(postData),
|
||||
success: function(data) {
|
||||
if (data.status) {
|
||||
customer_display_view(null, "reload");
|
||||
window.location.href = "/";
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.log("Error:", error);
|
||||
}
|
||||
});
|
||||
function customer_display_view(data, status) {
|
||||
$.post('/foodcourt/customer_view', {
|
||||
data: data,
|
||||
status: status
|
||||
}, function(result) {}, 'json');
|
||||
}
|
||||
|
||||
$('#cancel-btn').on('click', function(e) {
|
||||
const postData = {
|
||||
sale_id: "<%= @sale_data.sale_id %>"
|
||||
};
|
||||
|
||||
$.ajax({
|
||||
url: '/foodcourt/qrpay/cancel',
|
||||
method: 'POST',
|
||||
contentType: 'application/json',
|
||||
headers: {
|
||||
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
|
||||
},
|
||||
data: JSON.stringify(postData),
|
||||
success: function(data) {
|
||||
if (data.status) {
|
||||
customer_display_view(null, "reload");
|
||||
window.location.href = "/";
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.log("Error:", error);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user