@pisell/materials 1.0.643 → 1.0.645

package/es/components/dataSourceComponents/dataSourceForm/provider/formSetting/FormSettingContext.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { ModeType } from '../../type';
 export interface FormSettingContextType {
-    onDataSourceFinish?: (values: any, result: any) => void;
+    onDataSourceFinish?: (values: any, result: any, form: any) => void;
     renderMode?: ModeType;
     groupInfoPosition?: 'top' | 'side';
     children?: React.ReactNode;

package/es/components/dataSourceComponents/dataSourceForm/submitButton/index.js

@@ -155,7 +155,7 @@ var SubmitButton = function SubmitButton(props) {
             result = _context2.sent;
             // 数据源提交成功
             if (onDataSourceFinish) {
-              onDataSourceFinish(formattedValues, result);
+              onDataSourceFinish(formattedValues, result, form);
             }
             if (refreshData) {
               refreshTableData === null || refreshTableData === void 0 ? void 0 : refreshTableData();

package/es/components/pisellAnchor/PisellAnchor.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+interface PisellAnchorProps {
+    options: {
+        id: string;
+        name: string;
+    }[];
+    tab?: string;
+    containerRef?: any;
+    onChange?: (key: string) => void;
+    onTabClick?: () => void;
+    hideBorder?: boolean;
+}
+declare const PisellAnchor: React.FC<PisellAnchorProps>;
+export default PisellAnchor;

package/es/components/pisellAnchor/PisellAnchor.js

@@ -0,0 +1,18 @@
+var PisellAnchor = function PisellAnchor(_ref) {
+  var _ref$options = _ref.options,
+    options = _ref$options === void 0 ? [] : _ref$options,
+    tab = _ref.tab,
+    containerRef = _ref.containerRef,
+    onChange = _ref.onChange,
+    onTabClick = _ref.onTabClick,
+    _ref$hideBorder = _ref.hideBorder,
+    hideBorder = _ref$hideBorder === void 0 ? false : _ref$hideBorder;
+  // ... existing code ...
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames('pisell-anchor', {
+      'pisell-anchor-no-border': hideBorder
+    })
+  }, "// ... existing code ...");
+};
+export default PisellAnchor;

package/es/components/pisellAnchor/index.less

@@ -175,3 +175,11 @@
     }
   }
 }
+
+.pisell-anchor {
+  border-bottom: 1px solid #EAECF0;
+
+  &.pisell-anchor-no-border {
+    border-bottom: none;
+  }
+}

package/es/components/pisellNavigationMenu/PisellNavigationMenu.js

