@pisell/private-materials 3.2.21 → 3.2.23

package/lib/components/appointmentBooking/components/Date/index.js

@@ -36,19 +36,29 @@ var import_react = __toESM(require("react"));
 var import_antd = require("antd");
 var import_dayjs = __toESM(require("dayjs"));
 var import_isSameOrBefore = __toESM(require("dayjs/plugin/isSameOrBefore"));
-var import_state = require("./state");
 var import_classnames = __toESM(require("classnames"));
+var import_utils = require("@pisell/utils");
 var import_icons = require("@ant-design/icons");
 var import_context = require("../../context");
 var import_index = require("./index.less");
 import_dayjs.default.extend(import_isSameOrBefore.default);
 var CalendarDate = (props) => {
+  const [loading, setLoading] = (0, import_react.useState)(false);
   const [currentDate, setCurrentDate] = (0, import_react.useState)();
   const [dateMonthList, setDateMonthList] = (0, import_react.useState)([]);
   const [currentMonth, setCurrentMonth] = (0, import_react.useState)(() => {
     return (0, import_dayjs.default)();
   });
   const { appointmentBooking } = (0, import_context.useAppointmentBookingContext)();
+  const weekListText = [
+    import_utils.locales.getText("pisell2.appointment.sunday"),
+    import_utils.locales.getText("pisell2.appointment.monday"),
+    import_utils.locales.getText("pisell2.appointment.tuesday"),
+    import_utils.locales.getText("pisell2.appointment.wednesday"),
+    import_utils.locales.getText("pisell2.appointment.thursday"),
+    import_utils.locales.getText("pisell2.appointment.friday"),
+    import_utils.locales.getText("pisell2.appointment.saturday")
+  ];
   const startingColumn = 0 % 7;
   const columns = Array.from(
     { length: 7 },
@@ -80,40 +90,44 @@ var CalendarDate = (props) => {
     return lastDate.isBefore((0, import_dayjs.default)(), "month");
   };
   const getDates = async (date) => {
-    const startDate = (0, import_dayjs.default)(date).startOf("month").format("YYYY-MM-DD");
-    const endDate = (0, import_dayjs.default)(date).endOf("month").format("YYYY-MM-DD");
-    const params = {
-      startDate,
-      endDate
-    };
-    const data = await appointmentBooking.getAvailableDate(params);
-    console.log(
-      data,
-      params,
-      date,
-      date.format("YYYY-MM") === (0, import_dayjs.default)().format("YYYY-MM"),
-      "wh78968"
-    );
-    if (date.format("YYYY-MM") === (0, import_dayjs.default)().format("YYYY-MM")) {
-      const firstAvailableDate = data.find(
-        (d) => d.status === "available"
-      );
-      setCurrentDate(firstAvailableDate == null ? void 0 : firstAvailableDate.date);
-      appointmentBooking.setDateRange([firstAvailableDate]);
-    }
-    const baseMonthData = getMonthData(date.format("YYYY-MM"));
-    const updatedDates = baseMonthData.map((day) => {
-      const matchedDay = data.find((d) => d.date === day.date);
-      if (matchedDay) {
-        return {
-          ...day,
-          ...matchedDay,
-          disabled: matchedDay.status === "unavailable"
-        };
+    try {
+      const startDate = (0, import_dayjs.default)(date).startOf("month").format("YYYY-MM-DD");
+      const endDate = (0, import_dayjs.default)(date).endOf("month").format("YYYY-MM-DD");
+      const params = {
+        startDate,
+        endDate
+      };
+      const data = await appointmentBooking.getAvailableDate(params);
+      const selected = await appointmentBooking.getDateRange();
+      if ((selected == null ? void 0 : selected.length) > 0) {
+        setCurrentDate(selected[0].date);
+      } else {
+        if (date.format("YYYY-MM") === (0, import_dayjs.default)().format("YYYY-MM")) {
+          const firstAvailableDate = data.find(
+            (d) => d.status === "available"
+          );
+          setCurrentDate(firstAvailableDate == null ? void 0 : firstAvailableDate.date);
+          appointmentBooking.setDateRange([firstAvailableDate]);
+        }
       }
-      return day;
-    });
-    setDateMonthList(updatedDates);
+      const baseMonthData = getMonthData(date.format("YYYY-MM"));
+      const updatedDates = baseMonthData.map((day) => {
+        const matchedDay = data.find((d) => d.date === day.date);
+        if (matchedDay) {
+          return {
+            ...day,
+            ...matchedDay,
+            disabled: matchedDay.status === "unavailable"
+          };
+        }
+        return day;
+      });
+      setLoading(false);
+      setDateMonthList(updatedDates);
+    } catch (error) {
+      setLoading(false);
+      console.log(error, "wh978968234234");
+    }
   };
   (0, import_react.useEffect)(() => {
     getDates(currentMonth);
@@ -127,6 +141,7 @@ var CalendarDate = (props) => {
     let currentMonthText = currentMonth.format("YYYY-MM");
     let newNextMonth = (0, import_dayjs.default)(currentMonthText).add(1, "month");
     setCurrentMonth(newNextMonth);
+    setLoading(true);
   };
   return /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-date-box" }, !dateMonthList.length ? /* @__PURE__ */ import_react.default.createElement(import_antd.Skeleton, { loading: true, active: true, style: { paddingTop: "16px" } }) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-header" }, /* @__PURE__ */ import_react.default.createElement(
     "div",
@@ -140,7 +155,7 @@ var CalendarDate = (props) => {
       }
     },
     /* @__PURE__ */ import_react.default.createElement(import_icons.CaretLeftOutlined, null)
-  ), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-current-month" }, currentMonth.format("MMMM YYYY")), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-next-month", onClick: nextMonth }, /* @__PURE__ */ import_react.default.createElement(import_icons.CaretRightOutlined, null))), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-content" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-weeks" }, columns.map((col) => /* @__PURE__ */ import_react.default.createElement("div", { key: col, className: "calendar-weeks-items" }, import_state.weekListText[Number(col)]))), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-days" }, dateMonthList.map((day, index) => {
+  ), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-current-month" }, currentMonth.format("MMMM YYYY")), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-next-month", onClick: nextMonth }, /* @__PURE__ */ import_react.default.createElement(import_icons.CaretRightOutlined, null))), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-content" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-weeks" }, columns.map((col) => /* @__PURE__ */ import_react.default.createElement("div", { key: col, className: "calendar-weeks-items" }, weekListText[Number(col)]))), /* @__PURE__ */ import_react.default.createElement("div", { className: "calendar-days" }, dateMonthList.map((day, index) => {
     const date = (0, import_dayjs.default)(day.date).format("YYYY-MM-DD");
     const isCurrentMonth = (0, import_dayjs.default)(day.date).isSame(
       currentMonth,
@@ -152,26 +167,17 @@ var CalendarDate = (props) => {
         key: index,
         className: (0, import_classnames.default)("calendar-days-items", {
           ["disabledDate"]: day == null ? void 0 : day.disabled,
-          // ['disabledSelect']: status === 'sold_out',
           ["selectDate"]: currentDate === date,
-          ["other-month-days"]: !isCurrentMonth
+          ["other-month-days"]: !isCurrentMonth,
+          ["loading-item"]: loading
         }),
         onClick: () => {
           if (day == null ? void 0 : day.disabled) return;
-          console.log(day, "wh987976");
           setCurrentDate(date);
           appointmentBooking.setDateRange([day]);
         }
       },
-      isCurrentMonth && /* @__PURE__ */ import_react.default.createElement(
-        "div",
-        {
-          className: (0, import_classnames.default)("day-text", {
-            // ['day-line']: !disabled,
-          })
-        },
-        (0, import_dayjs.default)(day.date).format("D")
-      )
+      isCurrentMonth && /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("day-text") }, (0, import_dayjs.default)(day.date).format("D"))
     );
   })))));
 };

