@pisell/private-materials 6.0.25 → 6.1.1

package/es/components/eventBooking/utils.js

@@ -3,7 +3,7 @@ import useEngineContext from "../../hooks/useEngineContext";
 
 /**
  * @title: 获取背景色
- * @description: 
+ * @description:
  * @param {string} colors
  * @return {*}
  * @Author: WangHan
@@ -17,7 +17,7 @@ export var formatBackgroundColors = function formatBackgroundColors(colors) {
   });
   var colorStr = _colors.map(function (color, index) {
     return "".concat(color, " ").concat(index * 100 / _colors.length, "% ").concat((index + 1) * 100 / _colors.length, "%");
-  }).join(", ");
+  }).join(', ');
   if (colorStr) {
     return "conic-gradient(".concat(colorStr, ")");
   }
@@ -26,7 +26,7 @@ export var formatBackgroundColors = function formatBackgroundColors(colors) {
 
 /**
  * @title: 获取可用的 schedule
- * @description: 
+ * @description:
  * @param {any} schedule
  * @return {*}
  * @Author: zhiwei.Wang
@@ -49,7 +49,7 @@ export var getUsableSchedules = function getUsableSchedules(schedule) {
 
 /**
  * @title: 获取 schedules 的所有颜色
- * @description: 
+ * @description:
  * @param {any} schedules
  * @return {*}
  * @Author: zhiwei.Wang
@@ -63,7 +63,7 @@ export var getScheduleColors = function getScheduleColors(schedules) {
 
 /**
  * @title: 格式化日期头部日期显示
- * @description: 
+ * @description:
  * @param {string} dateString
  * @return {*}
  * @Author: WangHan
@@ -83,17 +83,17 @@ export var formatMonthDisplay = function formatMonthDisplay(dateString) {
 
 /**
  * @title: 资源名称
- * @description: 
+ * @description:
  * @param {any} data
  * @return {*}
  * @Author: WangHan
  * @Date: 2025-02-11 13:39
  */
 export var resourceTitle = function resourceTitle(data) {
-  var _data$initData, _form$setting, _context$appHelper, _translation;
+  var _data$initData, _form$setting, _context$appHelper;
   var context = useEngineContext();
   var form = data === null || data === void 0 || (_data$initData = data.initData) === null || _data$initData === void 0 || (_data$initData = _data$initData.boardSetting) === null || _data$initData === void 0 || (_data$initData = _data$initData.event_v2_form) === null || _data$initData === void 0 ? void 0 : _data$initData.form;
   var title = (form === null || form === void 0 || (_form$setting = form.setting) === null || _form$setting === void 0 ? void 0 : _form$setting.title) || (form === null || form === void 0 ? void 0 : form.title);
   var translation = context === null || context === void 0 || (_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.utils) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.translation;
-  return (_translation = translation(title)) === null || _translation === void 0 ? void 0 : _translation.toLowerCase();
+  return translation(title);
 };

package/es/components/index.d.ts

@@ -14,4 +14,5 @@ import WalletList from './walletList';
 import WorkspaceListDetail from './workSpaceListDetail/';
 import WorkspaceList from './workSpaceList';
 import PisellSelectCustomerModal from './pisellSelectCustomerModal';
-export { Login, BookingInfo, Booking, BookingNotes, BookingAddons, BookingForms, Schedules, ProductExtension, RuleSetting, TaxSelect, ToCPay, PisellSelectCustomerModal, Wallet, WalletList, WorkspaceList, WorkspaceListDetail, };
+import SubTotal from './subTotal';
+export { Login, BookingInfo, Booking, BookingNotes, BookingAddons, BookingForms, Schedules, ProductExtension, RuleSetting, TaxSelect, ToCPay, PisellSelectCustomerModal, Wallet, WalletList, WorkspaceList, WorkspaceListDetail, SubTotal, };

package/es/components/index.js

@@ -14,4 +14,5 @@ import WalletList from "./walletList";
 import WorkspaceListDetail from "./workSpaceListDetail/";
 import WorkspaceList from "./workSpaceList";
 import PisellSelectCustomerModal from "./pisellSelectCustomerModal";
