From 60750285204ba1057e61cf2dd5cfd5668c5983be Mon Sep 17 00:00:00 2001 From: unknown Date: Fri, 18 Sep 2026 17:48:54 +0800 Subject: [PATCH] =?UTF-8?q?fix(pay):=20=E6=94=AF=E4=BB=98=E6=96=B9?= =?UTF-8?q?=E5=BC=8F=E5=AD=97=E6=A0=B7=E4=B8=8E=E6=8C=89=E9=92=AE=20UI=20?= =?UTF-8?q?=E4=B8=89=E5=BC=B9=E7=AA=97=E7=BB=9F=E4=B8=80=E5=AF=B9=E9=BD=90?= =?UTF-8?q?=20Zibll?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 渠道展示名与按钮 UI 与参考主题 zibpay_get_payment_method_args / zibpay_get_initiate_pay_input 对齐： - 渠道名：aksrt_list_cash_payment_methods 增加 Zibll 基准展示名映射 （余额/支付宝/微信/PayPal/Stripe），充值与会员弹窗不再显示网关 内部名「站内余额」「微信支付」；积分弹窗手写「余额/卡密」与之同源 - 会员按钮字样：cta_label（立即开通/立即续费）→ Zibll 会员弹窗 initiate_pay_input(4) 默认「立即支付」，与充值/积分弹窗一致 - 无可用支付方式：禁用按钮+自实现文案 → Zibll 同款 暂时无法支付，请与客服联系 - 清理：按钮残留类 aksrt-vip-submit 与对应 CSS，加载/禁用态统一挂 .initiate-pay（三弹窗按钮共用）；renderMethods 空数组重复提示与 不可达 reason 映射删除 - 契约测试同步锁定（无 cta_label/aksrt-vip-submit、立即支付字样、 badg 提示、渠道名映射） 弹窗宽度差异（充值/积分 400px modal-mini、会员 600px）为 Zibll 原生设计，已在壳几何对齐时确认一致。 --- assets/css/frontend/vip-modal.css | 4 +-- assets/js/pay-vip.js | 26 +++++++++++-------- inc/helpers/aksrt-pay.php | 15 ++++++++++- .../card-pass-modal-redeem.test.cjs | 11 +++++++- 4 files changed, 41 insertions(+), 15 deletions(-) diff --git a/assets/css/frontend/vip-modal.css b/assets/css/frontend/vip-modal.css index 9e47702e..309348d5 100644 --- a/assets/css/frontend/vip-modal.css +++ b/assets/css/frontend/vip-modal.css @@ -147,8 +147,8 @@ display: none !important; } -.aksrt-vip-submit.is-loading, -.aksrt-vip-submit:disabled { +.initiate-pay.is-loading, +.initiate-pay:disabled { opacity: 0.7; cursor: wait; } diff --git a/assets/js/pay-vip.js b/assets/js/pay-vip.js index 2e51f3b3..a721d8d4 100644 --- a/assets/js/pay-vip.js +++ b/assets/js/pay-vip.js @@ -51,7 +51,6 @@ } function actionReason(reason) { - if (reason === "no_payment_method") return "暂无可用支付方式"; if (reason === "no_package") return "暂无可用套餐"; if (reason === "not_available") return "当前不可用"; return ""; @@ -127,10 +126,7 @@ function renderMethods(parent, methods, cardPass, wallet) { methods = Array.isArray(methods) ? methods : []; - if (!methods.length) { - append(parent, node("div", "muted-2-color text-center padding-10", "暂无可用支付方式")); - return; - } + if (!methods.length) return; // 无可用支付方式：由按钮区渲染 Zibll 同款 badg 提示。 wallet = wallet || {}; var defaultMethod = text(methods[0].id || "balance"); @@ -479,13 +475,21 @@ renderMethods(products, methods, cardPass, wallet); var actionName = actionKey(action); var actionAllowed = allowed[actionName] === true; + var noMethod = methods.length === 0; var reason = actionReason(reasons[actionName]); - var canPurchase = actionAllowed && methods.length > 0; - var submit = node("button", "mt6 but jb-red initiate-pay btn-block radius aksrt-vip-submit", canPurchase ? (group.items[0].cta_label || actionLabel(action)) : (reason || "暂无可用支付方式")); - submit.type = "button"; - submit.disabled = !canPurchase; - submit.setAttribute("data-vip-submit", ""); - append(products, submit); + var canPurchase = actionAllowed && !noMethod; + // 按钮字样对齐参考主题：会员弹窗即 zibpay_get_initiate_pay_input(4) + // 默认文案「立即支付」（开通/续费场景一致）；无可用支付方式时渲染 + // Zibll 同款 badg 提示，而非禁用按钮。 + if (noMethod) { + append(products, node("span", "badg px12 c-yellow-2", "暂时无法支付，请与客服联系")); + } else { + var submit = node("button", "mt6 but jb-red initiate-pay btn-block radius", canPurchase ? "立即支付" : (reason || "暂不可购买")); + submit.type = "button"; + submit.disabled = !canPurchase; + submit.setAttribute("data-vip-submit", ""); + append(products, submit); + } append(row, products); append(form, row); append(pane, form); diff --git a/inc/helpers/aksrt-pay.php b/inc/helpers/aksrt-pay.php index 33c97c96..223cfdf7 100644 --- a/inc/helpers/aksrt-pay.php +++ b/inc/helpers/aksrt-pay.php @@ -105,6 +105,19 @@ if (!function_exists('aksrt_list_cash_payment_methods')) { return []; } + // 渠道展示名对齐参考主题 zibpay_get_payment_method_args： + // 微信 / 支付宝 / 余额 / 卡密 / PayPal / Stripe（网关 get_name 仅供 + // 订单等内部场景，支付方式 UI 统一用本映射）。 + $labels = [ + 'balance' => __('余额', 'aksrt'), + 'alipay' => __('支付宝', 'aksrt'), + 'epay_alipay' => __('支付宝', 'aksrt'), + 'wechatpay' => __('微信', 'aksrt'), + 'epay_wxpay' => __('微信', 'aksrt'), + 'paypal' => 'PayPal', + 'stripe' => 'Stripe', + ]; + $methods = []; $gw = \AKSRT\Payment\Gateway::get_instance(); foreach ($ids as $id) { @@ -117,7 +130,7 @@ if (!function_exists('aksrt_list_cash_payment_methods')) { } $methods[] = [ 'id' => $id, - 'name' => method_exists($g, 'get_name') ? (string) $g->get_name() : $id, + 'name' => $labels[$id] ?? (method_exists($g, 'get_name') ? (string) $g->get_name() : $id), ]; } diff --git a/tests/widget-system/card-pass-modal-redeem.test.cjs b/tests/widget-system/card-pass-modal-redeem.test.cjs index 849aad44..71e659dd 100644 --- a/tests/widget-system/card-pass-modal-redeem.test.cjs +++ b/tests/widget-system/card-pass-modal-redeem.test.cjs @@ -30,6 +30,7 @@ const payVipJs = read('assets', 'js', 'pay-vip.js'); const chargeCard = read('src', 'Payment', 'ChargeCard.php'); const userOrders = read('src', 'Payment', 'UserOrders.php'); const vipPackages = read('src', 'Content', 'VipServicePackages.php'); +const aksrtPay = read('inc', 'helpers', 'aksrt-pay.php'); const vipPurchase = read('src', 'Content', 'VipServicePurchase.php'); const vipModal = read('src', 'Content', 'VipServiceModal.php'); const schemaPhp = read('src', 'Admin', 'Schema', 'SchemaPayment.php'); @@ -123,7 +124,15 @@ test('会员弹窗：卡密渠道注入与直兑分流（不创建支付订单 assert.match(payVipJs, /"data-value", "card_pass"/); assert.match(payVipJs, /hidden\.name = "payment_method"/); assert.match(payVipJs, /mt6 but jb-red initiate-pay btn-block radius/); - assert.doesNotMatch(payVipJs, /uc-vip-shop__method|aksrt_vip_pay_method/); + assert.doesNotMatch(payVipJs, /uc-vip-shop__method|aksrt_vip_pay_method|aksrt-vip-submit/); + // 按钮字样对齐参考主题：会员弹窗即 initiate_pay_input(4) 默认「立即支付」； + // 无可用支付方式渲染 Zibll 同款 badg 提示（而非禁用按钮/自实现文案）。 + assert.doesNotMatch(payVipJs, /cta_label/); + assert.match(payVipJs, /canPurchase \? "立即支付"/); + assert.match(payVipJs, /badg px12 c-yellow-2/, "暂时无法支付，请与客服联系"); + // 渠道展示名对齐参考主题 zibpay_get_payment_method_args（余额/微信/支付宝）。 + assert.match(aksrtPay, /'balance'\s+=> __\('余额', 'aksrt'\)/); + assert.match(aksrtPay, /'wechatpay'\s+=> __\('微信', 'aksrt'\)/); // 显隐：通用 data-controller（==/!=）匹配 + 卡密选中隐藏套餐。 assert.match(payVipJs, /function applyVipMethodVisibility\(/); assert.match(payVipJs, /querySelectorAll\('\[data-controller="payment_method"\]'\)/);