@pisell/materials 1.8.31 → 1.8.33

package/lib/components/pisellRecordBoard/PisellRecordBoard.js

@@ -103,6 +103,7 @@ function getDefaultRecordBoardContext(layoutType, selection, rowKey) {
   };
 }
 var PisellRecordBoard = (props) => {
+  var _a;
   const {
     children,
     layoutType = "grid",
@@ -187,8 +188,8 @@ var PisellRecordBoard = (props) => {
     bodyView
   ]);
   const [internalColumnVisibility, setInternalColumnVisibility] = (0, import_react.useState)(() => {
-    var _a, _b;
-    const fromConfig = ((_a = props.grid) == null ? void 0 : _a.defaultHiddenColumnKeys) ?? [];
+    var _a2, _b;
+    const fromConfig = ((_a2 = props.grid) == null ? void 0 : _a2.defaultHiddenColumnKeys) ?? [];
     const fromColumns = (((_b = props.grid) == null ? void 0 : _b.columns) ?? []).filter(
       (col) => col.hidden === true
     ).map((col) => (0, import_recordBoardColumns.getRecordBoardColumnKey)(col)).filter(Boolean);
@@ -247,6 +248,7 @@ var PisellRecordBoard = (props) => {
     setInternalColumnOrder(columnKeys);
   }, []);
   const contextValue = (0, import_react.useMemo)(() => {
+    var _a2;
     const defaultCtx = getDefaultRecordBoardContext(
       layoutType,
       {
@@ -257,6 +259,7 @@ var PisellRecordBoard = (props) => {
       rowKeyProp
     );
     const pagination = paginationProp !== void 0 ? paginationProp : defaultCtx.pagination;
+    const gridInfiniteScroll = ((_a2 = props.grid) == null ? void 0 : _a2.infiniteScroll) === true;
     let data;
     let total;
     if (dataProp !== void 0) {
@@ -267,8 +270,13 @@ var PisellRecordBoard = (props) => {
       total = totalProp !== void 0 ? totalProp : raw.length;
       const { pageNumber, pageSize } = pagination;
       const safeSize = Math.max(1, pageSize);
-      const start = Math.max(0, (pageNumber - 1) * safeSize);
-      data = raw.slice(start, start + safeSize);
+      if (gridInfiniteScroll) {
+        const end = Math.min(raw.length, pageNumber * safeSize);
+        data = raw.slice(0, end);
+      } else {
+        const start = Math.max(0, (pageNumber - 1) * safeSize);
+        data = raw.slice(start, start + safeSize);
+      }
     } else {
       data = defaultCtx.data;
       total = totalProp !== void 0 ? totalProp : defaultCtx.total;
@@ -325,7 +333,8 @@ var PisellRecordBoard = (props) => {
        * 业务方传入的自定义分页渲染：注入 ctx 后，shellFrame 内置的
        * `<RecordBoardPagination />` 会优先使用它（详见 RecordBoardPagination 实现）。
        */
-      paginationRender: props.paginationRender
+      paginationRender: props.paginationRender,
+      gridInfiniteScroll
     };
   }, [
     layoutType,
@@ -361,7 +370,8 @@ var PisellRecordBoard = (props) => {
     resourceWallProp,
     bodyView,
     setBodyView,
-    props.paginationRender
+    props.paginationRender,
+    (_a = props.grid) == null ? void 0 : _a.infiniteScroll
   ]);
   const content = /* @__PURE__ */ import_react.default.createElement(import_RecordBoardProvider.RecordBoardProvider, { value: contextValue }, children);
   return /* @__PURE__ */ import_react.default.createElement(

package/lib/components/pisellRecordBoard/layouts/GridLayout/Grid.js

@@ -72,7 +72,10 @@ var CONTEXT_ONLY_KEYS = [
   "setScrollAreaHeight",
   "collapseUniformColumns",
   "columnOrder",
-  "onColumnOrderChange"
+  "onColumnOrderChange",
+  "gridInfiniteScroll",
+  "infiniteScroll",
+  "paginationRender"
 ];
 var RecordBoardGridView = (props) => {
   const ctx = (0, import_useRecordBoardContext.useRecordBoardContext)({ displayName: "grid" });
@@ -186,6 +189,7 @@ var RecordBoardGridView = (props) => {
   const gridTableProps = (0, import_react.useMemo)(() => {
     const picked = {};
     Object.keys(ctx).forEach((k) => {
+      if (k === "onScroll") return;
       if (CONTEXT_ONLY_KEYS.includes(
         k
       ))
@@ -205,6 +209,7 @@ var RecordBoardGridView = (props) => {
       0
     ) || 2e3;
   }, [columns]);
+  const gridInfiniteScroll = ctx.gridInfiniteScroll === true;
   const tableScroll = (0, import_react.useMemo)(() => {
     const scroll = rest.scroll ?? ctx.scroll;
     const scrollX = isEmpty && scroll && typeof scroll.x !== "number" ? sumColumnWidths : scroll == null ? void 0 : scroll.x;
@@ -214,7 +219,7 @@ var RecordBoardGridView = (props) => {
       return {
         x: scrollX ?? sumColumnWidths,
         y: Math.max(wrapHeight - reservedHeight, 100),
-        scrollToFirstRowOnChange: scroll.scrollToFirstRowOnChange
+        scrollToFirstRowOnChange: gridInfiniteScroll ? false : scroll.scrollToFirstRowOnChange
       };
     }
     if (scroll && typeof scroll === "object") {
@@ -223,7 +228,8 @@ var RecordBoardGridView = (props) => {
       if (resolved) {
         return {
           ...resolved,
-          x: scrollX ?? resolved.x ?? sumColumnWidths
+          x: scrollX ?? resolved.x ?? sumColumnWidths,
+          ...gridInfiniteScroll ? { scrollToFirstRowOnChange: false } : {}
         };
       }
       return resolved;
@@ -237,36 +243,187 @@ var RecordBoardGridView = (props) => {
     columns,
     sumColumnWidths,
     isEmpty,
-    uniformSummaryHeight
+    uniformSummaryHeight,
+    gridInfiniteScroll
   ]);
-  return /* @__PURE__ */ import_react.default.createElement("div", { "data-layout-slot": "grid", className: "pisell-lowcode-record-board-grid" }, summaryItems.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { ref: summaryRef, className: "pisell-record-board-uniform-summary" }, summaryItems.map((item) => {
-    const processedCol = processedColumnsForSummary == null ? void 0 : processedColumnsForSummary.find(
-      (c) => (0, import_recordBoardColumns.getRecordBoardColumnKey)(c) === item.columnKey
-    );
-    const useRender = typeof (processedCol == null ? void 0 : processedCol.render) === "function";
-    const content = useRender ? processedCol.render(item.cellValue, item.record ?? {}, 0) : item.type === "empty" ? (0, import_locales.getText)("record-board-uniform-summary-empty") : item.displayValue ?? (0, import_locales.getText)("record-board-uniform-summary-same");
-    return /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        key: item.columnKey,
-        className: "pisell-record-board-uniform-summary-item"
-      },
-      /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-record-board-uniform-summary-label" }, item.title),
-      /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-record-board-uniform-summary-value" }, content)
-    );
-  })), /* @__PURE__ */ import_react.default.createElement(
-    import_antd.Table,
-    {
-      ...rest,
-      ...gridTableProps,
-      scroll: tableScroll,
-      rowKey: tableRowKey,
-      dataSource: ctx.data ?? [],
-      loading: ctx.loading,
-      columns,
-      rowSelection,
-      pagination: false
+  const infiniteLoadLockRef = (0, import_react.useRef)(false);
+  const [infiniteScrollFetching, setInfiniteScrollFetching] = (0, import_react.useState)(false);
+  (0, import_react.useEffect)(() => {
+    if (!ctx.loading) {
+      infiniteLoadLockRef.current = false;
     }
-  ));
+  }, [ctx.loading, dataSource.length]);
+  (0, import_react.useEffect)(() => {
+    setInfiniteScrollFetching(false);
+  }, [dataSource.length]);
+  const gridWrapRef = (0, import_react.useRef)(null);
+  const ctxRef = (0, import_react.useRef)(ctx);
+  ctxRef.current = ctx;
+  const restRef = (0, import_react.useRef)(rest);
+  restRef.current = rest;
+  const gridInfiniteRef = (0, import_react.useRef)(false);
+  gridInfiniteRef.current = gridInfiniteScroll;
+  (0, import_react.useEffect)(() => {
+    if (!gridInfiniteScroll) return;
+    const root = gridWrapRef.current;
+    if (!root) {
+      return;
+    }
+    const handler = (e) => {
+      var _a, _b;
+      const r = restRef.current;
+      const c = ctxRef.current;
+      const ev = e;
+      (_a = r.onScroll) == null ? void 0 : _a.call(r, ev);
+      (_b = c.onScroll) == null ? void 0 : _b.call(
+        c,
+        ev
+      );
+      if (!gridInfiniteRef.current) return;
+      if (c.loading || infiniteLoadLockRef.current) {
+        return;
+      }
+      const st = e.currentTarget ?? e.target;
+      const dataLen = (c.data ?? []).length;
+      const tot = c.total ?? 0;
+      const { scrollTop, clientHeight, scrollHeight } = st;
+      const dist = scrollHeight - scrollTop - clientHeight;
+      if (dataLen >= tot) {
+        return;
+      }
+      if (dist > 48) return;
+      infiniteLoadLockRef.current = true;
+      setInfiniteScrollFetching(true);
+      c.onPageChange(c.pagination.pageNumber + 1, c.pagination.pageSize);
+    };
+    const listScrollTargets = (r) => {
+      const out = [];
+      const seen = /* @__PURE__ */ new Set();
+      const add = (el) => {
+        if (el && !seen.has(el)) {
+          seen.add(el);
+          out.push(el);
+        }
+      };
+      r.querySelectorAll(".ant-table-body, .pisell-lowcode-table-body").forEach(
+        (n) => add(n)
+      );
+      add(r.closest(".pisell-record-board-scroll-body"));
+      return out;
+    };
+    const cleanups = [];
+    const bind = () => {
+      cleanups.forEach((fn) => fn());
+      cleanups.length = 0;
+      const targets = listScrollTargets(root);
+      targets.forEach((el) => {
+        el.addEventListener("scroll", handler, { passive: true });
+        cleanups.push(() => el.removeEventListener("scroll", handler));
+      });
+    };
+    const t0 = window.setTimeout(() => bind(), 0);
+    const t1 = window.setTimeout(() => bind(), 120);
+    const t2 = window.setTimeout(() => bind(), 400);
+    return () => {
+      clearTimeout(t0);
+      clearTimeout(t1);
+      clearTimeout(t2);
+      cleanups.forEach((fn) => fn());
+    };
+  }, [
+    gridInfiniteScroll,
+    dataSource.length,
+    isEmpty,
+    ctx.scrollAreaHeight,
+    columns,
+    summaryItems.length
+  ]);
+  const tableRest = (0, import_react.useMemo)(() => {
+    if (!gridInfiniteScroll) return rest;
+    const { onScroll: _onScroll, ...r } = rest;
+    return r;
+  }, [gridInfiniteScroll, rest]);
+  const userGridSummary = gridTableProps.summary;
+  const infiniteSummaryColSpan = (0, import_react.useMemo)(() => {
+    const n = Array.isArray(columns) ? columns.length : 1;
+    return n + (rowSelection ? 1 : 0);
+  }, [columns, rowSelection]);
+  const mergedTableSummary = (0, import_react.useMemo)(() => {
+    if (!gridInfiniteScroll) {
+      return userGridSummary;
+    }
+    return (pageData) => {
+      const userNode = typeof userGridSummary === "function" ? userGridSummary(pageData) : userGridSummary;
+      const len = (ctx.data ?? []).length;
+      const tot = ctx.total;
+      const loading = !!ctx.loading;
+      const loadingMore = loading || infiniteScrollFetching;
+      const showBar = len > 0 || loadingMore;
+      if (!showBar && !userNode) {
+        return null;
+      }
+      const hasMore = tot == null || typeof tot !== "number" ? true : len < tot;
+      const allLoaded = typeof tot === "number" && tot > 0 && len > 0 && len >= tot;
+      let statusInner = null;
+      if (showBar) {
+        if (allLoaded) {
+          statusInner = /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-record-board-infinite-scroll-tip-done" }, (0, import_locales.getText)("record-board-infinite-scroll-all-loaded"));
+        } else if (hasMore && len > 0) {
+          statusInner = /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-record-board-infinite-scroll-tip-loading" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Spin, { size: "small" }), /* @__PURE__ */ import_react.default.createElement("span", null, (0, import_locales.getText)("record-board-infinite-scroll-loading-more")));
+        }
+      }
+      const statusBlock = statusInner != null ? /* @__PURE__ */ import_react.default.createElement(import_antd.Table.Summary, { fixed: "bottom" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Table.Summary.Row, { className: "pisell-record-board-infinite-scroll-summary-row" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Table.Summary.Cell, { index: 0, colSpan: infiniteSummaryColSpan, align: "left" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "pisell-record-board-infinite-scroll-tip" }, statusInner)))) : null;
+      if (!userNode && !statusBlock) return null;
+      return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, userNode, statusBlock);
+    };
+  }, [
+    gridInfiniteScroll,
+    userGridSummary,
+    infiniteSummaryColSpan,
+    ctx.data,
+    ctx.total,
+    ctx.loading,
+    infiniteScrollFetching
+  ]);
+  const { summary: _userSummaryOmitted, ...gridTablePropsWithoutSummary } = gridTableProps;
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      ref: gridWrapRef,
+      "data-layout-slot": "grid",
+      className: "pisell-lowcode-record-board-grid"
+    },
+    summaryItems.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { ref: summaryRef, className: "pisell-record-board-uniform-summary" }, summaryItems.map((item) => {
+      const processedCol = processedColumnsForSummary == null ? void 0 : processedColumnsForSummary.find(
+        (c) => (0, import_recordBoardColumns.getRecordBoardColumnKey)(c) === item.columnKey
+      );
+      const useRender = typeof (processedCol == null ? void 0 : processedCol.render) === "function";
+      const content = useRender ? processedCol.render(item.cellValue, item.record ?? {}, 0) : item.type === "empty" ? (0, import_locales.getText)("record-board-uniform-summary-empty") : item.displayValue ?? (0, import_locales.getText)("record-board-uniform-summary-same");
+      return /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          key: item.columnKey,
+          className: "pisell-record-board-uniform-summary-item"
+        },
+        /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-record-board-uniform-summary-label" }, item.title),
+        /* @__PURE__ */ import_react.default.createElement("span", { className: "pisell-record-board-uniform-summary-value" }, content)
+      );
+    })),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Table,
+      {
+        ...tableRest,
+        ...gridTablePropsWithoutSummary,
+        summary: mergedTableSummary,
+        scroll: tableScroll,
+        rowKey: tableRowKey,
+        dataSource: ctx.data ?? [],
+        loading: ctx.loading,
+        columns,
+        rowSelection,
+        pagination: false
+      }
+    )
+  );
 };
 var Grid_default = RecordBoardGridView;

package/lib/components/pisellRecordBoard/layouts/GridLayout/Grid.less

@@ -111,3 +111,34 @@
 .pisell-record-board-row-cancelled {
   background: #fff1f0;
 }
+
+// 无限滚动：表尾 Table.Summary 一行，文案靠左
+// 不再加 border-top：上方数据行已有 border-bottom，再画 top 会与 antd 格线叠成双线
+.pisell-record-board-infinite-scroll-summary-row > .pisell-lowcode-table-cell,
+.pisell-record-board-infinite-scroll-summary-row > .ant-table-cell {
+  background: var(--ant-color-bg-container, #ffffff) !important;
+  border-top: none !important;
+  text-align: left !important;
+  vertical-align: middle;
+  padding: 8px 12px !important;
+}
+
+.pisell-record-board-infinite-scroll-tip {
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 8px;
+  font-size: 12px;
+  line-height: 18px;
+}
+
+.pisell-record-board-infinite-scroll-tip-loading {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  color: #475467;
+}
+
+.pisell-record-board-infinite-scroll-tip-done {
+  color: #667085;
+}

package/lib/components/pisellRecordBoard/shellFrame/Calendar/view/BookingCalendarMonthView.js

@@ -101,123 +101,126 @@ function BookingCalendarMonthView({
           )
         ),
         /* @__PURE__ */ import_react.default.createElement("div", { className: "absolute right-3 top-3 flex gap-1 pt-1" }, day.bookingCount > 0 && /* @__PURE__ */ import_react.default.createElement("span", { className: "h-3 w-3 rounded-full bg-violet-500" }), (day.blockCount > 0 || day.fullyBooked) && /* @__PURE__ */ import_react.default.createElement("span", { className: "h-3 w-3 rounded-full bg-red-500" })),
-        dayItems.length > 0 ? /* @__PURE__ */ import_react.default.createElement("div", { className: "mt-10 flex w-full flex-col items-start gap-1.5" }, dayItems.map((item, i) => {
-          const isLastVisible = i === dayItems.length - 1;
-          const shrinkForMore = showMoreTile && isLastVisible;
-          const layoutClassName = `block rounded-md px-2 py-2 text-xs text-left ${(0, import_BookingCalendarStyle.getGridBookingRowStateClasses)(
-            item
-          )} ${shrinkForMore ? "flex-1 min-w-0" : "w-full"}`;
-          return /* @__PURE__ */ import_react.default.createElement(
-            "div",
-            {
-              key: i,
-              className: "flex w-full items-stretch gap-2"
-            },
-            renderMonthWeekBooking ? /* @__PURE__ */ import_react.default.createElement(
+        dayItems.length > 0 ? (
+          /** 顶对齐：日期区为 top-3(12px) + h-11(44px)=56px，原先 mt-10(40px) 与数字圈底不齐，易多出一条缝 */
+          /* @__PURE__ */ import_react.default.createElement("div", { className: "mt-14 flex w-full flex-col items-start gap-1.5" }, dayItems.map((item, i) => {
+            const isLastVisible = i === dayItems.length - 1;
+            const shrinkForMore = showMoreTile && isLastVisible;
+            const layoutClassName = `block rounded-md px-2 pt-1.5 pb-2 text-xs text-left ${(0, import_BookingCalendarStyle.getGridBookingRowStateClasses)(
+              item
+            )} ${shrinkForMore ? "flex-1 min-w-0" : "w-full"}`;
+            return /* @__PURE__ */ import_react.default.createElement(
               "div",
               {
-                className: shrinkForMore ? "flex-1 min-w-0" : "w-full"
+                key: i,
+                className: "flex w-full items-stretch gap-2"
               },
-              renderMonthWeekBooking({
-                item,
-                dateKey: day.key,
-                view: "month",
-                isLight,
-                layoutClassName,
-                onOpenDetail: openBookingDetail,
-                onDragStart: (it) => setDraggingItem(it),
-                draggable: item.kind !== "block"
-              })
-            ) : /* @__PURE__ */ import_react.default.createElement(
-              "button",
-              {
-                type: "button",
-                draggable: item.kind !== "block",
-                onDragStart: (e) => {
-                  if (item.kind !== "block") {
-                    e.stopPropagation();
-                    setDraggingItem(item);
-                  }
-                },
-                onClick: (e) => {
-                  e.stopPropagation();
-                  openBookingDetail(item);
+              renderMonthWeekBooking ? /* @__PURE__ */ import_react.default.createElement(
+                "div",
+                {
+                  className: shrinkForMore ? "flex-1 min-w-0" : "w-full"
                 },
-                className: layoutClassName
-              },
-              /* @__PURE__ */ import_react.default.createElement("div", { className: "truncate" }, item.name),
-              /* @__PURE__ */ import_react.default.createElement("div", { className: "mt-1 opacity-80" }, (0, import_bookingCalendarDateUtils.formatHourLabel)(item.startHour), " -", " ", (0, import_bookingCalendarDateUtils.formatHourLabel)(item.endHour))
-            ),
-            shrinkForMore && /* @__PURE__ */ import_react.default.createElement(
-              "div",
-              {
-                className: "relative h-[52px] w-[52px] shrink-0",
-                ref: (overflowPopover == null ? void 0 : overflowPopover.courtId) === "month" && (overflowPopover == null ? void 0 : overflowPopover.date) === day.key ? overflowPanelRef : null
-              },
-              /* @__PURE__ */ import_react.default.createElement(
+                renderMonthWeekBooking({
+                  item,
+                  dateKey: day.key,
+                  view: "month",
+                  isLight,
+                  layoutClassName,
+                  onOpenDetail: openBookingDetail,
+                  onDragStart: (it) => setDraggingItem(it),
+                  draggable: item.kind !== "block"
+                })
+              ) : /* @__PURE__ */ import_react.default.createElement(
                 "button",
                 {
-                  onMouseEnter: (e) => {
-                    e.stopPropagation();
-                    setOverflowPopover({
-                      courtId: "month",
-                      date: day.key,
-                      items: moreItems,
-                      pinned: false
-                    });
+                  type: "button",
+                  draggable: item.kind !== "block",
+                  onDragStart: (e) => {
+                    if (item.kind !== "block") {
+                      e.stopPropagation();
+                      setDraggingItem(item);
+                    }
                   },
                   onClick: (e) => {
                     e.stopPropagation();
-                    setOverflowPopover(null);
-                    setOverflowListModal(
-                      (prev) => prev && prev.scope === "month" && prev.date === day.key ? null : {
-                        scope: "month",
-                        date: day.key,
-                        title: (0, import_calendarI18n.tCal)(
-                          "pisell2.recordBoard.calendar.overflow.listTitleBookings",
-                          { date: day.key }
-                        ),
-                        items: allItems.filter(
-                          (x) => x.kind === "booking"
-                        )
-                      }
-                    );
+                    openBookingDetail(item);
                   },
-                  className: "flex h-[52px] w-[52px] items-center justify-center rounded-xl bg-violet-700/90 text-sm font-semibold text-white"
+                  className: layoutClassName
                 },
-                "+",
-                moreCount
+                /* @__PURE__ */ import_react.default.createElement("div", { className: "truncate" }, item.name),
+                /* @__PURE__ */ import_react.default.createElement("div", { className: "mt-1 opacity-80" }, (0, import_bookingCalendarDateUtils.formatHourLabel)(item.startHour), " -", " ", (0, import_bookingCalendarDateUtils.formatHourLabel)(item.endHour))
               ),
-              (overflowPopover == null ? void 0 : overflowPopover.courtId) === "month" && (overflowPopover == null ? void 0 : overflowPopover.date) === day.key && !overflowListModal && /* @__PURE__ */ import_react.default.createElement(
+              shrinkForMore && /* @__PURE__ */ import_react.default.createElement(
                 "div",
                 {
-                  onMouseLeave: () => {
-                    if (!(overflowPopover == null ? void 0 : overflowPopover.pinned))
-                      setOverflowPopover(null);
-                  },
-                  className: `absolute right-0 top-[60px] z-20 flex min-w-[240px] max-h-[360px] flex-col rounded-xl border p-3 shadow-2xl ${isLight ? "theme-panel theme-border" : "border-zinc-700 bg-[#111218]"}`
+                  className: "relative h-[52px] w-[52px] shrink-0",
+                  ref: (overflowPopover == null ? void 0 : overflowPopover.courtId) === "month" && (overflowPopover == null ? void 0 : overflowPopover.date) === day.key ? overflowPanelRef : null
                 },
                 /* @__PURE__ */ import_react.default.createElement(
-                  "div",
+                  "button",
                   {
-                    className: `mb-3 shrink-0 text-xs font-semibold ${isLight ? "theme-text-soft" : "text-zinc-300"}`
+                    onMouseEnter: (e) => {
+                      e.stopPropagation();
+                      setOverflowPopover({
+                        courtId: "month",
+                        date: day.key,
+                        items: moreItems,
+                        pinned: false
+                      });
+                    },
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      setOverflowPopover(null);
+                      setOverflowListModal(
+                        (prev) => prev && prev.scope === "month" && prev.date === day.key ? null : {
+                          scope: "month",
+                          date: day.key,
+                          title: (0, import_calendarI18n.tCal)(
+                            "pisell2.recordBoard.calendar.overflow.listTitleBookings",
+                            { date: day.key }
+                          ),
+                          items: allItems.filter(
+                            (x) => x.kind === "booking"
+                          )
+                        }
+                      );
+                    },
+                    className: "flex h-[52px] w-[52px] items-center justify-center rounded-xl bg-violet-700/90 text-sm font-semibold text-white"
                   },
-                  (0, import_calendarI18n.tCal)(
-                    "pisell2.recordBoard.calendar.overflow.bookingsForDay"
-                  )
+                  "+",
+                  moreCount
                 ),
-                /* @__PURE__ */ import_react.default.createElement("div", { className: "min-h-0 flex-1 overflow-hidden" }, /* @__PURE__ */ import_react.default.createElement(
-                  import_OverflowPopover.MonthGridOverflowVirtualList,
+                (overflowPopover == null ? void 0 : overflowPopover.courtId) === "month" && (overflowPopover == null ? void 0 : overflowPopover.date) === day.key && !overflowListModal && /* @__PURE__ */ import_react.default.createElement(
+                  "div",
                   {
-                    items: overflowPopover.items,
-                    listWidth: 214,
-                    onPickItem: openBookingDetail
-                  }
-                ))
+                    onMouseLeave: () => {
+                      if (!(overflowPopover == null ? void 0 : overflowPopover.pinned))
+                        setOverflowPopover(null);
+                    },
+                    className: `absolute right-0 top-[60px] z-20 flex min-w-[240px] max-h-[360px] flex-col rounded-xl border p-3 shadow-2xl ${isLight ? "theme-panel theme-border" : "border-zinc-700 bg-[#111218]"}`
+                  },
+                  /* @__PURE__ */ import_react.default.createElement(
+                    "div",
+                    {
+                      className: `mb-3 shrink-0 text-xs font-semibold ${isLight ? "theme-text-soft" : "text-zinc-300"}`
+                    },
+                    (0, import_calendarI18n.tCal)(
+                      "pisell2.recordBoard.calendar.overflow.bookingsForDay"
+                    )
+                  ),
+                  /* @__PURE__ */ import_react.default.createElement("div", { className: "min-h-0 flex-1 overflow-hidden" }, /* @__PURE__ */ import_react.default.createElement(
+                    import_OverflowPopover.MonthGridOverflowVirtualList,
+                    {
+                      items: overflowPopover.items,
+                      listWidth: 214,
+                      onPickItem: openBookingDetail
+                    }
+                  ))
+                )
               )
-            )
-          );
-        })) : null
+            );
+          }))
+        ) : null
       );
     }))))
   );

