155 lines
5.4 KiB
HTML
155 lines
5.4 KiB
HTML
{include file="public/head"}
|
|
<link rel="stylesheet" href="/static/css/wepay.css?v=2">
|
|
</head>
|
|
<body class="wepay-page">
|
|
<div class="zh_content">
|
|
{include file="public/newnav" }
|
|
</div>
|
|
<main
|
|
class="container wepay-shell"
|
|
id="payment-success-page"
|
|
data-payment-confirmed="{$payment_confirmed}"
|
|
data-poll-status-url="{$poll_status_url}"
|
|
>
|
|
<section class="wepay-result-card">
|
|
<div id="payment-pending-block" class="payment-pending" style="display: none;">
|
|
<div class="wepay-result-icon wepay-result-icon--pending">
|
|
<span class="payment-spinner"></span>
|
|
</div>
|
|
<p class="wepay-eyebrow">{:lang('wepay.payment_title')}</p>
|
|
<h1 class="payment-pending-title">{:lang('sqpay.notice_title')}</h1>
|
|
<p class="payment-pending-text">{:lang('sqpay.notice_text')}</p>
|
|
<p class="payment-pending-order">
|
|
{:str_replace('%order_sn%', $order_sn ?? '', lang('pay.order_submitted'))}
|
|
</p>
|
|
<p class="payment-pending-status" id="payment-pending-status">{:lang('sqpay.notice_text')}</p>
|
|
<div class="wepay-actions">
|
|
<a class="wepay-button wepay-button--ghost" href="{$repay_url}">{:lang('pay.repay_button')}</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="payment-success-block" class="wepay-success-detail">
|
|
<div class="wepay-result-icon wepay-result-icon--success">✓</div>
|
|
<p class="wepay-eyebrow">{:lang('wepay.payment_success')}</p>
|
|
<h1>{:lang('pay.thank_you_message')}</h1>
|
|
<p class="wepay-success-order">
|
|
{:str_replace('%order_sn%', $order_sn ?? '', lang('pay.order_submitted'))}
|
|
</p>
|
|
<p class="wepay-success-text">
|
|
{:str_replace('%country%', $country ?? '', lang('pay.processing_time_info'))}
|
|
</p>
|
|
{if $arrive_date_info}
|
|
<p class="wepay-success-text">
|
|
{$arrive_date_info}
|
|
</p>
|
|
{/if}
|
|
<p class="wepay-contact-text">
|
|
{:lang('pay.contact')}
|
|
</p>
|
|
</div>
|
|
|
|
<div class="wepay-actions" id="payment-success-action">
|
|
<a class="wepay-button" href="{:url('visa/index')}">{:lang('pay.visa_application_button')}</a>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
{include file="public/newfooter" }
|
|
<script>
|
|
(function () {
|
|
var pageEl = document.getElementById('payment-success-page');
|
|
if (!pageEl) {
|
|
return;
|
|
}
|
|
|
|
var isConfirmed = pageEl.getAttribute('data-payment-confirmed') === '1';
|
|
var pollUrl = pageEl.getAttribute('data-poll-status-url');
|
|
var pendingBlock = document.getElementById('payment-pending-block');
|
|
var successBlock = document.getElementById('payment-success-block');
|
|
var successAction = document.getElementById('payment-success-action');
|
|
var pendingStatus = document.getElementById('payment-pending-status');
|
|
var pendingText = "{:lang('sqpay.notice_text')}";
|
|
var successText = "{:lang('controller.payment_success')}";
|
|
var pollTimer = null;
|
|
var maxAttempts = 30;
|
|
var attempt = 0;
|
|
|
|
function showPending() {
|
|
if (pendingBlock) {
|
|
pendingBlock.style.display = 'block';
|
|
}
|
|
if (successBlock) {
|
|
successBlock.style.display = 'none';
|
|
}
|
|
if (successAction) {
|
|
successAction.style.display = 'none';
|
|
}
|
|
}
|
|
|
|
function showSuccess() {
|
|
if (pendingBlock) {
|
|
pendingBlock.style.display = 'none';
|
|
}
|
|
if (successBlock) {
|
|
successBlock.style.display = 'block';
|
|
}
|
|
if (successAction) {
|
|
successAction.style.display = 'block';
|
|
}
|
|
}
|
|
|
|
if (isConfirmed || !pollUrl) {
|
|
showSuccess();
|
|
return;
|
|
}
|
|
|
|
showPending();
|
|
|
|
async function pollStatus() {
|
|
attempt++;
|
|
try {
|
|
var response = await fetch(pollUrl, {
|
|
method: 'GET',
|
|
headers: {
|
|
'X-Requested-With': 'XMLHttpRequest'
|
|
}
|
|
});
|
|
var data = await response.json();
|
|
if (data.status === 1) {
|
|
if (pendingStatus) {
|
|
pendingStatus.textContent = successText;
|
|
}
|
|
window.clearInterval(pollTimer);
|
|
showSuccess();
|
|
return;
|
|
}
|
|
|
|
if (data.status === -1 && data.url) {
|
|
window.clearInterval(pollTimer);
|
|
window.location.href = data.url;
|
|
return;
|
|
}
|
|
|
|
if (pendingStatus) {
|
|
pendingStatus.textContent = data.msg || pendingText;
|
|
}
|
|
} catch (e) {
|
|
if (pendingStatus) {
|
|
pendingStatus.textContent = pendingText;
|
|
}
|
|
}
|
|
|
|
if (attempt >= maxAttempts) {
|
|
window.clearInterval(pollTimer);
|
|
if (pendingStatus) {
|
|
pendingStatus.textContent = pendingText;
|
|
}
|
|
}
|
|
}
|
|
|
|
pollStatus();
|
|
pollTimer = window.setInterval(pollStatus, 2000);
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|