@@ -76,7 +76,12 @@ var PisellNavigationMenu = function PisellNavigationMenu(_ref) {
       _item$allowDelete = item.allowDelete,
       allowDelete = _item$allowDelete === void 0 ? true : _item$allowDelete,
       _item$allowAddChild = item.allowAddChild,
-      allowAddChild = _item$allowAddChild === void 0 ? true : _item$allowAddChild;
+      allowAddChild = _item$allowAddChild === void 0 ? true : _item$allowAddChild,
+      _item$allowAddSubmenu = item.allowAddSubmenu,
+      allowAddSubmenu = _item$allowAddSubmenu === void 0 ? true : _item$allowAddSubmenu,
+      _item$allowAddPage = item.allowAddPage,
+      allowAddPage = _item$allowAddPage === void 0 ? true : _item$allowAddPage;
+    var isShowAddButton = item.isGroup && allowAddChild && (allowAddSubmenu || allowAddPage);
     return /*#__PURE__*/React.createElement("div", {
       className: "pisell-lowcode-navigation-menu-item"
     }, /*#__PURE__*/React.createElement("div", {
@@ -106,13 +111,21 @@ var PisellNavigationMenu = function PisellNavigationMenu(_ref) {
         type: "pisell2-edit-05",
         className: "pisell-lowcode-navigation-menu-item-action-button-icon"
       })
-    }), item.isGroup && allowAddChild && /*#__PURE__*/React.createElement(Dropdown, {
+    }), isShowAddButton && /*#__PURE__*/React.createElement(Dropdown, {
       menu: {
-        items: items,
-        onClick: function onClick(_ref2) {
-          var key = _ref2.key;
-          return handleClick(key, item);
-        }
+        items: [allowAddSubmenu && {
+          key: 'add-child',
+          label: getText('pisell-lowcode-navigation-menu-add-sub-menu'),
+          onClick: function onClick() {
+            return handleClick('add-child', item);
+          }
+        }, allowAddPage && {
+          key: 'add-page',
+          label: getText('pisell-lowcode-navigation-menu-add-page'),
+          onClick: function onClick() {
+            return handleClick('add-page', item);
+          }
+        }].filter(Boolean)
       }
     }, /*#__PURE__*/React.createElement(Button, {
       type: "text",

package/es/components/pisellNavigationMenu/types.d.ts

@@ -19,6 +19,10 @@ export interface NavigationMenuItem {
     allowDelete?: boolean;
     /** 是否允许编辑 */
     allowEdit?: boolean;
+    /** 是否允许添加子菜单 */
+    allowAddSubmenu?: boolean;
+    /** 是否允许添加页面 */
+    allowAddPage?: boolean;
     /** 其他属性 */
     [key: string]: any;
 }

package/es/components/walletCard/index.d.ts

@@ -1,29 +1,67 @@
 import React from 'react';
 import './index.less';
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            [elemName: string]: any;
+        }
+    }
+}
+interface WalletCardItem {
+    key: string;
+    label?: string;
+    hidden?: boolean;
+    value?: number;
+}
 interface WalletCardProps {
+    /** 二维码弹窗适配平台 */
     platform?: 'pc' | 'h5' | 'ipad';
+    /** 卡片主题 */
     mode?: 'dark' | 'light';
+    /** 默认还是完整显示code */
     cardStyle?: 'normal' | 'full';
-    codeType?: 'one' | 'two';
+    /** 条形码还是二维码 */
+    codeType?: 'barCode' | 'orCode';
+    /** 二维码方向 */
     codeDirection?: 'bottom' | 'top';
-    icon?: boolean;
-    vipLevel?: boolean;
-    shopName?: boolean;
-    isShowShopName: boolean;
+    /** 图标 */
+    icon?: React.ReactNode;
+    /** 钱包名称 */
+    walletName?: string;
+    /** 店铺名称 */
+    shopName?: string;
+    /** 是否显示店铺名称 */
+    isShowShopName?: boolean;
+    /** 卡号 */
     cardNo?: string;
+    /** 是否显示卡号 */
     isShowCardNo?: boolean;
+    /** 是否显示二维码 */
     showCode?: boolean;
+    /** 是否显示积分卡信息 */
     points?: boolean;
+    /** 是否显示余额信息 */
     balance?: boolean;
+    /** 是否显示折扣信息 */
     coupon?: boolean;
+    /** 是否显示优惠券数量 */
     isShowVouCher?: boolean;
+    /** 是否显示折扣卡数量 */
     isShowDiscountCard?: boolean;
+    /** 积分卡金额 */
     pointsValue?: number;
+    /** 余额 */
     balanceValue?: number;
+    /** 优惠券金额 */
     couponValue?: number;
+    /** 优惠券金额 */
     vouCherValue?: number;
+    /** 折扣卡金额 */
     discountCardValue?: number;
-    items: [];
+    /** 卡片内容项 */
+    items: WalletCardItem[];
+    /** 点击二维码/条形码的回调 */
+    onCodeClick?: () => void;
 }
-declare const WalletCard: (props: WalletCardProps) => React.JSX.Element;
+declare const WalletCard: React.FC<WalletCardProps>;
 export default WalletCard;

package/es/components/walletCard/index.js

@@ -4,80 +4,114 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import React, { useEffect, useState } from 'react';
-import { Card, Flex, QRCode, Divider, Button } from 'antd';
+import React, { useState, useMemo } from 'react';
+import { Card, QRCode, Divider, Button } from 'antd';
 import Iconfont from "./../iconfont";
-import useEngineContext from "../../hooks/useEngineContext";
 import Barcode from 'react-barcode';
 import Amount from "./../pisellText/components/Amount";
-import "./index.less";
 import PisellModal from "./../pisellModal";
 import classNames from 'classnames';
 import { getText } from "../../locales/index";
-import wallet_bg_black from "./img/wallet_bg_black.png";
-import wallet_bg_white from "./img/wallet_bg_white.png";
+import "./index.less";
+// 默认值
+var DEFAULT_PROPS = {
+  mode: 'dark',
+  cardStyle: 'normal',
+  codeType: 'barCode',
+  platform: 'pc',
+  codeDirection: 'bottom',
+  isShowShopName: true,
+  isShowCardNo: true,
+  showCode: true,
+  walletName: '',
+  points: true,
+  balance: true,
+  coupon: true,
+  isShowVouCher: true,
+  isShowDiscountCard: true,
+  pointsValue: 0,
+  balanceValue: 0,
+  vouCherValue: 0,
+  couponValue: 0,
+  discountCardValue: 0,
+  items: []
+};
 var WalletCard = function WalletCard(props) {
-  var _context$appHelper;
   var _props$mode = props.mode,
-    mode = _props$mode === void 0 ? 'dark' : _props$mode,
+    mode = _props$mode === void 0 ? DEFAULT_PROPS.mode : _props$mode,
     _props$cardStyle = props.cardStyle,
-    cardStyle = _props$cardStyle === void 0 ? 'normal' : _props$cardStyle,
+    cardStyle = _props$cardStyle === void 0 ? DEFAULT_PROPS.cardStyle : _props$cardStyle,
     _props$codeType = props.codeType,
-    codeType = _props$codeType === void 0 ? 'one' : _props$codeType,
-    _props$icon = props.icon,
-    icon = _props$icon === void 0 ? false : _props$icon,
-    _props$vipLevel = props.vipLevel,
-    vipLevel = _props$vipLevel === void 0 ? true : _props$vipLevel,
+    codeType = _props$codeType === void 0 ? DEFAULT_PROPS.codeType : _props$codeType,
+    _props$platform = props.platform,
+    platform = _props$platform === void 0 ? DEFAULT_PROPS.platform : _props$platform,
+    _props$codeDirection = props.codeDirection,
+    codeDirection = _props$codeDirection === void 0 ? DEFAULT_PROPS.codeDirection : _props$codeDirection,
+    icon = props.icon,
+    _props$walletName = props.walletName,
+    walletName = _props$walletName === void 0 ? DEFAULT_PROPS.walletName : _props$walletName,
     _props$shopName = props.shopName,
-    shopName = _props$shopName === void 0 ? '默认店铺名称' : _props$shopName,
+    shopName = _props$shopName === void 0 ? '' : _props$shopName,
     _props$isShowShopName = props.isShowShopName,
-    isShowShopName = _props$isShowShopName === void 0 ? true : _props$isShowShopName,
-    _props$pointsValue = props.pointsValue,
-    pointsValue = _props$pointsValue === void 0 ? 0 : _props$pointsValue,
-    _props$balanceValue = props.balanceValue,
-    balanceValue = _props$balanceValue === void 0 ? 0 : _props$balanceValue,
-    _props$vouCherValue = props.vouCherValue,
-    vouCherValue = _props$vouCherValue === void 0 ? 0 : _props$vouCherValue,
-    _props$couponValue = props.couponValue,
-    couponValue = _props$couponValue === void 0 ? 0 : _props$couponValue,
-    _props$discountCardVa = props.discountCardValue,
-    discountCardValue = _props$discountCardVa === void 0 ? 0 : _props$discountCardVa,
+    isShowShopName = _props$isShowShopName === void 0 ? DEFAULT_PROPS.isShowShopName : _props$isShowShopName,
     _props$cardNo = props.cardNo,
     cardNo = _props$cardNo === void 0 ? '' : _props$cardNo,
     _props$isShowCardNo = props.isShowCardNo,
-    isShowCardNo = _props$isShowCardNo === void 0 ? true : _props$isShowCardNo,
-    _props$codeDirection = props.codeDirection,
-    codeDirection = _props$codeDirection === void 0 ? 'bottom' : _props$codeDirection,
+    isShowCardNo = _props$isShowCardNo === void 0 ? DEFAULT_PROPS.isShowCardNo : _props$isShowCardNo,
     _props$showCode = props.showCode,
-    showCode = _props$showCode === void 0 ? 'true' : _props$showCode,
+    showCode = _props$showCode === void 0 ? DEFAULT_PROPS.showCode : _props$showCode,
     _props$points = props.points,
-    points = _props$points === void 0 ? true : _props$points,
+    points = _props$points === void 0 ? DEFAULT_PROPS.points : _props$points,
     _props$balance = props.balance,
-    balance = _props$balance === void 0 ? true : _props$balance,
+    balance = _props$balance === void 0 ? DEFAULT_PROPS.balance : _props$balance,
     _props$coupon = props.coupon,
-    coupon = _props$coupon === void 0 ? true : _props$coupon,
-    _props$vouCher = props.vouCher,
-    vouCher = _props$vouCher === void 0 ? true : _props$vouCher,
+    coupon = _props$coupon === void 0 ? DEFAULT_PROPS.coupon : _props$coupon,
+    _props$isShowVouCher = props.isShowVouCher,
+    isShowVouCher = _props$isShowVouCher === void 0 ? DEFAULT_PROPS.isShowVouCher : _props$isShowVouCher,
     _props$isShowDiscount = props.isShowDiscountCard,
-    isShowDiscountCard = _props$isShowDiscount === void 0 ? true : _props$isShowDiscount,
-    _props$platform = props.platform,
-    platform = _props$platform === void 0 ? 'pc' : _props$platform,
+    isShowDiscountCard = _props$isShowDiscount === void 0 ? DEFAULT_PROPS.isShowDiscountCard : _props$isShowDiscount,
+    _props$pointsValue = props.pointsValue,
+    pointsValue = _props$pointsValue === void 0 ? DEFAULT_PROPS.pointsValue : _props$pointsValue,
+    _props$balanceValue = props.balanceValue,
+    balanceValue = _props$balanceValue === void 0 ? DEFAULT_PROPS.balanceValue : _props$balanceValue,
+    _props$vouCherValue = props.vouCherValue,
+    vouCherValue = _props$vouCherValue === void 0 ? DEFAULT_PROPS.vouCherValue : _props$vouCherValue,
+    _props$couponValue = props.couponValue,
+    couponValue = _props$couponValue === void 0 ? DEFAULT_PROPS.couponValue : _props$couponValue,
+    _props$discountCardVa = props.discountCardValue,
+    discountCardValue = _props$discountCardVa === void 0 ? DEFAULT_PROPS.discountCardValue : _props$discountCardVa,
     _props$items = props.items,
-    items = _props$items === void 0 ? [] : _props$items; // 裁剪形状
-  var context = useEngineContext();
+    items = _props$items === void 0 ? DEFAULT_PROPS.items : _props$items,
+    onCodeClick = props.onCodeClick;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isModalOpen = _useState2[0],
-    setIsModalOpen = _useState2[1]; //控制模态框的显示与隐藏
-  var _ref = ((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.utils) || {},
-    store = _ref.store;
-  useEffect(function () {
-    document.body.id = 'body';
-  }, []);
-  var codeRender = function codeRender() {
-    return /*#__PURE__*/React.createElement(Flex, {
-      justify: "center"
-    }, codeType === 'one' ? /*#__PURE__*/React.createElement(Barcode, {
+    setIsModalOpen = _useState2[1];
+
+  // 处理二维码点击
+  var handleCodeClick = function handleCodeClick(e) {
+    e.stopPropagation();
+    if (onCodeClick) {
+      onCodeClick();
+    } else {
+      setIsModalOpen(true);
+    }
+  };
+
+  // 添加按钮点击处理函数
+  var handleButtonClick = function handleButtonClick(e) {
+    e.stopPropagation();
+    setIsModalOpen(false);
+  };
+
+  // 渲染二维码/条形码
+  var renderCode = useMemo(function () {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "pisell-wallet-card-code",
+      style: {
+        textAlign: 'center'
+      }
+    }, codeType === 'barCode' ? /*#__PURE__*/React.createElement(Barcode, {
       value: cardNo,
       height: 114,
       width: 3
@@ -86,101 +120,120 @@ var WalletCard = function WalletCard(props) {
       value: cardNo,
       bordered: false
     }));
+  }, [cardNo, codeType]);
+
+  // 渲染卡片头部
+  var renderHeader = function renderHeader() {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-wallet-card-header')
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-wallet-card-header-left')
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-wallet-card-header-level')
+    }, icon && /*#__PURE__*/React.createElement("div", {
+      className: "pisell-wallet-card-header-icon"
+    }, icon), walletName && /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-wallet-card-header-level-text')
+    }, walletName)), isShowShopName && shopName && /*#__PURE__*/React.createElement("div", null, shopName), isShowCardNo && cardNo && /*#__PURE__*/React.createElement("div", null, cardNo)), /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-wallet-card-header-right')
+    }, showCode && cardStyle === 'normal' && /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-wallet-card-icon-wrapper'),
+      onClick: handleCodeClick
+    }, /*#__PURE__*/React.createElement(Iconfont, {
+      type: codeType === 'barCode' ? 'pisell2-Barcode' : 'pisell2-a-qr-code-02',
+      className: classNames('pisell-wallet-card-icon')
+    }))));
   };