package/lib/components/appointmentBooking/components/Date/index.less

@@ -128,4 +128,9 @@
     background: none;
     border: none;
   }
+
+  &.loading-item {
+    background: #eaecf0;
+    cursor: not-allowed;
+  }
 }

package/lib/components/appointmentBooking/components/Guest/index.js

@@ -36,14 +36,12 @@ var import_react = __toESM(require("react"));
 var import_antd = require("antd");
 var import_materials = require("@pisell/materials");
 var import_utils = require("@pisell/utils");
-var import_hooks = require("../../hooks");
 var import_context = require("../../context");
+var import_hooks = require("../../hooks");
 var import_utils2 = require("../../utils");
 var import_index = require("./index.less");
 var Guest = () => {
   const [openOption, setOpenOption] = (0, import_react.useState)(false);
-  const [holderItem, setHolderItem] = (0, import_react.useState)(null);
-  const [removeOpen, setRemoveOpen] = (0, import_react.useState)(false);
   const { carts, appointmentBooking } = (0, import_context.useAppointmentBookingContext)();
   const { accountLists } = (0, import_hooks.useAppointmentBookingAccount)();
   const lists = (0, import_react.useMemo)(() => {
@@ -80,7 +78,6 @@ var Guest = () => {
         {
           size: "large",
           onClick: () => {
-            setHolderItem(item);
             setOpenOption(true);
           }
         },
@@ -93,7 +90,6 @@ var Guest = () => {
         menu: {
           items: _options,
           onClick: (e) => {
-            setHolderItem(item);
             handleClick(e, item);
           }
         },
@@ -104,6 +100,11 @@ var Guest = () => {
     );
   };
   const handleAddGuest = () => {
+    if (accountLists.length >= 6) {
+      return (0, import_materials.PisellToast)({
+        content: import_utils.locales.getText("pisell2.appointment.max.guest")
+      });
+    }
     const guest = {
       id: (0, import_utils.getUniqueId)(),
       username: `Guest${accountLists.length + 1}`,

package/lib/components/appointmentBooking/components/Header/index.js

@@ -33,13 +33,35 @@ __export(Header_exports, {
 });
 module.exports = __toCommonJS(Header_exports);
 var import_react = __toESM(require("react"));
+var import_utils = require("@pisell/utils");
 var import_progressBar = __toESM(require("../../../eventBooking/components/progressBar"));
 var import_context = require("../../context");
 var import_index = require("./index.less");
 var Header = () => {
   var _a, _b;
-  const { currentStep, appointmentBooking } = (0, import_context.useAppointmentBookingContext)();
+  const { currentStep, appointmentBooking, resources } = (0, import_context.useAppointmentBookingContext)();
+  const stepName = (0, import_react.useMemo)(() => {
+    var _a2, _b2, _c, _d, _e;
+    const key = (_a2 = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _a2.key;
+    if (key === "select-resource") {
+      const name = ((_d = (_c = (_b2 = resources == null ? void 0 : resources[0]) == null ? void 0 : _b2.resources) == null ? void 0 : _c[0]) == null ? void 0 : _d.title) || "";
+      return import_utils.locales.getText("pisell2.event.select.category")(name);
+    }
+    return (_e = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _e.description;
+  }, [(_a = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _a.key, resources]);
   const handleBack = () => {
+    var _a2;
+    const key = (_a2 = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _a2.key;
+    const types = {
+      "select-time": "time",
+      "select-resource": "resource"
+    };
+    if (types[key]) {
+      appointmentBooking.deleteCartItemInfo(types[key]);
+    }
+    if (key === "select-date") {
+      appointmentBooking.clearDateRange();
+    }
     appointmentBooking.back();
   };
   const handleClose = () => {
@@ -48,8 +70,8 @@ var Header = () => {
   return /* @__PURE__ */ import_react.default.createElement(
     import_progressBar.default,
     {
-      title: (_a = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _a.title,
-      description: (_b = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _b.description,
+      title: (_b = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _b.title,
+      description: stepName,
       showBack: (currentStep == null ? void 0 : currentStep.index) > 0,
       onBack: () => handleBack(),
       onClose: () => handleClose()

package/lib/components/appointmentBooking/components/Resource/index.d.ts

@@ -1,3 +1,3 @@
 import './index.less';
-declare const Resource: ({ onChange }: any) => JSX.Element;
+declare const Resource: () => JSX.Element;
 export default Resource;

package/lib/components/appointmentBooking/components/Resource/index.js

@@ -38,32 +38,32 @@ var import_resourceDisplay = __toESM(require("../../../eventBooking/components/r
 var import_materials = require("@pisell/materials");
 var import_hooks = require("../../hooks");
 var import_context = require("../../context");
+var import_guests = __toESM(require("../../assets/guests.svg"));
 var import_utils = require("@pisell/utils");
 var import_index = require("./index.less");
-var Resource = ({ onChange }) => {
+var Resource = () => {
   const [selectedResource, setSelectedResource] = (0, import_react.useState)(0);
   const { appointmentBooking, resources, carts, resourceOtherParams } = (0, import_context.useAppointmentBookingContext)();
-  const {
-    getResourceList,
-    getResourceTimeSlot,
-    autoSelectAllProductResources
-  } = (0, import_hooks.useAppointmentBookingResource)();
+  const { getResourceList, autoSelectAllProductResources } = (0, import_hooks.useAppointmentBookingResource)();
   console.log(resources, carts, appointmentBooking, "lists, products");
   (0, import_react.useEffect)(() => {
+    var _a, _b, _c;
     const _resources = getResourceList();
-    autoSelectAllProductResources("resources");
+    const code = (_c = (_b = (_a = _resources == null ? void 0 : _resources[0]) == null ? void 0 : _a.resources) == null ? void 0 : _b[0]) == null ? void 0 : _c.code;
+    autoSelectAllProductResources(code);
   }, []);
   (0, import_react.useEffect)(() => {
     var _a;
-    console.log(resourceOtherParams == null ? void 0 : resourceOtherParams.errorList, "errorListerrorListerrorList");
     if (((_a = resourceOtherParams == null ? void 0 : resourceOtherParams.errorList) == null ? void 0 : _a.length) > 0) {
-      return;
+      return (0, import_materials.PisellToast)({
+        content: import_utils.locales.getText("pisell2.appointment.no.available.time")
+      });
     }
   }, [resourceOtherParams == null ? void 0 : resourceOtherParams.errorList]);
   const anyResource = [
     {
       id: 0,
-      image: "https://cdn-partners-api.fresha.com/employee-avatars/processed/399178/medium/3b77991b-0ee2-4d0f-9d6f-a7501b39afcd-tempImageHYe20U.jpg",
+      image: import_guests.default,
       title: "Any professional",
       subtitle: "for maximum availability"
     }
@@ -71,7 +71,6 @@ var Resource = ({ onChange }) => {
   const currentResource = (0, import_react.useMemo)(() => {
     var _a, _b;
     if (resources.length && carts.length) {
-      console.log(resources, carts, "lists, products");
       if (carts.length === 1) {
         return (_b = (_a = resources[0]) == null ? void 0 : _a.resources) == null ? void 0 : _b[0];
       } else {
@@ -88,12 +87,11 @@ var Resource = ({ onChange }) => {
   const onClick = (e) => {
     var _a;
     setSelectedResource(e.id);
-    console.log(currentResource, e, "whcurrentResourcecurrentResource");
+    console.log(currentResource, e, carts, "whcurrentResourcecurrentResource");
     if (e.id) {
-      getResourceTimeSlot({
-        product: (_a = resources == null ? void 0 : resources[0]) == null ? void 0 : _a.product,
-        resources: currentResource == null ? void 0 : currentResource.renderList,
-        currentResourceId: e.id
+      return appointmentBooking.updateCart({
+        _id: (_a = carts == null ? void 0 : carts[0]) == null ? void 0 : _a._id,
+        resources: [e]
       });
     }
   };
@@ -111,7 +109,8 @@ var Resource = ({ onChange }) => {
             dataSource: item,
             direction: "vertical",
             children: !(item == null ? void 0 : item.image) ? (_a = item == null ? void 0 : item.title) == null ? void 0 : _a.charAt(0).toUpperCase() : null,
-            selected: selectedResource === (item == null ? void 0 : item.id)
+            selected: selectedResource === (item == null ? void 0 : item.id),
+            className: !item.id ? "appointment-resource-guest-card" : ""
           }
         );
       },

package/lib/components/appointmentBooking/components/Resource/index.less

@@ -3,4 +3,9 @@
   .pisell-lowcode-card {
     min-height: 166px !important;
   }
+
+  .appointment-resource-guest-card .pisell-lowcode-avatar-image img {
+    width: 50%;
+    height: 50%;
+  }
 }

package/lib/components/appointmentBooking/components/Services/index.js

@@ -33,22 +33,36 @@ __export(Services_exports, {
 });
 module.exports = __toCommonJS(Services_exports);
 var import_react = __toESM(require("react"));
+var import_antd = require("antd");
 var import_SearchLg = __toESM(require("@pisell/icon/es/SearchLg"));
 var import_utils = require("@pisell/utils");
 var import_materials = require("@pisell/materials");
-var import_antd = require("antd");
 var import_TabProduct = __toESM(require("../../../booking/components/TabProduct"));
 var import_utils2 = require("../../../booking/utils");
 var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
 var import_context = require("../../context");
+var import_hooks = require("../../hooks");
+var import_utils3 = require("../../utils");
 var import_index = require("./index.less");
 var Services = () => {
   const searchRef = (0, import_react.useRef)();
   const [search, setSearch] = (0, import_react.useState)("");
   const context = (0, import_useEngineContext.default)();
   const { utils } = context.appHelper || {};
-  const { appointmentBooking, products, setProducts } = (0, import_context.useAppointmentBookingContext)();
+  const appointmentBooking = (0, import_hooks.useAppointmentBooking)();
+  const { products, setProducts } = (0, import_context.useAppointmentBookingContext)();
+  const { accountLists } = (0, import_hooks.useAppointmentBookingAccount)();
+  const accountRef = (0, import_react.useRef)(accountLists);
+  const currentUser = (0, import_utils3.formatCurrentUser)();
   (0, import_react.useEffect)(() => {
+    console.log(accountLists, accountRef, "wh978896786");
+  }, [accountLists, accountRef]);
+  (0, import_react.useEffect)(() => {
+    var _a;
+    console.log(accountRef.current, currentUser, "accountRef");
+    if (!((_a = accountRef.current) == null ? void 0 : _a.length) && currentUser) {
+      appointmentBooking.addAccount([currentUser]);
+    }
     const { productModuleParams } = appointmentBooking.otherParams || {};
     appointmentBooking.loadProducts(productModuleParams).then((res) => {
       setProducts(res || []);
@@ -65,6 +79,11 @@ var Services = () => {
         const resources = ((_b = (_a = data == null ? void 0 : data.origin) == null ? void 0 : _a.product_resource) == null ? void 0 : _b.resources) || [];
         const activeStatus = resources.find((item2) => item2.status === 1);
         if (!activeStatus) {
+          return (0, import_materials.PisellToast)({
+            content: import_utils.locales.getText(
+              "pisell2.appointment.no.available.service"
+            )
+          });
         }
         const product = {
           ...data,

package/lib/components/appointmentBooking/components/TimeSlicing/index.js

@@ -34,34 +34,31 @@ __export(TimeSlicing_exports, {
 module.exports = __toCommonJS(TimeSlicing_exports);
 var import_react = __toESM(require("react"));
 var import_materials = require("@pisell/materials");
+var import_utils = require("@pisell/utils");
 var import_context = require("../../context");
 var import_index = require("./index.less");
 var Resource = ({ params }) => {
   const [selectedResource, setSelectedResource] = (0, import_react.useState)("");
-  const { times, resources, appointmentBooking, carts } = (0, import_context.useAppointmentBookingContext)();
+  const { times, resources, appointmentBooking, carts, setSelectedTime } = (0, import_context.useAppointmentBookingContext)();
   console.log(params, resources, times, "wh8765");
+  const getAutoSelect = async (val) => {
+    setSelectedTime(val);
+    const { errorList } = await appointmentBooking.autoSelectAllProductResources("sites", val);
+    const result = await appointmentBooking.submitTimeSlot(val);
+    console.log(errorList, result, "wh9896788");
+  };
+  (0, import_react.useEffect)(() => {
+    var _a;
+    if ((times == null ? void 0 : times.length) > 0) {
+      setSelectedResource((_a = times == null ? void 0 : times[0]) == null ? void 0 : _a.start_time);
+      getAutoSelect(times == null ? void 0 : times[0]);
+    }
+  }, [times]);
   const onClick = async (e) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
     setSelectedResource(e == null ? void 0 : e.start_time);
-    const data = await appointmentBooking.autoSelectResource({
-      resourceProductData: resources == null ? void 0 : resources[0],
-      resources: (_c = (_b = (_a = resources == null ? void 0 : resources[0]) == null ? void 0 : _a.resources) == null ? void 0 : _b[1]) == null ? void 0 : _c.renderList,
-      timeSlots: e
-    });
-    if (data) {
-      const _resources = [
-        (_g = (_f = (_e = (_d = resources == null ? void 0 : resources[0]) == null ? void 0 : _d.resources) == null ? void 0 : _e[0]) == null ? void 0 : _f.renderList) == null ? void 0 : _g[0],
-        (_k = (_j = (_i = (_h = resources == null ? void 0 : resources[0]) == null ? void 0 : _h.resources) == null ? void 0 : _i[1]) == null ? void 0 : _j.renderList) == null ? void 0 : _k[0]
-      ];
-      const aa = await appointmentBooking.submitTimeSlot({
-        resourceProductData: resources == null ? void 0 : resources[0],
-        selectedResources: _resources,
-        timeSlots: e
-      });
-      console.log(data, _resources, aa, "wh9879676");
-    }
+    getAutoSelect(e);
   };
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: "appointment-time-slicing-wrap" }, times.map((item, index) => {
+  return (times == null ? void 0 : times.length) > 0 ? /* @__PURE__ */ import_react.default.createElement("div", { className: "appointment-time-slicing-wrap" }, times.map((item, index) => {
     return /* @__PURE__ */ import_react.default.createElement(
       "div",
       {
@@ -72,6 +69,11 @@ var Resource = ({ params }) => {
       /* @__PURE__ */ import_react.default.createElement("span", null, item == null ? void 0 : item.start_time),
       /* @__PURE__ */ import_react.default.createElement(import_materials.Iconfont, { type: "pisell2-chevron-right", className: `icon` })
     );
-  }));
+  })) : /* @__PURE__ */ import_react.default.createElement(
+    import_materials.PisellEmpty,
+    {
+      description: import_utils.locales.getText("pisell2.appointment.booking.empty.time")
+    }
+  );
 };
 var TimeSlicing_default = Resource;

package/lib/components/appointmentBooking/components/TimeSlicing/index.less

@@ -18,6 +18,10 @@
 
     &:hover {
       background-color: #f1f1f1;
+      cursor: pointer;
+    }
+    &.active {
+      background-color: #f1f1f1;
     }
   }
 }

package/lib/components/appointmentBooking/components/Voucher/index.d.ts

@@ -0,0 +1,4 @@
+import '../../../booking/components/voucher/index.less';
+import './index.less';
+declare const VoucherCard: (props: any) => JSX.Element;
+export default VoucherCard;