@pisell/private-materials 6.0.25 → 6.2.1

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

@@ -0,0 +1,226 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/appointmentBooking/components/Resource/index.tsx
+var Resource_exports = {};
+__export(Resource_exports, {
+  default: () => Resource_default
+});
+module.exports = __toCommonJS(Resource_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_resourceDisplay = __toESM(require("../../../eventBooking/components/resourceDisplay"));
+var import_materials = require("@pisell/materials");
+var import_hooks = require("../../hooks");
+var import_context = require("../../context");
+var import_utils = require("../../utils");
+var import_guests = __toESM(require("../../assets/guests.svg"));
+var import_resource = __toESM(require("../../assets/resource.svg"));
+var import_utils2 = require("@pisell/utils");
+var import_index = require("./index.less");
+var Resource = (0, import_react.forwardRef)((props, ref) => {
+  const [selectedResource, setSelectedResource] = (0, import_react.useState)(0);
+  const {
+    appointmentBooking,
+    carts,
+    resourceOtherParams,
+    currentStep,
+    setResourceOtherParams,
+    currentStepParams,
+    currentSelectedResources
+  } = (0, import_context.useAppointmentBookingContext)();
+  const { getResourceList } = (0, import_hooks.useAppointmentBookingResource)();
+  const { checkSkipResourceStep } = (0, import_hooks.useIsSkipResourceStep)();
+  const { updateStep, nextStep } = (0, import_hooks.useAppointmentBookingStep)();
+  const [loading, setLoading] = (0, import_react.useState)(false);
+  const utils = (0, import_hooks.contextUtils)();
+  (0, import_react.useImperativeHandle)(ref, () => ({
+    next: async () => {
+      setResourceOtherParams({
+        ...resourceOtherParams,
+        errorList: null
+      });
+      nextStep();
+    }
+  }));
+  const resources = (0, import_react.useMemo)(() => {
+    const { resources: resources2 } = getResourceList();
+    return resources2 || [];
+  }, []);
+  (0, import_react.useEffect)(() => {
+    setLoading(true);
+  }, []);
+  (0, import_react.useEffect)(() => {
+    const checkAndSkipResourceStep = async () => {
+      var _a;
+      try {
+        const _resources = getResourceList();
+        const skipResourceStep = await checkSkipResourceStep();
+        const key = (_a = currentStep == null ? void 0 : currentStep.step) == null ? void 0 : _a.key;
+        updateStep(key, {
+          index: currentStep == null ? void 0 : currentStep.index,
+          isSkip: skipResourceStep
+        });
+        if (skipResourceStep) {
+          return true;
+        }
+        return false;
+      } catch (error) {
+      }
+    };
+    checkAndSkipResourceStep();
+  }, [currentStepParams.key]);
+  const anyResource = [
+    {
+      id: 0,
+      image: import_guests.default,
+      title: import_utils2.locales.getText("pisell2.appointment.any.professional"),
+      subtitle: import_utils2.locales.getText("pisell2.appointment.for.maximum.availability")
+    }
+  ];
+  const appointmentBoard = (0, import_react.useMemo)(() => {
+    return (0, import_utils.currentAppointmentBoard)(
+      currentStepParams.key,
+      resources,
+      appointmentBooking
+    );
+  }, [currentStepParams.key, resources]);
+  const renderLists = (0, import_react.useMemo)(() => {
+    const appointmentCarts = carts.filter(
+      (n) => !(appointmentBooking == null ? void 0 : appointmentBooking.isTargetCartIdNormalProduct(n._id))
+    );
+    if (appointmentCarts.length > 1 || !(appointmentCarts == null ? void 0 : appointmentCarts.length)) {
+      return [];
+    }
+    return (0, import_utils.currentRenderLists)(resources, appointmentBoard == null ? void 0 : appointmentBoard.form_code);
+  }, [resources, appointmentBoard == null ? void 0 : appointmentBoard.form_code, carts]);
+  (0, import_react.useEffect)(() => {
+    const autoSelectResources = async () => {
+      if (!(appointmentBoard == null ? void 0 : appointmentBoard.form_code)) {
+        return;
+      }
+      const res = await appointmentBooking.autoSelectAllProductResources(
+        appointmentBoard == null ? void 0 : appointmentBoard.form_code
+      );
+      setResourceOtherParams({
+        ...resourceOtherParams,
+        ...res
+      });
+      getResourceList();
+      const carts2 = await appointmentBooking.getCart();
+      const cartItem = carts2 == null ? void 0 : carts2[0];
+      if (cartItem == null ? void 0 : cartItem._id) {
+        appointmentBooking.updateCart({
+          _id: cartItem == null ? void 0 : cartItem._id,
+          ...cartItem
+        });
+      }
+    };
+    autoSelectResources();
+  }, [appointmentBoard]);
+  const resourcesResult = (0, import_react.useMemo)(() => {
+    let _anyResource = (appointmentBoard == null ? void 0 : appointmentBoard.isRequired) ? [] : [...anyResource];
+    return _anyResource.concat(renderLists || []);
+  }, [renderLists, appointmentBoard]);
+  const onClick = (e) => {
+    var _a;
+    setSelectedResource(e.id);
+    if (e.id) {
+      const index = carts.findIndex(
+        (n) => !(appointmentBooking == null ? void 0 : appointmentBooking.isTargetCartIdNormalProduct(n._id))
+      );
+      e.like_status = "like";
+      return appointmentBooking.updateCart({
+        _id: (_a = carts == null ? void 0 : carts[index]) == null ? void 0 : _a._id,
+        resources: (0, import_utils.updateCartResources)(carts == null ? void 0 : carts[index], e)
+      });
+    }
+  };
+  (0, import_react.useEffect)(() => {
+    var _a, _b, _c;
+    const index = carts.findIndex(
+      (n) => !(appointmentBooking == null ? void 0 : appointmentBooking.isTargetCartIdNormalProduct(n._id))
+    );
+    const selectedResource2 = (_c = (_b = (_a = carts == null ? void 0 : carts[index]) == null ? void 0 : _a._origin) == null ? void 0 : _b.resources) == null ? void 0 : _c.find(
+      (item) => (item == null ? void 0 : item.form_id) === (appointmentBoard == null ? void 0 : appointmentBoard.form_id)
+    );
+    setSelectedResource((selectedResource2 == null ? void 0 : selectedResource2.id) || 0);
+  }, [carts, appointmentBoard == null ? void 0 : appointmentBoard.form_id]);
+  (0, import_react.useEffect)(() => {
+    if (resourcesResult) {
+      setLoading(false);
+    }
+  }, [resourcesResult]);
+  const currentResourceName = (0, import_react.useMemo)(() => {
+    var _a;
+    const currentResource = (_a = currentSelectedResources == null ? void 0 : currentSelectedResources[0]) == null ? void 0 : _a.currentSelectedResource;
+    const resourceItem = (currentResource == null ? void 0 : currentResource.resourceItem) || {};
+    const name = (0, import_utils.getResourceTitle)(
+      appointmentBooking,
+      resourceItem == null ? void 0 : resourceItem.code,
+      utils,
+      resourceItem
+    );
+    return name;
+  }, [currentSelectedResources]);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "appointment-resource-wrap" }, loading ? /* @__PURE__ */ import_react.default.createElement(import_antd.Skeleton, { loading: true, active: true }) : !(resourcesResult == null ? void 0 : resourcesResult.length) ? /* @__PURE__ */ import_react.default.createElement(
+    import_materials.PisellEmpty,
+    {
+      description: import_utils2.locales.getText("pisell2.appointment.resource.tip")(
+        currentResourceName
+      ),
+      maxWidth: 400,
+      icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Image, { src: import_resource.default, preview: false, width: 44 })
+    }
+  ) : /* @__PURE__ */ import_react.default.createElement(
+    import_materials.PisellCustomCheckboxGroup,
+    {
+      dataSource: resourcesResult,
+      renderItem: (item) => {
+        var _a;
+        return /* @__PURE__ */ import_react.default.createElement(
+          import_resourceDisplay.default,
+          {
+            key: item.id,
+            mode: "rule",
+            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),
+            className: !item.id ? "appointment-resource-guest-card" : ""
+          }
+        );
+      },
+      columns: (0, import_utils2.isMobile)() ? 2 : 3,
+      horizontalGap: 16,
+      verticalGap: 16,
+      onClick: (e) => onClick && onClick(e)
+    }
+  ));
+});
+var Resource_default = Resource;

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

