@pisell/private-materials 3.0.162 → 3.0.164

package/lib/components/booking/info/clientVariant/vertical/index.js

@@ -333,93 +333,105 @@ var VerticalClient = (0, import_react.forwardRef)((props, ref) => {
     handleOpenClientModal();
   };
   (0, import_react.useImperativeHandle)(ref, () => {
+    var _a2, _b2;
     return {
-      close: () => {
-        var _a2;
-        (_a2 = modalRef.current) == null ? void 0 : _a2.close();
-      }
+      open: handleOpenClientModal,
+      close: (_a2 = modalRef.current) == null ? void 0 : _a2.close,
+      setSearch: (_b2 = modalRef.current) == null ? void 0 : _b2.setSearch
     };
   });
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-vertical-client-wrap" }, /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement(
     "div",
     {
-      className: (0, import_classnames.default)("pisell-lowcode__booking-vertical-client", {
-        "pisell-lowcode__booking-vertical-client-walkin": isWalkIn
-      }),
-      onClick: handleOpenClient
+      className: (0, import_classnames.default)("pisell-lowcode__booking-vertical-client-wrap", {
+        ["create-booking-page-vertical-client-wrap"]: state.isBookingCreatePage
+      })
     },
-    /* @__PURE__ */ import_react.default.createElement(import_antd.Skeleton, { loading: false, active: true, round: true }, /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Avatar,
-      {
-        className: "pisell-lowcode__booking-client-avatar",
-        src: import_utils.image.ali((_y = state.client.value) == null ? void 0 : _y.cover, 100),
-        size: 64,
-        icon: /* @__PURE__ */ import_react.default.createElement(import_User01.default, { className: "pisell-lowcode__booking-client-list-item-avatar-icon" })
-      }
-    ), isWalkIn ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-info-desc" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-title" }, import_utils.locales.getText("pisell2.text.add-client")), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-desc-item" }, import_utils.locales.getText("pisell2.text.leave-empty-for-walk-in"))) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-title" }, getNickname(state.client.value)), ((_z = state.client.value) == null ? void 0 : _z.email) ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-desc-item" }, (_A = state.client.value) == null ? void 0 : _A.email) : null, ((_B = state.client.value) == null ? void 0 : _B.phone) ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-desc-item" }, (_C = state.client.value) == null ? void 0 : _C.phone) : null), !isWalkIn && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-action-wrap" }, !state.disabledEdit && /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Dropdown.Button,
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
       {
-        menu: {
-          items: menus,
-          onClick: menuChange
+        className: (0, import_classnames.default)("pisell-lowcode__booking-vertical-client", {
+          "pisell-lowcode__booking-vertical-client-walkin": isWalkIn
+        }),
+        onClick: handleOpenClient
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_antd.Skeleton, { loading: false, active: true, round: true }, /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Avatar,
+        {
+          className: "pisell-lowcode__booking-client-avatar",
+          src: import_utils.image.ali((_y = state.client.value) == null ? void 0 : _y.cover, 100),
+          size: 64,
+          icon: /* @__PURE__ */ import_react.default.createElement(import_User01.default, { className: "pisell-lowcode__booking-client-list-item-avatar-icon" })
+        }
+      ), isWalkIn ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-info-desc" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-title" }, import_utils.locales.getText("pisell2.text.add-client")), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-desc-item" }, import_utils.locales.getText("pisell2.text.leave-empty-for-walk-in"))) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-title" }, getNickname(state.client.value)), ((_z = state.client.value) == null ? void 0 : _z.email) ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-desc-item" }, (_A = state.client.value) == null ? void 0 : _A.email) : null, ((_B = state.client.value) == null ? void 0 : _B.phone) ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-desc-item" }, (_C = state.client.value) == null ? void 0 : _C.phone) : null), !isWalkIn && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-client-action-wrap" }, !state.disabledEdit && /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Dropdown.Button,
+        {
+          menu: {
+            items: menus,
+            onClick: menuChange
+          },
+          placement: "bottomRight",
+          onClick: () => handleOpenClientModal()
         },
-        placement: "bottomRight",
-        onClick: () => handleOpenClientModal()
+        import_utils.locales.getText("pisell2.text.variant-client-change")
+      ), /* @__PURE__ */ import_react.default.createElement(
+        import_antd.Button,
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            handleViewClient();
+          }
+        },
+        import_utils.locales.getText("pisell2.text.view-profile")
+      )))
+    ),
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: (0, import_classnames.default)("pisell-lowcode__booking-vertical-pet", {
+          "pisell-lowcode__booking-vertical-pet-walkin": isWalkIn
+        }),
+        onClick: handleOpenClient
       },