-  var modalProps = {
-    title: getText('walletCard-qrcode'),
-    platform: platform,
-    onCancel: function onCancel() {
-      return setIsModalOpen(false);
-    },
-    open: isModalOpen,
-    footer: null,
-    mobileModalHeight: 'auto',
-    className: classNames('pisell-qrcode-modal'),
-    bodyStyle: {
-      padding: 0
-    }
+
+  // 渲染卡片内容
+  var renderContent = function renderContent() {
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-wallet-card-list')
+    }, items.map(function (item, index) {
+      var label = item.label,
+        value = item.value;
+      return /*#__PURE__*/React.createElement("div", {
+        key: index,
+        className: "pisell-wallet-card-item"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "pisell-wallet-card-item-label"
+      }, getText("walletCard-".concat(label)) || ''), /*#__PURE__*/React.createElement("div", {
+        className: "pisell-wallet-card-item-value"
+      }, label === 'rechargeable' || label === 'pionts' ? /*#__PURE__*/React.createElement(Amount, {
+        className: "pisell-card-amount-item-value",
+        useThousandsSeparator: true,
+        showCurrencySymbol: true,
+        value: value
+      }) : value));
+    }));
+  };
+
+  // 渲染模态框
+  var renderModal = function renderModal() {
+    return /*#__PURE__*/React.createElement(PisellModal, {
+      title: getText('walletCard-qrcode'),
+      platform: platform,
+      onCancel: function onCancel(e) {
+        e.stopPropagation();
+        setIsModalOpen(false);
+      },
+      open: isModalOpen,
+      footer: null,
+      mobileModalHeight: "auto",
+      className: classNames('pisell-qrcode-modal'),
+      bodyStyle: {
+        padding: 0
+      },
+      modalRender: function modalRender(modal) {
+        return /*#__PURE__*/React.createElement("div", {
+          onClick: function onClick(e) {
+            return e.stopPropagation();
+          }
+        }, modal);
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      onClick: function onClick(e) {
+        return e.stopPropagation();
+      }
+    }, codeType === 'barCode' ? /*#__PURE__*/React.createElement(Barcode, {
+      value: cardNo,
+      height: 114,
+      width: 3
+    }) : /*#__PURE__*/React.createElement(QRCode, {
+      size: 200,
+      value: cardNo,
+      style: {
+        marginTop: 24
+      }
+    }), codeType === 'orCode' && /*#__PURE__*/React.createElement("div", {
+      className: classNames('pisell-qrcode-modal-value')
+    }, cardNo), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(Button, {
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        handleButtonClick(e);
+      },
+      className: classNames('pisell-qrcode-modal-button')
+    }, getText('walletCard-done'))));
   };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Card, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: classNames('pisell-wallet-card-wrapper')