-export { Login, BookingInfo, Booking, BookingNotes, BookingAddons, BookingForms, Schedules, ProductExtension, RuleSetting, TaxSelect, ToCPay, PisellSelectCustomerModal, Wallet, WalletList, WorkspaceList, WorkspaceListDetail };
+import SubTotal from "./subTotal";
+export { Login, BookingInfo, Booking, BookingNotes, BookingAddons, BookingForms, Schedules, ProductExtension, RuleSetting, TaxSelect, ToCPay, PisellSelectCustomerModal, Wallet, WalletList, WorkspaceList, WorkspaceListDetail, SubTotal };

package/es/components/listComponent/index.js

@@ -1,9 +1,9 @@
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import "./index.less";
 export interface LoginProps {
     title: string;

package/es/components/pay/toB/components/Cache/index.d.ts

@@ -0,0 +1,10 @@
+import './index.less';
+declare const ToBPayCache: (props: {
+    open: boolean;
+    title: string;
+    uuid: string;
+    expect_amount: string;
+    onCancel: () => void;
+    onOk: (amount: string) => void;
+}) => JSX.Element;
+export default ToBPayCache;

package/es/components/pay/toB/components/Cache/index.js

@@ -0,0 +1,94 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { useState, useEffect } from 'react';
+import { locales } from '@pisell/utils';
+import { InputNumber } from 'antd';
+import { PisellModal } from '@pisell/materials';
+import { limitDecimals } from "../../store/utils";
+import { useOSPayment } from "../../store";
+import { useSymbol } from "../../hooks";
+import "./index.less";
+var ToBPayCache = function ToBPayCache(props) {
+  var open = props.open,
+    title = props.title,
+    uuid = props.uuid,
+    _props$expect_amount = props.expect_amount,
+    expect_amount = _props$expect_amount === void 0 ? '' : _props$expect_amount,
+    onCancel = props.onCancel,
+    _onOk = props.onOk;
+  var osPayment = useOSPayment();
+  var symbol = useSymbol();
+  var _useState = useState(expect_amount),
+    _useState2 = _slicedToArray(_useState, 2),
+    inputAmount = _useState2[0],
+    setInputAmount = _useState2[1];
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    payDesc = _useState4[0],
+    setPayDesc = _useState4[1];
+  useEffect(function () {
+    setInputAmount(expect_amount);
+  }, [expect_amount]);
+  useEffect(function () {
+    osPayment.getRemainingOrderAmountWithInputAsync(inputAmount, uuid).then(function (res) {
+      // 全额支付
+      if (Number(res) === 0) {
+        setPayDesc(locales.getText('tobPay.text.cash.modal.no.change.given'));
+      }
+      // 找零
+      if (Number(res) < 0) {
+        setPayDesc(locales.getText('tobPay.text.cash.modal.amount.pay.change')("".concat(symbol).concat(Math.abs(Number(res)))));
+      }
+      // 还需支付
+      if (Number(res) > 0) {
+        setPayDesc(locales.getText('tobPay.text.cash.modal.amount.left.pay.paid')("".concat(symbol).concat(res)));
+      }
+    });
+  }, [inputAmount]);
+  return /*#__PURE__*/React.createElement(PisellModal, {
+    title: title,
+    open: open,
+    onCancel: onCancel,
+    okButtonProps: {
+      disabled: Number(inputAmount) <= 0
+    },
+    okText: locales.getText('tobPay.text.cash.modal.ok'),
+    onOk: function onOk() {
+      _onOk(inputAmount);
+    },
+    destroyOnClose: true
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-cache"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-cache-money"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-cache-text"
+  }, locales.getText('tobPay.text.cash.modal.amount.toPay')), /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-cache-num"
+  }, symbol, Number(expect_amount).toFixed(2))), /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-cache-title"
+  }, locales.getText('tobPay.text.cash.modal.input.title')), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(InputNumber, {
+    precision: 2,
+    value: inputAmount,
+    min: 0,
+    formatter: limitDecimals,
+    parser: limitDecimals,
+    onChange: function onChange(event) {
+      if (event !== null && event !== undefined) {
+        setInputAmount(event);
+      } else {
+        setInputAmount('0');
+      }
+    },
+    style: {
+      width: '100%'
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-cache-desc"
+  }, payDesc)));
+};
+export default ToBPayCache;

