@pisell/private-materials 3.0.211 → 3.0.213

package/lib/components/eventBooking/components/bookingDetailModal/index.js

@@ -52,6 +52,8 @@ var BookingDetailModal = (props) => {
   const [activeTab, setActiveTab] = (0, import_react.useState)("introduction");
   const [isScrolling, setIsScrolling] = (0, import_react.useState)(false);
   const [openCheckout, setOpenCheckout] = (0, import_react.useState)(false);
+  const isUserClickRef = (0, import_react.useRef)(false);
+  const scrollTimeoutRef = (0, import_react.useRef)(null);
   const anchorOptions = (0, import_react.useMemo)(
     () => [
       {
@@ -100,34 +102,104 @@ var BookingDetailModal = (props) => {
     if (!modalContentRef.current || !open)
       return;
     const handleScroll = () => {
-      var _a2;
-      if (isScrolling)
+      if (isScrolling || isUserClickRef.current)
         return;
       const container2 = modalContentRef.current;
       if (!container2)
         return;
-      const scrollTop = container2.scrollTop;
-      const headerHeight = 58;
-      for (const option of anchorOptions) {
-        const element = document.getElementById(option.id);
-        if (element) {
+      if (scrollTimeoutRef.current) {
+        clearTimeout(scrollTimeoutRef.current);
+      }
+      scrollTimeoutRef.current = setTimeout(() => {
+        const scrollTop = container2.scrollTop;
+        const headerHeight = 58;
+        const containerHeight = container2.clientHeight;
+        const scrollHeight = container2.scrollHeight;
+        const viewportMiddle = headerHeight + (containerHeight - headerHeight) / 2;
+        const sectionPositions = anchorOptions.map((option) => {
+          const element = document.getElementById(option.id);
+          if (!element)
+            return null;
           const rect = element.getBoundingClientRect();
-          const elementTop = rect.top;
-          if (Math.abs(elementTop - headerHeight) < 50) {
-            if (activeTab !== option.id) {
-              setActiveTab(option.id);
-              (_a2 = tabsRef == null ? void 0 : tabsRef.current) == null ? void 0 : _a2.scroll(option.id);
+          return {
+            id: option.id,
+            top: rect.top,
+            bottom: rect.bottom,
+            height: rect.height,
+            // 添加可见度计算
+            visibleTop: Math.max(rect.top, headerHeight),
+            visibleBottom: Math.min(rect.bottom, containerHeight),
+            // 计算元素中点到视口中点的距离
+            distanceToCenter: Math.abs((rect.top + rect.bottom) / 2 - viewportMiddle)
+          };
+        }).filter((section) => section !== null);
+        const isAtBottom = Math.abs(scrollTop + containerHeight - scrollHeight) <= 2;
+        if (isAtBottom) {
+          const lastOption = anchorOptions[anchorOptions.length - 1];
+          if (activeTab !== lastOption.id) {
+            setActiveTab(lastOption.id);
+          }
+          return;
+        }
+        let bestSection = null;
+        const sectionsWithPriority = sectionPositions.map((section) => {
+          const visibleHeight = section.visibleBottom - section.visibleTop;
+          const visibilityRatio = visibleHeight / section.height;
+          const topDistance = Math.abs(section.top - headerHeight);
+          const priority = (
+            // 基础可见度权重
+            visibilityRatio * 0.6 + // 小内容区域补偿
+            (section.height < 200 ? 0.3 : 0) + // 距离权重（反比，越近权重越大）
+            0.4 * (1 - Math.min(topDistance / containerHeight, 1))
+          );
+          return {
+            ...section,
+            visibilityRatio,
+            topDistance,
+            priority
+          };
+        });
+        sectionsWithPriority.sort((a, b) => {
+          if (a.visibilityRatio > 0.1 && b.visibilityRatio > 0.1) {
+            if (Math.abs(a.topDistance - b.topDistance) < 50) {
+              return b.priority - a.priority;
             }
-            break;
+            return a.topDistance - b.topDistance;
+          }
+          return b.priority - a.priority;
+        });
+        bestSection = sectionsWithPriority[0];
+        if (bestSection && activeTab !== bestSection.id) {
+          const currentSection = sectionPositions.find((s) => s.id === activeTab);
+          if (!currentSection || bestSection.priority > (currentSection.priority || 0) + 0.2 || bestSection.visibilityRatio > 0.3 && bestSection.topDistance < currentSection.topDistance) {
+            setActiveTab(bestSection.id);
           }
         }
-      }
+      }, 200);
     };
     const container = modalContentRef.current;
     container.addEventListener("scroll", handleScroll);
-    setTimeout(handleScroll, 100);
-    return () => container.removeEventListener("scroll", handleScroll);
+    return () => {
+      container.removeEventListener("scroll", handleScroll);
+      if (scrollTimeoutRef.current) {
+        clearTimeout(scrollTimeoutRef.current);
+      }
+    };
   }, [anchorOptions, activeTab, open, isScrolling]);
+  const handleTabChange = (key) => {
+    if (isUserClickRef.current) {
+      setActiveTab(key);
+      setIsScrolling(true);
+      setTimeout(() => {
+        setIsScrolling(false);
+        isUserClickRef.current = false;
+      }, 1200);
+    } else {
+      if (!isScrolling && !isUserClickRef.current) {
+        setActiveTab(key);
+      }
+    }
+  };
   const content = () => {
     return /* @__PURE__ */ import_react.default.createElement("div", { className: "booking-detail-modal-content", ref: modalContentRef }, /* @__PURE__ */ import_react.default.createElement("div", { className: "anchor-wrapper" }, /* @__PURE__ */ import_react.default.createElement(
       import_materials.PisellAnchor,
@@ -135,9 +207,10 @@ var BookingDetailModal = (props) => {
         ref: tabsRef,
         options: anchorOptions,
         tab: activeTab,
-        onChange: (key) => {
-          scrollToElement(key);
-          setActiveTab(key);
+        containerRef: modalContentRef,
+        onChange: handleTabChange,
+        onTabClick: () => {
+          isUserClickRef.current = true;
         }
       }
     )), /* @__PURE__ */ import_react.default.createElement("div", { className: "content-wrapper" }, /* @__PURE__ */ import_react.default.createElement("div", { id: "introduction", className: "content-section" }, (images == null ? void 0 : images.length) > 0 ? /* @__PURE__ */ import_react.default.createElement(
@@ -162,17 +235,23 @@ var BookingDetailModal = (props) => {
     }
     addToCart();
   };
+  (0, import_react.useEffect)(() => {
+    if (open) {
+      setActiveTab("introduction");
+      setIsScrolling(false);
+      isUserClickRef.current = false;
+    }
+  }, [open]);
   return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
     import_materials.PisellModal,
     {
       open,
       title: import_utils.locales.getText("pisell2.event.details"),
       platform: (0, import_utils.isMobile)() ? "h5" : "pc",
-      bodyStyle: { padding: 0, overflow: "hidden" },
+      bodyStyle: { padding: 0 },
       destroyOnClose: true,
-      mobileModalHeight: "80vh",
       className: "booking-detail-modal",
-      onCancel: () => onCloseEventDetail(),
+      onCancel: onCloseEventDetail,
       okText: import_utils.locales.getText("pisell2.event.add.to.cart"),
       cancelVisible: false,
       onOk: handleOk,

package/lib/components/eventBooking/components/bookingDetailModal/index.less

@@ -2,7 +2,7 @@
   .booking-detail-modal-content {
     display: flex;
     flex-direction: column;
-    height: calc(80vh - 140px);
+    height: 100%;
     overflow-y: auto;
     overflow-x: hidden;
     scroll-behavior: smooth;
@@ -12,7 +12,7 @@
       top: 0;
       z-index: 10;
       background: #fff;
-      padding: 0 !important;
+      padding: 0 16px !important;
       // padding: 16px;
     }
 

package/lib/components/eventBooking/components/resourceDisplay/index.less

@@ -78,4 +78,18 @@
       line-height: 10px;
     }
   }
+
+  &-empty-avatar {
+    .pisell-lowcode-avatar-string {
+      position: relative;
+      left: 0;
+      height: 32px;
+      line-height: 32px;
+      transform: scale(1) !important;
+      .pisell-lowcode-image {
+        width: 32px;
+        height: 32px;
+      }
+    }
+  }
 }

package/lib/components/eventBooking/components/selectHolder/index.js

@@ -81,7 +81,7 @@ var PisellSelectHolder = ({
         onOk && onOk(e);
       },
       bodyStyle: { padding: (0, import_utils.isMobile)() ? "0 16px 16px" : 20 },
-      mobileModalHeight: "90%",
+      mobileModalHeight: "auto",
       destroyOnClose: true,
       className: `select-holder-modal ${(0, import_utils.isMobile)() ? "select-holder-modal-mobile" : ""}`,
       headerDivider: false

package/lib/components/eventBooking/index.js

@@ -59,7 +59,8 @@ var Content = () => {
       return;
     getResourceList.run({
       form_id,
-      shop_id
+      shop_id,
+      form_data_status: "active"
     });
   }, [form_id]);
   return getResourceList.data ? /* @__PURE__ */ import_react.default.createElement(

package/lib/components/eventBooking/index.less

@@ -14,6 +14,8 @@
 }
 
 .event-booking-mobile-wrap {
+  background: #ffffff;
+  min-height: 100vh;
   .pisell-section-headers-content {
     width: 100%;
   }

package/lib/components/eventBooking/locales.d.ts

@@ -13,11 +13,12 @@ declare const _default: {
         'pisell2.event.close.continue': string;
         'pisell2.event.close.exit': string;
         'pisell2.event.step': (step: number) => string;
-        'pisell2.event.select.category': string;
+        'pisell2.event.select.category': (val: string) => string;
         'pisell2.event.select.campus': (val: string) => string;
         'pisell2.event.select.event': string;
         'pisell2.event.cart': string;
         'pisell2.event.total': string;
+        'pisell2.event.total.gst': (val: string, amount: any) => string;
         'pisell2.event.continue': string;
         'pisell2.event.details': string;
         'pisell2.event.introduction': string;
@@ -83,11 +84,12 @@ declare const _default: {
         'pisell2.event.close.continue': string;
         'pisell2.event.close.exit': string;
         'pisell2.event.step': (step: number) => string;
-        'pisell2.event.select.category': string;
+        'pisell2.event.select.category': (val: string) => string;
         'pisell2.event.select.event': string;
         'pisell2.event.select.campus': (val: string) => string;
         'pisell2.event.cart': string;
         'pisell2.event.total': string;
+        'pisell2.event.total.gst': (val: string, amount: any) => string;
         'pisell2.event.continue': string;
         'pisell2.event.details': string;
         'pisell2.event.introduction': string;
@@ -153,11 +155,12 @@ declare const _default: {
         'pisell2.event.close.continue': string;
         'pisell2.event.close.exit': string;
         'pisell2.event.step': (step: number) => string;
-        'pisell2.event.select.category': string;
+        'pisell2.event.select.category': (val: string) => string;
         'pisell2.event.select.event': string;
         'pisell2.event.select.campus': (val: string) => string;
         'pisell2.event.cart': string;
         'pisell2.event.total': string;
+        'pisell2.event.total.gst': (val: string, amount: any) => string;
         'pisell2.event.continue': string;
         'pisell2.event.details': string;
         'pisell2.event.introduction': string;

package/lib/components/eventBooking/locales.js

@@ -37,11 +37,12 @@ var locales_default = {
     "pisell2.event.close.continue": "Continue",
     "pisell2.event.close.exit": "Exit",
     "pisell2.event.step": (step) => `Step ${step}`,
-    "pisell2.event.select.category": "Select category",
-    "pisell2.event.select.campus": (val) => `Please choose ${val || "resource"}`,
-    "pisell2.event.select.event": "Select event",
+    "pisell2.event.select.category": (val) => `Select ${val || "resource"}`,
+    "pisell2.event.select.campus": (val) => `Please select ${val || "resource"}`,
+    "pisell2.event.select.event": "Select service",
     "pisell2.event.cart": "Cart",
     "pisell2.event.total": "Total",
+    "pisell2.event.total.gst": (val, amount) => `Including ${val} ${amount}`,
     "pisell2.event.continue": "Continue",
     "pisell2.event.details": "Details",
     "pisell2.event.introduction": "Introduction",
@@ -107,11 +108,12 @@ var locales_default = {
     "pisell2.event.close.continue": "继续",
     "pisell2.event.close.exit": "退出",
     "pisell2.event.step": (step) => `步骤 ${step}`,
-    "pisell2.event.select.category": "选择分类",
-    "pisell2.event.select.event": "选择活动",
+    "pisell2.event.select.category": (val) => `选择${val || "资源"}`,
+    "pisell2.event.select.event": "选择服务",
     "pisell2.event.select.campus": (val) => `请选择${val || "资源"}`,
     "pisell2.event.cart": "购物车",
     "pisell2.event.total": "总计",
+    "pisell2.event.total.gst": (val, amount) => `包含${val} ${amount}`,
     "pisell2.event.continue": "继续",
     "pisell2.event.details": "详情",
     "pisell2.event.introduction": "介绍",
@@ -177,11 +179,12 @@ var locales_default = {
     "pisell2.event.close.continue": "繼續",
     "pisell2.event.close.exit": "退出",
     "pisell2.event.step": (step) => `步驟 ${step}`,
-    "pisell2.event.select.category": "選擇分類",
-    "pisell2.event.select.event": "選擇活動",
+    "pisell2.event.select.category": (val) => `選擇${val || "資源"}`,
+    "pisell2.event.select.event": "選擇服務",
     "pisell2.event.select.campus": (val) => `請選擇${val || "資源"}`,
     "pisell2.event.cart": "購物車",
     "pisell2.event.total": "總計",
+    "pisell2.event.total.gst": (val, amount) => `包含${val} ${amount}`,
     "pisell2.event.continue": "繼續",
     "pisell2.event.details": "詳情",
     "pisell2.event.introduction": "介紹",

package/lib/components/eventBooking/utils.d.ts

@@ -34,3 +34,12 @@ export declare const getScheduleColors: (schedules: any[]) => string;
  * @Date: 2025-01-12 11:55
  */
 export declare const formatMonthDisplay: (dateString: string) => string;
+/**
+ * @title: 资源名称
+ * @description:
+ * @param {any} data
+ * @return {*}
+ * @Author: WangHan
+ * @Date: 2025-02-11 13:39
+ */
+export declare const resourceTitle: (data: any) => any;

package/lib/components/eventBooking/utils.js

@@ -32,7 +32,8 @@ __export(utils_exports, {
   formatBackgroundColors: () => formatBackgroundColors,
   formatMonthDisplay: () => formatMonthDisplay,
   getScheduleColors: () => getScheduleColors,
-  getUsableSchedules: () => getUsableSchedules
+  getUsableSchedules: () => getUsableSchedules,
+  resourceTitle: () => resourceTitle
 });
 module.exports = __toCommonJS(utils_exports);
 var import_dayjs = __toESM(require("dayjs"));
@@ -71,10 +72,19 @@ var formatMonthDisplay = (dateString) => {
   const date = /* @__PURE__ */ new Date(dateString + "-01");
   return date.toLocaleString(locale, { month: "long", year: "numeric" });
 };
+var resourceTitle = (data) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const context = (0, import_useEngineContext.default)();
+  const form = (_c = (_b = (_a = data == null ? void 0 : data.initData) == null ? void 0 : _a.boardSetting) == null ? void 0 : _b.event_v2_form) == null ? void 0 : _c.form;
+  const title = ((_d = form == null ? void 0 : form.setting) == null ? void 0 : _d.title) || (form == null ? void 0 : form.title);
+  const translation = (_f = (_e = context == null ? void 0 : context.appHelper) == null ? void 0 : _e.utils) == null ? void 0 : _f.translation;
+  return (_g = translation(title)) == null ? void 0 : _g.toLowerCase();
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   formatBackgroundColors,
   formatMonthDisplay,
   getScheduleColors,
-  getUsableSchedules
+  getUsableSchedules,
+  resourceTitle
 });

package/lib/components/tabProduct/tabs/index.less

@@ -108,9 +108,19 @@
         white-space: nowrap;
       }
 
-      &:hover {
-        .pisell-tabs-tab-content {
-          background-color: #f1f1f1;
+      @media (min-width: 769px) {
+        &:hover {
+          .pisell-tabs-tab-content {
+            background-color: #f1f1f1;
+          }
+        }
+      }
+
+      @media (max-width: 768px) {
+        &:hover {
+          .pisell-tabs-tab-content {
+            background-color: transparent;
+          }
         }
       }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/private-materials",
-  "version": "3.0.211",
+  "version": "3.0.213",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -60,7 +60,7 @@
     "rc-virtual-list": "^3.11.3",
     "decimal.js": "^10.4.3",
     "@pisell/utils": "1.0.42",
-    "@pisell/materials": "3.0.64",
+    "@pisell/materials": "3.0.66",
     "@pisell/icon": "0.0.11",
     "@pisell/date-picker": "3.0.2"
   },