-  }, /*#__PURE__*/React.createElement(Flex, {
+  }, /*#__PURE__*/React.createElement(Card, {
+    bordered: false,
+    className: classNames('pisell-wallet-card')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames('pisell-wallet-card-container'),
     style: {
-      flexDirection: "".concat(codeDirection === 'bottom' ? 'column' : 'column-reverse')
+      width: '100%'
     }
-  }, /*#__PURE__*/React.createElement(Flex, {
-    vertical: true,
+  }, /*#__PURE__*/React.createElement("div", {
     className: classNames('pisell-wallet-card-content', mode),
     style: {
-      backgroundImage: "url(".concat(mode === 'dark' ? wallet_bg_black : wallet_bg_white, ")")
+      backgroundImage: "url(https://file.mypisell-dev.com/pisel/image/9/".concat(mode === 'dark' ? '3d039c83ff5b84fadafb8a23c33d6cc42025_02_26_00_42_53_288_08413160975__720_456__' : '61dcbe950c9451164a6bb1d17d5bc5f02025_02_26_00_43_42_741_04853453608__720_456__', ".png)"),
+      flexDirection: codeDirection === 'bottom' ? 'column' : 'column-reverse',
+      display: 'flex'
     }
-  }, /*#__PURE__*/React.createElement(Flex, {
-    className: classNames('pisell-wallet-card-header'),
-    justify: "space-between",
-    align: "start"
-  }, /*#__PURE__*/React.createElement(Flex, {
-    className: classNames('pisell-wallet-card-header-left'),
-    vertical: true
-  }, /*#__PURE__*/React.createElement(Flex, {
-    className: classNames('pisell-wallet-card-header-level'),
-    gap: 10,
-    align: "center"
-  }, icon && /*#__PURE__*/React.createElement("div", {
-    className: "pisell-wallet-card-header-icon"
-  }, icon), vipLevel && /*#__PURE__*/React.createElement("p", {
-    className: classNames('pisell-wallet-card-header-level-text')
-  }, "Level")), isShowShopName && /*#__PURE__*/React.createElement("p", null, shopName), isShowCardNo && /*#__PURE__*/React.createElement("p", null, cardNo)), /*#__PURE__*/React.createElement(Flex, {
-    className: classNames('pisell-wallet-card-header-right')
-  }, showCode && cardStyle === 'normal' && /*#__PURE__*/React.createElement(React.Fragment, null, codeType === 'one' ? /*#__PURE__*/React.createElement(Iconfont, {
-    type: "pisell2-Barcode",
-    onClick: function onClick(e) {
-      e.stopPropagation();
-      setIsModalOpen(true);
-    },
-    className: classNames('pisell-wallet-card-icon')
-  }) : /*#__PURE__*/React.createElement(Iconfont, {
-    type: "pisell2-a-qr-code-02",
-    onClick: function onClick(e) {
-      e.stopPropagation();
-      setIsModalOpen(true);
-    },
-    className: classNames('pisell-wallet-card-icon')
-  })))), /*#__PURE__*/React.createElement(Flex, {
-    className: classNames('pisell-wallet-card-list'),
-    vertical: true,
-    justify: "center"
-  }, /*#__PURE__*/React.createElement(Flex, {
-    className: classNames('pisell-wallet-card-row'),
-    justify: "space-around"
-  }, items.map(function (item, index) {
-    console.log('%c [ item ]-187', 'font-size:13px; background:pink; color:#bf2c9f;', item);
-    var _item$hidden = item.hidden,
-      hidden = _item$hidden === void 0 ? false : _item$hidden,
-      _item$key = item.key,
-      key = _item$key === void 0 ? '' : _item$key;
-    return /*#__PURE__*/React.createElement("div", {
-      key: index,
-      hidden: hidden
-    }, /*#__PURE__*/React.createElement("p", null, " ", getText("walletCard-".concat(key))), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement(Amount, {
-      className: "pisell-card-amount-item-value",
-      useThousandsSeparator: true,
-      showCurrencySymbol: true,
-      value: pointsValue
-    })));
-  })))), showCode && cardStyle === 'full' && /*#__PURE__*/React.createElement("div", {
+  }, renderHeader(), renderContent()), showCode && cardStyle === 'full' && /*#__PURE__*/React.createElement("div", {
     className: classNames('pisell-wallet-card-showCode')
-  }, codeRender()))), /*#__PURE__*/React.createElement(PisellModal, modalProps, /*#__PURE__*/React.createElement(QRCode, {
-    size: 200,
-    value: cardNo,
-    style: {
-      marginTop: 24
-    }
-  }), /*#__PURE__*/React.createElement("p", {
-    className: classNames('pisell-qrcode-modal-value')
-  }, cardNo), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(Button, {
-    onClick: function onClick() {
-      return setIsModalOpen(false);
-    },
-    className: classNames('pisell-qrcode-modal-button')
-  }, getText('walletCard-done'))));
+  }, renderCode)))), renderModal());
 };
 export default WalletCard;