更新充值临时支付页
This commit is contained in:
zhx
parent
9d3b43bee6
commit
aebb22facb
@ -249,6 +249,14 @@
|
||||
<h2>创建支付链接</h2>
|
||||
<form id="createForm">
|
||||
<div class="form-grid">
|
||||
<div class="field full">
|
||||
<label for="appCode">App</label>
|
||||
<select id="appCode">
|
||||
<option value="lalu">lalu</option>
|
||||
<option value="yumi">yumi</option>
|
||||
<option value="aslan">aslan</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="field full">
|
||||
<label for="paymentMethod">支付方式</label>
|
||||
<select id="paymentMethod" required>
|
||||
@ -284,7 +292,7 @@
|
||||
<label for="returnUrl">支付完成返回地址</label>
|
||||
<input
|
||||
id="returnUrl"
|
||||
placeholder="不填则返回当前页面"
|
||||
placeholder="默认按选择的 App 返回充值页"
|
||||
type="url"
|
||||
/>
|
||||
</div>
|
||||
@ -357,13 +365,17 @@
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<script src="../common/api.js"></script>
|
||||
<script>
|
||||
(function () {
|
||||
var API_BASE_URL = 'https://api.global-interaction.com/';
|
||||
var RETURN_URL_BASE =
|
||||
'https://h5.global-interaction.com/recharge/index.html';
|
||||
var methods = [];
|
||||
var latestPaymentLink = '';
|
||||
var latestOrderID = '';
|
||||
var returnUrlTouched = false;
|
||||
var els = {
|
||||
appCode: document.getElementById('appCode'),
|
||||
coinAmount: document.getElementById('coinAmount'),
|
||||
copyLink: document.getElementById('copyLink'),
|
||||
createButton: document.getElementById('createButton'),
|
||||
@ -382,11 +394,16 @@
|
||||
verifyResult: document.getElementById('verifyResult'),
|
||||
};
|
||||
|
||||
els.envMeta.textContent =
|
||||
'App：' +
|
||||
window.HyAppAPI.getAppCode() +
|
||||
' ｜ API：' +
|
||||
window.HyAppAPI.baseURL();
|
||||
setDefaultReturnURL(true);
|
||||
renderEnvMeta();
|
||||
els.appCode.addEventListener('change', function () {
|
||||
setDefaultReturnURL(false);
|
||||
renderEnvMeta();
|
||||
loadMethods();
|
||||
});
|
||||
els.returnUrl.addEventListener('input', function () {
|
||||
returnUrlTouched = true;
|
||||
});
|
||||
els.createForm.addEventListener('submit', createPaymentLink);
|
||||
els.reloadMethods.addEventListener('click', loadMethods);
|
||||
els.copyLink.addEventListener('click', function () {
|
||||
@ -406,9 +423,7 @@
|
||||
function loadMethods() {
|
||||
setMessage(els.createMessage, '正在加载支付方式...', '');
|
||||
els.paymentMethod.disabled = true;
|
||||
return window.HyAppAPI.get(
|
||||
'/api/v1/recharge/h5/temporary/methods'
|
||||
)
|
||||
return apiGet('/api/v1/recharge/h5/temporary/methods')
|
||||
.then(function (data) {
|
||||
methods = Array.isArray(data.methods)
|
||||
? data.methods
|
||||
@ -484,18 +499,13 @@
|
||||
}
|
||||
setLoading(els.createButton, true, '创建中...');
|
||||
setMessage(els.createMessage, '正在创建支付链接...', '');
|
||||
window.HyAppAPI.post(
|
||||
'/api/v1/recharge/h5/temporary/orders',
|
||||
{
|
||||
coin_amount: coinAmount,
|
||||
usd_minor_amount: usdMinorAmount,
|
||||
provider_code: method.provider_code,
|
||||
payment_method_id: method.method_id,
|
||||
return_url:
|
||||
els.returnUrl.value.trim() ||
|
||||
window.location.href,
|
||||
}
|
||||
)
|
||||
apiPost('/api/v1/recharge/h5/temporary/orders', {
|
||||
coin_amount: coinAmount,
|
||||
usd_minor_amount: usdMinorAmount,
|
||||
provider_code: method.provider_code,
|
||||
payment_method_id: method.method_id,
|
||||
return_url: currentReturnURL(),
|
||||
})
|
||||
.then(function (data) {
|
||||
latestPaymentLink = data.payment_link || '';
|
||||
latestOrderID =
|
||||
@ -541,7 +551,7 @@
|
||||
'正在向后端查询支付状态...',
|
||||
''
|
||||
);
|
||||
window.HyAppAPI.get(
|
||||
apiGet(
|
||||
'/api/v1/recharge/h5/temporary/orders/' +
|
||||
encodeURIComponent(orderID)
|
||||
)
|
||||
@ -571,7 +581,7 @@
|
||||
var order = data.order || {};
|
||||
var paymentLink = data.payment_link || order.pay_url || '';
|
||||
target.innerHTML = [
|
||||
resultRow('订单号', order.order_id || '-'),
|
||||
resultRow('订单ID', order.order_id || '-'),
|
||||
resultRow(
|
||||
'支付状态',
|
||||
'<span class="status ' +
|
||||
@ -638,6 +648,153 @@
|
||||
});
|
||||
}
|
||||
|
||||
function apiGet(path) {
|
||||
return apiRequest(path, { method: 'GET' });
|
||||
}
|
||||
|
||||
function apiPost(path, body) {
|
||||
return apiRequest(path, {
|
||||
method: 'POST',
|
||||
body: body || {},
|
||||
});
|
||||
}
|
||||
|
||||
function apiRequest(path, options) {
|
||||
var opts = options || {};
|
||||
var headers = {
|
||||
'X-App-Code': currentAppCode(),
|
||||
};
|
||||
var body;
|
||||
if (opts.body) {
|
||||
headers['Content-Type'] = 'application/json';
|
||||
body = JSON.stringify(opts.body);
|
||||
}
|
||||
return fetch(apiURL(path), {
|
||||
method: opts.method || 'GET',
|
||||
headers: headers,
|
||||
body: body,
|
||||
credentials: 'omit',
|
||||
}).then(function (response) {
|
||||
return response.text().then(function (text) {
|
||||
var payload = parsePayload(text);
|
||||
if (!response.ok) {
|
||||
var error = new Error(
|
||||
errorMessage(response, payload, text)
|
||||
);
|
||||
error.status = response.status;
|
||||
error.payload = payload;
|
||||
throw error;
|
||||
}
|
||||
if (isAPIFailure(payload)) {
|
||||
throw new Error(
|
||||
payload.message ||
|
||||
payload.errorMsg ||
|
||||
payload.error ||
|
||||
'接口请求失败'
|
||||
);
|
||||
}
|
||||
return Object.prototype.hasOwnProperty.call(
|
||||
payload,
|
||||
'data'
|
||||
)
|
||||
? payload.data
|
||||
: payload;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function apiURL(path) {
|
||||
return new URL(
|
||||
path.replace(/^\/+/, ''),
|
||||
API_BASE_URL
|
||||
).toString();
|
||||
}
|
||||
|
||||
function parsePayload(text) {
|
||||
if (!text) return {};
|
||||
try {
|
||||
return JSON.parse(text);
|
||||
} catch (_) {
|
||||
return { message: text };
|
||||
}
|
||||
}
|
||||
|
||||
function errorMessage(response, payload, text) {
|
||||
if (response.status === 404) {
|
||||
return '接口不存在或后端还没有部署到线上';
|
||||
}
|
||||
return (
|
||||
payload.message ||
|
||||
payload.errorMsg ||
|
||||
payload.error ||
|
||||
text ||
|
||||
response.statusText ||
|
||||
'接口请求失败'
|
||||
);
|
||||
}
|
||||
|
||||
function isAPIFailure(payload) {
|
||||
var code = payload && payload.code;
|
||||
var errorCode = payload && payload.errorCode;
|
||||
return (
|
||||
(typeof code === 'number' && code !== 0) ||
|
||||
(typeof code === 'string' &&
|
||||
code !== '' &&
|
||||
code !== 'OK') ||
|
||||
(typeof errorCode === 'number' && errorCode !== 0) ||
|
||||
(typeof errorCode === 'string' &&
|
||||
errorCode !== '' &&
|
||||
errorCode !== '0' &&
|
||||
errorCode !== 'OK')
|
||||
);
|
||||
}
|
||||
|
||||
function currentAppCode() {
|
||||
var value = String(els.appCode.value || 'lalu')
|
||||
.trim()
|
||||
.toLowerCase();
|
||||
return value === 'yumi' || value === 'aslan'
|
||||
? value
|
||||
: 'lalu';
|
||||
}
|
||||
|
||||
function currentReturnURL() {
|
||||
return (
|
||||
els.returnUrl.value.trim() ||
|
||||
defaultReturnURL(currentAppCode())
|
||||
);
|
||||
}
|
||||
|
||||
function defaultReturnURL(appCode) {
|
||||
var url = new URL(RETURN_URL_BASE);
|
||||
url.searchParams.set('app_code', appCode || 'lalu');
|
||||
return url.toString();
|
||||
}
|
||||
|
||||
function setDefaultReturnURL(force) {
|
||||
var nextURL = defaultReturnURL(currentAppCode());
|
||||
if (
|
||||
force ||
|
||||
!returnUrlTouched ||
|
||||
isKnownDefaultReturnURL(els.returnUrl.value)
|
||||
) {
|
||||
els.returnUrl.value = nextURL;
|
||||
returnUrlTouched = false;
|
||||
}
|
||||
}
|
||||
|
||||
function isKnownDefaultReturnURL(value) {
|
||||
var text = String(value || '').trim();
|
||||
return ['lalu', 'yumi', 'aslan'].some(function (appCode) {
|
||||
return text === defaultReturnURL(appCode);
|
||||
});
|
||||
}
|
||||
|
||||
function renderEnvMeta() {
|
||||
els.envMeta.textContent =
|
||||
'App：' + currentAppCode() + ' ｜ API：' + API_BASE_URL;
|
||||
}
|
||||
|
||||
function dollarsToMinor(value) {
|
||||
var text = String(value || '').trim();
|
||||
if (!/^\d+(\.\d{1,2})?$/.test(text)) return 0;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user