package/es/components/pay/toB/components/Cache/index.less

@@ -0,0 +1,41 @@
+.tob-pay-cache {
+  padding: 24px 0;
+
+  .tob-pay-cache-money {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    .tob-pay-cache-text {
+      height: 22px;
+      font-size: 16px;
+      font-weight: 650;
+      line-height: 22px;
+      color: #1a1a1a;
+    }
+
+    .tob-pay-cache-num {
+      height: 22px;
+      font-size: 16px;
+
+      font-weight: 600;
+      line-height: 22px;
+      color: #1a1a1a;
+    }
+  }
+
+  .tob-pay-cache-title {
+    margin: 24px 0 8px 0;
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 22px;
+    color: #1a1a1a;
+  }
+
+  .tob-pay-cache-desc {
+    margin-top: 8px;
+    font-size: 14px;
+    font-weight: 400;
+    color: #8c8c8c;
+  }
+}

package/es/components/pay/toB/components/Card/index.d.ts

@@ -0,0 +1,7 @@
+import { PayMethod } from '../../types';
+import './index.less';
+declare const ToBPayCard: ({ data, onChange, }: {
+    data: PayMethod;
+    onChange: (item: PayMethod, type: 'fullPay' | 'pay') => void;
+}) => JSX.Element;
+export default ToBPayCard;

package/es/components/pay/toB/components/Card/index.js

@@ -0,0 +1,32 @@
+import React from 'react';
+import { locales } from '@pisell/utils';
+import { Button, Iconfont } from '@pisell/materials';
+import "./index.less";
+var ToBPayCard = function ToBPayCard(_ref) {
+  var data = _ref.data,
+    onChange = _ref.onChange;
+  var name = data.name,
+    type = data.type;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-card",
+    onClick: function onClick() {
+      return onChange(data, 'pay');
+    }
+  }, /*#__PURE__*/React.createElement(Iconfont, {
+    type: "icona-zu6491",
+    style: {
+      color: 'var(--theme-color)',
+      fontSize: '30px',
+      marginBottom: '10px'
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-card-name"
+  }, name || ''), type === 'eftpos' ? /*#__PURE__*/React.createElement(Button, {
+    type: "link",
+    onClick: function onClick(e) {
+      e.stopPropagation();
+      onChange(data, 'fullPay');
+    }
+  }, locales.getText('tobPay.text.card.edit.amount')) : null);
+};
+export default ToBPayCard;

package/es/components/pay/toB/components/Card/index.less

@@ -0,0 +1,26 @@
+.tob-pay-card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  min-height: 120px;
+  padding: 16px;
+  background: #fff;
+  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.16);
+  border-radius: 4px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+
+  &:hover {
+    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
+    transform: translateY(-2px);
+  }
+
+  &-name {
+    font-size: 16px;
+    font-weight: 500;
+    color: #1a1a1a;
+    text-align: center;
+  }
+}

package/es/components/pay/toB/components/CardGroup/index.d.ts

@@ -0,0 +1,7 @@
+import { PayMethod, PayMethodGroup } from '../../types';
+import './index.less';
+declare const ToBPayCardGroup: (props: {
+    data: PayMethodGroup;
+    onChange: (item: PayMethod, type: 'fullPay' | 'pay') => void;
+}) => JSX.Element;
+export default ToBPayCardGroup;

