@pisell/private-materials 6.3.116 → 6.3.117

package/es/components/kioskSkuDetail/index.js

@@ -117,6 +117,11 @@ function KioskSkuDetail(props) {
     isEdit = _useState14[0],
     setIsEdit = _useState14[1];
   var skuOptionsSelectionRef = useRef(null);
+  // 原生初始化传入的数据
+  var _useState15 = useState(null),
+    _useState16 = _slicedToArray(_useState15, 2),
+    nativeInitData = _useState16[0],
+    setNativeInitData = _useState16[1];
   /**
    * @description 防止“原生多次初始化/快速切换”导致请求乱序覆盖
    */
@@ -137,6 +142,7 @@ function KioskSkuDetail(props) {
       bundle: [],
       option: []
     });
+    setNativeInitData(null);
   }, []);
   var loadByProductId = useCallback( /*#__PURE__*/function () {
     var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(productId) {
@@ -250,7 +256,7 @@ function KioskSkuDetail(props) {
   var loadRef = useRef(loadByProductId);
   loadRef.current = loadByProductId;
   useEffect(function () {
-    var _interaction$utils, _interaction$utils$po, _interaction$utils2, _interaction$utils2$m, _interaction$utils3, _interaction$utils3$m;
+    var _interaction$utils, _interaction$utils$po, _interaction$utils2, _interaction$utils2$m, _interaction$utils3, _interaction$utils3$m, _interaction$utils4, _interaction$utils4$m;
     // 通知原生初始化
     interaction === null || interaction === void 0 || (_interaction$utils = interaction.utils) === null || _interaction$utils === void 0 || (_interaction$utils$po = _interaction$utils.postMessageToApp) === null || _interaction$utils$po === void 0 || _interaction$utils$po.call(_interaction$utils, {
       module: 'wallet_pass',
@@ -269,8 +275,24 @@ function KioskSkuDetail(props) {
       if (id || id === 0) loadRef.current(id);
       setIsEdit(false);
     });
+    // 原生初始化调用-新购流程
+    interaction === null || interaction === void 0 || (_interaction$utils3 = interaction.utils) === null || _interaction$utils3 === void 0 || (_interaction$utils3$m = _interaction$utils3.mountFunction) === null || _interaction$utils3$m === void 0 || _interaction$utils3$m.call(_interaction$utils3, 'wallet_pass', 'restore_recharge_wallet_pass', function (_data) {
+      var data = JSON.parse(_data || '{}');
+      console.log('重置状态', data === null || data === void 0 ? void 0 : data.productId);
+      console.log('宽', window.innerWidth);
+      console.log('高', window.innerHeight);
+      console.log('设备像素比', window.devicePixelRatio);
+      // 原生会预渲染页面，真正展示时再调用这里；该方法可能被多次调用
+      resetForInit();
+
+      // 原生回调入参就是 productId：直接触发加载（不走“state→effect”链）
+      if (data !== null && data !== void 0 && data.productId || (data === null || data === void 0 ? void 0 : data.productId) === 0) loadRef.current(data === null || data === void 0 ? void 0 : data.productId);
+      setIsEdit(false);
+      // 原生初始化传入的数据
+      setNativeInitData(data);
+    });
     // 原生初始化调用-购物车编辑
-    interaction === null || interaction === void 0 || (_interaction$utils3 = interaction.utils) === null || _interaction$utils3 === void 0 || (_interaction$utils3$m = _interaction$utils3.mountFunction) === null || _interaction$utils3$m === void 0 || _interaction$utils3$m.call(_interaction$utils3, 'wallet_pass', 'edit_buy_wallet_pass', function (data) {
+    interaction === null || interaction === void 0 || (_interaction$utils4 = interaction.utils) === null || _interaction$utils4 === void 0 || (_interaction$utils4$m = _interaction$utils4.mountFunction) === null || _interaction$utils4$m === void 0 || _interaction$utils4$m.call(_interaction$utils4, 'wallet_pass', 'edit_buy_wallet_pass', function (data) {
       console.log('编辑状态', data);
       var productData = JSON.parse(data);
       /**
@@ -296,6 +318,7 @@ function KioskSkuDetail(props) {
         option: []
       });
       setIsEdit(true);
+      setNativeInitData(productData);
     });
 
     // URL 有 productId：挂载时只加载一次
@@ -368,16 +391,20 @@ function KioskSkuDetail(props) {
       quantity: quantity,
       variantId: skuValue.product_variant_id,
       pricePerUnit: unitPrice,
-      isWebBuyWalletPass: true
+      isWebBuyWalletPass: true,
+      // 特定字段
+      balance: nativeInitData === null || nativeInitData === void 0 ? void 0 : nativeInitData.balance,
+      walletCodeId: nativeInitData === null || nativeInitData === void 0 ? void 0 : nativeInitData.walletCodeId,
+      walletPassCodeId: nativeInitData === null || nativeInitData === void 0 ? void 0 : nativeInitData.walletPassCodeId
     };
     interaction.utils.postMessageToApp({
       module: 'wallet_pass',
       key: 'buy_wallet_pass',
-      data: {
+      data: _objectSpread(_objectSpread({}, nativeInitData || {}), {}, {
         // 把洗好的数据放这里
         productData: obj,
         isEdit: isEdit
-      }
+      })
     });
   };
   var onBack = function onBack() {
@@ -420,7 +447,9 @@ function KioskSkuDetail(props) {
     dangerouslySetInnerHTML: {
       __html: descriptionText
     }
-  })), !!priceRangeText && /*#__PURE__*/React.createElement("div", {
+  })), nativeInitData !== null && nativeInitData !== void 0 && nativeInitData.balance ? /*#__PURE__*/React.createElement("div", {
+    className: "pisell-kiosk-sku-detail__price-range"
+  }, locales.getText('pisell2.text.kiosk.sku.detail.balance'), ": ", symbol, nativeInitData === null || nativeInitData === void 0 ? void 0 : nativeInitData.balance) : !!priceRangeText && /*#__PURE__*/React.createElement("div", {
     className: "pisell-kiosk-sku-detail__price-range"
   }, priceRangeText, " ", currency_code), !!errorText && /*#__PURE__*/React.createElement("div", {
     className: "pisell-kiosk-sku-detail__error"
@@ -506,10 +535,10 @@ function getQueryFirstMatch(params) {
 function useDesignStageScale(params) {
   var designWidth = params.designWidth;
   var designHeight = params.designHeight;
-  var _useState15 = useState(1),
-    _useState16 = _slicedToArray(_useState15, 2),
-    scale = _useState16[0],
-    setScale = _useState16[1];
+  var _useState17 = useState(1),
+    _useState18 = _slicedToArray(_useState17, 2),
+    scale = _useState18[0],
+    setScale = _useState18[1];
   useEffect(function () {
     var update = function update() {
       var viewportWidth = window.innerWidth || designWidth;

package/es/components/kioskSkuDetail/locales.d.ts

@@ -0,0 +1,48 @@
+declare const _default: {
+    en: {
+        'pisell2.text.kiosk.sku.detail.btn.back': string;
+        'pisell2.text.kiosk.sku.detail.item.total': string;
+        'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
+        'pisell2.text.kiosk.sku.detail.btn.update': string;
+        'pisell2.text.kiosk.sku.detail.loading.options': string;
+        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
+        'pisell2.text.kiosk.sku.detail.balance': string;
+    };
+    'zh-CN': {
+        'pisell2.text.kiosk.sku.detail.btn.back': string;
+        'pisell2.text.kiosk.sku.detail.item.total': string;
+        'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
+        'pisell2.text.kiosk.sku.detail.btn.update': string;
+        'pisell2.text.kiosk.sku.detail.loading.options': string;
+        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
+        'pisell2.text.kiosk.sku.detail.balance': string;
+    };
+    'zh-TW': {
+        'pisell2.text.kiosk.sku.detail.btn.back': string;
+        'pisell2.text.kiosk.sku.detail.item.total': string;
+        'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
+        'pisell2.text.kiosk.sku.detail.btn.update': string;
+        'pisell2.text.kiosk.sku.detail.loading.options': string;
+        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
+        'pisell2.text.kiosk.sku.detail.balance': string;
+    };
+    ja: {
+        'pisell2.text.kiosk.sku.detail.btn.back': string;
+        'pisell2.text.kiosk.sku.detail.item.total': string;
+        'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
+        'pisell2.text.kiosk.sku.detail.btn.update': string;
+        'pisell2.text.kiosk.sku.detail.loading.options': string;
+        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
+        'pisell2.text.kiosk.sku.detail.balance': string;
+    };
+    pt: {
+        'pisell2.text.kiosk.sku.detail.btn.back': string;
+        'pisell2.text.kiosk.sku.detail.item.total': string;
+        'pisell2.text.kiosk.sku.detail.btn.add.to.cart': string;
+        'pisell2.text.kiosk.sku.detail.btn.update': string;
+        'pisell2.text.kiosk.sku.detail.loading.options': string;
+        'pisell2.text.kiosk.sku.detail.toast.select.variant': string;
+        'pisell2.text.kiosk.sku.detail.balance': string;
+    };
+};
+export default _default;

package/es/components/kioskSkuDetail/locales.js

@@ -5,7 +5,8 @@ export default {
     'pisell2.text.kiosk.sku.detail.btn.add.to.cart': 'Add to cart',
     'pisell2.text.kiosk.sku.detail.btn.update': 'Update',
     'pisell2.text.kiosk.sku.detail.loading.options': 'Loading options…',
-    'pisell2.text.kiosk.sku.detail.toast.select.variant': 'Please select a top-up option'
+    'pisell2.text.kiosk.sku.detail.toast.select.variant': 'Please select a top-up option',
+    'pisell2.text.kiosk.sku.detail.balance': 'Balance'
   },
   'zh-CN': {
     'pisell2.text.kiosk.sku.detail.btn.back': '返回',
@@ -13,7 +14,8 @@ export default {
     'pisell2.text.kiosk.sku.detail.btn.add.to.cart': '加入购物车',
     'pisell2.text.kiosk.sku.detail.btn.update': '更新',
     'pisell2.text.kiosk.sku.detail.loading.options': '正在加载选项…',
-    'pisell2.text.kiosk.sku.detail.toast.select.variant': '请选择充值选项'
+    'pisell2.text.kiosk.sku.detail.toast.select.variant': '请选择充值选项',
+    'pisell2.text.kiosk.sku.detail.balance': '余额'
   },
   'zh-TW': {
     'pisell2.text.kiosk.sku.detail.btn.back': '返回',
@@ -21,6 +23,25 @@ export default {
     'pisell2.text.kiosk.sku.detail.btn.add.to.cart': '加入購物車',
     'pisell2.text.kiosk.sku.detail.btn.update': '更新',
     'pisell2.text.kiosk.sku.detail.loading.options': '正在載入選項…',
-    'pisell2.text.kiosk.sku.detail.toast.select.variant': '請選擇充值選項'
+    'pisell2.text.kiosk.sku.detail.toast.select.variant': '請選擇充值選項',
+    'pisell2.text.kiosk.sku.detail.balance': '餘額'
+  },
+  ja: {
+    'pisell2.text.kiosk.sku.detail.btn.back': '戻る',
+    'pisell2.text.kiosk.sku.detail.item.total': '小計',
+    'pisell2.text.kiosk.sku.detail.btn.add.to.cart': 'カートに追加',
+    'pisell2.text.kiosk.sku.detail.btn.update': '更新',
+    'pisell2.text.kiosk.sku.detail.loading.options': 'オプションを読み込み中…',
+    'pisell2.text.kiosk.sku.detail.toast.select.variant': 'チャージオプションを選択してください',
+    'pisell2.text.kiosk.sku.detail.balance': '残高'
+  },
+  pt: {
+    'pisell2.text.kiosk.sku.detail.btn.back': 'Voltar',
+    'pisell2.text.kiosk.sku.detail.item.total': 'Subtotal',
+    'pisell2.text.kiosk.sku.detail.btn.add.to.cart': 'Adicionar ao carrinho',
+    'pisell2.text.kiosk.sku.detail.btn.update': 'Atualizar',
+    'pisell2.text.kiosk.sku.detail.loading.options': 'Carregando opções…',
+    'pisell2.text.kiosk.sku.detail.toast.select.variant': 'Por favor, selecione uma opção de recarga',
+    'pisell2.text.kiosk.sku.detail.balance': 'Saldo'
   }
 };

package/es/components/login/locales.d.ts

@@ -0,0 +1,38 @@
+declare const _default: {
+    en: {
+        'pisell2.text.login': string;
+        "pisell2.text.email-placeholder": string;
+        "pisell2.text.password-placeholder": string;
+        "pisell2.text.password-error": string;
+        "pisell2.text.email-error": string;
+    };
+    'zh-CN': {
+        'pisell2.text.login': string;
+        "pisell2.text.email-placeholder": string;
+        "pisell2.text.password-placeholder": string;
+        "pisell2.text.password-error": string;
+        "pisell2.text.email-error": string;
+    };
+    'zh-HK': {
+        'pisell2.text.login': string;
+        "pisell2.text.email-placeholder": string;
+        "pisell2.text.password-placeholder": string;
+        "pisell2.text.password-error": string;
+        "pisell2.text.email-error": string;
+    };
+    ja: {
+        'pisell2.text.login': string;
+        "pisell2.text.email-placeholder": string;
+        "pisell2.text.password-placeholder": string;
+        "pisell2.text.password-error": string;
+        "pisell2.text.email-error": string;
+    };
+    pt: {
+        'pisell2.text.login': string;
+        "pisell2.text.email-placeholder": string;
+        "pisell2.text.password-placeholder": string;
+        "pisell2.text.password-error": string;
+        "pisell2.text.email-error": string;
+    };
+};
+export default _default;

package/es/components/login/locales.js

@@ -19,5 +19,19 @@ export default {
     "pisell2.text.password-placeholder": "請輸入密碼",
     "pisell2.text.password-error": "請輸入正確的密碼",
     "pisell2.text.email-error": "請輸入正確的電子郵件"
+  },
+  ja: {
+    'pisell2.text.login': "ログイン",
+    "pisell2.text.email-placeholder": "メールアドレスを入力してください",
+    "pisell2.text.password-placeholder": "パスワードを入力してください",
+    "pisell2.text.password-error": "正しいパスワードを入力してください",
+    "pisell2.text.email-error": "正しいメールアドレスを入力してください"
+  },
+  pt: {
+    'pisell2.text.login': "Login",
+    "pisell2.text.email-placeholder": "Por favor, insira o e-mail",
+    "pisell2.text.password-placeholder": "Por favor, insira a senha",
+    "pisell2.text.password-error": "Por favor, insira a senha correta",
+    "pisell2.text.email-error": "Por favor, insira o e-mail correto"
   }
 };

package/es/components/pay/toC/PaymentList/payment/google_pay.svg

@@ -1,9 +1,27 @@
-<svg width="46" height="32" viewBox="0 0 46 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect x="0.5" y="0.5" width="45" height="31" rx="3.5" fill="white"/>
-<rect x="0.5" y="0.5" width="45" height="31" rx="3.5" stroke="#F2F4F7"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M21.4108 20.7039V16.7911H23.4303C24.2579 16.7911 24.9563 16.5138 25.5257 15.9669L25.6624 15.8282C26.7025 14.696 26.6342 12.9321 25.5257 11.8846C24.9715 11.33 24.2123 11.0296 23.4303 11.045H20.1885V20.7039H21.4108ZM21.4109 15.6048V12.2311H23.4611C23.9016 12.2311 24.3192 12.4006 24.6305 12.7087C25.2911 13.3557 25.3063 14.434 24.6685 15.1041C24.3572 15.4353 23.9167 15.6202 23.4611 15.6048H21.4109ZM31.3639 14.6112C30.84 14.1259 30.1263 13.8795 29.2229 13.8795C28.0613 13.8795 27.1882 14.3108 26.6112 15.1658L27.6893 15.8513C28.0841 15.2659 28.6231 14.9732 29.3064 14.9732C29.7391 14.9732 30.1567 15.135 30.4832 15.4277C30.802 15.7049 30.9842 16.1055 30.9842 16.5291V16.8141C30.5135 16.5522 29.9214 16.4136 29.1925 16.4136C28.3422 16.4136 27.6589 16.6138 27.1502 17.0221C26.6416 17.4303 26.3834 17.9695 26.3834 18.655C26.3682 19.2789 26.634 19.872 27.1047 20.2725C27.583 20.7039 28.1904 20.9195 28.904 20.9195C29.7467 20.9195 30.4148 20.5421 30.9235 19.7873H30.9767V20.7039H32.1458V16.6292C32.1458 15.7743 31.8877 15.0964 31.3639 14.6112ZM28.046 19.4869C27.7954 19.3021 27.6436 19.0017 27.6436 18.6782C27.6436 18.3161 27.8106 18.0157 28.1371 17.777C28.4712 17.5382 28.8889 17.4149 29.3824 17.4149C30.0658 17.4072 30.5974 17.5613 30.977 17.8694C30.977 18.3932 30.772 18.8476 30.3696 19.2327C30.0051 19.6025 29.5115 19.8104 28.9952 19.8104C28.6535 19.8181 28.3194 19.7026 28.046 19.4869ZM34.7734 23.6077L38.858 14.0952H37.5294L35.6389 18.8399H35.6162L33.6802 14.0952H32.3516L35.0316 20.2803L33.5132 23.6077H34.7734Z" fill="#3C4043"/>
-<path d="M17.1905 15.9439C17.1905 15.5665 17.1601 15.1891 17.0994 14.8193H11.9443V16.9529H14.8977C14.7762 17.6384 14.3814 18.2546 13.8044 18.6398V20.0262H15.5658C16.5983 19.0634 17.1905 17.6385 17.1905 15.9439Z" fill="#4285F4"/>
-<path d="M11.9452 21.3662C13.4181 21.3662 14.6632 20.8732 15.5666 20.0259L13.8053 18.6395C13.3118 18.9784 12.6816 19.1709 11.9452 19.1709C10.5179 19.1709 9.31074 18.1927 8.87799 16.8833H7.06348V18.316C7.98971 20.1877 9.88015 21.3662 11.9452 21.3662Z" fill="#34A853"/>
-<path d="M8.87795 16.8834C8.65015 16.1978 8.65015 15.4507 8.87795 14.7575V13.3325H7.06315C6.28103 14.8961 6.28103 16.7447 7.06315 18.3083L8.87795 16.8834Z" fill="#FBBC04"/>
-<path d="M11.9452 12.47C12.7272 12.4546 13.4788 12.755 14.0406 13.3018L15.6046 11.7151C14.61 10.7754 13.3042 10.2593 11.9452 10.2747C9.88015 10.2747 7.98971 11.4609 7.06348 13.3326L8.87799 14.7653C9.31074 13.4482 10.5179 12.47 11.9452 12.47Z" fill="#EA4335"/>
+<svg width="46" height="32" viewBox="170 168 754 328" fill="none" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg">
+<path fill="#FFFFFF" d="M722.7,170h-352c-110,0-200,90-200,200l0,0c0,110,90,200,200,200h352c110,0,200-90,200-200l0,0
+	C922.7,260,832.7,170,722.7,170z"/>
+<path fill="#3C4043" d="M722.7,186.2c24.7,0,48.7,4.9,71.3,14.5c21.9,9.3,41.5,22.6,58.5,39.5
+	c16.9,16.9,30.2,36.6,39.5,58.5c9.6,22.6,14.5,46.6,14.5,71.3s-4.9,48.7-14.5,71.3c-9.3,21.9-22.6,41.5-39.5,58.5
+	c-16.9,16.9-36.6,30.2-58.5,39.5c-22.6,9.6-46.6,14.5-71.3,14.5h-352c-24.7,0-48.7-4.9-71.3-14.5c-21.9-9.3-41.5-22.6-58.5-39.5
+	c-16.9-16.9-30.2-36.6-39.5-58.5c-9.6-22.6-14.5-46.6-14.5-71.3s4.9-48.7,14.5-71.3c9.3-21.9,22.6-41.5,39.5-58.5
+	c16.9-16.9,36.6-30.2,58.5-39.5c22.6-9.6,46.6-14.5,71.3-14.5L722.7,186.2 M722.7,170h-352c-110,0-200,90-200,200l0,0
+	c0,110,90,200,200,200h352c110,0,200-90,200-200l0,0C922.7,260,832.7,170,722.7,170L722.7,170z"/>
+<path fill="#3C4043" d="M529.3,384.2v60.5h-19.2V295.3H561c12.9,0,23.9,4.3,32.9,12.9
+	c9.2,8.6,13.8,19.1,13.8,31.5c0,12.7-4.6,23.2-13.8,31.7c-8.9,8.5-19.9,12.7-32.9,12.7h-31.7V384.2z M529.3,313.7v52.1h32.1
+	c7.6,0,14-2.6,19-7.7c5.1-5.1,7.7-11.3,7.7-18.3c0-6.9-2.6-13-7.7-18.1c-5-5.3-11.3-7.9-19-7.9h-32.1V313.7z"/>
+<path fill="#3C4043" d="M657.9,339.1c14.2,0,25.4,3.8,33.6,11.4c8.2,7.6,12.3,18,12.3,31.2v63h-18.3v-14.2h-0.8
+	c-7.9,11.7-18.5,17.5-31.7,17.5c-11.3,0-20.7-3.3-28.3-10s-11.4-15-11.4-25c0-10.6,4-19,12-25.2c8-6.3,18.7-9.4,32-9.4
+	c11.4,0,20.8,2.1,28.1,6.3v-4.4c0-6.7-2.6-12.3-7.9-17c-5.3-4.7-11.5-7-18.6-7c-10.7,0-19.2,4.5-25.4,13.6l-16.9-10.6
+	C625.9,345.8,639.7,339.1,657.9,339.1z M633.1,413.3c0,5,2.1,9.2,6.4,12.5c4.2,3.3,9.2,5,14.9,5c8.1,0,15.3-3,21.6-9
+	s9.5-13,9.5-21.1c-6-4.7-14.3-7.1-25-7.1c-7.8,0-14.3,1.9-19.5,5.6C635.7,403.1,633.1,407.8,633.1,413.3z"/>
+<path fill="#3C4043" d="M808.2,342.4l-64,147.2h-19.8l23.8-51.5L706,342.4h20.9l30.4,73.4h0.4l29.6-73.4H808.2z"/>
+<path fill="#4285F4" d="M452.93,372c0-6.26-0.56-12.25-1.6-18.01h-80.48v33L417.2,387
+	c-1.88,10.98-7.93,20.34-17.2,26.58v21.41h27.59C443.7,420.08,452.93,398.04,452.93,372z"/>
+<path fill="#34A853" d="M400.01,413.58c-7.68,5.18-17.57,8.21-29.14,8.21c-22.35,0-41.31-15.06-48.1-35.36
+	h-28.46v22.08c14.1,27.98,43.08,47.18,76.56,47.18c23.14,0,42.58-7.61,56.73-20.71L400.01,413.58z"/>
+<path fill="#FABB05" d="M320.09,370.05c0-5.7,0.95-11.21,2.68-16.39v-22.08h-28.46
+	c-5.83,11.57-9.11,24.63-9.11,38.47s3.29,26.9,9.11,38.47l28.46-22.08C321.04,381.26,320.09,375.75,320.09,370.05z"/>
+<path fill="#E94235" d="M370.87,318.3c12.63,0,23.94,4.35,32.87,12.85l24.45-24.43
+	c-14.85-13.83-34.21-22.32-57.32-22.32c-33.47,0-62.46,19.2-76.56,47.18l28.46,22.08C329.56,333.36,348.52,318.3,370.87,318.3z"/>
 </svg>

package/es/components/pay/toC/PaymentList/payment/google_pay2.svg

@@ -0,0 +1,9 @@
+<svg width="46" height="32" viewBox="0 0 46 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="0.5" width="45" height="31" rx="3.5" fill="white"/>
+<rect x="0.5" y="0.5" width="45" height="31" rx="3.5" stroke="#F2F4F7"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M21.4108 20.7039V16.7911H23.4303C24.2579 16.7911 24.9563 16.5138 25.5257 15.9669L25.6624 15.8282C26.7025 14.696 26.6342 12.9321 25.5257 11.8846C24.9715 11.33 24.2123 11.0296 23.4303 11.045H20.1885V20.7039H21.4108ZM21.4109 15.6048V12.2311H23.4611C23.9016 12.2311 24.3192 12.4006 24.6305 12.7087C25.2911 13.3557 25.3063 14.434 24.6685 15.1041C24.3572 15.4353 23.9167 15.6202 23.4611 15.6048H21.4109ZM31.3639 14.6112C30.84 14.1259 30.1263 13.8795 29.2229 13.8795C28.0613 13.8795 27.1882 14.3108 26.6112 15.1658L27.6893 15.8513C28.0841 15.2659 28.6231 14.9732 29.3064 14.9732C29.7391 14.9732 30.1567 15.135 30.4832 15.4277C30.802 15.7049 30.9842 16.1055 30.9842 16.5291V16.8141C30.5135 16.5522 29.9214 16.4136 29.1925 16.4136C28.3422 16.4136 27.6589 16.6138 27.1502 17.0221C26.6416 17.4303 26.3834 17.9695 26.3834 18.655C26.3682 19.2789 26.634 19.872 27.1047 20.2725C27.583 20.7039 28.1904 20.9195 28.904 20.9195C29.7467 20.9195 30.4148 20.5421 30.9235 19.7873H30.9767V20.7039H32.1458V16.6292C32.1458 15.7743 31.8877 15.0964 31.3639 14.6112ZM28.046 19.4869C27.7954 19.3021 27.6436 19.0017 27.6436 18.6782C27.6436 18.3161 27.8106 18.0157 28.1371 17.777C28.4712 17.5382 28.8889 17.4149 29.3824 17.4149C30.0658 17.4072 30.5974 17.5613 30.977 17.8694C30.977 18.3932 30.772 18.8476 30.3696 19.2327C30.0051 19.6025 29.5115 19.8104 28.9952 19.8104C28.6535 19.8181 28.3194 19.7026 28.046 19.4869ZM34.7734 23.6077L38.858 14.0952H37.5294L35.6389 18.8399H35.6162L33.6802 14.0952H32.3516L35.0316 20.2803L33.5132 23.6077H34.7734Z" fill="#3C4043"/>
+<path d="M17.1905 15.9439C17.1905 15.5665 17.1601 15.1891 17.0994 14.8193H11.9443V16.9529H14.8977C14.7762 17.6384 14.3814 18.2546 13.8044 18.6398V20.0262H15.5658C16.5983 19.0634 17.1905 17.6385 17.1905 15.9439Z" fill="#4285F4"/>
+<path d="M11.9452 21.3662C13.4181 21.3662 14.6632 20.8732 15.5666 20.0259L13.8053 18.6395C13.3118 18.9784 12.6816 19.1709 11.9452 19.1709C10.5179 19.1709 9.31074 18.1927 8.87799 16.8833H7.06348V18.316C7.98971 20.1877 9.88015 21.3662 11.9452 21.3662Z" fill="#34A853"/>
+<path d="M8.87795 16.8834C8.65015 16.1978 8.65015 15.4507 8.87795 14.7575V13.3325H7.06315C6.28103 14.8961 6.28103 16.7447 7.06315 18.3083L8.87795 16.8834Z" fill="#FBBC04"/>
+<path d="M11.9452 12.47C12.7272 12.4546 13.4788 12.755 14.0406 13.3018L15.6046 11.7151C14.61 10.7754 13.3042 10.2593 11.9452 10.2747C9.88015 10.2747 7.98971 11.4609 7.06348 13.3326L8.87799 14.7653C9.31074 13.4482 10.5179 12.47 11.9452 12.47Z" fill="#EA4335"/>
+</svg>

package/es/components/pay/toC/PaymentList/serve.js

@@ -15,7 +15,7 @@ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 import { request } from "../../../../utils";
 import { paymentKeys } from "./status";
-import { isWx, isIOS } from '@pisell/utils';
+import { isWx, isSafari, isIOS } from '@pisell/utils';
 import { paymentTypes, isCustomPayment } from "./status";
 import { formatCreditCardSurchargeList, formatCreditCardSurchargeText } from "./utils";
 
@@ -106,7 +106,7 @@ export var filterPaymentList = function filterPaymentList(list) {
   // }
 
   // 非IOS 隐藏苹果支付
-  if (!isIOS()) {
+  if (!isIOS() && !isSafari()) {
     arr = arr.concat(['mw.apple']);
   }
 

package/es/components/pay/toC/PaymentMethods/MWCreditCard/Add/index.d.ts

@@ -4,9 +4,15 @@ export interface AddMWCreditCardRef {
     init: () => void;
     onReset: () => void;
     onSubmit: () => void;
+    close: () => void;
 }
 export interface AddMWCreditCardProps {
+    /** 创建卡片回调 */
     onCreate?: (values: any) => void;
+    /** 店铺名称，用于授权说明文案 */
+    shopName?: string;
+    /** 按钮 loading */
+    btnLoading?: boolean;
 }
 declare const _default: React.ForwardRefExoticComponent<AddMWCreditCardProps & React.RefAttributes<any>>;
 export default _default;

package/es/components/pay/toC/PaymentMethods/MWCreditCard/Add/index.js

@@ -10,7 +10,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { useState, useMemo, useContext, useImperativeHandle, forwardRef } from 'react';
 import { locales } from '@pisell/utils';
-import { Form, Row, Col, Checkbox } from 'antd';
+import { Form, Row, Col, Checkbox, Divider } from 'antd';
 import { PisellModal, PisellInput, PisellDatePicker, PisellAlert, Iconfont, PisellToast, PisellText } from '@pisell/materials';
 import { Context } from "../../../model";
 import "./index.less";
@@ -77,7 +77,11 @@ var formatName = function formatName(card_name) {
  * @Date: 2024-08-16 11:13
  */
 var AddMWCreditCard = function AddMWCreditCard(props, ref) {
-  var onCreate = props.onCreate;
+  var onCreate = props.onCreate,
+    _props$shopName = props.shopName,
+    shopName = _props$shopName === void 0 ? '' : _props$shopName,
+    _props$btnLoading = props.btnLoading,
+    btnLoading = _props$btnLoading === void 0 ? false : _props$btnLoading;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -233,11 +237,20 @@ var AddMWCreditCard = function AddMWCreditCard(props, ref) {
   var onSubmit = function onSubmit() {
     form.submit();
   };
+
+  /**
+   * @title: 关闭弹窗
+   * @description: 供外部调用，直接关闭添加卡片弹窗
+   */
+  var close = function close() {
+    setOpen(false);
+  };
   useImperativeHandle(ref, function () {
     return {
       init: init,
       onReset: onReset,
-      onSubmit: onSubmit
+      onSubmit: onSubmit,
+      close: close
     };
   });
 
@@ -264,18 +277,40 @@ var AddMWCreditCard = function AddMWCreditCard(props, ref) {
     }
   }, [state.payGroup]);
   return /*#__PURE__*/React.createElement(PisellModal, {
-    title: /*#__PURE__*/React.createElement("div", null, locales.getText('tocPay.text.addCard')),
+    title: /*#__PURE__*/React.createElement("div", {
+      className: "secure-card-payment-title"
+    }, locales.getText('tocPay.text.secureCardPayment'), /*#__PURE__*/React.createElement(Iconfont, {
+      type: "pisell2-shield-tick",
+      className: "secure-card-payment-title-icon"
+    })),
     open: open,
     onCancel: onCancel,
     cancelVisible: false,
     onOk: onSubmit,
     okText: okText,
     bodyStyle: {
-      padding: 24
+      padding: 24,
+      display: 'flex',
+      flexDirection: 'column'
+    },
+    okButtonProps: {
+      loading: btnLoading,
+      style: {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center'
+      }
     }
   }, /*#__PURE__*/React.createElement("div", {
-    className: ""
-  }, /*#__PURE__*/React.createElement(Form, {
+    className: "add-mw-credit-card-wrap"
+  }, /*#__PURE__*/React.createElement(PisellAlert, {
+    className: "secure-card-tip-alert",
+    icon: /*#__PURE__*/React.createElement(Iconfont, {
+      type: "pisell2-shield-tick"
+    }),
+    showIcon: true,
+    message: locales.getText('tocPay.text.secureBankInfo')
+  }), /*#__PURE__*/React.createElement(Form, {
     layout: "vertical",
     form: form,
     onFinish: onFinish,
@@ -329,23 +364,32 @@ var AddMWCreditCard = function AddMWCreditCard(props, ref) {
     }]
   }, /*#__PURE__*/React.createElement(PisellInput, {
     placeholder: locales.getText('tocPay.text.incorrectName')
-  }))), /*#__PURE__*/React.createElement(Col, {
-    span: 24
-  }, /*#__PURE__*/React.createElement(Form.Item, {
+  })))), /*#__PURE__*/React.createElement("div", {
+    className: "merchant-authorization-text"
+  }, locales.getText('tocPay.text.merchantAuthorizationBefore'), /*#__PURE__*/React.createElement("span", {
+    className: "merchant-shop-name"
+  }, shopName), locales.getText('tocPay.text.merchantAuthorizationAfter')), /*#__PURE__*/React.createElement(Divider, {
+    className: "secure-card-divider"
+  }), /*#__PURE__*/React.createElement(Form.Item, {
     name: "is_save",
     valuePropName: "checked",
-    initialValue: true
+    initialValue: true,
+    className: "save-card-form-item"
   }, /*#__PURE__*/React.createElement(Checkbox, null, /*#__PURE__*/React.createElement("span", {
     className: "save-card-checkbox-text"
-  }, locales.getText('tocPay.text.saveCardForNextTime'))))), /*#__PURE__*/React.createElement(Col, {
-    span: 24
-  }, /*#__PURE__*/React.createElement(PisellAlert, {
-    className: "save-card-alert",
-    icon: /*#__PURE__*/React.createElement(Iconfont, {
-      type: "pisell2-shield-tick"
-    }),
-    showIcon: true,
-    message: locales.getText('tocPay.text.secureBankInfo')
-  }))))));
+  }, locales.getText('tocPay.text.saveCardForNextTime')))), /*#__PURE__*/React.createElement("div", {
+    className: "save-card-encryption-text"
+  }, locales.getText('tocPay.text.saveCardEncryption'))), /*#__PURE__*/React.createElement("div", {
+    className: "three-d-secure-section"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "three-d-secure-badge"
+  }, /*#__PURE__*/React.createElement(Iconfont, {
+    type: "pisell2-shield-01",
+    className: "three-d-secure-icon"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "three-d-secure-badge-text"
+  }, "3D")), /*#__PURE__*/React.createElement("span", {
+    className: "three-d-secure-text"
+  }, locales.getText('tocPay.text.threeDSecureProtection')))));
 };
 export default /*#__PURE__*/forwardRef(AddMWCreditCard);

package/es/components/pay/toC/PaymentMethods/MWCreditCard/Add/index.less

@@ -1,3 +1,4 @@
+/* 表单 label 样式 */
 .pisell-lowcode-form-item-label {
   color: var(--Gray-900, #101828);
   font-size: 14px;
@@ -6,20 +7,120 @@
   line-height: 20px;
 }
 
+/* 标题区域 */
+.secure-card-payment-title {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-weight: 600;
+}
+
+.secure-card-payment-title-icon {
+  color: #12b76a;
+  font-size: 20px;
+}
+
+/* 外层容器 - flex 列布局，使 3D Secure 内容少时贴底 */
+.add-mw-credit-card-wrap {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+
+/* 安全提示 Alert - 顶部 */
+.secure-card-tip-alert {
+  margin-bottom: 12px;
+  .pisell-lowcode-alert-message {
+    font-size: 13px;
+    font-style: normal;
+    font-weight: 500;
+    line-height: 18px;
+    color: #027a48;
+  }
+}
+
+/* 授权说明文案 */
+.merchant-authorization-text {
+  color: var(--Gray-600, #475467);
+  font-size: 13px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 18px;
+  margin-top: 4px;
+}
+
+/* shopName 蓝色高亮 */
+.merchant-shop-name {
+  color: #1570EF;
+}
+
+/* 分割线 */
+.secure-card-divider {
+  margin: 16px 0;
+}
+
+/* 保存卡片 Checkbox */
+.save-card-form-item {
+  margin-bottom: 4px !important;
+}
+
 .save-card-checkbox-text {
   color: var(--Gray-900, #101828);
-  font-size: 16px;
+  font-size: 14px;
   font-style: normal;
   font-weight: 500;
 }
 
-.save-card-alert {
+/* 保存卡片加密提示 */
+.save-card-encryption-text {
+  color: var(--Gray-500, #667085);
+  font-size: 13px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 18px;
+  padding-left: 24px;
+  margin-bottom: 24px;
+}
 
-  .pisell-lowcode-alert-message {
-    font-size: 14px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 20px;
-  }
+/* 3D Secure 安全说明 - margin-top: auto 使其内容少时贴底，多时跟随流 */
+.three-d-secure-section {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  padding: 16px 0;
+  margin-top: auto;
+}
+
+.three-d-secure-badge {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+}
+
+.three-d-secure-icon {
+  color: #2e90fa;
+  font-size: 32px;
+}
 
-}
+.three-d-secure-badge-text {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  font-size: 10px;
+  font-weight: 700;
+  color: #2e90fa;
+  line-height: 1;
+}
+
+.three-d-secure-text {
+  color: var(--Gray-600, #475467);
+  font-size: 13px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 18px;
+}

package/es/components/pay/toC/PaymentMethods/MWCreditCard/List/index.d.ts

@@ -2,10 +2,12 @@ import React from 'react';
 import './index.less';
 export interface MWCreditCardListRef {
     init: (order: any) => void;
+    close: () => void;
 }
 interface MWCreditCardListProps {
     onAdd?: () => void;
     onChange?: (cardId: number) => void;
+    btnLoading?: boolean;
 }
 declare const _default: React.ForwardRefExoticComponent<MWCreditCardListProps & React.RefAttributes<any>>;
 export default _default;