Files
scan-code-jssdk/src/services/payment/alipayFormView.js
iqudoo 378c7e4ba5 fix
2026-06-17 16:36:12 +08:00

119 lines
4.0 KiB
JavaScript

import { getConfig } from "../config";
import { createPaymentDialogHost } from "./paymentDialogHost";
import { appendPaymentAmount } from "./paymentAmount";
import { hasEmbedPaymentDialogTarget, delegatePaymentDialog } from "./embedPaymentDialog";
const OVERLAY_ID = "__iscan_payment_alipay_form__";
const dialogHost = createPaymentDialogHost(OVERLAY_ID);
function getStyleConfig(alipayKey, nativeKey, fallback) {
const value = getConfig(alipayKey);
if (value) {
return value;
}
const nativeValue = getConfig(nativeKey);
if (nativeValue) {
return nativeValue;
}
return fallback;
}
function getIframeHeight() {
const height = getConfig("paymentAlipayFormIframeHeight");
if (typeof height === "number" && height > 0) {
return height;
}
return 520;
}
function writeHtmlToIframe(iframe, html) {
const iframeWin = iframe.contentWindow;
const iframeDoc = iframe.contentDocument || (iframeWin && iframeWin.document);
if (!iframeDoc) {
throw new Error("alipay payment iframe document is not available");
}
iframeDoc.open();
iframeDoc.write(html);
iframeDoc.close();
}
export function closeAlipayPaymentForm() {
dialogHost.removeOverlay();
}
export function showAlipayPaymentFormLocal(html, amount, currency) {
if (!html) {
return Promise.reject(new Error("alipay payment form html is required"));
}
if (getConfig("paymentAlipayFormEnabled") === false) {
return Promise.resolve({ shown: false });
}
let paymentIframe;
try {
dialogHost.mountOverlay({
overlayClass: getConfig("paymentAlipayFormOverlayClass") || getConfig("paymentNativeQrOverlayClass"),
panelClass: getConfig("paymentAlipayFormPanelClass") || getConfig("paymentNativeQrPanelClass"),
overlayStyle: getStyleConfig(
"paymentAlipayFormOverlayStyle",
"paymentNativeQrOverlayStyle",
undefined
),
panelStyle: getStyleConfig(
"paymentAlipayFormPanelStyle",
"paymentNativeQrPanelStyle",
"position:relative;width:100%;max-width:480px;background:#fff;border-radius:12px;padding:24px 20px 20px;box-shadow:0 8px 28px rgba(0,0,0,0.22);"
),
closeButtonStyle: getStyleConfig(
"paymentAlipayFormCloseButtonStyle",
"paymentNativeQrCloseButtonStyle",
undefined
),
fillPanel(panel) {
const doc = panel.ownerDocument;
const title = doc.createElement("h3");
title.textContent = getConfig("paymentAlipayFormTitle") || "支付宝支付";
title.style.cssText = "margin:0 0 8px;font-size:18px;font-weight:600;color:#222;line-height:1.35;text-align:center;";
const message = doc.createElement("p");
message.textContent = getConfig("paymentAlipayFormMessage") || "请在下方页面完成支付";
message.style.cssText = "margin:0 0 12px;font-size:14px;color:#666;line-height:1.5;text-align:center;";
const iframeWrap = doc.createElement("div");
iframeWrap.style.cssText = "width:100%;overflow:hidden;border:1px solid #eee;border-radius:8px;background:#fff;";
paymentIframe = doc.createElement("iframe");
paymentIframe.setAttribute("title", "支付宝支付");
paymentIframe.style.cssText = `display:block;width:100%;height:${getIframeHeight()}px;border:0;background:#fff;`;
iframeWrap.appendChild(paymentIframe);
panel.appendChild(title);
appendPaymentAmount(panel, doc, amount, currency);
panel.appendChild(message);
panel.appendChild(iframeWrap);
},
});
} catch (err) {
return Promise.reject(err);
}
try {
writeHtmlToIframe(paymentIframe, html);
return Promise.resolve({ shown: true });
} catch (err) {
dialogHost.removeOverlay();
return Promise.reject(err);
}
}
export function showAlipayPaymentForm(html, amount, currency) {
if (hasEmbedPaymentDialogTarget()) {
const delegated = delegatePaymentDialog("showAlipayPaymentForm", { html, amount, currency });
if (delegated) {
return delegated;
}
}
return showAlipayPaymentFormLocal(html, amount, currency);
}