@pisell/private-materials 6.4.34 → 6.4.36

package/lib/components/checkout/PaymentModal.js

@@ -37,9 +37,9 @@ var import_utils = require("@pisell/utils");
 var import_locales = require("../../utils/locales");
 var import_ahooks = require("ahooks");
 var import_react_dom = require("react-dom");
+var import_react_dom2 = __toESM(require("react-dom"));
 var import_locales2 = __toESM(require("./locales"));
 var import_materials = require("@pisell/materials");
-var import_materials2 = require("@pisell/materials");
 var import_useEngineContext = __toESM(require("../../hooks/useEngineContext"));
 var import_noteModal = __toESM(require("../../plus/noteModal"));
 var import_SendPaymentLinkModal = __toESM(require("./components/SendPaymentLinkModal"));
@@ -55,9 +55,7 @@ var import_PaymentResultToastUtils = require("./utils/PaymentResultToastUtils");
 var import_icon = require("@pisell/icon");
 var import_styles = require("./styles");
 var import_paymentMethods = __toESM(require("../pay/toB/paymentMethods"));
-var import_components = require("../../pro/comprehensiveSearch/components");
 var import_SearchAndClientModule = __toESM(require("./components/SearchAndClientModule"));
-var import_useToast = __toESM(require("../../hooks/useToast"));
 var import_index = require("./index.less");
 var import_constants = require("./constants");
 var import_lodash = require("lodash");
