@pisell/private-materials 3.1.3 → 3.2.2

package/lib/components/wallet/Voucher/index.js

@@ -0,0 +1,120 @@
+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/wallet/Voucher/index.tsx
+var Voucher_exports = {};
+__export(Voucher_exports, {
+  default: () => Voucher_default
+});
+module.exports = __toCommonJS(Voucher_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_model = require("./model");
+var import_WalletCard = __toESM(require("../components/WalletCard"));
+var import_useWalletCard = require("../hooks/useWalletCard");
+var import_utils = require("@pisell/utils");
+var import_index = require("./index.less");
+var { Title } = import_materials.Typography;
+var Voucher = (0, import_model.Provider)((props) => {
+  const { globalState, setGlobalState } = props;
+  const { product_voucher = [] } = globalState;
+  const recordViewRef = (0, import_react.useRef)(null);
+  const {
+    platform,
+    isEmpty,
+    state,
+    handleRowClick,
+    renderCardDetail,
+    formatData
+  } = (0, import_useWalletCard.useWalletCard)({
+    globalState,
+    setGlobalState,
+    walletContext: (0, import_react.useContext)(import_model.Context),
+    cardList: product_voucher,
+    cardType: "product_voucher"
+  });
+  (0, import_react.useEffect)(() => {
+    if (globalState.setup !== "detail" && recordViewRef.current) {
+      recordViewRef.current.closeDetailModal();
+    }
+  }, [globalState.setup]);
+  const renderItem = (item) => /* @__PURE__ */ import_react.default.createElement(
+    import_WalletCard.default,
+    {
+      item,
+      currentId: globalState.currentId,
+      onClick: () => {
+        setGlobalState({
+          type: "setState",
+          payload: { currentId: item.id }
+        });
+      }
+    }
+  );
+  if (isEmpty) {
+    return /* @__PURE__ */ import_react.default.createElement(import_materials.PisellEmpty, null);
+  }
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, platform !== "pc" && /* @__PURE__ */ import_react.default.createElement(Title, { className: "wallet-voucher-title" }, import_utils.locales.getText("page.wallet.voucher")), /* @__PURE__ */ import_react.default.createElement(
+    import_materials.CardMetricItem,
+    {
+      title: import_utils.locales.getText("page.wallet.voucherBalance"),
+      style: { margin: "8px 0 24px" },
+      hint: false,
+      tags: false,
+      number: state.total
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_materials.RecordView,
+    {
+      ref: recordViewRef,
+      mobilePadDetailModalDisplay: true,
+      leftSpan: 9,
+      rightSpan: 15,
+      gutter: 20,
+      onRowClick: handleRowClick,
+      modalWrapStyle: {
+        overflowY: "auto",
+        top: 68,
+        height: "calc(100vh - 68px)",
+        zIndex: 998
+      },
+      pcDetailModalDisplay: platform === "h5" ? true : false,
+      padDetailModalDisplay: true,
+      isShowClode: false,
+      split: false,
+      children: null,
+      detail: renderCardDetail(),
+      emptyButtons: [],
+      doubleList: true,
+      doubleListSource: formatData(),
+      dataSource: product_voucher,
+      renderItem
+    }
+  ));
+});
+var Voucher_default = Voucher;

package/lib/components/wallet/Voucher/index.less

@@ -0,0 +1,11 @@
+.wallet-voucher-title {
+  color: var(--Gray-900, #101828);
+
+  /* Text xl/Semibold */
+  font-family: Inter;
+  font-size: 20px;
+  font-style: normal;
+  font-weight: 600;
+  line-height: 30px; /* 150% */
+  margin: 20px 0;
+}

package/lib/components/wallet/Voucher/locales.d.ts

@@ -0,0 +1,21 @@
+declare const _default: {
+    en: {
+        'page.wallet.rechargeOptions': string;
+        'page.wallet.available': string;
+        'page.wallet.unavailable': string;
+        'page.wallet.recharge': string;
+    };
+    'zh-CN': {
+        'page.wallet.rechargeOptions': string;
+        'page.wallet.available': string;
+        'page.wallet.unavailable': string;
+        'page.wallet.recharge': string;
+    };
+    'zh-HK': {
+        'page.wallet.rechargeOptions': string;
+        'page.wallet.available': string;
+        'page.wallet.unavailable': string;
+        'page.wallet.recharge': string;
+    };
+};
+export default _default;

package/lib/components/wallet/Voucher/locales.js

@@ -0,0 +1,44 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/wallet/Voucher/locales.ts
+var locales_exports = {};
+__export(locales_exports, {
+  default: () => locales_default
+});
+module.exports = __toCommonJS(locales_exports);
+var locales_default = {
+  "en": {
+    "page.wallet.rechargeOptions": "Recharge Options",
+    "page.wallet.available": "Available",
+    "page.wallet.unavailable": "Un Available",
+    "page.wallet.recharge": "Recharge"
+  },
+  "zh-CN": {
+    "page.wallet.rechargeOptions": "充值选项",
+    "page.wallet.available": "可用",
+    "page.wallet.unavailable": "不可用",
+    "page.wallet.recharge": "充值"
+  },
+  "zh-HK": {
+    "page.wallet.rechargeOptions": "儲值選項",
+    "page.wallet.available": "可用",
+    "page.wallet.unavailable": "不可用",
+    "page.wallet.recharge": "充值"
+  }
+};

package/lib/components/wallet/Voucher/model.d.ts

@@ -0,0 +1 @@
+export declare const Provider: any, Context: any;

package/lib/components/wallet/Voucher/model.js

@@ -0,0 +1,43 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/wallet/Voucher/model.tsx
+var model_exports = {};
+__export(model_exports, {
+  Context: () => Context,
+  Provider: () => Provider
+});
+module.exports = __toCommonJS(model_exports);
+var import_utils = require("@pisell/utils");
+var defaultState = {
+  total: 0
+};
+var { Provider, Context } = (0, import_utils.miniRedux)({
+  namespace: "state",
+  state: defaultState,
+  reducers: {
+    setState(state, payload) {
+      return { ...state, ...payload };
+    }
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Context,
+  Provider
+});

package/lib/components/wallet/components/FooterButtons/index.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import './index.less';
+export interface FooterButtonsProps {
+    step: string;
+    onAppleWalletClick?: () => void;
+    onRechargeClick?: () => void;
+    onAddClick?: () => void;
+    disabled?: boolean;
+    platform?: 'pc' | 'h5';
+    isIOS?: boolean;
+}
+/**
+ * 通用底部按钮组件
+ * 根据step不同显示不同的按钮组
+ */
+declare const FooterButtons: React.FC<FooterButtonsProps>;
+export default FooterButtons;

package/lib/components/wallet/components/FooterButtons/index.js

@@ -0,0 +1,107 @@
+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/wallet/components/FooterButtons/index.tsx
+var FooterButtons_exports = {};
+__export(FooterButtons_exports, {
+  default: () => FooterButtons_default
+});
+module.exports = __toCommonJS(FooterButtons_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
+var import_index = require("./index.less");
+var FooterButtons = ({
+  step,
+  onAppleWalletClick,
+  onRechargeClick,
+  onAddClick,
+  disabled = false,
+  platform = "h5",
+  isIOS = false
+}) => {
+  if (platform === "pc") {
+    return null;
+  }
+  const renderButtons = () => {
+    switch (step) {
+      case "list":
+        return /* @__PURE__ */ import_react.default.createElement("div", { className: "wallet-footer-buttons" }, /* @__PURE__ */ import_react.default.createElement(
+          import_antd.Button,
+          {
+            type: "primary",
+            onClick: onAddClick,
+            disabled,
+            size: "large",
+            className: "wallet-footer-buttons-item wallet-footer-buttons-item-primary"
+          },
+          import_utils.locales.getText("page.wallet.button.add")
+        ));
+      case "detail":
+        const buttons = [];
+        if (onAppleWalletClick) {
+          buttons.push(
+            /* @__PURE__ */ import_react.default.createElement(
+              import_antd.Button,
+              {
+                key: "apple-wallet",
+                onClick: onAppleWalletClick,
+                disabled,
+                size: "large",
+                className: "wallet-footer-buttons-item wallet-footer-buttons-item-secondary"
+              },
+              isIOS ? import_utils.locales.getText("page.wallet.button.addToAppleWallet") : import_utils.locales.getText("page.wallet.button.addToGoogleWallet")
+            )
+          );
+        }
+        if (onRechargeClick) {
+          buttons.push(
+            /* @__PURE__ */ import_react.default.createElement(
+              import_antd.Button,
+              {
+                key: "recharge",
+                type: "primary",
+                onClick: onRechargeClick,
+                disabled,
+                size: "large",
+                className: "wallet-footer-buttons-item wallet-footer-buttons-item-primary"
+              },
+              import_utils.locales.getText("page.wallet.button.recharge")
+            )
+          );
+        }
+        const buttonCount = buttons.length;
+        const className = `wallet-footer-buttons wallet-footer-buttons-count-${buttonCount}`;
+        return buttons.length > 0 ? /* @__PURE__ */ import_react.default.createElement("div", { className }, buttons) : null;
+      default:
+        return null;
+    }
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "wallet-footer" }, renderButtons());
+};
+var FooterButtons_default = FooterButtons;

package/lib/components/wallet/components/FooterButtons/index.less

@@ -0,0 +1,75 @@
+.wallet-footer {
+  position: relative;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #fff;
+  padding: 24px;
+  z-index: 100;
+  border-top: 1px solid #d0d5de;
+  &-buttons {
+    display: flex;
+    gap: 12px;
+    width: 100%;
+    
+    // 按钮数量样式
+    // 单个按钮占满宽度
+    &-count-1 {
+      .wallet-footer-buttons-item {
+        flex: 1;
+        width: 100%;
+      }
+    }
+    
+    // 两个按钮各占一半
+    &-count-2 {
+      .wallet-footer-buttons-item {
+        flex: 1;
+        width: calc(50% - 6px);
+      }
+    }
+    
+    // 三个按钮各占三分之一
+    &-count-3 {
+      .wallet-footer-buttons-item {
+        flex: 1;
+        width: calc(33.33% - 8px);
+      }
+    }
+    
+    // 四个按钮各占四分之一
+    &-count-4 {
+      .wallet-footer-buttons-item {
+        flex: 1;
+        width: calc(25% - 9px);
+      }
+    }
+    
+    // Ant Design按钮覆盖样式
+    :global(.ant-btn) {
+      height: 48px;
+      border-radius: 6px;
+      font-size: 16px;
+      font-weight: 500;
+      width: 100%;
+    }
+    
+    &-item {
+      // 修饰符：主按钮
+      &-primary {
+        background-color: var(--theme-color, #7F56D9);
+      }
+      
+      // 修饰符：次按钮
+      &-secondary {
+        background-color: #fff;
+        border-color: #d0d5de;
+        color: var(--Gray-700, #344054);
+      }
+    }
+  }
+}
+
+.wallet-footer:empty {
+  display: none;
+} 

package/lib/components/wallet/components/WalletBar/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import './index.less';
+interface WalletBarProps {
+    setup?: 'menu' | 'list' | 'detail';
+    onBack?: () => void;
+}
+declare const WalletBar: React.FC<WalletBarProps>;
+export default WalletBar;

package/lib/components/wallet/components/WalletBar/index.js

@@ -0,0 +1,48 @@
+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/wallet/components/WalletBar/index.tsx
+var WalletBar_exports = {};
+__export(WalletBar_exports, {
+  default: () => WalletBar_default
+});
+module.exports = __toCommonJS(WalletBar_exports);
+var import_react = __toESM(require("react"));
+var import_icons = require("@ant-design/icons");
+var import_utils = require("@pisell/utils");
+var import_index = require("./index.less");
+var WalletBar = ({ setup, onBack }) => {
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode-wallet-bar" }, /* @__PURE__ */ import_react.default.createElement(
+    import_icons.LeftOutlined,
+    {
+      onClick: onBack,
+      className: "pisell-lowcode-wallet-header-bar-arrow"
+    }
+  ), /* @__PURE__ */ import_react.default.createElement("span", { className: "header-title" }, setup === "detail" ? import_utils.locales.getText("page.wallet.details") : ""));
+};
+var WalletBar_default = WalletBar;

package/lib/components/wallet/components/WalletBar/index.less

@@ -0,0 +1,36 @@
+.pisell-lowcode-wallet-bar {
+  height: 44px;
+  display: flex;
+  align-items: center;
+  padding: 0 0;
+  background: #fff;
+  font-size: 16px;
+  font-weight: 500;
+  color: #101828;
+  border-bottom: 1px solid #EAECF0;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 100;
+  transform: translateZ(0); // 强制创建新的层叠上下文
+
+  .pisell-lowcode-wallet-header-bar-arrow {
+    width: 24px;
+    height: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 20px;
+    cursor: pointer;
+  }
+
+  .header-title {
+    flex: 1;
+    text-align: center;
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 24px;
+    margin-left: -24px; // 抵消返回按钮宽度,保持文字居中
+  }
+} 

package/lib/components/wallet/components/WalletCard.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { IWalletListItemProps } from '../serve';
+export interface WalletCardProps {
+    item: IWalletListItemProps;
+    currentId?: string | number;
+    isDiscountCard?: boolean;
+    onClick?: () => void;
+    balanceTitle?: string;
+}
+declare const _default: React.NamedExoticComponent<WalletCardProps>;
+export default _default;

package/lib/components/wallet/components/WalletCard.js

@@ -0,0 +1,92 @@
+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/wallet/components/WalletCard.tsx
+var WalletCard_exports = {};
+__export(WalletCard_exports, {
+  default: () => WalletCard_default
+});
+module.exports = __toCommonJS(WalletCard_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_utils = require("@pisell/utils");
+var WalletCard = ({
+  item,
+  currentId,
+  isDiscountCard = false,
+  onClick,
+  balanceTitle
+}) => {
+  const {
+    id,
+    tag,
+    product_title = "",
+    balance = 0,
+    code = "",
+    encoded = "",
+    expire_date = "",
+    shop = { name: "" },
+    limit_status,
+    product_cover = "",
+    par_value = "",
+    unified_messages = {}
+  } = item;
+  const platform = (0, import_react.useMemo)(() => (0, import_utils.isMobile)() ? "h5" : "pc", []);
+  const { title: disabledReason = "" } = unified_messages;
+  const { name: storeName = "" } = shop;
+  const isActive = id === currentId && platform === "pc";
+  console.log("%c [ tag ]-49", "font-size:13px; color:#bf2c9f;", tag);
+  const isDisabled = limit_status !== "enable";
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_materials.PisellWalletPassCard,
+    {
+      balanceTitle,
+      showDetail: false,
+      showRedeem: false,
+      showQrCode: false,
+      showBalance: !isDiscountCard,
+      cover: product_cover,
+      disabled: isDisabled,
+      showDisabledReason: isDisabled,
+      disabledReason,
+      propStyle: { marginBottom: 16 },
+      showBalanceSymbol: tag !== "point_card",
+      active: isActive,
+      name: product_title,
+      qrCode: code,
+      storeName,
+      balance: Number(balance),
+      discount: isDiscountCard ? Number(par_value) : void 0,
+      showDiscount: isDiscountCard,
+      code: encoded,
+      validDate: expire_date,
+      onClick
+    }
+  );
+};
+var WalletCard_default = import_react.default.memo(WalletCard);

package/lib/components/wallet/components/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WalletBar } from './WalletBar';
+export { default as FooterButtons } from './FooterButtons';