@pisell/private-materials 6.4.42 → 6.4.43

package/es/pro/priceKeyboard/index.less

@@ -0,0 +1,215 @@
+.price-keyboard {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  background-color: #ffffff;
+  border-radius: 12px;
+  padding: 20px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+
+.price-keyboard-inputs {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.price-keyboard-inputs-default {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.price-keyboard-input-wrapper {
+  display: flex;
+  align-items: center;
+  padding: 12px 16px;
+  background-color: #f9fafb;
+  border: 1px solid #d0d5dd;
+  border-radius: 8px;
+  transition: all 0.2s ease;
+
+  &:hover {
+    border-color: #98a2b3;
+  }
+
+  &:focus-within {
+    border-color: #1570ef;
+    box-shadow: 0 0 0 3px rgba(21, 112, 239, 0.1);
+  }
+}
+
+.price-keyboard-input {
+  flex: 1;
+}
+
+.price-keyboard-keyboard {
+  display: flex;
+  gap: 12px;
+}
+
+.price-keyboard-keyboard-numbers {
+  flex: 1;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 8px;
+}
+
+.price-keyboard-keyboard-actions {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 80px;
+}
+
+.price-keyboard-key {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 48px;
+  border: 1px solid #d0d5dd;
+  border-radius: 8px;
+  background-color: #ffffff;
+  color: #344054;
+  font-size: 16px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  outline: none;
+
+  &:hover {
+    background-color: #f9fafb;
+    border-color: #98a2b3;
+  }
+
+  &:active {
+    background-color: #f2f4f7;
+    transform: translateY(1px);
+  }
+
+  &:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    
+    &:hover {
+      background-color: #ffffff;
+      border-color: #d0d5dd;
+      transform: none;
+    }
+  }
+
+  &.price-keyboard-key-primary {
+    background-color: #1570ef;
+    color: #ffffff;
+    border-color: #1570ef;
+
+    &:hover {
+      background-color: #1366d9;
+      border-color: #1366d9;
+    }
+
+    &:active {
+      background-color: #0f5bc4;
+      border-color: #0f5bc4;
+    }
+  }
+
+  &.price-keyboard-key-size-2 {
+    height: 104px; /* 48px * 2 + 8px gap */
+  }
+
+  &.price-keyboard-key-size-3 {
+    height: 160px; /* 48px * 3 + 16px gap */
+  }
+}
+
+.price-keyboard-delete-icon {
+  width: 20px;
+  height: 20px;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+  .price-keyboard {
+    padding: 16px;
+    gap: 16px;
+  }
+
+  .price-keyboard-keyboard {
+    flex-direction: column;
+    gap: 16px;
+  }
+
+  .price-keyboard-keyboard-actions {
+    flex-direction: row;
+    width: auto;
+    height: auto;
+  }
+
+  .price-keyboard-key {
+    height: 44px;
+    font-size: 14px;
+  }
+
+  .price-keyboard-key.price-keyboard-key-size-2 {
+    height: 44px;
+    flex: 2;
+  }
+
+  .price-keyboard-key.price-keyboard-key-size-3 {
+    height: 44px;
+    flex: 3;
+  }
+}
+
+/* 深色主题支持 */
+@media (prefers-color-scheme: dark) {
+  .price-keyboard {
+    background-color: #1f2937;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+  }
+
+  .price-keyboard-input-wrapper {
+    background-color: #374151;
+    border-color: #4b5563;
+
+    &:hover {
+      border-color: #6b7280;
+    }
+
+    &:focus-within {
+      border-color: #3b82f6;
+      box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+    }
+  }
+
+  .price-keyboard-key {
+    background-color: #374151;
+    border-color: #4b5563;
+    color: #f9fafb;
+
+    &:hover {
+      background-color: #4b5563;
+      border-color: #6b7280;
+    }
+
+    &:active {
+      background-color: #6b7280;
+    }
+
+    &.price-keyboard-key-primary {
+      background-color: #3b82f6;
+      border-color: #3b82f6;
+
+      &:hover {
+        background-color: #2563eb;
+        border-color: #2563eb;
+      }
+
+      &:active {
+        background-color: #1d4ed8;
+        border-color: #1d4ed8;
+      }
+    }
+  }
+}

package/es/pro/priceKeyboard/utils.d.ts

@@ -0,0 +1,31 @@
+export declare const DEFAULT_THEME_CONFIG: {
+    dark: {
+        titleColor: string;
+        subtitleColor: string;
+        keyboardBgColor: string;
+        keyboardWrapperBgColor: string;
+        bgColor: string;
+        bgColorGray200: string;
+        bgColorGray300: string;
+        textGray500: string;
+        textGray600: string;
+        textGray900: string;
+    };
+    light: {
+        titleColor: string;
+        subtitleColor: string;
+        keyboardBgColor: string;
+        keyboardWrapperBgColor: string;
+        bgColor: string;
+        bgColorGray200: string;
+        bgColorGray300: string;
+        textGray500: string;
+        textGray600: string;
+        textGray900: string;
+    };
+};
+/**
+ * 设置键盘主题
+ * @param theme 主题
+ */
+export declare const setKeyboardTheme: (theme?: 'dark' | 'light') => void;

package/es/pro/priceKeyboard/utils.js

@@ -0,0 +1,51 @@
+//@ts-ignore
+import { setTheme } from '@pisell/utils';
+export var DEFAULT_THEME_CONFIG = {
+  dark: {
+    titleColor: '#FFFFFF',
+    subtitleColor: '#D0D5DD',
+    keyboardBgColor: 'rgba(0, 0, 0, 0.4)',
+    keyboardWrapperBgColor: 'rgba(0, 0, 0, 0.7)',
+    bgColor: 'rgba(0, 0, 0, 0.70)',
+    bgColorGray200: 'rgba(0, 0, 0, 0.40)',
+    bgColorGray300: 'rgba(0, 0, 0, 0.40)',
+    textGray500: '#D0D5DD',
+    textGray600: '#FFFFFF',
+    textGray900: '#FFFFFF'
+  },
+  light: {
+    titleColor: '#101828',
+    subtitleColor: '#667085',
+    keyboardBgColor: '#D0D5DD',
+    keyboardWrapperBgColor: 'white',
+    bgColor: '#FFFFFF',
+    bgColorGray200: '#EAECF0',
+    bgColorGray300: '#D0D5DD',
+    textGray500: '#667085',
+    textGray600: '#475467',
+    textGray900: '#101828'
+  }
+};
+
+/**
+ * 设置键盘主题
+ * @param theme 主题
+ */
+export var setKeyboardTheme = function setKeyboardTheme(theme) {
+  var currentTheme = DEFAULT_THEME_CONFIG[theme || 'light'];
+  setTheme({
+    // 标题颜色
+    '--pisell-pro-price-keyboard-title-color': currentTheme.titleColor,
+    // 副标题颜色
+    '--pisell-pro-price-keyboard-subtitle-color': currentTheme.subtitleColor,
+    // 背景颜色梯度
+    '--pisell-pro-price-keyboard-wrapper-bg-color': currentTheme.keyboardWrapperBgColor,
+    '--pisell-pro-price-keyboard-bg-color': currentTheme.keyboardBgColor,
+    '--pisell-pro-price-keyboard-bg-color-gray-200': currentTheme.bgColorGray200,
+    '--pisell-pro-price-keyboard-bg-color-gray-300': currentTheme.bgColorGray300,
+    // 文本颜色梯度
+    '--pisell-pro-price-keyboard-text-gray-500': currentTheme.textGray500,
+    '--pisell-pro-price-keyboard-text-gray-600': currentTheme.textGray600,
+    '--pisell-pro-price-keyboard-text-gray-900': currentTheme.textGray900
+  });
+};

package/es/pro/skuDetailModal/index.js

@@ -13,8 +13,6 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import React, { forwardRef, useImperativeHandle, useState, useMemo } from 'react';
 import { PisellModal, Button } from '@pisell/materials';
 import Decimal from 'decimal.js';
-import { PisellAdjustPrice } from '@pisell/materials';
-import { createPortal } from 'react-dom';
 import cloneDeep from 'lodash/cloneDeep';
 import { locales } from '@pisell/utils';
 import Delete_wght300_24px from '@pisell/icon/es/Delete_wght300_24px';
@@ -23,6 +21,7 @@ import "./index.less";
 import PisellNumberSelector from "../pisellNumberSelector";
 import NoteModal from "../../plus/noteModal";
 import useEngineContext from "../../hooks/useEngineContext";
+import { DiscountKeyboard } from "../priceKeyboard";
 var SkuDetailModal = function SkuDetailModal(_ref, ref) {
   var _context$appHelper, _store$getState, _context$engine, _productData$_extend2, _productData$_extend4, _productData$_extend6;
   var onConfirm = _ref.onConfirm,
@@ -346,21 +345,25 @@ var SkuDetailModal = function SkuDetailModal(_ref, ref) {
     onCancel: onNoteCancel,
     onConfirm: onNoteConfirm,
     onDelete: onNoteDelete
-  }), showPriceAdjustModal && /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", {
-    className: "pisell-price-adjust-overlay"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "pisell-price-adjust-backdrop",
-    onMouseDown: function onMouseDown(e) {
-      e.preventDefault();
-      setShowPriceAdjustModal(false);
+  }), /*#__PURE__*/React.createElement(DiscountKeyboard, {
+    containerProps: {
+      renderType: 'modal',
+      open: showPriceAdjustModal,
+      onCancel: function onCancel() {
+        return setShowPriceAdjustModal(false);
+      }
     }
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "pisell-price-adjust-container"
-  }, /*#__PURE__*/React.createElement(PisellAdjustPrice, {
-    originValue: priceOverride,
-    value: priceOverride,
-    onChange: handlePriceAdjustConfirm,
+    // 允许一口价超出原价
+    ,
+    enableExceedMaxAmount: true,
+    originalValue: priceOverride,
+    defaultValue: priceOverride,
+    onEnter: function onEnter(discountAmount) {
+      // 将折扣值转化为最终值
+      var finalPrice = new Decimal(priceOverride || 0).minus(discountAmount).toNumber();
+      handlePriceAdjustConfirm(finalPrice);
+    },
     selectType: "dark"
-  }))), document.body)));
+  })));
 };
 export default /*#__PURE__*/forwardRef(SkuDetailModal);