package/es/components/pay/toB/components/CardGroup/index.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import ToBPayCard from "../Card";
+import "./index.less";
+var ToBPayCardGroup = function ToBPayCardGroup(props) {
+  var _data$list;
+  var data = props.data,
+    onChange = props.onChange;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-card-group"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-card-group-title"
+  }, data.title), /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-card-group-list"
+  }, data === null || data === void 0 || (_data$list = data.list) === null || _data$list === void 0 ? void 0 : _data$list.map(function (item) {
+    return /*#__PURE__*/React.createElement(ToBPayCard, {
+      key: item.id,
+      data: item,
+      onChange: onChange
+    });
+  })));
+};
+export default ToBPayCardGroup;

package/es/components/pay/toB/components/CardGroup/index.less

@@ -0,0 +1,18 @@
+.tob-pay-card-group {
+  margin-bottom: 32px;
+
+  &-title {
+    margin-bottom: 20px;
+    font-size: 18px;
+    font-weight: 500;
+    color: #1a1a1a;
+  }
+
+  &-list {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
+    grid-template-columns: repeat(3, 1fr);
+    gap: 20px;
+    max-width: 100%;
+  }
+}

package/es/components/pay/toB/components/ConfirmedPayment/index.d.ts

@@ -0,0 +1,6 @@
+import { Payment } from '../../types';
+import './index.less';
+declare const ConfirmedPayment: (props: {
+    data: Payment[];
+}) => JSX.Element;
+export default ConfirmedPayment;

package/es/components/pay/toB/components/ConfirmedPayment/index.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import { Iconfont } from '@pisell/materials';
+import { locales } from '@pisell/utils';
+import Decimal from 'decimal.js';
+import { useSymbol } from "../../hooks";
+import "./index.less";
+var ConfirmedPayment = function ConfirmedPayment(props) {
+  var data = props.data;
+  var symbol = useSymbol();
+  var getTotalAmount = function getTotalAmount(item) {
+    var amount = new Decimal((item === null || item === void 0 ? void 0 : item.amount) || 0);
+    var surcharge = getSurcharge(item);
+    return amount.add(surcharge).toFixed(2).toString();
+  };
+  var getSurcharge = function getSurcharge(item) {
+    var _item$service_charge, _item$service_charge2;
+    var amount = new Decimal((item === null || item === void 0 ? void 0 : item.amount) || 0);
+    var surcharge = new Decimal(0);
+    if (item !== null && item !== void 0 && (_item$service_charge = item.service_charge) !== null && _item$service_charge !== void 0 && _item$service_charge.percentage) {
+      // amount * percentage
+      surcharge = amount.mul(item.service_charge.percentage);
+    }
+    if (item !== null && item !== void 0 && (_item$service_charge2 = item.service_charge) !== null && _item$service_charge2 !== void 0 && _item$service_charge2.amount) {
+      // surcharge + service_charge.amount
+      surcharge = surcharge.add(item.service_charge.amount);
+    }
+    return surcharge.toFixed(2).toString();
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-confirmed-payment"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-confirmed-payment-title"
+  }, locales.getText('tobPay.text.confirmed.payment')), /*#__PURE__*/React.createElement("div", {
+    className: "tob-pay-confirmed-payment-list"
+  }, data.map(function (item) {
+    var totalAmount = getTotalAmount(item);
+    var surcharge = getSurcharge(item);
+    return /*#__PURE__*/React.createElement("div", {
+      key: item.uuid,
+      className: "tob-pay-confirmed-payment-item"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "tob-pay-confirmed-payment-item-left"
+    }, /*#__PURE__*/React.createElement(Iconfont, {
+      type: "icona-zu6491",
+      style: {
+        marginTop: '-2px',
+        fontSize: '24px',
+        color: 'var(--theme-color)'
+      }
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "tob-pay-confirmed-payment-item-left-content"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "tob-pay-confirmed-payment-item-name"
+    }, item.name), item.created_at && /*#__PURE__*/React.createElement("span", {
+      className: "tob-pay-confirmed-payment-item-time"
+    }, item.created_at))), /*#__PURE__*/React.createElement("div", {
+      className: "tob-pay-confirmed-payment-item-right"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "tob-pay-confirmed-payment-item-right-info"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "tob-pay-confirmed-payment-item-amount"
+    }, symbol, totalAmount), Number(surcharge) > 0 && /*#__PURE__*/React.createElement("span", {
+      className: "tob-pay-confirmed-payment-item-surcharge"
+    }, locales.getText('tobPay.text.payment.with.surcharge'), ":", ' ', symbol, surcharge))));
+  })));
+};
+export default ConfirmedPayment;