package/lib/components/pisellRecordBoard/shellFrame/index.js

@@ -192,6 +192,7 @@ var RecordBoardShellFrame = ({ children, className, style, belowToolbar }) => {
     () => hasGridContent && ctx.bodyView === "grid",
     [hasGridContent, ctx.bodyView]
   );
+  const showGridPagination = showGrid && ctx.gridInfiniteScroll !== true;
   const showFloorMap = (0, import_react.useMemo)(
     () => hasFloorMapSlot && effectiveFloorMapProps != null && ctx.bodyView === "floorMap",
     [hasFloorMapSlot, effectiveFloorMapProps, ctx.bodyView]
@@ -306,7 +307,7 @@ var RecordBoardShellFrame = ({ children, className, style, belowToolbar }) => {
       autoCalc: (_c = (_b = (_a = ctx == null ? void 0 : ctx.childComponentProps) == null ? void 0 : _a.grid) == null ? void 0 : _b.scroll) == null ? void 0 : _c.autoCalc
     },
     gridChildren
-  ) : showResourceWall ? resourceWallNode : showCalendar ? calendarNode : floorMapNode, showGrid ? /* @__PURE__ */ import_react.default.createElement(import_Pagination.default, null) : null) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, showGrid ? gridChildren : showResourceWall ? resourceWallNode : showCalendar ? calendarNode : floorMapNode, showGrid ? /* @__PURE__ */ import_react.default.createElement(import_Pagination.default, null) : null);
+  ) : showResourceWall ? resourceWallNode : showCalendar ? calendarNode : floorMapNode, showGridPagination ? /* @__PURE__ */ import_react.default.createElement(import_Pagination.default, null) : null) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, showGrid ? gridChildren : showResourceWall ? resourceWallNode : showCalendar ? calendarNode : floorMapNode, showGridPagination ? /* @__PURE__ */ import_react.default.createElement(import_Pagination.default, null) : null);
   const shellStyle = fillHeight && style ? { ...style, ...FILL_HEIGHT_WRAPPER_STYLE } : fillHeight ? FILL_HEIGHT_WRAPPER_STYLE : style;
   const wrapper = /* @__PURE__ */ import_react.default.createElement(import_ShellBodyMetaContext.RecordBoardShellBodyMetaContext.Provider, { value: shellBodyMeta }, /* @__PURE__ */ import_react.default.createElement(
     import_pisellShellFrame.PisellShellFrame,

package/lib/components/pisellRecordBoard/types.d.ts

@@ -540,6 +540,10 @@ export interface RecordBoardContextValue {
      * `<RecordBoardPagination />` 优先级：组件 `render` prop > 此 ctx 字段 > 默认 materials Pagination。
      */
     paginationRender?: (ctx: RecordBoardContextValue) => React.ReactNode;
+    /**
+     * 与 `grid.infiniteScroll` 同步：为 true 时不渲染 ShellFrame 底部分页，由 Grid 表体触底触发翻页。
+     */
+    gridInfiniteScroll?: boolean;
     /** 是否占满父容器高度，供 ShellFrame 做弹性布局（内容区纯 CSS 滚动 + 表头 sticky；scroll.autoCalc 时用测量高度） */
     fillHeight?: boolean;
     /** 内容区滚动容器高度（fillHeight 且 grid.scroll.autoCalc 时由 ShellFrame 测量），供 Grid 计算 scroll.y */
@@ -658,6 +662,11 @@ export declare type RecordBoardGridProps = {
         autoCalc?: boolean;
         scrollToFirstRowOnChange?: boolean;
     };
+    /**
+     * 为 true 时：表体滚动触底触发 `onPageChange` 加载下一页，ShellFrame **不展示**底部分页条。
+     * 宿主需保证 `data` 为已加载的**累积**行（或 dataSources 模式由容器做累积切片），且 `total` 为总量；触底停更条件为 `data.length < total`。
+     */
+    infiniteScroll?: boolean;
     /** 表格尺寸 */
     size?: 'small' | 'middle' | 'default';
     /** 当前选中的行 key 列表（多选） */