@@ -101,7 +99,7 @@ var PaymentContent = (0, import_react.forwardRef)(
     const context = (0, import_useEngineContext.default)();
     const utils = context.appHelper.utils || {};
     const { pisellos, getData, pisellosAllModule, interaction } = utils;
-    const Toast = (0, import_useToast.default)();
+    const Toast = (0, import_materials.useToast)();
     const checkoutRef = (0, import_react.useRef)(null);
     const savePayLaterHandlerRef = (0, import_react.useRef)(null);
     const [customAmount, setCustomAmount] = (0, import_react.useState)("");
@@ -399,7 +397,7 @@ var PaymentContent = (0, import_react.forwardRef)(
             );
             const orderPaymentAddedUnsubscribe = core.effects.on(
               CheckoutHooks.OnOrderPaymentAdded,
-              (data) => {
+              async (data) => {
                 var _a2, _b2;
                 console.log("orderPaymentAddedUnsubscribe>>>>", data);
                 const balanceDueAmount2 = checkoutModule.getBalanceDueAmount();
@@ -409,7 +407,7 @@ var PaymentContent = (0, import_react.forwardRef)(
                     false
                   );
                   const orderInfo2 = checkoutModule.getCurrentOrderInfo();
-                  (0, import_PaymentResultToastUtils.displayPaymentResultToast)(
+                  await (0, import_PaymentResultToastUtils.displayPaymentResultToast)(
                     {
                       paymentStatus: "partially_paid",
                       orderTotalAmount: orderInfo2.totalAmount,
@@ -508,7 +506,7 @@ var PaymentContent = (0, import_react.forwardRef)(
         return;
       }
       const result = await checkoutModule.manualSyncOrderAsync();
-      showSuccessToast == null ? void 0 : showSuccessToast(result);
+      await (showSuccessToast == null ? void 0 : showSuccessToast(result));
       if (result.success) {
         const responseData = (_a2 = result.response) == null ? void 0 : _a2.data;
         console.log("print_order_onOrderSynced>>>>", result);
@@ -529,6 +527,7 @@ var PaymentContent = (0, import_react.forwardRef)(
         } catch (error) {
           console.error("print_order_onOrderSynced_error>>>>", error);
         }
+        onPaymentCancel(true);
       }
     };
     const handleSavePayLater = (0, import_react.useCallback)(
@@ -546,7 +545,6 @@ var PaymentContent = (0, import_react.forwardRef)(
           const res = await checkoutModule.saveForLaterPaymentAsync();
           if (res.success) {
             onPaymentCancel(true);
-            (0, import_PaymentResultToast.closePaymentResultToast)();
           }
         }
       },
@@ -787,35 +785,49 @@ var PaymentContent = (0, import_react.forwardRef)(
       const res = await checkoutModule.roundAmountAsync(amount);
       return res;
     };
+    const handleModalClick = (0, import_react.useCallback)((event) => {
+      (0, import_PaymentResultToast.closeAllPaymentResultToasts)();
+    }, []);
     return /* @__PURE__ */ import_react.default.createElement(
       "div",
       {
         ref: checkoutRef,
+        ...{ onClick: handleModalClick },
         style: {
           ...import_styles.checkoutStyles.container,
           maxHeight: dynamicMaxHeight
         }
       },
       /* @__PURE__ */ import_react.default.createElement(
-        import_SearchAndClientModule.default,
-        {
-          onClientChange: () => {
-            clientChangedRef.current = true;
-          },
-          onSearch: handleSearch,
-          ...searchAndClientProps
-        }
-      ),
-      moduleConfig.showWalletPass && /* @__PURE__ */ import_react.default.createElement(
-        import_WalletPassModule.default,
+        "div",
         {
-          clientId: (_b = (_a = state == null ? void 0 : state.client) == null ? void 0 : _a.value) == null ? void 0 : _b.id,
-          customAmount,
-          orderInfo: orderInfo || void 0,
-          ref: walletPassRef,
-          paymentItems,
-          onSelectChange: handleSelectWalletChange
-        }
+          style: {
+            padding: "12px 16px",
+            border: "1px solid #d0d5dd",
+            borderRadius: 8
+          }
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          import_SearchAndClientModule.default,
+          {
+            onClientChange: () => {
+              clientChangedRef.current = true;
+            },
+            onSearch: handleSearch,
+            ...searchAndClientProps
+          }
+        ),
+        moduleConfig.showWalletPass && /* @__PURE__ */ import_react.default.createElement(
+          import_WalletPassModule.default,
+          {
+            clientId: (_b = (_a = state == null ? void 0 : state.client) == null ? void 0 : _a.value) == null ? void 0 : _b.id,
+            customAmount,
+            orderInfo: orderInfo || void 0,
+            ref: walletPassRef,
+            paymentItems,
+            onSelectChange: handleSelectWalletChange
+          }
+        )
       ),
       /* @__PURE__ */ import_react.default.createElement(
         import_AmountSummary.default,
@@ -831,6 +843,7 @@ var PaymentContent = (0, import_react.forwardRef)(
           clientInfo: (_c = state == null ? void 0 : state.client) == null ? void 0 : _c.value,
           onAmountChange: handleAmountChange,
           onDepositStatusChange: handleDepositStatusChange,
+          onBalanceDueAmountClick: handleButtonClick,
           onConfirm: handleWalletPassConfirmPay,
           totalAmount
         }
@@ -880,7 +893,8 @@ var PaymentContent = (0, import_react.forwardRef)(
               paymentMethods,
               customAmount,
               title: paymentOptionsTitle,
-              disabled: isOrderFree
+              disabled: isOrderFree,
+              showCashPayment
             }
           )
         ),
@@ -946,7 +960,7 @@ var PaymentContent = (0, import_react.forwardRef)(
             ) || "Close price adjustment modal"
           }
         ), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-price-adjust-container" }, /* @__PURE__ */ import_react.default.createElement(
-          import_materials2.PisellAdjustPrice,
+          import_materials.PisellAdjustPrice,
           {
             selectType: "dark",
             originValue: currentTotalPrice,
@@ -994,14 +1008,14 @@ var PaymentModal = ({
   const [actualShowCashPayment, setActualShowCashPayment] = (0, import_react.useState)(true);
   const [windowHeight, setWindowHeight] = (0, import_react.useState)(0);
   const [showRetryModal, setShowRetryModal] = (0, import_react.useState)(false);
-  const Toast = (0, import_useToast.default)();
+  const Toast = (0, import_materials.useToast)();
   const handleRetry = async () => {
     const checkoutModule = pisellos == null ? void 0 : pisellos.getModule("checkout");
     const res = await (checkoutModule == null ? void 0 : checkoutModule.manualSyncOrderAsync());
     console.log(res);
     if (res.success) {
       setShowRetryModal(false);
-      showSuccessToast == null ? void 0 : showSuccessToast(res);
+      await (showSuccessToast == null ? void 0 : showSuccessToast(res));
     }
   };
   (0, import_react.useEffect)(() => {
@@ -1018,6 +1032,29 @@ var PaymentModal = ({
       window.removeEventListener("orientationchange", updateHeight);
     };
   }, []);
+  (0, import_react.useEffect)(() => {
+    var _a2;
+    const initTillButtonData = async () => {
+      var _a3, _b2;
+      console.log("准备获取tillButton数据");
+      try {
+        const tillButtonData = await ((_b2 = (_a3 = interaction == null ? void 0 : interaction.utils) == null ? void 0 : _a3.asyncDataManager) == null ? void 0 : _b2.call(_a3, {
+          module: "get",
+          key: "till_button"
+        }));
+        console.log("获取tillButton数据成功", tillButtonData);
+        if (tillButtonData) {
+          (0, import_PaymentResultToast.setTillButton)(tillButtonData);
+          console.log("PaymentModal: tillButton data set successfully", tillButtonData);
+        }
+      } catch (error) {
+        console.error("PaymentModal: Failed to get till_button from asyncDataManager:", error);
+      }
+    };
+    if ((_a2 = interaction == null ? void 0 : interaction.utils) == null ? void 0 : _a2.asyncDataManager) {
+      initTillButtonData();
+    }
+  }, [interaction]);
   const dynamicMaxHeight = (0, import_react.useMemo)(() => {
     if (windowHeight === 0) return "600px";
     const bodyTransform = getComputedStyle(document.body).transform;
@@ -1119,8 +1156,105 @@ var PaymentModal = ({
   const currentPaymentResultRef = import_react.default.useRef(null);
   const paymentContentRef = import_react.default.useRef(null);
   const handleOrderNoteClickFromToast = () => {
-    setNoteModalSource("payment-result-toast");
-    setNoteModalOpen(true);
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g2;
+    const modalContainer = document.createElement("div");
+    document.body.appendChild(modalContainer);
+    const showToast = (type, message) => {
+      if (Toast && Toast[type]) {
+        Toast[type](message);
+      } else {
+        if (type === "success") {
+          console.log("✅ Success:", message);
+        } else {
+          console.error("❌ Error:", message);
+        }
+      }
+    };
+    const handleNoteConfirm2 = async (noteValue) => {
+      var _a3;
+      try {
+        const checkoutModule = pisellos == null ? void 0 : pisellos.getModule("checkout");
+        const orderId = checkoutModule == null ? void 0 : checkoutModule.getCurrentOrderId();
+        if (checkoutModule && orderId) {
+          await ((_a3 = checkoutModule.editOrderNoteByOrderIdAsync) == null ? void 0 : _a3.call(checkoutModule, orderId, noteValue));
+          setOrderNote(noteValue);
+          showToast("success", import_utils.locales.getText("pisell2.checkout.order-note.updated-successfully"));
+        }
+      } catch (error) {
+        console.error("Failed to update order note:", error);
+        showToast("error", import_utils.locales.getText("pisell2.checkout.order-note.update-failed"));
+      }
+      import_react_dom2.default.unmountComponentAtNode(modalContainer);
+      if (document.body.contains(modalContainer)) {
+        document.body.removeChild(modalContainer);
+      }
+    };
+    const handleNoteDelete2 = async () => {
+      var _a3;
+      try {
+        const checkoutModule = pisellos == null ? void 0 : pisellos.getModule("checkout");
+        const orderId = checkoutModule == null ? void 0 : checkoutModule.getCurrentOrderId();
+        if (checkoutModule && orderId) {
+          await ((_a3 = checkoutModule.editOrderNoteByOrderIdAsync) == null ? void 0 : _a3.call(checkoutModule, orderId, ""));
+          setOrderNote("");
+          showToast("success", import_utils.locales.getText("pisell2.checkout.order-note.deleted-successfully"));
+        }
+      } catch (error) {
+        console.error("Failed to delete order note:", error);
+        showToast("error", import_utils.locales.getText("pisell2.checkout.order-note.delete-failed"));
+      }
+      import_react_dom2.default.unmountComponentAtNode(modalContainer);
+      if (document.body.contains(modalContainer)) {
+        document.body.removeChild(modalContainer);
+      }
+    };
+    const handleNoteCancel2 = () => {
+      import_react_dom2.default.unmountComponentAtNode(modalContainer);
+      if (document.body.contains(modalContainer)) {
+        document.body.removeChild(modalContainer);
+      }
+    };
+    const currentLocale = ((_e2 = (_d2 = (_c2 = (_b2 = (_a2 = context.appHelper.utils) == null ? void 0 : _a2.getApp) == null ? void 0 : _b2.call(_a2)) == null ? void 0 : _c2.locales) == null ? void 0 : _d2.getLocale) == null ? void 0 : _e2.call(_d2)) || ((_g2 = (_f2 = context.appHelper.utils) == null ? void 0 : _f2.storage) == null ? void 0 : _g2.get("umi_locale")) || "en";
+    const EngineContextProvider = ({ children }) => {
+      var _a3;
+      const tempEngineContext = {
+        ...context,
+        engine: {
+          ...context.engine,
+          props: {
+            ...(_a3 = context.engine) == null ? void 0 : _a3.props,
+            locale: currentLocale
+          }
+        }
+      };
+      const TempContext = import_react.default.createContext(tempEngineContext);
+      const originalContext = window.__injectedContext;
+      window.__injectedContext = tempEngineContext;
+      import_react.default.useEffect(() => {
+        return () => {
+          window.__injectedContext = originalContext;
+        };
+      }, []);
+      return /* @__PURE__ */ import_react.default.createElement(TempContext.Provider, { value: tempEngineContext }, children);
+    };
+    import_react_dom2.default.render(
+      /* @__PURE__ */ import_react.default.createElement(EngineContextProvider, null, /* @__PURE__ */ import_react.default.createElement(import_materials.ConfigProvider, { prefixCls: "pisell-lowcode", theme: {
+        token: {
+          colorPrimary: "#7F56DA"
+        }
+      } }, /* @__PURE__ */ import_react.default.createElement(
+        import_noteModal.default,
+        {
+          open: true,
+          title: import_utils.locales.getText("pisell2.text.add-order-notes"),
+          value: orderNote,
+          onConfirm: handleNoteConfirm2,
+          onDelete: handleNoteDelete2,
+          onCancel: handleNoteCancel2
+        }
+      ))),
+      modalContainer
+    );
   };
   const translation = (key, fallback) => {
     const umiLocale = (0, import_locales.getLocale)();
@@ -1143,11 +1277,14 @@ var PaymentModal = ({
   };
   const handleToastClose = () => {
     console.log(
-      "PaymentModal - Toast closed, executing callbacks and closing modal"
+      "PaymentModal - Toast closed, executing payment completion callback"
     );
     if (currentPaymentResultRef.current) {
       callback == null ? void 0 : callback(currentPaymentResultRef.current);
     }
+  };
+  const handleModalClose = () => {
+    console.log("PaymentModal - Modal closing independently");
     onClose == null ? void 0 : onClose(true);
   };
   const handlePaymentCancel = (reset) => {
@@ -1157,43 +1294,30 @@ var PaymentModal = ({
     checkout.cancelCurrentOrderAsync();
     onClose == null ? void 0 : onClose(reset || false);
   };
-  const CustomHeader = () => /* @__PURE__ */ import_react.default.createElement(
-    "div",
+  const CustomHeader = () => /* @__PURE__ */ import_react.default.createElement("div", { className: "payment-modal-custom-header" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "header__left" }, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Button,
     {
-      style: {
-        display: "flex",
-        alignItems: "center",
-        width: "100%",
-        position: "relative"
+      icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "pisell2-arrow-left", size: 24 }),
+      size: "small",
+      type: "text",
+      onClick: () => {
+        const checkout = pisellos.getModule("checkout");
+        if (checkout.isCurrentOrderSynced()) {
+          handlePaymentCancel(true);
+        } else {
+          handlePaymentCancel(false);
+        }
       }
+    }
+  )), /* @__PURE__ */ import_react.default.createElement("div", { className: "header__center" }, translation("order.total"), "：", (0, import_PaymentResultToastUtils.formatCurrency)(totalAmount, state == null ? void 0 : state.amountSymbol)), /* @__PURE__ */ import_react.default.createElement("div", { className: "header__right" }, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Button,
+    {
+      size: "small",
+      type: "link",
+      onClick: () => handlePaymentCancel(true)
     },
-    /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        style: {
-          display: "flex",
-          alignItems: "center",
-          gap: "12px",
-          flex: "0 0 auto"
-        }
-      },
-      /* @__PURE__ */ import_react.default.createElement(import_components.DeviceIconGroup, null)
-    ),
-    /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        style: {
-          position: "absolute",
-          left: "50%",
-          transform: "translateX(-50%)",
-          fontWeight: "500"
-        }
-      },
-      translation("order.total"),
-      "：",
-      (0, import_PaymentResultToastUtils.formatCurrency)(totalAmount, state == null ? void 0 : state.amountSymbol)
-    )
-  );
+    import_utils.locales.getText("order.start-new-order")
+  )));
   (0, import_react.useEffect)(() => {
     var _a2;
     if ((_a2 = data == null ? void 0 : data.order_info) == null ? void 0 : _a2.order_note) {
@@ -1246,8 +1370,8 @@ var PaymentModal = ({
           }
           unsubscribeRef.current = checkout.core.effects.on(
             "checkout:onOrderSynced",
-            (data2) => {
-              var _a3, _b3, _c2;
+            async (data2) => {
+              var _a3, _b3, _c2, _d2, _e2;
               const responseData = (_a3 = data2.response) == null ? void 0 : _a3.data;
               const paymentStatus = responseData == null ? void 0 : responseData.payment_status;
               if (data2.isManual) return;
@@ -1313,17 +1437,24 @@ var PaymentModal = ({
                   paymentStatus,
                   !!currentChangeGivenAmount
                 );
-                (0, import_PaymentResultToastUtils.displayPaymentResultToast)(
+                const enabledAutoPrint = await ((_e2 = (_d2 = interaction == null ? void 0 : interaction.utils) == null ? void 0 : _d2.asyncDataManager) == null ? void 0 : _e2.call(_d2, {
+                  module: "get",
+                  key: "auto_print_receipt"
+                }));
+                await (0, import_PaymentResultToastUtils.displayPaymentResultToast)(
                   {
                     paymentStatus,
                     orderTotalAmount,
                     gapAmount: paymentStatus === "partially_paid" ? gapAmount : currentChangeGivenAmount,
                     failureReason,
                     autoCloseConfig,
-                    actionButtons: generateActionButtons(paymentStatus)
+                    actionButtons: generateActionButtons(paymentStatus, enabledAutoPrint)
                   },
                   paymentResultToastConfig
                 );
+                if (paymentStatus === "paid") {
+                  handleModalClose();
+                }
                 const paymentResult = {
                   ...data2,
                   toastInfo: {
@@ -1391,13 +1522,12 @@ var PaymentModal = ({
     state,
     onToastClose: handleToastClose
   };
-  const generateActionButtons = (paymentStatus) => {
+  const generateActionButtons = (paymentStatus, enabledAutoPrint) => {
     const getClassName = (suffix) => `payment-result-toast-${suffix}`;
     const handleDetailsClick = async () => {
       var _a2;
       setTimeout(() => {
         (0, import_PaymentResultToast.closePaymentResultToast)();
-        handleToastClose();
       }, 0);
       const { isTerminal, isWebPos } = (_a2 = context.appHelper) == null ? void 0 : _a2.utils;
       if (isTerminal == null ? void 0 : isTerminal()) {
@@ -1414,6 +1544,9 @@ var PaymentModal = ({
       }
     };
     const handlePrintReceiptClick = async () => {
+      setTimeout(() => {
+        (0, import_PaymentResultToast.closePaymentResultToast)();
+      }, 0);
       const checkoutModule = pisellos == null ? void 0 : pisellos.getModule("checkout");
       if (!checkoutModule) return;
       let data2;
@@ -1462,6 +1595,9 @@ var PaymentModal = ({
       (0, import_PaymentResultToast.closePaymentResultToast)();
     };
     const handleOrderNoteClick = () => {
+      setTimeout(() => {
+        (0, import_PaymentResultToast.closePaymentResultToast)();
+      }, 0);
       console.log(import_utils.locales.getText("payment.result.actions.orderNoteClicked"));
       if (handleOrderNoteClickFromToast) {
         handleOrderNoteClickFromToast();
@@ -1474,7 +1610,7 @@ var PaymentModal = ({
       case "paid":
         return [
           [
-            {
+            enabledAutoPrint ? {
               id: "details",
               buttonProps: {
                 className: getClassName("action-button"),
@@ -1482,8 +1618,7 @@ var PaymentModal = ({
                 icon: /* @__PURE__ */ import_react.default.createElement(import_icon.FileCheck02, { className: getClassName("action-icon") }),
                 children: import_utils.locales.getText("payment.result.details")
               }
-            },
-            {
+            } : {
               id: "print",
               buttonProps: {
                 className: getClassName("action-button"),
@@ -1519,21 +1654,12 @@ var PaymentModal = ({
         return [
           [
             {
-              id: "saveAsPartialPaid",
-              buttonProps: {
-                className: getClassName("action-button"),
-                onClick: handleSaveAsPartialPaidClick,
-                children: import_utils.locales.getText("payment.result.saveAsPartialPaid")
-              }
-            },
-            {
-              id: "continuePayment",
+              id: "details",
               buttonProps: {
                 className: getClassName("action-button"),
-                onClick: () => {
-                  (0, import_PaymentResultToast.closePaymentResultToast)();
-                },
-                children: import_utils.locales.getText("payment.result.continuePayment")
+                onClick: handleDetailsClick,
+                icon: /* @__PURE__ */ import_react.default.createElement(import_icon.FileCheck02, { className: getClassName("action-icon") }),
+                children: import_utils.locales.getText("payment.result.details")
               }
             },
             {
@@ -1677,7 +1803,7 @@ var PaymentModal = ({
     paymentResultToastConfig,
     generateActionButtons
   );
-  return /* @__PURE__ */ import_react.default.createElement(import_PaymentResultToast.PaymentResultToastProvider, null, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
     import_materials.PisellContainer,
     {
       renderType: "modal",
@@ -1691,10 +1817,9 @@ var PaymentModal = ({
         destroyOnClose: false,
         maskClosable: false,
         footer: null,
-        closeIcon: null,
+        closeIcon: false,
         wrapClassName: `payment-modal-wrapper ${!actualShowCashPayment ? "no-cash-payment" : ""}`,
         size: "large",
-        headerDivider: false,
         style: {
           height: "auto"
         },
@@ -1702,7 +1827,7 @@ var PaymentModal = ({
           maxHeight: "100%",
           // 使用100%基于父元素，而不是视口的90%
           overflowY: "auto",
-          padding: 0,
+          padding: 16,
           display: "flex",
           flexDirection: "column"
         }

package/lib/components/checkout/PaymentPlugin.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const PaymentPlugin: () => JSX.Element;
 export default PaymentPlugin;

package/lib/components/checkout/components/AdditionalModule/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import './index.less';
-import { CurrentOrderInfo } from "../../types";
+import { CurrentOrderInfo } from '../../types';
 interface AdditionalModuleProps {
     orderInfo?: CurrentOrderInfo;
     customAmount?: string;