Commit 352eac48 by renyizhao

优化支付

parent bc9d5ca2
...@@ -150,8 +150,13 @@ ...@@ -150,8 +150,13 @@
</el-checkbox> </el-checkbox>
</div> </div>
<template #footer> <template #footer>
<el-button @click="safetyDialog.visible = false">取消</el-button> <el-button :disabled="safetyDialog.submitting" @click="safetyDialog.visible = false">取消</el-button>
<el-button type="primary" :disabled="!safetyDialog.checked" @click="confirmRecharge">确认充值</el-button> <el-button
type="primary"
:disabled="!safetyDialog.checked"
:loading="safetyDialog.submitting"
@click="confirmRecharge"
>确认充值</el-button>
</template> </template>
</el-dialog> </el-dialog>
...@@ -296,7 +301,8 @@ function handleRecharge() { ...@@ -296,7 +301,8 @@ function handleRecharge() {
} }
// 确认充值 // 确认充值
function confirmRecharge() { async function confirmRecharge() {
if (safetyDialog.value.submitting) return; // 防双击
if (!safetyDialog.value.checked) { if (!safetyDialog.value.checked) {
proxy.$modal.msgError("请先勾选同意安全使用条款"); proxy.$modal.msgError("请先勾选同意安全使用条款");
return; return;
...@@ -305,43 +311,60 @@ function confirmRecharge() { ...@@ -305,43 +311,60 @@ function confirmRecharge() {
// 记录用户已同意安全承诺 // 记录用户已同意安全承诺
localStorage.setItem(STORAGE_KEY_SAFETY_AGREED, 'true'); localStorage.setItem(STORAGE_KEY_SAFETY_AGREED, 'true');
safetyDialog.value.visible = false; // 进入提交态:弹窗不关,按钮转 loading,直到二维码生成成功才关闭
doRecharge(); safetyDialog.value.submitting = true;
try {
await doRecharge(); // 成功(QR 已展示)后再走下面
safetyDialog.value.visible = false;
} catch (e) {
// 失败时弹窗保留,方便用户直接重试;错误提示由 doRecharge 内 msgError 处理
} finally {
safetyDialog.value.submitting = false;
}
} }
function doRecharge() { function doRecharge() {
rechargeLoading.value = true; // 返回 Promise:resolve = 二维码已展示,reject = 出错(弹窗保留)
qrCode.value.url = ""; return new Promise((resolve, reject) => {
rechargeLoading.value = true;
createRecharge(rechargeForm.amount).then(response => { qrCode.value.url = "";
if (response && response.data && response.data.id) {
// 保存当前充值ID用于轮询 createRecharge(rechargeForm.amount).then(response => {
currentRechargeId.value = response.data.id; if (response && response.data && response.data.id) {
// 保存当前充值ID用于轮询
// 生成二维码 currentRechargeId.value = response.data.id;
if (response.data.qrCodeUrl) {
QRCode.toDataURL(response.data.qrCodeUrl, { errorCorrectionLevel: 'L', margin: 2, width: 200 }, (err, url) => { // 生成二维码
if (err) { if (response.data.qrCodeUrl) {
proxy.$modal.msgError("生成二维码失败"); QRCode.toDataURL(response.data.qrCodeUrl, { errorCorrectionLevel: 'L', margin: 2, width: 200 }, (err, url) => {
rechargeLoading.value = false; rechargeLoading.value = false;
return; if (err) {
} proxy.$modal.msgError("生成二维码失败");
qrCode.value.url = url; reject(err);
qrCode.value.visible = true; return;
// 开始轮询 }
createQueryInterval(currentRechargeId.value); qrCode.value.url = url;
}); qrCode.value.visible = true;
// 开始轮询
createQueryInterval(currentRechargeId.value);
proxy.$modal.msgSuccess("充值订单已创建");
resolve();
});
} else {
rechargeLoading.value = false;
proxy.$modal.msgError("获取支付链接失败");
reject(new Error("no qrCodeUrl"));
}
} else { } else {
proxy.$modal.msgError("获取支付链接失败"); rechargeLoading.value = false;
proxy.$modal.msgError("创建充值订单失败");
reject(new Error("invalid response"));
} }
proxy.$modal.msgSuccess("充值订单已创建"); }).catch(error => {
} else { rechargeLoading.value = false;
proxy.$modal.msgError("创建充值订单失败"); proxy.$modal.msgError("充值失败: " + (error.message || "未知错误"));
} reject(error);
rechargeLoading.value = false; });
}).catch(error => {
rechargeLoading.value = false;
proxy.$modal.msgError("充值失败: " + (error.message || "未知错误"));
}); });
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment