feat(subscription): 优化订阅及支付二维码生成流程

- 统一调用 subscribe 接口创建订阅,确保后端设置价格类型
- 免费应用订阅成功后直接激活,提示订阅成功并刷新订阅信息
- 付费应用订阅成功后调用 pay 接口生成支付小程序码
- 支持显示支付二维码,展示付费信息,弹出支付模态框
- 增加支付状态轮询逻辑以跟踪支付进度
- 优化错误处理,打印错误日志并提示用户重试
This commit is contained in:
2026-07-15 14:25:14 +08:00
parent 09af76e4ea
commit 7c73f9f821

View File

@@ -499,32 +499,35 @@ const confirmSubscribe = async () => {
if (!product?.productId) return; if (!product?.productId) return;
subscribing.value = true; subscribing.value = true;
try { try {
if (isFreeProduct.value) { // 1. 创建订阅subscribe 后端会 setPriceType避免 generatePayQrcode 的 price_type 报错)
// 免费应用:直接创建并激活 const subResult = await subscriptionStore.subscribe({
await subscriptionStore.subscribe({
productId: product.productId, productId: product.productId,
subscriptionPeriod: selectedPeriod.value subscriptionPeriod: selectedPeriod.value
}); });
// 免费应用subscribe 直接激活status=active
if (subResult.status === 'active') {
message.success('订阅成功'); message.success('订阅成功');
subscribeModalVisible.value = false; subscribeModalVisible.value = false;
refreshSubscription(); refreshSubscription();
return; return;
} }
// 付费应用:生成支付小程序码 // 2. 付费应用:用 pay 生成支付小程序码(参考 websopy-pc 的 subscribe + pay 模式)
const result = await subscriptionStore.generatePayQrcode({ const payResult = await subscriptionStore.pay(
productId: product.productId, subResult.subscriptionId,
subscriptionPeriod: selectedPeriod.value, 'wechat',
envVersion envVersion
}); );
paySubscriptionNo.value = result.subscriptionNo; if ('miniappQrcode' in payResult) {
payQrcode.value = result.qrcodeBase64; paySubscriptionNo.value =
payPrice.value = Number(result.payPrice) || 0; payResult.subscriptionNo || subResult.subscriptionNo;
payProductName.value = payQrcode.value = payResult.miniappQrcode;
result.productName || product.productName || '应用订阅'; payPrice.value = Number(payResult.payPrice) || 0;
payProductName.value = product.productName || '应用订阅';
subscribeModalVisible.value = false; subscribeModalVisible.value = false;
payModalVisible.value = true; payModalVisible.value = true;
// 开始轮询支付状态 // 开始轮询支付状态
startPolling(result.subscriptionNo); startPolling(paySubscriptionNo.value);
}
} catch (e: any) { } catch (e: any) {
console.error('创建订阅失败:', e); console.error('创建订阅失败:', e);
message.error(e?.message || '创建订阅失败,请重试'); message.error(e?.message || '创建订阅失败,请重试');