-      import_utils.locales.getText("pisell2.text.variant-client-change")
-    ), /* @__PURE__ */ import_react.default.createElement(
+      petRender
+    ),
+    isShowAddBtn && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-vertical-footer" }, /* @__PURE__ */ import_react.default.createElement(
       import_antd.Button,
       {
-        onClick: (e) => {
-          e.stopPropagation();
-          handleViewClient();
-        }
-      },
-      import_utils.locales.getText("pisell2.text.view-profile")
-    )))
-  ), /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: (0, import_classnames.default)("pisell-lowcode__booking-vertical-pet", {
-        "pisell-lowcode__booking-vertical-pet-walkin": isWalkIn
-      }),
-      onClick: handleOpenClient
-    },
-    petRender
-  ), isShowAddBtn && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-vertical-footer" }, /* @__PURE__ */ import_react.default.createElement(
-    import_antd.Button,
-    {
-      onClick: () => {
-        const currentClientSearchValue = getCurrentClientSearchValue();
-        modalRef.current.setSearch(currentClientSearchValue);
-        handleOpenClientModal(currentClientSearchValue);
+        onClick: () => {
+          const currentClientSearchValue = getCurrentClientSearchValue();
+          modalRef.current.setSearch(currentClientSearchValue);
+          handleOpenClientModal(currentClientSearchValue);
+        },
+        block: true,
+        size: "large"
       },
-      block: true,
-      size: "large"
-    },
-    import_utils.locales.getText("pisell2.text.select")
-  )), /* @__PURE__ */ import_react.default.createElement(
-    import_SelectDrawer.default,
-    {
-      modalOpen: state.modalOpen,
-      loading,
-      autoFocus: !((_F = (_E = (_D = context == null ? void 0 : context.appHelper) == null ? void 0 : _D.utils) == null ? void 0 : _E.isTerminal) == null ? void 0 : _F.call(_E)),
-      ref: modalRef,
-      onClose: handleClose,
-      handleSelectClient,
-      handleCreateItem,
-      childrenValue: state.pet.value,
-      handleSelectPet,
-      formData: state.pet.formData,
-      searchChange,
-      options: renderList,
-      holder: (_G = state == null ? void 0 : state.bookingConfig) == null ? void 0 : _G.holder,
-      client: (_H = state == null ? void 0 : state.client) == null ? void 0 : _H.value,
-      loadMore,
-      showPet: (boardConfig == null ? void 0 : boardConfig.type) === "form",
-      handleAddPet,
-      franchiseeLoading
-    }
-  ));
+      import_utils.locales.getText("pisell2.text.select")
+    )),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_SelectDrawer.default,
+      {
+        showHeader: !state.isBookingCreatePage,
+        modalOpen: state.modalOpen,
+        loading,
+        autoFocus: !((_F = (_E = (_D = context == null ? void 0 : context.appHelper) == null ? void 0 : _D.utils) == null ? void 0 : _E.isTerminal) == null ? void 0 : _F.call(_E)),
+        ref: modalRef,
+        onClose: handleClose,
+        handleSelectClient,
+        handleCreateItem,
+        childrenValue: state.pet.value,
+        handleSelectPet,
+        formData: state.pet.formData,
+        searchChange,
+        options: renderList,
+        holder: (_G = state == null ? void 0 : state.bookingConfig) == null ? void 0 : _G.holder,
+        client: (_H = state == null ? void 0 : state.client) == null ? void 0 : _H.value,
+        loadMore,
+        showPet: (boardConfig == null ? void 0 : boardConfig.type) === "form",
+        handleAddPet,
+        franchiseeLoading
+      }
+    )
+  );
 });
 var vertical_default = VerticalClient;

package/lib/components/booking/info/clientVariant/vertical/index.less

@@ -117,3 +117,11 @@
     line-height: 24px;
   }
 }
+.create-booking-page-vertical-client-wrap {
+  .pisell-lowcode__booking-drawer-title-wrap {
+    padding: 16px 16px 0 !important;
+  }
+  .pisell-lowcode-input-affix-wrapper {
+    margin-top: 0 !important;
+  }
+}

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