@@ -0,0 +1,10 @@
+.appointment-resource-wrap {
+  .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/Resource/utils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * 滚动到第一个错误卡片
+ * @param {string} selector - 错误卡片的 class 选择器
+ */
+export declare const scrollToFirstErrorCard: (selector?: string) => void;

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

@@ -0,0 +1,36 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/appointmentBooking/components/Resource/utils.ts
+var utils_exports = {};
+__export(utils_exports, {
+  scrollToFirstErrorCard: () => scrollToFirstErrorCard
+});
+module.exports = __toCommonJS(utils_exports);
+var scrollToFirstErrorCard = (selector = ".pisell-lowcode-product-select-resource-error") => {
+  setTimeout(() => {
+    const errorCard = document.querySelector(selector);
+    if (errorCard) {
+      errorCard.scrollIntoView({ behavior: "smooth", block: "center" });
+    }
+  }, 0);
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  scrollToFirstErrorCard
+});

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

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.less';
+declare const Services: React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
+export default Services;

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

@@ -0,0 +1,193 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/appointmentBooking/components/Services/index.tsx
+var Services_exports = {};
+__export(Services_exports, {
+  default: () => Services_default
+});
+module.exports = __toCommonJS(Services_exports);
+var import_react = __toESM(require("react"));
+var import_dayjs = __toESM(require("dayjs"));
+var import_utils = require("@pisell/utils");
+var import_productSelect = __toESM(require("../../../productSelect"));
+var import_useEngineContext = __toESM(require("../../../../hooks/useEngineContext"));
+var import_context = require("../../context");
+var import_hooks = require("../../hooks");
+var import_index = require("./index.less");
+var import_utils2 = require("../../utils");
+var Services = (0, import_react.forwardRef)((props, ref) => {
+  const context = (0, import_useEngineContext.default)();
+  const { utils } = context.appHelper || {};
+  const appointmentBooking = (0, import_hooks.useAppointmentBooking)();
+  const { isDateSelectedFirst, isRetailTemplate } = (0, import_hooks.useAppointmentBookingSetting)();
+  const { getProducts, checkProductType } = (0, import_hooks.useAppointmentBookingProduct)();
+  const { removeStep, nextStep } = (0, import_hooks.useAppointmentBookingStep)();
+  const { currentStep, setLoading, carts } = (0, import_context.useAppointmentBookingContext)();
+  const [products, setProducts] = (0, import_react.useState)(null);
+  const [productLoading, setProductLoading] = (0, import_react.useState)(false);
+  (0, import_react.useImperativeHandle)(ref, () => ({
+    next: () => {
+      setLoading(true);
+      setTimeout(() => {
+        nextStep();
+        setLoading(false);
+      }, 500);
+    }
+  }));
+  (0, import_react.useEffect)(() => {
+    setProductLoading(true);
+    getProducts().then((res) => {
+      setProducts(res || []);
+      setProductLoading(false);
+    }).catch(() => {
+      setProducts([]);
+      setProductLoading(false);
+    });
+  }, [isDateSelectedFirst]);
+  const handleSelectProduct = async (item) => {
+    let type = "";
+    if (!isRetailTemplate) {
+      type = await checkProductType(item == null ? void 0 : item.id);
+      appointmentBooking.openProductDetail(item.id);
+    }
+    utils == null ? void 0 : utils.action({
+      type: "pisell1.productDetail",
+      data: {
+        detail: { ...item, open_deposit: 1 },
+        setting: { can_input: true }
+      },
+      callback: async (data) => {
+        var _a, _b;
+        if (data.isCancel) {
+          appointmentBooking.closeProductDetail();
+          return;
+        }
+        const product = {
+          ...data,
+          options: (data == null ? void 0 : data.option) || []
+        };
+        delete product.option;
+        if (isRetailTemplate) {
+          if (data == null ? void 0 : data.isCancel) return;
+          appointmentBooking.storeProduct(product);
+          return;
+        }
+        const session = data == null ? void 0 : data.session;
+        if (session) {
+          const startDate = (0, import_dayjs.default)(session == null ? void 0 : session.start_at).format("YYYY-MM-DD");
+          const endDate = (0, import_dayjs.default)(session == null ? void 0 : session.end_at).format("YYYY-MM-DD");
+          appointmentBooking.addProductToCart({
+            product: { ...product },
+            date: {
+              startTime: `${startDate} ${session == null ? void 0 : session.start_time}`,
+              endTime: `${endDate} ${session == null ? void 0 : session.end_time}`
+            }
+          });
+          await appointmentBooking.getAvailableDate({
+            startDate,
+            endDate
+          });
+        } else {
+          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 && !appointmentBooking.isTargetNormalProduct(data == null ? void 0 : data.origin)) {
+            return (0, import_utils2.Toast)(
+              import_utils.locales.getText("pisell2.appointment.no.available.service")
+            );
+          }
+          appointmentBooking.storeProduct(product);
+          if (type === "duration") {
+            await appointmentBooking.getAvailableDate();
+          }
+        }
+        appointmentBooking.closeProductDetail();
+        if (isDateSelectedFirst) {
+          const index = (currentStep == null ? void 0 : currentStep.index) + 2;
+          if (type === "duration" || appointmentBooking.isCartHasDurationProduct()) {
+            const stepList = appointmentBooking.getStepList();
+            const hasResourceStep = stepList == null ? void 0 : stepList.find(
+              (item2) => (item2 == null ? void 0 : item2.key) === "select-resource"
+            );
+            if (hasResourceStep) {
+              const description = import_utils.locales.getText(
+                "pisell2.appointment.select.time"
+              );
+              appointmentBooking.addStep(
+                { index, key: "select-time", description },
+                "select-resource"
+              );
+            }
+          } else {
+            removeStep("select-time");
+          }
+        } else {
+          if (type === "session") {
+            removeStep("select-date");
+            removeStep("select-time");
+          }
+        }
+      }
+    });
+  };
+  const productListSetting = (0, import_react.useMemo)(() => {
+    var _a;
+    const { customPageData } = ((_a = context.engine) == null ? void 0 : _a.props) || {};
+    let productListBlock;
+    if (Array.isArray(customPageData == null ? void 0 : customPageData.block)) {
+      productListBlock = customPageData.block.find(
+        (b) => "product_list" === b.type
+      );
+    }
+    return (productListBlock == null ? void 0 : productListBlock.setting) || {};
+  }, [context]);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "appointment-service-wrap" }, /* @__PURE__ */ import_react.default.createElement(
+    import_productSelect.default,
+    {
+      dataSource: products,
+      onChange: handleSelectProduct,
+      scrollDom: (0, import_utils.isMobile)() ? ".parallel-content-wrap" : ".parallel-booking-wrap",
+      loading: productLoading,
+      emptyDescription: import_utils.locales.getText(
+        "pisell2.appointment.booking.empty.service"
+      ),
+      token: {
+        colorPrimary: "var(--theme-color)",
+        containerBg: "#FFFFFF",
+        tabItemBg: "#F2F4F7",
+        tabItemHoverBg: "#F2F4F7",
+        tabItemActiveBg: "var(--theme-color)",
+        categoryTextColor: "#1B1B1B",
+        cardSelectedBg: "var(--theme-color)"
+      },
+      productListSetting,
+      selectedItems: carts
+    }
+  ));
+});
+var Services_default = Services;

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

