import React, { useMemo } from 'react';
import { Button } from 'antd';
import { PisellModal } from '@pisell/materials';
import { locales } from '@pisell/utils';
import "./index.less";

/** 弹窗场景类型 */

/** 不同场景对应的 i18n key 映射 */
var TEXT_KEY_MAP = {
  /** 预检查：卡不支持 3DS 验证 */
  'tds-not-supported': {
    title: 'tocPay.text.tdsErrorTitle',
    desc: 'tocPay.text.tdsErrorDesc'
  },
  /** 支付中：银行安全验证失败（700500） */
  'bank-verify-failed': {
    title: 'tocPay.text.bankVerifyFailedTitle',
    desc: 'tocPay.text.bankVerifyFailedDesc'
  }
};
/**
 * @title: 支付错误弹窗（通用）
 * @description: 根据 type 展示不同文案，按钮行为一致：
 *              更换卡片 / 使用其他支付方式 / 稍后支付。
 *              支持两种场景：
 *              1. tds-not-supported —— 预检查发现卡不支持 3DS 验证
 *              2. bank-verify-failed —— 3DS 流程中银行安全验证失败（700500）
 */
var TDSErrorModal = function TDSErrorModal(_ref) {
  var open = _ref.open,
    _ref$type = _ref.type,
    type = _ref$type === void 0 ? 'tds-not-supported' : _ref$type,
    shopPhone = _ref.shopPhone,
    shopEmail = _ref.shopEmail,
    onUseAnotherCard = _ref.onUseAnotherCard,
    onUseAnotherPayment = _ref.onUseAnotherPayment,
    onPayLater = _ref.onPayLater;
  /** 是否展示底部联系方式（电话或邮箱至少有一个） */
  var showContact = !!(shopPhone || shopEmail);

  /** 根据 type 获取对应的 i18n key */
  var textKeys = useMemo(function () {
    return TEXT_KEY_MAP[type];
  }, [type]);
  return /*#__PURE__*/React.createElement(PisellModal, {
    open: open,
    closable: false,
    footer: null,
    header: false,
    mobileModalHeight: "auto",
    headerDivider: false,
    footerDivider: false,
    bodyStyle: {
      padding: 24
    },
    transitionName: "pisell-move-down"
  }, /*#__PURE__*/React.createElement("div", {
    className: "tds-error-modal"
  }, /*#__PURE__*/React.createElement("div", {
    className: "tds-error-modal-title"
  }, locales.getText(textKeys.title)), /*#__PURE__*/React.createElement("div", {
    className: "tds-error-modal-desc"
  }, locales.getText(textKeys.desc)), /*#__PURE__*/React.createElement("div", {
    className: "tds-error-modal-actions"
  }, /*#__PURE__*/React.createElement(Button, {
    type: "primary",
    block: true,
    className: "tds-error-modal-btn-primary",
    onClick: onUseAnotherCard
  }, locales.getText('tocPay.text.useAnotherCard')), /*#__PURE__*/React.createElement(Button, {
    block: true,
    className: "tds-error-modal-btn-secondary",
    onClick: onUseAnotherPayment
  }, locales.getText('tocPay.text.useAnotherPayment')), /*#__PURE__*/React.createElement(Button, {
    block: true,
    className: "tds-error-modal-btn-secondary",
    onClick: onPayLater
  }, locales.getText('tocPay.text.payLater'))), showContact && /*#__PURE__*/React.createElement("div", {
    className: "tds-error-modal-contact"
  }, locales.getText('tocPay.text.paymentTroubleContact')(shopPhone || '', shopEmail || ''))));
};
export default TDSErrorModal;