@@ -15,4 +15,23 @@
   //   height: 42px;
   //   background: #069456;
   // }
+}
+#create-booking-page-info-wrap {
+  .pisell-lowcode__booking-tab-pane-footer {
+    padding: 12px 16px !important;
+  }
+}
+.create-booking-page-info-wrap-create {
+  background: var(--Success-50, #ECFDF3);
+}
+.create-booking-page-info-wrap {
+  position: initial !important;
+  padding: 0 16px !important;
+  .booking-info-create-new {
+    margin-top: 10px;
+    color: var(--Base-Black, #000);
+    font-size: 24px;
+    font-weight: 600;
+    line-height: 32px;
+  }
 }

package/lib/components/booking/info/main.js

@@ -49,7 +49,9 @@ var import_date2 = require("./date");
 var import_useEngineContext = __toESM(require("../../../hooks/useEngineContext"));
 var import_notes = __toESM(require("./notes"));
 var import_index = require("./index.less");
+var import_classnames = __toESM(require("classnames"));
 var import_antd = require("antd");
+var import_useCreateBookingPageHeader = __toESM(require("../hooks/useCreateBookingPageHeader"));
 var defaultModules = {
   client: 1,
   date: 1,
@@ -68,6 +70,7 @@ var Info = (0, import_model.Provider)((props) => {
     var _a2, _b2, _c2, _d2;
     return ((_d2 = (_c2 = (_b2 = (_a2 = modal.state) == null ? void 0 : _a2.bookingConfig) == null ? void 0 : _b2.config) == null ? void 0 : _c2.basic) == null ? void 0 : _d2.appointment_subject) || {};
   }, [(_d = (_c = (_b = (_a = modal.state) == null ? void 0 : _a.bookingConfig) == null ? void 0 : _b.config) == null ? void 0 : _c.basic) == null ? void 0 : _d.appointment_subject]);
+  const { createHeader, isBookingCreatePage, isBookingCreatePageCreateMode } = (0, import_useCreateBookingPageHeader.default)(globalState);
   (0, import_react.useEffect)(() => {
     document.body.id = "body";
     if (props.setState) {
@@ -122,7 +125,7 @@ var Info = (0, import_model.Provider)((props) => {
     if (!modules.note) {
       return null;
     }
-    return (globalState == null ? void 0 : globalState.bookingId) ? globalState.renderType === "eventBooking" ? /* @__PURE__ */ import_react.default.createElement(import_notes.default, null) : null : /* @__PURE__ */ import_react.default.createElement(import_addNote.default, { value: (_b2 = (_a2 = modal.state) == null ? void 0 : _a2.notes) == null ? void 0 : _b2.orderNote, onChange: addNote });
+    return (globalState == null ? void 0 : globalState.bookingId) ? globalState.renderType === "eventBooking" || globalState.isBookingCreatePage ? /* @__PURE__ */ import_react.default.createElement(import_notes.default, null) : null : /* @__PURE__ */ import_react.default.createElement(import_addNote.default, { value: (_b2 = (_a2 = modal.state) == null ? void 0 : _a2.notes) == null ? void 0 : _b2.orderNote, onChange: addNote });
   }, [
     modules.note,
     globalState == null ? void 0 : globalState.bookingId,
@@ -145,9 +148,12 @@ var Info = (0, import_model.Provider)((props) => {
       style: {
         height: ((_h = (_g = context == null ? void 0 : context.appHelper) == null ? void 0 : _g.utils) == null ? void 0 : _h.isMobile) ? "100%" : "100vh"
       },
-      bodyClassName: "booking-info-warp"
+      bodyClassName: (0, import_classnames.default)("booking-info-warp", {
+        ["create-booking-page-info-wrap"]: isBookingCreatePage,
+        ["create-booking-page-info-wrap-create"]: isBookingCreatePageCreateMode
+      })
     },
-    /* @__PURE__ */ import_react.default.createElement("div", { className: "booking-info" }, modules.client ? /* @__PURE__ */ import_react.default.createElement(import_client.default, null) : null, modules.holder && !((_i = modal.state) == null ? void 0 : _i.disabledEdit) ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, params.type === "form" ? /* @__PURE__ */ import_react.default.createElement(import_pet.default, null) : null) : null, modules.date ? /* @__PURE__ */ import_react.default.createElement(import_date.default, null) : null, /* @__PURE__ */ import_react.default.createElement(
+    /* @__PURE__ */ import_react.default.createElement("div", { className: "booking-info" }, createHeader, modules.client ? /* @__PURE__ */ import_react.default.createElement(import_client.default, null) : null, modules.holder && !((_i = modal.state) == null ? void 0 : _i.disabledEdit) ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, params.type === "form" ? /* @__PURE__ */ import_react.default.createElement(import_pet.default, null) : null) : null, modules.date ? /* @__PURE__ */ import_react.default.createElement(import_date.default, null) : null, /* @__PURE__ */ import_react.default.createElement(
       import_antd.Skeleton,
       {
         loading: globalState.loading,

package/lib/components/booking/info/pet/index.js

@@ -410,7 +410,8 @@ var Pet = (props) => {
     state.disableEventBookingEdit,
     params.search,
     loadMore,
-    addButtonProps
+    addButtonProps,
+    state.isBookingCreatePage
   ]);
 };
 var pet_default = Pet;

package/lib/components/booking/info/service/addService/index.d.ts

@@ -1,6 +1,12 @@
 import React from 'react';
+import { PisellDrawerProps } from '../../../components/drawer';
 import './index.less';
-declare const Info: ({ onEdit }: {
-    onEdit: any;
-}) => React.JSX.Element;
+interface AddServiceProps {
+    onEdit?: any;
+    dispatch?: any;
+    state?: any;
+    drawerProps?: PisellDrawerProps;
+    renderMode?: 'current' | 'drawer';
+}
+declare const Info: (props: AddServiceProps) => React.JSX.Element;
 export default Info;

package/lib/components/booking/info/service/addService/index.js

@@ -63,13 +63,16 @@ var shopList = [
   6848,
   6305
 ];
-var Info = ({ onEdit }) => {
+var Info = (props) => {
   var _a, _b, _c, _d;
+  const { onEdit, drawerProps, renderMode } = props;
   const [search, setSearch] = (0, import_react.useState)("");
-  const { state, dispatch } = (0, import_react.useContext)(import_model.Context);
+  let { state, dispatch } = (0, import_react.useContext)(import_model.Context);
   const [loading, setLoading] = (0, import_react.useState)(false);
   const searchRef = (0, import_react.useRef)();
   const context = (0, import_useEngineContext.default)();
+  state = state || (props == null ? void 0 : props.state);
+  dispatch = dispatch || (props == null ? void 0 : props.dispatch);
   import_utils3.request.setRequest(context.appHelper.utils.request);
   const setDefaultService = async (list) => {
     if (state.renderType !== "eventBooking") {
@@ -120,7 +123,7 @@ var Info = ({ onEdit }) => {
       }
     });
   };
-  const getServices = async () => {
+  const getServices = async (params) => {
     var _a2;
     setLoading(true);
     let data = await state.apis.getServices({
@@ -134,8 +137,10 @@ var Info = ({ onEdit }) => {
       with_count: ["bundleGroup", "optionGroup"],
       order_by_string: "sort:desc",
       status: "published",
-      _config: {
-        useCache: true
+      ...state.isBookingCreatePage ? { schedule_date: params == null ? void 0 : params.schedule_date } : {
+        _config: {
+          useCache: true
+        }
       }
     });
     setLoading(false);
@@ -211,6 +216,9 @@ var Info = ({ onEdit }) => {
             cacheItem._id = (_a2 = state.service.cacheItem) == null ? void 0 : _a2._id;
             cacheItem.new = 0;
           }
+          if (renderMode === "current") {
+            cacheItem.currentDefaultTime = state.date.value.format("HH:mm");
+          }
           cacheItem._extend = (0, import_utils2.getProductExtend)({ cacheItem, state });
           if (state.renderType === "eventBooking") {
             cacheItem.autoClose = false;
@@ -269,12 +277,24 @@ var Info = ({ onEdit }) => {
       setSearch("");
     }
   }, [state.service.addModal]);
+  const currentDate = (0, import_react.useMemo)(() => {
+    return state.date.value.format("YYYY-MM-DD");
+  }, [state.date.value]);
+  console.log(currentDate, "currentDate");
+  (0, import_react.useEffect)(() => {
+    if (renderMode === "current") {
+      getServices({ schedule_date: currentDate });
+    }
+  }, [renderMode, currentDate]);
   (0, import_react.useEffect)(() => {
     if (state.renderType === "eventBooking" && state.modalOpen) {
       getServices();
     }
   }, [state.renderType, state.modalOpen]);
   const addButton = (0, import_react.useMemo)(() => {
+    if (state.isBookingCreatePage) {
+      return /* @__PURE__ */ import_react.default.createElement("div", { style: { height: 20 } });
+    }
     if (state.renderType === "eventBooking") {
       return isService ? /* @__PURE__ */ import_react.default.createElement("div", { style: { height: 20 } }) : /* @__PURE__ */ import_react.default.createElement(
         import_addButton.default,
@@ -303,13 +323,50 @@ var Info = ({ onEdit }) => {
     state.service.value,
     loading
   ]);
+  const isRenderCurrent = (0, import_react.useMemo)(() => {
+    return renderMode === "current";
+  }, [renderMode]);
   return (0, import_react.useMemo)(() => {
     var _a2, _b2;
+    const header = /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-header" }, /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Input,
+      {
+        ref: searchRef,
+        prefix: /* @__PURE__ */ import_react.default.createElement(import_SearchLg.default, null),
+        style: { marginTop: 16, height: 44 },
+        placeholder: import_utils4.locales.getText("pisell2.text.search"),
+        allowClear: true,
+        value: search,
+        onChange: (e) => {
+          setSearch(e.target.value);
+        }
+      }
+    ));
+    const content = /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-body" }, /* @__PURE__ */ import_react.default.createElement(
+      import_TabProduct.default,
+      {
+        list: renderList,
+        amountSymbol: state.amountSymbol,
+        onChange: handleSelectProduct,
+        scrollDom: isRenderCurrent ? ".pisell-lowcode__booking-vertical-add-service-wrap" : ".booking-server-wrap .pisell-lowcode-drawer-body "
+      }
+    ));
+    if (renderMode === "current") {
+      return /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          className: "pisell-lowcode__booking-vertical-add-service-wrap",
+          style: { width: "100%", height: "100%", overflow: "auto" }
+        },
+        header,
+        content
+      );
+    }
     return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, ((_b2 = (_a2 = state.service) == null ? void 0 : _a2.cacheItem) == null ? void 0 : _b2.autoClose) && /* @__PURE__ */ import_react.default.createElement(import_antd.Skeleton, { loading: true, active: true, round: true }), addButton, /* @__PURE__ */ import_react.default.createElement(
       import_drawer.default,
       {
         titleNoWrap: true,
-        open: state.service.addModal,
+        open: state.service.addModal && !state.isBookingCreatePage,
         title: import_utils4.locales.getText("pisell2.text.select-service"),
         rootClassName: "booking-server-wrap",
         onClose: () => {
@@ -321,30 +378,10 @@ var Info = ({ onEdit }) => {
             }
           });
         },
-        header: /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-header" }, /* @__PURE__ */ import_react.default.createElement(
-          import_antd.Input,
-          {
-            ref: searchRef,
-            prefix: /* @__PURE__ */ import_react.default.createElement(import_SearchLg.default, null),
-            style: { marginTop: 16, height: 44 },
-            placeholder: import_utils4.locales.getText("pisell2.text.search"),
-            allowClear: true,
-            value: search,
-            onChange: (e) => {
-              setSearch(e.target.value);
-            }
-          }
-        ))
+        header,
+        ...drawerProps || {}
       },
-      /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-body" }, /* @__PURE__ */ import_react.default.createElement(
-        import_TabProduct.default,
-        {
-          list: renderList,
-          amountSymbol: state.amountSymbol,
-          onChange: handleSelectProduct,
-          scrollDom: ".booking-server-wrap .pisell-lowcode-drawer-body"
-        }
-      ))
+      content
     ));
   }, [
     (_d = (_c = state.service) == null ? void 0 : _c.cacheItem) == null ? void 0 : _d.autoClose,

package/lib/components/booking/info/service/addService/index.less

@@ -3,7 +3,33 @@
   // border-bottom: 1px solid var(--gray-300, #D0D5DD);
 }
 
-
 .pisell-lowcode__booking-service-body {
   background: var(--gray-50, #F9FAFB);
+}
+
+.pisell-lowcode__booking-vertical-add-service-wrap {
+  &::-webkit-scrollbar {
+    display: none !important;
+  }
+  .pisell-lowcode__booking-service-header {
+    background-color: #fff;
+    top: 0;
+    position: sticky;
+    z-index: 2;
+    padding: 16px !important;
+    margin: 0;
+    .pisell-lowcode-input-affix-wrapper {
+      margin: 0 !important;
+    }
+  }
+  .booking-category-list {
+    padding: 0 16px !important;
+  }
+  .pisell-lowcode__booking-service-body {
+    .booking-tab-product {
+      .booking-tabs-wrap {
+        top: 76px !important;
+      }
+    }
+  }
 }

package/lib/components/booking/info/service/editService/index.js

@@ -118,7 +118,7 @@ var Info = (_, ref) => {
     } catch (err) {
     }
   }, [useDuration, flexibleOption]);
-  const getResources = async (cacheItem) => {
+  const getResources = async (cacheItem, open) => {
     console.log("getResources2");
     try {
       let _list = state.service.resourcesOrigin || [];
@@ -143,7 +143,7 @@ var Info = (_, ref) => {
           }, 200);
         } else {
           setTimeout(() => {
-            if (selectOpen === void 0) {
+            if (selectOpen === void 0 || open) {
               setSelectOpen(true);
             }
           }, 500);
@@ -266,12 +266,12 @@ var Info = (_, ref) => {
       }
     });
   });
-  const setEditData = (0, import_ahooks.useMemoizedFn)((_cacheItem) => {
+  const setEditData = (0, import_ahooks.useMemoizedFn)((_cacheItem, open) => {
     let cacheItem = _cacheItem || state.service.cacheItem;
     let values = cacheItem._extend;
     form.setFieldsValue(values);
     if (state.renderType !== "eventBooking") {
-      getResources(_cacheItem);
+      getResources(cacheItem, open);
     }
   });
   const isReason = (0, import_react.useMemo)(() => {
@@ -298,7 +298,10 @@ var Info = (_, ref) => {
     (_f = state.service.cacheItem) == null ? void 0 : _f.autoClose
   ]);
   (0, import_react.useEffect)(() => {
-  }, [state.service.editModal]);
+    if (state.isBookingCreatePage && state.service.editModal) {
+      setEditData(null, true);
+    }
+  }, [state.service.editModal, state.isBookingCreatePage]);
   (0, import_react.useEffect)(() => {
     getErrorMsg();
   }, [useResource, useStartTime, useDuration]);
@@ -435,7 +438,7 @@ var Info = (_, ref) => {
           });
         }
       },
-      /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-body-edit" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Page, null, /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { layout: "vertical", form, onFinish }, /* @__PURE__ */ import_react.default.createElement(import_antd.Row, { style: { width: "100%" }, gutter: [16, 0] }, /* @__PURE__ */ import_react.default.createElement(import_antd.Col, { span: 24 }, /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "product_name" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "current-service-info" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "current-service-info-name-wrap" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "current-service-info-name" }, ((_d2 = (_c2 = (_b2 = state.service) == null ? void 0 : _b2.cacheItem) == null ? void 0 : _c2._extend) == null ? void 0 : _d2.product_name) || "-"), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: handleEdit }, import_utils.locales.getText("pisell2.text.edit")), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: handleChange }, import_utils.locales.getText("pisell2.text.change"))), /* @__PURE__ */ import_react.default.createElement(
+      /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-body-edit" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Page, null, /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { layout: "vertical", form, onFinish }, /* @__PURE__ */ import_react.default.createElement(import_antd.Row, { style: { width: "100%" }, gutter: [16, 0] }, /* @__PURE__ */ import_react.default.createElement(import_antd.Col, { span: 24 }, /* @__PURE__ */ import_react.default.createElement(import_antd.Form.Item, { name: "product_name" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "current-service-info" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "current-service-info-name-wrap" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "current-service-info-name" }, ((_d2 = (_c2 = (_b2 = state.service) == null ? void 0 : _b2.cacheItem) == null ? void 0 : _c2._extend) == null ? void 0 : _d2.product_name) || "-"), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: handleEdit }, import_utils.locales.getText("pisell2.text.edit")), !state.isBookingCreatePage && /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: handleChange }, import_utils.locales.getText("pisell2.text.change"))), /* @__PURE__ */ import_react.default.createElement(
         import_collapsibleList.default,
         {
           style: { marginTop: bundles.length ? "8px" : 0 },

package/lib/components/booking/info/service/index.js

@@ -39,9 +39,10 @@ var import_editService = __toESM(require("./editService"));
 var import_index = require("./index.less");
 var import_serviceList = __toESM(require("./serviceList"));
 var import_addTimeModal = __toESM(require("./addTimeModal"));
+var import_useClearCart = __toESM(require("../../hooks/useClearCart"));
 var Service = () => {
   var _a, _b;
-  const { state } = (0, import_react.useContext)(import_model.Context);
+  const { state, dispatch } = (0, import_react.useContext)(import_model.Context);
   const detailRef = (0, import_react.useRef)();
   (0, import_react.useEffect)(() => {
     document.body.id = "body";
@@ -70,6 +71,7 @@ var Service = () => {
       (_b2 = (_a2 = detailRef.current) == null ? void 0 : _a2.init) == null ? void 0 : _b2.call(_a2, cacheItem);
     }, 100);
   };
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-wrap" }, /* @__PURE__ */ import_react.default.createElement(import_serviceList.default, { onEdit: handleEdit }), /* @__PURE__ */ import_react.default.createElement(import_addService.default, { onEdit: handleEdit })), /* @__PURE__ */ import_react.default.createElement(import_editService.default, { ref: detailRef }), showAddTimeModal && /* @__PURE__ */ import_react.default.createElement(import_addTimeModal.default, null));
+  const clearCart = (0, import_useClearCart.default)(state, dispatch);
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-wrap" }, clearCart, /* @__PURE__ */ import_react.default.createElement(import_serviceList.default, { onEdit: handleEdit }), /* @__PURE__ */ import_react.default.createElement(import_addService.default, { onEdit: handleEdit })), /* @__PURE__ */ import_react.default.createElement(import_editService.default, { ref: detailRef }), showAddTimeModal && /* @__PURE__ */ import_react.default.createElement(import_addTimeModal.default, null));
 };
 var service_default = import_react.default.memo(Service);

package/lib/components/booking/info/service/index.less

@@ -1,3 +1,21 @@
 .pisell-lowcode__booking-service-wrap {
   margin-top: 16px;
+  .pisell-lowcode__booking-service-clear-btn {
+    cursor: pointer;
+    margin-top: -12px;
+    color: var(--Blue-700, #175CD3);
+    font-weight: 600;
+    line-height: 24px; /* 150% */
+    display: flex;
+    align-items: center;
+    margin-bottom: 4px;
+    padding: 12px 0;
+    .anticon {
+      font-size: 18px;
+      margin-right: 6px;
+    }
+  }
+  .pisell-lowcode__booking-service-clear-btn-disabled {
+    color: #98A2B3
+  }
 }

package/lib/components/booking/info/service/serviceItem/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
-import "./index.less";
-declare const ServiceItem: ({ d, handleEditService, state, handleLike, resourceItem, errorMessage, }: any) => React.JSX.Element;
+import React from 'react';
+import './index.less';
+declare const ServiceItem: ({ d, handleEditService, state, handleLike, resourceItem, errorMessage, handleDeleteService, }: any) => React.JSX.Element;
 export default ServiceItem;

package/lib/components/booking/info/service/serviceItem/index.js

@@ -41,15 +41,18 @@ var import_utils3 = require("../../../components/collapsibleList/utils");
 var import_antd = require("antd");
 var import_actions = __toESM(require("../actions"));
 var import_index = require("./index.less");
+var import_materials = require("@pisell/materials");
 var ServiceItem = ({
   d,
   handleEditService,
   state,
   handleLike,
   resourceItem,
-  errorMessage
+  errorMessage,
+  handleDeleteService
 }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+  console.log(d, "dddddd");
   let resourceName = (resourceItem == null ? void 0 : resourceItem.labelText) || d.relation_form_name;
   const isDiscount = (0, import_react.useMemo)(() => {
     var _a2, _b2;
@@ -64,6 +67,17 @@ var ServiceItem = ({
         handleEditService(d);
       }
     },
+    /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        className: "pisell-lowcode__booking-service-item-delete",
+        onClick: (e) => {
+          e.stopPropagation();
+          handleDeleteService(d);
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { type: "text", icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Iconfont, { type: "pisell2-trash-01" }) })
+    ),
     d.id ? /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-item-title" }, d.title) : null,
     d._extend ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, state.renderType !== "eventBooking" && /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-item-date" }, (0, import_utils.getServiceTime)(d, state.date.value)), /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-lowcode__booking-service-item-technician" }, d._extend.resource ? /* @__PURE__ */ import_react.default.createElement(
       import_like.default,