+
+
+
@@ -72,6 +155,83 @@
return null;
}
+ // 检查是否是支付回调
+ function isPaymentCallback() {
+ return getQueryParam('callback') === 'true';
+ }
+
+ // 检查订单状态
+ function checkOrderStatus(orderNo) {
+ return fetch(`/pay/front/api/v1/payPage/status?no=${orderNo}`, {
+ method: 'GET',
+ })
+ .then(response => {
+ if (!response.ok) {
+ throw new Error('网络响应不正常');
+ }
+ return response.json();
+ })
+ .then(data => {
+ if (data.code !== 200) {
+ throw new Error(data.message || '获取订单状态失败');
+ }
+ return data;
+ });
+ }
+
+ // 显示Loading状态
+ function showLoading() {
+ document.getElementById('pay-container').style.display = 'none';
+ document.getElementById('loading').style.display = 'flex';
+ }
+
+ // 隐藏Loading状态
+ function hideLoading() {
+ document.getElementById('pay-container').style.display = 'block';
+ document.getElementById('loading').style.display = 'none';
+ }
+
+ // 处理支付回调
+ function handlePaymentCallback() {
+ const orderNo = getQueryParam('no');
+ if (!orderNo) {
+ console.error('订单号不存在');
+ return;
+ }
+
+ showLoading();
+
+ // 检查订单状态
+ checkOrderStatus(orderNo)
+ .then(data => {
+ if (data.data.status === 'SUCCESS') {
+ // 支付成功，跳转到指定链接
+ if (data.data.redirectUrl) {
+ setTimeout(() => {
+ window.location.href = data.data.redirectUrl;
+ }, 1000);
+ } else {
+ hideLoading();
+ alert('支付成功！');
+ }
+ } else if (data.data.status === 'PENDING') {
+ // 支付处理中，1秒后再次检查
+ setTimeout(() => {
+ handlePaymentCallback();
+ }, 1000);
+ } else {
+ // 支付失败或其他状态
+ hideLoading();
+ alert('支付未完成: ' + (data.data.message || '未知错误'));
+ }
+ })
+ .catch(error => {
+ hideLoading();
+ console.error('检查订单状态失败:', error);
+ alert('检查订单状态失败: ' + error.message);
+ });
+ }
+
// 获取支付方式列表
function fetchPaymentMethods() {
const id = getQueryParam('no');
@@ -89,7 +249,6 @@
} else {
return data;
}
-
} else {
throw new Error('无效');
}
@@ -100,15 +259,17 @@
const pay = document.getElementById('pay');
pay.innerHTML = '
支付环境异常，请检查
';
} else if (data.data.length === 1) {
+ // 只有一个支付方式时，显示支付中状态并直接跳转
+ showLoading();
window.location.href = `/pay/front/api/v1/payPage/submit?pay_channel_id=${data.data[0].pay_channel_id}&no=${id}`;
} else {
renderPaymentMethods(data.data);
}
-
})
.catch(error => {
- console.error('data', data);
-
+ console.error('获取支付方式失败:', error);
+ const pay = document.getElementById('pay');
+ pay.innerHTML = '
获取支付方式失败，请刷新重试
';
});
} else {
console.error('Order no not found in URL');
@@ -122,48 +283,84 @@
const paymentList = document.getElementById('payment-list');
paymentList.innerHTML = '';
+
paymentMethods.forEach(method => {
const listItem = document.createElement('li');
+ listItem.className = 'payment-option';
+
const radioInput = document.createElement('input');
radioInput.type = 'radio';
radioInput.name = 'paymentMethod';
radioInput.value = method.pay_channel_id;
+ radioInput.id = `method-${method.pay_channel_id}`;
+
+ const label = document.createElement('label');
+ label.htmlFor = `method-${method.pay_channel_id}`;
+ label.textContent = method.pay_name;
+
+ if (method.icon_url) {
+ const icon = document.createElement('img');
+ icon.src = method.icon_url;
+ icon.style.height = '24px';
+ icon.style.marginRight = '10px';
+ label.prepend(icon);
+ }
+
listItem.appendChild(radioInput);
- listItem.appendChild(document.createTextNode(method.pay_name));
+ listItem.appendChild(label);
paymentList.appendChild(listItem);
+
+ // 点击整个区域也可以选择
+ listItem.addEventListener('click', () => {
+ radioInput.checked = true;
+ });
});
// 添加提交按钮
const submitButton = document.createElement('button');
submitButton.type = 'button';
- submitButton.textContent = '提交';
+ submitButton.textContent = '立即支付';
submitButton.onclick = function () {
const no = getQueryParam('no');
const selectedMethod = document.querySelector('input[name="paymentMethod"]:checked');
if (selectedMethod) {
+ showLoading();
window.location.href = `/pay/front/api/v1/payPage/submit?pay_channel_id=${selectedMethod.value}&no=${no}`;
} else {
alert('请选择支付方式');
}
};
- paymentList.appendChild(submitButton);
+
+ const buttonContainer = document.createElement('div');
+ buttonContainer.style.textAlign = 'center';
+ buttonContainer.appendChild(submitButton);
+ paymentList.appendChild(buttonContainer);
}
-
- // 在页面加载时调用 fetchPaymentMethods 函数
- window.onload = fetchPaymentMethods;
+ // 页面加载时执行
+ window.onload = function() {
+ if (isPaymentCallback()) {
+ // 如果是支付回调，处理支付结果
+ handlePaymentCallback();
+ } else {
+ // 否则获取支付方式
+ fetchPaymentMethods();
+ }
+ };
{{ else}}
-
{{.message}}
+
+
支付异常
+
{{.message}}
+
+
{{end}}
-