@@ -0,0 +1,3 @@
+.appointment-service-wrap {
+
+}

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

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.less';
+declare const TimeSlicing: React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;
+export default TimeSlicing;

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

@@ -0,0 +1,102 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/appointmentBooking/components/TimeSlicing/index.tsx
+var TimeSlicing_exports = {};
+__export(TimeSlicing_exports, {
+  default: () => TimeSlicing_default
+});
+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_hooks = require("../../hooks");
+var import_utils2 = require("../../utils");
+var import_index = require("./index.less");
+var TimeSlicing = (0, import_react.forwardRef)((props, ref) => {
+  const [selectedResource, setSelectedResource] = (0, import_react.useState)("");
+  const {
+    times,
+    appointmentBooking,
+    setSelectedTime,
+    resourceOtherParams,
+    carts
+  } = (0, import_context.useAppointmentBookingContext)();
+  const { getResourceTimeSlot, getResourceList } = (0, import_hooks.useAppointmentBookingResource)();
+  const { nextStep } = (0, import_hooks.useAppointmentBookingStep)();
+  (0, import_react.useImperativeHandle)(ref, () => ({
+    next: () => {
+      const isUnSelectedTimes = appointmentBooking.checkCartItems("date");
+      if ((isUnSelectedTimes == null ? void 0 : isUnSelectedTimes.length) > 0) {
+        (0, import_utils2.Toast)(import_utils.locales.getText("pisell2.appointment.unselect.time"));
+        return;
+      }
+      nextStep();
+    }
+  }));
+  (0, import_react.useEffect)(() => {
+    getResourceTimeSlot();
+  }, []);
+  const getAutoSelect = async (val) => {
+    setSelectedTime(val);
+    const result = await appointmentBooking.submitTimeSlot(val);
+  };
+  (0, import_react.useEffect)(() => {
+    var _a, _b, _c;
+    let appoimentBookingProductCart = carts.filter((item) => !appointmentBooking.isTargetCartIdNormalProduct(item == null ? void 0 : item._id));
+    if ((times == null ? void 0 : times.length) > 0 && (appoimentBookingProductCart == null ? void 0 : appoimentBookingProductCart.length) > 0) {
+      const startTime = ((_a = appoimentBookingProductCart == null ? void 0 : appoimentBookingProductCart[0]) == null ? void 0 : _a.start_time) || ((_b = times == null ? void 0 : times[0]) == null ? void 0 : _b.start_time);
+      setSelectedResource(startTime);
+      if ((_c = appoimentBookingProductCart == null ? void 0 : appoimentBookingProductCart[0]) == null ? void 0 : _c.start_time) return;
+      getAutoSelect(times == null ? void 0 : times[0]);
+    }
+  }, [times, carts]);
+  const onClick = async (e) => {
+    setSelectedResource(e == null ? void 0 : e.start_time);
+    getAutoSelect(e);
+  };
+  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",
+      {
+        key: index,
+        onClick: () => onClick(item),
+        className: `item ${selectedResource === (item == null ? void 0 : item.start_time) ? "active" : ""}`
+      },
+      /* @__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.unselect.time")
+    }
+  );
+});
+var TimeSlicing_default = TimeSlicing;

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

@@ -0,0 +1,33 @@
+.appointment-time-slicing-wrap {
+  padding-top: 0;
+  .item {
+    cursor: pointer;
+    padding: 25px 20px;
+    border-bottom: 1px solid #f1f1f1;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 22px;
+    color: #1b1b1b;
+
+    .icon {
+      color: #919191;
+      font-size: 18px;
+    }
+
+    &:hover {
+      background-color: #f1f1f1;
+      cursor: pointer;
+    }
+    &.active {
+      background-color: var(--theme-color, #7f56d9);
+      color: #ffffff !important;
+
+      .icon {
+        color: #ffffff;
+      }
+    }
+  }
+}

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;