var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/components/pisellWalletPassCard/index.tsx
var pisellWalletPassCard_exports = {};
__export(pisellWalletPassCard_exports, {
  default: () => pisellWalletPassCard_default
});
module.exports = __toCommonJS(pisellWalletPassCard_exports);
var import_react = __toESM(require("react"));
var import_classnames = __toESM(require("classnames"));
var import_icons = require("@ant-design/icons");
var import_antd = require("antd");
var import_dayjs = __toESM(require("dayjs"));
var import_iconfont = __toESM(require("../iconfont"));
var import__ = require("../../index");
var import_Amount = __toESM(require("../pisellText/components/Amount"));
var import_index = require("./index.less");
var import_locales = require("../../locales");
var import_pisellQrcode = __toESM(require("./../pisellQrcode"));
var PisellWalletPassCard = (props) => {
  const [isShowDetail, setIsShowDetail] = import_react.default.useState(false);
  const [isShowEdit, setIsShowEdit] = import_react.default.useState(false);
  const [form] = import_antd.Form.useForm();
  const [form2] = import_antd.Form.useForm();
  const [lastTap, setLastTap] = import_react.default.useState(0);
  const [pressTimer, setPressTimer] = import_react.default.useState(
    null
  );
  (0, import_react.useEffect)(() => {
    return () => {
      if (pressTimer) {
        clearTimeout(pressTimer);
      }
    };
  }, [pressTimer]);
  const {
    id,
    type,
    code,
    qrCode,
    balance,
    disabledReason,
    name,
    storeName,
    redeem,
    validDate,
    disabled,
    active = false,
    cover,
    balanceTitle,
    redeemTitle,
    showCover = true,
    showDetail = true,
    showBalance = true,
    showRedeem = true,
    showName = true,
    showCode = true,
    showStoreName = true,
    showValidDate = true,
    showQrCode = true,
    showBalanceSymbol = true,
    showDisabledReason = true,
    showDiscount = false,
    discount,
    showActions,
    actions,
    beforeEdit,
    onConfirmEdit,
    originData,
    style = {}
  } = props;
  (0, import_react.useEffect)(() => {
    document.body.id = "body";
  }, []);
  const isMini = (0, import_react.useMemo)(() => {
    return "mini" === type;
  }, [type]);
  const onDetail = () => {
    var _a;
    if (disabled || disabledReason || !((_a = actions == null ? void 0 : actions.detail) == null ? void 0 : _a.visible)) return;
    form2.setFieldsValue({
      name,
      storeName,
      balance,
      redeem,
      code,
      validDate
    });
    setIsShowDetail(true);
  };
  const onEdit = async () => {
    var _a, _b;
    if (disabled || disabledReason || !((_a = actions == null ? void 0 : actions.edit) == null ? void 0 : _a.visible) || !((_b = actions == null ? void 0 : actions.edit) == null ? void 0 : _b.enableDialog)) {
      return;
    }
    const executeEdit = () => {
      form.setFieldsValue({
        name,
        storeName,
        balance,
        redeem,
        code,
        validDate: (0, import_dayjs.default)(validDate)
      });
      setIsShowEdit(true);
    };
    if (!beforeEdit) {
      executeEdit();
      return;
    }
    try {
      const result = beforeEdit({
        id,
        name,
        storeName,
        balance,
        redeem,
        code,
        validDate,
        originData
      });
      if (result instanceof Promise) {
        const shouldProceed = await result;
        if (shouldProceed !== false) {
          executeEdit();
        }
        return;
      }
      if (result !== false) {
        executeEdit();
      }
    } catch (error) {
      console.error("Before edit check failed:", error);
    }
  };
  const handleTouchStart = () => {
    var _a;
    if (disabled || disabledReason || !((_a = actions == null ? void 0 : actions.edit) == null ? void 0 : _a.enableDialog)) return;
    const timer = setTimeout(() => {
      onEdit();
    }, 500);
    setPressTimer(timer);
  };
  const handleTouchEnd = () => {
    if (pressTimer) {
      clearTimeout(pressTimer);
      setPressTimer(null);
    }
  };
  const handleTap = () => {
    if (disabled || disabledReason) return;
    const now = Date.now();
    const DOUBLE_TAP_DELAY = 300;
    if (now - lastTap < DOUBLE_TAP_DELAY) {
      onDetail();
    }
    setLastTap(now);
  };
  const _onConfirmEdit = () => {
    form.validateFields().then((values) => {
      var _a;
      onConfirmEdit == null ? void 0 : onConfirmEdit({
        id,
        name,
        storeName,
        balance,
        redeem,
        code,
        ...values,
        validDate: "validDate" in values ? (_a = values.validDate) == null ? void 0 : _a.format("YYYY-MM-DD") : validDate
      });
      setIsShowEdit(false);
    });
  };
  const stop = (e) => {
    e.stopPropagation();
  };
  const renderActions = () => {
    if (disabled || disabledReason) return null;
    if (!showActions || !actions) return null;
    if ("collapsed" === actions.layout) {
      const items = [];
      if (actions.detail && actions.detail.visible) {
        items.push({
          key: "detail",
          label: /* @__PURE__ */ import_react.default.createElement(
            "div",
            {
              className: "pisell-card-actions-dropdown-detail",
              onClick: (e) => {
                stop(e);
                onDetail();
              }
            },
            /* @__PURE__ */ import_react.default.createElement("span", null, (0, import_locales.getText)("pisell-wallet-pass-card-detail"))
          )
        });
      }
      if (actions.edit && actions.edit.visible) {
        items.push({
          key: "edit",
          label: /* @__PURE__ */ import_react.default.createElement(
            "div",
            {
              className: "pisell-card-actions-dropdown-edit",
              onClick: (e) => {
                stop(e);
                onEdit();
              }
            },
            /* @__PURE__ */ import_react.default.createElement("span", null, (0, import_locales.getText)("pisell-wallet-pass-card-edit"))
          )
        });
      }
      if (!items.length) return null;
      return /* @__PURE__ */ import_react.default.createElement(
        import_antd.Dropdown,
        {
          trigger: ["click"],
          menu: { items },
          overlayStyle: { minWidth: 120 }
        },
        /* @__PURE__ */ import_react.default.createElement("div", { className: "actions-dropdown-trigger", onClick: stop }, /* @__PURE__ */ import_react.default.createElement(import_icons.MoreOutlined, { style: { fontSize: 24 } }))
      );
    }
    if ("expanded" === actions.layout) {
      return /* @__PURE__ */ import_react.default.createElement("div", { className: "actions-btn-wrapper" }, actions.detail && actions.detail.visible && /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          className: "pisell-card-actions-detail-btn",
          onClick: (e) => {
            stop(e);
            onDetail();
          }
        },
        /* @__PURE__ */ import_react.default.createElement(
          import_icons.ExclamationCircleOutlined,
          {
            style: {
              fontSize: 24,
              color: actions.detail.iconColor || "#1570EF"
            }
          }
        )
      ), actions.edit && actions.edit.visible && /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          className: "pisell-card-actions-edit-btn",
          onClick: (e) => {
            stop(e);
            onEdit();
          }
        },
        /* @__PURE__ */ import_react.default.createElement(
          import_icons.EditOutlined,
          {
            style: {
              fontSize: 24,
              color: actions.edit.iconColor || "#1570EF"
            }
          }
        )
      ));
    }
  };
  const renderNameInfo = () => {
    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-name-wrap" }, showName && name), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-store-name" }, showStoreName && storeName));
  };
  const renderBalanceInfo = () => {
    var _a;
    return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-wrap" }, showRedeem && !disabled && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item pisell-wallet-pass-card-redeem" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item-label" }, redeemTitle || (0, import_locales.getText)("pisell-wallet-pass-card-redeem"), isMini ? ": " : ""), /* @__PURE__ */ import_react.default.createElement(
      import_Amount.default,
      {
        className: "pisell-card-amount-item-value",
        useThousandsSeparator: true,
        value: redeem
      }
    )), showBalance && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item pisell-wallet-pass-card-balance" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item-label" }, balanceTitle || (0, import_locales.getText)("pisell-wallet-pass-card-balance"), disabled || isMini ? ": " : ""), /* @__PURE__ */ import_react.default.createElement(
      import_Amount.default,
      {
        className: "pisell-card-amount-item-value",
        useThousandsSeparator: true,
        value: balance,
        showCurrencySymbol: showBalanceSymbol
      }
    )), showDiscount && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item-label" }, (0, import_locales.getText)("pisell-discount-card-title")), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-amount-item-value" }, ((_a = props.metadata) == null ? void 0 : _a.discount_card_type) === "fixed_amount" ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, (0, import_locales.getText)("pisell-discount-card-fixed-amount-prefix"), " ", /* @__PURE__ */ import_react.default.createElement(
      import_Amount.default,
      {
        className: "pisell-card-amount-item-value",
        useThousandsSeparator: true,
        value: discount
      }
    )) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, discount, "% ", (0, import_locales.getText)("pisell-discount-card-unit"))))), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-code-wrap" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-code" }, showCode && !isMini && /* @__PURE__ */ import_react.default.createElement("div", null, code), showValidDate && /* @__PURE__ */ import_react.default.createElement("div", null, (0, import_locales.getText)("pisell-wallet-pass-card-valid-to"), " ", !!validDate ? validDate : (0, import_locales.getText)("pisell-wallet-pass-card-expireDate")))));
  };
  const getInputItem = (name2) => {
    if ("validDate" === name2) {
      return /* @__PURE__ */ import_react.default.createElement(import_antd.DatePicker, { style: { width: "100%" } });
    }
    if ("balance" === name2 || "redeem" === name2) {
      return /* @__PURE__ */ import_react.default.createElement(
        import_antd.InputNumber,
        {
          formatter: (value) => `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ","),
          parser: (value) => value == null ? void 0 : value.replace(/\$\s?|(,*)/g, ""),
          style: { width: "100%" },
          max: "redeem" === name2 ? originData == null ? void 0 : originData.available_max_amount : void 0
        }
      );
    }
    return /* @__PURE__ */ import_react.default.createElement(import_antd.Input, { style: { width: "100%" } });
  };
  const renderEditModal = () => {
    var _a, _b;
    return /* @__PURE__ */ import_react.default.createElement(
      import__.PisellModal,
      {
        title: ((_a = actions == null ? void 0 : actions.edit) == null ? void 0 : _a.dialogTitle) || (0, import_locales.getText)("pisell-wallet-pass-card-edit"),
        open: isShowEdit,
        className: "pisell-wallet-pass-card-edit-modal",
        onCancel: () => setIsShowEdit(false),
        width: 480,
        onOk: _onConfirmEdit,
        okText: (0, import_locales.getText)("pisell-wallet-pass-card-confirm"),
        cancelText: (0, import_locales.getText)("pisell-wallet-pass-card-cancel"),
        platform: "pc"
      },
      /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { form, layout: "vertical", style: { padding: "16px 0" } }, Array.isArray((_b = actions == null ? void 0 : actions.edit) == null ? void 0 : _b.fields) && actions.edit.fields.map((item) => {
        return /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            key: item.name,
            name: item.name,
            label: item.label,
            rules: [
              {
                required: true,
                message: (0, import_locales.getText)("pisell-wallet-pass-card-required")
              }
            ]
          },
          getInputItem(item.name)
        );
      }))
    );
  };
  const renderDetailModal = () => {
    return /* @__PURE__ */ import_react.default.createElement(
      import__.PisellModal,
      {
        title: (0, import_locales.getText)("pisell-wallet-pass-card-detail"),
        open: isShowDetail,
        onCancel: () => {
          setIsShowDetail(false);
        },
        width: 480,
        className: "pisell-wallet-pass-card-detail-modal",
        footer: null,
        platform: "pc"
      },
      /* @__PURE__ */ import_react.default.createElement(
        import_antd.Form,
        {
          form: form2,
          disabled: true,
          layout: "vertical",
          style: { padding: "16px 0" }
        },
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            name: "name",
            label: (0, import_locales.getText)("pisell-wallet-pass-card-name")
          },
          /* @__PURE__ */ import_react.default.createElement(import_antd.Input, null)
        ),
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            name: "storeName",
            label: (0, import_locales.getText)("pisell-wallet-pass-card-store-name")
          },
          /* @__PURE__ */ import_react.default.createElement(import_antd.Input, null)
        ),
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            name: "balance",
            label: (0, import_locales.getText)("pisell-wallet-pass-card-balance")
          },
          /* @__PURE__ */ import_react.default.createElement(
            import_antd.InputNumber,
            {
              formatter: (value) => `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ","),
              style: { width: "100%" }
            }
          )
        ),
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            name: "redeem",
            label: (0, import_locales.getText)("pisell-wallet-pass-card-redeem")
          },
          /* @__PURE__ */ import_react.default.createElement(
            import_antd.InputNumber,
            {
              formatter: (value) => `$ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ","),
              style: { width: "100%" }
            }
          )
        ),
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            name: "code",
            label: (0, import_locales.getText)("pisell-wallet-pass-card-code")
          },
          /* @__PURE__ */ import_react.default.createElement(import_antd.Input, null)
        ),
        /* @__PURE__ */ import_react.default.createElement(
          import_antd.Form.Item,
          {
            name: "validDate",
            label: (0, import_locales.getText)("pisell-wallet-pass-card-valid-to")
          },
          /* @__PURE__ */ import_react.default.createElement(import_antd.Input, null)
        )
      )
    );
  };
  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { onClick: (e) => e.stopPropagation() }, renderDetailModal(), renderEditModal()), /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      className: (0, import_classnames.default)("pisell-wallet-pass-card", {
        "pisell-card-disabled": disabled,
        "pisell-card-disabled-hide-disabled-reason": disabled && !showDisabledReason,
        "pisell-wallet-pass-card-mini": isMini,
        active
      }),
      style: showCover && !isMini ? {
        ...style,
        backgroundImage: showCover ? `url('${cover || "data:image/jpeg;base64, "}')` : ""
      } : style
    },
    renderActions(),
    /* @__PURE__ */ import_react.default.createElement(
      "div",
      { className: "pisell-wallet-pass-card-body" },
      renderNameInfo(),
      renderBalanceInfo(),
      showQrCode && !isMini && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-qr-code" }, /* @__PURE__ */ import_react.default.createElement(import_pisellQrcode.default, { value: qrCode, size: 60 })),
      // mini卡片选中模式
      isMini && active && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-checked-icon" }, /* @__PURE__ */ import_react.default.createElement(
        import_icons.CheckCircleFilled,
        {
          style: { fontSize: 20, color: "var(--Primary-600, #7F56D9)" }
        }
      ))
    ),
    (disabled || disabledReason) && showDisabledReason && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-card-warn-message" }, /* @__PURE__ */ import_react.default.createElement(
      import_iconfont.default,
      {
        className: "pisell-card-icon",
        type: "pisell2-alert-circle"
      }
    ), /* @__PURE__ */ import_react.default.createElement("span", null, disabledReason))
  ));
};
var pisellWalletPassCard_default = PisellWalletPassCard;
