// 订单支付页面脚本
let countdownTimer;
let statusCheckTimer;
let timeLeft = 15 * 60; // 15分钟
// 页面加载时开始倒计时
document.addEventListener('DOMContentLoaded', function() {
startCountdown();
});
// 页面卸载时清理定时器
window.addEventListener('beforeunload', function() {
if (countdownTimer) clearInterval(countdownTimer);
if (statusCheckTimer) clearInterval(statusCheckTimer);
});
// 开始倒计时
function startCountdown() {
countdownTimer = setInterval(() => {
timeLeft--;
const minutes = Math.floor(timeLeft / 60);
const seconds = timeLeft % 60;
document.getElementById('countdown').textContent =
`${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
if (timeLeft <= 0) {
clearInterval(countdownTimer);
showAlert('订单已过期,请重新下单', 'warning');
setTimeout(() => {
window.location.href = '/order/list';
}, 2000);
}
}, 1000);
}
// 开始支付
function startPayment() {
const paymentSn = document.querySelector('[data-payment-sn]')?.dataset.paymentSn;
const paymentMethod = document.querySelector('[data-payment-method]')?.dataset.paymentMethod;
if (!paymentSn || !paymentMethod) {
showAlert('支付信息获取失败', 'error');
return;
}
fetch('/payment/process', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
payment_sn: paymentSn,
payment_method: paymentMethod
})
})
.then(response => response.json())
.then(data => {
if (data.success) {
if (data.payment_type === 'qrcode') {
showQRCode(data.qr_code_url);
startStatusCheck();
} else if (data.payment_type === 'redirect') {
window.open(data.pay_url, '_blank');
startStatusCheck();
}
} else {
showAlert(data.message, 'error');
}
})
.catch(error => {
showAlert('支付启动失败,请重试', 'error');
});
}
// 显示二维码
function showQRCode(qrUrl) {
const qrArea = document.getElementById('qrCodeArea');
const qrImage = document.getElementById('qrCodeImage');
// 这里应该使用真实的二维码生成库,现在用文本模拟
qrImage.innerHTML = `
`;
qrArea.style.display = 'block';
}
// 开始检查支付状态
function startStatusCheck() {
statusCheckTimer = setInterval(() => {
checkPaymentStatus();
}, 3000); // 每3秒检查一次
}
// 检查支付状态
function checkPaymentStatus() {
const paymentSn = document.querySelector('[data-payment-sn]')?.dataset.paymentSn;
if (!paymentSn) return;
fetch(`/payment/check_status/${paymentSn}`)
.then(response => response.json())
.then(data => {
if (data.success) {
if (data.status === 2) { // 支付成功
clearInterval(statusCheckTimer);
clearInterval(countdownTimer);
showPaymentSuccess();
}
}
})
.catch(error => {
console.error('状态检查失败:', error);
});
}
// 显示支付成功
function showPaymentSuccess() {
document.getElementById('paymentArea').style.display = 'none';
document.getElementById('paymentStatus').style.display = 'block';
const orderId = document.querySelector('[data-order-id]')?.dataset.orderId;
setTimeout(() => {
window.location.href = `/order/detail/${orderId}`;
}, 2000);
}
// 取消订单
function cancelOrder() {
const orderId = document.querySelector('[data-order-id]')?.dataset.orderId;
if (!orderId) {
showAlert('订单信息获取失败', 'error');
return;
}
if (confirm('确定要取消这个订单吗?')) {
fetch(`/order/cancel/${orderId}`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
}
})
.then(response => response.json())
.then(data => {
if (data.success) {
showAlert('订单已取消', 'success');
setTimeout(() => {
window.location.href = '/order/list';
}, 1500);
} else {
showAlert(data.message, 'error');
}
})
.catch(error => {
showAlert('取消失败,请重试', 'error');
});
}
}
// 模拟支付成功(开发测试用)
function simulatePayment() {
const paymentSn = document.querySelector('[data-payment-sn]')?.dataset.paymentSn;
if (!paymentSn) {
showAlert('支付信息获取失败', 'error');
return;
}
if (confirm('这是测试功能,确定要模拟支付成功吗?')) {
fetch(`/payment/simulate_success/${paymentSn}`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
}
})
.then(response => response.json())
.then(data => {
if (data.success) {
showAlert('模拟支付成功', 'success');
setTimeout(() => {
showPaymentSuccess();
}, 1000);
} else {
showAlert(data.message, 'error');
}
})
.catch(error => {
showAlert('模拟支付失败', 'error');
});
}
}