-
-
支付处理中,请稍等...
+
+
-
-
-
+ // 渲染支付方式列表
+ function renderPaymentMethods(paymentMethods) {
+ const pay = document.getElementById("pay");
+ pay.innerHTML = "
请选择支付方式
";
- {{ else}}
+ const paymentList = document.getElementById("payment-list");
+ paymentList.innerHTML = "";
-
-
-
支付异常
-
{{.message}}
-
+ // 标记是否是第一个支付方式
+ let isFirstMethod = true;
+
+ paymentMethods.forEach((method) => {
+ const listItem = document.createElement("li");
+ listItem.className = "payment-option";
+
+ const radioInput = document.createElement("input");
+ radioInput.type = "radio";
+ radioInput.name = "paymentMethod";
+ radioInput.value = method.pay_channel_id;
+ radioInput.id = `method-${method.pay_channel_id}`;
+
+ // 如果是第一个支付方式,默认选中
+ if (isFirstMethod) {
+ radioInput.checked = true;
+ listItem.classList.add("selected");
+ isFirstMethod = false;
+ }
+
+ const label = document.createElement("label");
+ label.htmlFor = `method-${method.pay_channel_id}`;
+ label.textContent = method.pay_name;
+
+ if (method.icon_url) {
+ const icon = document.createElement("img");
+ icon.src = method.icon_url;
+ icon.style.height = "24px";
+ icon.style.marginRight = "10px";
+ label.prepend(icon);
+ }
+
+ listItem.appendChild(radioInput);
+ listItem.appendChild(label);
+ paymentList.appendChild(listItem);
+
+ // 点击整个区域也可以选择
+ listItem.addEventListener("click", () => {
+ // 移除所有选中样式
+ document.querySelectorAll(".payment-option").forEach((item) => {
+ item.classList.remove("selected");
+ });
+ // 添加当前选中样式
+ listItem.classList.add("selected");
+ radioInput.checked = true;
+ });
+ });
+
+ // 添加提交按钮
+ const submitButton = document.createElement("button");
+ submitButton.type = "button";
+ submitButton.textContent = "立即支付";
+
+ submitButton.onclick = function () {
+ const no = getQueryParam("no");
+ const selectedMethod = document.querySelector(
+ 'input[name="paymentMethod"]:checked'
+ );
+ if (selectedMethod) {
+ window.location.href = `/pay/front/api/v1/payPage/submit?pay_channel_id=${selectedMethod.value}&no=${no}`;
+ } else {
+ alert("请选择支付方式");
+ }
+ };
+
+ const buttonContainer = document.createElement("div");
+ buttonContainer.style.textAlign = "center";
+ buttonContainer.appendChild(submitButton);
+ paymentList.appendChild(buttonContainer);
+ }
+
+ // 监听页面可见性变化
+ document.addEventListener("visibilitychange", function () {
+ if (!document.hidden && localStorage.getItem("auto-redirect") == 2) {
+ // 页面从后台返回且处于支付状态
+ fetchPaymentMethods();
+ }
+ });
+
+ // 页面加载时执行
+ window.onload = function () {
+ alert(`return:${getQueryParam("return")}`);
+ if (
+ localStorage.getItem("auto-redirect") &&
+ localStorage.getItem("auto-redirect") == 2
+ ) {
+ alert("查询支付状态");
+ handlePaymentCallback(); // 如果是支付回调且不是自动跳转,处理支付结果
+ } else {
+ localStorage.setItem("auto-redirect", 1); // 设置自动跳转标记
+ fetchPaymentMethods(); // 获取支付方式
+ }
+ };
+
+
+ {{ else}}
+
+
+
+
支付异常
+
{{.message}}
+
-
+
- {{end}}
-
-
-{{end}}
\ No newline at end of file
+ {{end}}
+
+{{end}}