milky/asd-backend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 支付成功页轮询确认+升级页onShow自动同步pending订单

Browse Source
This commit is contained in:
milky0217
2026-06-07 10:24:52 +08:00
parent ce3c0ab701
commit b806d0c7e0
1 changed files with 40 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/handlers/payment.rs
View File

@@ -865,6 +865,7 @@ pub struct AlipaySuccessQuery {
fn build_success_html(order_no: &str) -> String {
let green = "#52c41a";
let white = "white";
let orange = "#fa8c16";
let html = format!(
r##"<!DOCTYPE html>
<html lang="zh-CN">
@@ -876,26 +877,55 @@ fn build_success_html(order_no: &str) -> String {
body {{ font-family: -apple-system, BlinkMacSystemFont, sans-serif; background: #f0f2f5; margin: 0; padding: 40px; text-align: center; }}
.card {{ background: #fff; border-radius: 16px; padding: 48px 32px; max-width: 400px; margin: 0 auto; box-shadow: 0 2px 12px rgba(0,0,0,0.1); }}
.icon {{ width: 64px; height: 64px; margin-bottom: 16px; }}
h2 {{ color: {0}; font-size: 22px; margin-bottom: 8px; }}
h2 {{ font-size: 22px; margin-bottom: 8px; }}
p {{ color: #666; font-size: 14px; margin-bottom: 24px; }}
.tip {{ background: #f0f7ff; border-radius: 8px; padding: 16px; font-size: 13px; color: #1677ff; margin-top: 16px; }}
.order-no {{ font-size: 12px; color: #bbb; margin-top: 12px; }}
.loader {{ display: inline-block; width: 32px; height: 32px; border: 3px solid #f0f0f0; border-top-color: {0}; border-radius: 50%; animation: spin 0.8s linear infinite; margin-bottom: 16px; }}
@keyframes spin {{ to {{ transform: rotate(360deg); }} }}
</style>
</head>
<body>
<div class="card">
<svg class="icon" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="32" cy="32" r="32" fill="{0}"/>
<path d="M20 32l8 8 16-16" stroke="{1}" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<h2>支付成功！</h2>
<p>恭喜您已成为会员，额度已自动到账</p>
<div class="tip">请返回微信小程序查看您的会员状态</div>
<div class="order-no">订单号: {2}</div>
<div id="confirmedView" style="display:none">
<svg class="icon" viewBox="0 0 64 64" fill="none"><circle cx="32" cy="32" r="32" fill="{0}"/><path d="M20 32l8 8 16-16" stroke="{1}" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>
<h2 style="color:{0}">支付成功！</h2>
<p>恭喜您已成为会员，额度已自动到账</p>
<div class="tip">请返回微信小程序查看您的会员状态</div>
<div class="order-no">订单号: {2}</div>
</div>
<div id="pendingView">
<div class="loader"></div>
<h2 style="color:{3}">支付确认中...</h2>
<p>我们正在确认您的付款，请稍候</p>
<div class="tip">系统会自动处理，无需重复操作</div>
<div class="order-no">订单号: {2}</div>
</div>
</div>
<script>
(function poll(){{
var orderNo = '{2}';
if (!orderNo) return;
fetch('/api/payment/sync-order', {{
method: 'POST',
headers: {{ 'Content-Type': 'application/json' }},
body: JSON.stringify({{ order_id: orderNo }})
}})
.then(function(r){{ return r.json(); }})
.then(function(data){{
if (data.success && data.data.order_status === 'paid') {{
document.getElementById('confirmedView').style.display = 'block';
document.getElementById('pendingView').style.display = 'none';
}} else {{
setTimeout(poll, 2000);
}}
}})
.catch(function(){{ setTimeout(poll, 2000); }});
}})();
</script>
</body>
</html>"##,
green, white, order_no
green, white, order_no, orange
);
html
}