package/es/components/pay/toB/components/ConfirmedPayment/index.less

@@ -0,0 +1,69 @@
+.tob-pay-confirmed-payment {
+  margin-bottom: 32px;
+
+  .tob-pay-confirmed-payment-title {
+    margin-bottom: 20px;
+    font-size: 18px;
+    font-weight: 500;
+    color: #1a1a1a;
+  }
+
+  .tob-pay-confirmed-payment-list {
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+
+    .tob-pay-confirmed-payment-item {
+      min-height: 80px;
+      width: 100%;
+      padding: 15px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      flex-wrap: wrap;
+      background: #fff;
+      box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.16);
+      border-radius: 4px;
+
+      .tob-pay-confirmed-payment-item-left {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+
+        .tob-pay-confirmed-payment-item-left-content {
+          display: flex;
+          flex-direction: column;
+
+          .tob-pay-confirmed-payment-item-name {
+            font-size: 16px;
+            font-weight: 500;
+            color: #1a1a1a;
+          }
+
+          .tob-pay-confirmed-payment-item-time {
+            font-size: 14px;
+          }
+        }
+      }
+
+      .tob-pay-confirmed-payment-item-right {
+        .tob-pay-confirmed-payment-item-right-info {
+          display: flex;
+          flex-direction: column;
+          align-items: flex-end;
+        }
+
+        .tob-pay-confirmed-payment-item-amount {
+          font-size: 16px;
+          font-weight: 500;
+          color: #1a1a1a;
+        }
+
+        .tob-pay-confirmed-payment-item-surcharge {
+          font-size: 14px;
+          color: #8c8c8c;
+        }
+      }
+    }
+  }
+}

package/es/components/pay/toB/components/Content/Footer.d.ts

@@ -0,0 +1,7 @@
+declare const ToBPayFooter: (props: {
+    loading: boolean;
+    submitDisabled: boolean;
+    onCancel: () => void;
+    onSubmit: () => void;
+}) => JSX.Element;
+export default ToBPayFooter;

package/es/components/pay/toB/components/Content/Footer.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import { Button } from '@pisell/materials';
+import { locales } from '@pisell/utils';
+var ToBPayFooter = function ToBPayFooter(props) {
+  var loading = props.loading,
+    submitDisabled = props.submitDisabled,
+    onCancel = props.onCancel,
+    onSubmit = props.onSubmit;
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: '100%',
+      display: 'flex',
+      gap: '20px'
+    }
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "default",
+    size: "large",
+    onClick: onCancel,
+    disabled: loading,
+    style: {
+      flex: 1,
+      height: 50
+    }
+  }, locales.getText('tobPay.text.cancel')), /*#__PURE__*/React.createElement(Button, {
+    type: "primary",
+    size: "large",
+    onClick: onSubmit,
+    disabled: submitDisabled,
+    loading: loading,
+    style: {
+      flex: 1,
+      height: 50
+    }
+  }, locales.getText('tobPay.text.submit')));
+};
+export default ToBPayFooter;

package/es/components/pay/toB/components/Content/Header.d.ts

@@ -0,0 +1,4 @@
+declare const ToBPayTitle: (props: {
+    amount: number | string;
+}) => JSX.Element;
+export default ToBPayTitle;

package/es/components/pay/toB/components/Content/Header.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { locales } from '@pisell/utils';
+var ToBPayTitle = function ToBPayTitle(props) {
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      textAlign: 'center',
+      fontSize: '18px',
+      fontWeight: 600
+    }
+  }, locales.getText('tobPay.text.waitPay'), props.amount);
+};
+export default ToBPayTitle;

package/es/components/pay/toB/components/Content/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.less';
+declare const ToBPayContent: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<unknown>>;
+export default ToBPayContent;