package/lib/components/booking/components/actionButtons/index.js

@@ -33,8 +33,8 @@ __export(actionButtons_exports, {
 });
 module.exports = __toCommonJS(actionButtons_exports);
 var import_react = __toESM(require("react"));
-var import_react_dom = require("react-dom");
 var import_antd = require("antd");
+var import_decimal = __toESM(require("decimal.js"));
 var import_icon = require("@pisell/icon");
 var import_utils = require("@pisell/utils");
 var import_materials = require("@pisell/materials");
@@ -48,6 +48,7 @@ var import_useCustomer = require("../../../ticketBooking/hooks/pisellos/useCusto
 var import_ahooks = require("ahooks");
 var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
 var import_useScanManager = __toESM(require("../../../ticketBooking/hooks/pisellos/useScanManager"));
+var import_priceKeyboard = require("../../../../pro/priceKeyboard");
 var createToastContent = (text) => /* @__PURE__ */ import_react.default.createElement("div", { className: "action-buttons-toast-content" }, text);
 var ActionButtons = ({
   state,
@@ -146,6 +147,9 @@ var ActionButtons = ({
       return 0;
     }
   }, [state, hasCartItems]);
+  const currentTotalPriceAfterDiscount = (0, import_react.useMemo)(() => {
+    return new import_decimal.default(currentTotalPrice).minus(state.shop_discount || 0).toNumber();
+  }, [state.shop_discount, currentTotalPrice]);
   const [discountList, setDiscountList] = (0, import_react.useState)([]);
   const usedVouchersCount = (0, import_react.useMemo)(() => {
     var _a2, _b2;
@@ -217,6 +221,12 @@ var ActionButtons = ({
         shop_discount: "0"
       }
     });
+    dispatch({
+      type: "setPaymentPaid",
+      payload: {
+        value: {}
+      }
+    });
     setShowClearModal(false);
     Toast == null ? void 0 : Toast.success(
       createToastContent(
@@ -264,6 +274,12 @@ var ActionButtons = ({
         orderNote: ""
       }
     });
+    dispatch({
+      type: "setPaymentPaid",
+      payload: {
+        value: {}
+      }
+    });
     setShowClearModal(false);
     Toast == null ? void 0 : Toast.success(
       createToastContent(
@@ -293,13 +309,7 @@ var ActionButtons = ({
       });
     }
   }, [(_g = state.service) == null ? void 0 : _g.value, (_h = state.addons) == null ? void 0 : _h.value]);
-  const handlePriceAdjustConfirm = (newPrice) => {
-    const { productAmount } = (0, import_amount.getSumTotal)(state, {
-      isEdit: true,
-      ScheduleModule,
-      ...getDataFromHost()
-    });
-    const discountAmount = Math.max(0, productAmount - newPrice);
+  const handlePriceAdjustConfirm = (discountAmount) => {
     dispatch({
       type: "setState",
       payload: {
@@ -419,26 +429,19 @@ var ActionButtons = ({
       onClearItemsOnly: handleClearItemsOnly,
       onClearAllAndReset: handleClearAllAndReset
     }
-  ), showPriceAdjustModal && (0, import_react_dom.createPortal)(
-    /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-price-adjust-overlay" }, /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        className: "pisell-price-adjust-backdrop",
-        onMouseDown: (e) => {
-          e.preventDefault();
-          setShowPriceAdjustModal(false);
-        }
-      }
-    ), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-price-adjust-container" }, /* @__PURE__ */ import_react.default.createElement(
-      import_materials.PisellAdjustPrice,
-      {
-        selectType: "dark",
-        originValue: currentTotalPrice,
-        value: currentTotalPrice,
-        onChange: handlePriceAdjustConfirm
-      }
-    ))),
-    document.body
+  ), /* @__PURE__ */ import_react.default.createElement(
+    import_priceKeyboard.DiscountKeyboard,
+    {
+      containerProps: {
+        renderType: "modal",
+        open: showPriceAdjustModal,
+        onCancel: () => setShowPriceAdjustModal(false)
+      },
+      selectType: "dark",
+      originalValue: currentTotalPrice,
+      defaultValue: currentTotalPriceAfterDiscount,
+      onEnter: handlePriceAdjustConfirm
+    }
   ), /* @__PURE__ */ import_react.default.createElement(
     import_customiseItemModal.default,
     {

package/lib/components/booking/components/actionButtons/index.less

@@ -185,31 +185,3 @@
   font-weight: 400 !important;
   color: inherit !important;
 }
-
-// 价格调整覆盖层样式 - 现在通过 Portal 渲染到 document.body
-.pisell-price-adjust-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 9999; // 由于现在渲染到 document.body，使用更高的 z-index
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.pisell-price-adjust-backdrop {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: transparent; // 纯透明遮罩
-  cursor: pointer; // 显示点击手势
-}
-
-.pisell-price-adjust-container {
-  position: relative;
-  z-index: 10000; // 确保键盘在遮罩之上
-} 

package/lib/components/booking/components/footer/amount.d.ts

@@ -23,12 +23,12 @@ export declare const getSumTotal: (state: any, options: {
     surcharge: any;
     otherAmount: any;
     sumTotalAmount: number;
-    paidAmount: number;
+    paidAmount: any;
     notPaidAmount: number;
     paySurchargeFee: number;
     expectAmount: number;
-    actualPaidAmount: number;
-    orderPaidAmount: number;
+    actualPaidAmount: any;
+    orderPaidAmount: any;
     totalRefundAmount: number;
     dueAmount: number;
     roundingAmount: number;

package/lib/components/booking/components/footer/amount.js

@@ -419,16 +419,22 @@ var getSurchargeAmount = (state, surcharge, options) => {
   }, 0);
 };
 var getPaidAmount = (state) => {
-  var _a;
+  var _a, _b, _c, _d, _e;
   const { bookingDetail, bookingId } = state;
+  if ((_b = (_a = state.paymentPaid) == null ? void 0 : _a.value) == null ? void 0 : _b.paidAmount) {
+    return (_d = (_c = state.paymentPaid) == null ? void 0 : _c.value) == null ? void 0 : _d.paidAmount;
+  }
   if (!bookingDetail || !bookingId) return 0;
-  return Number((_a = state.bookingDetail) == null ? void 0 : _a.paid_amount) || 0;
+  return Number((_e = state.bookingDetail) == null ? void 0 : _e.paid_amount) || 0;
 };
 var getOrderPaidAmount = (state) => {
-  var _a;
+  var _a, _b, _c, _d, _e;
   const { bookingDetail, bookingId } = state;
+  if ((_b = (_a = state.paymentPaid) == null ? void 0 : _a.value) == null ? void 0 : _b.paidAmountWithoutSurcharge) {
+    return (_d = (_c = state.paymentPaid) == null ? void 0 : _c.value) == null ? void 0 : _d.paidAmountWithoutSurcharge;
+  }
   if (!bookingDetail || !bookingId) return 0;
-  return Number((_a = state.bookingDetail) == null ? void 0 : _a.order_paid_amount) || 0;
+  return Number((_e = state.bookingDetail) == null ? void 0 : _e.order_paid_amount) || 0;
 };
 var getIsPriceIncludeTax = (state) => {
   var _a;