@pisell/private-materials 6.2.24 → 6.2.26

package/lib/plus/clinetSearch/InfiniteScroll/InfiniteScroll.js

@@ -0,0 +1,235 @@
+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/plus/clinetSearch/InfiniteScroll/InfiniteScroll.tsx
+var InfiniteScroll_exports = {};
+__export(InfiniteScroll_exports, {
+  default: () => InfiniteScroll_default
+});
+module.exports = __toCommonJS(InfiniteScroll_exports);
+var import_react = __toESM(require("react"));
+var InfiniteScroll = ({
+  dataLength,
+  next,
+  hasMore,
+  loader = /* @__PURE__ */ import_react.default.createElement("div", null, "Loading..."),
+  endMessage,
+  height,
+  scrollThreshold = 0.8,
+  onScroll,
+  style,
+  className,
+  scrollableTarget,
+  children,
+  inverse = false
+}) => {
+  const [isLoading, setIsLoading] = (0, import_react.useState)(false);
+  const containerRef = (0, import_react.useRef)(null);
+  const lastDataLength = (0, import_react.useRef)(dataLength);
+  const scrollTimeoutRef = (0, import_react.useRef)(null);
+  const isMountedRef = (0, import_react.useRef)(true);
+  const lastCallTimeRef = (0, import_react.useRef)(0);
+  const throttle = (0, import_react.useCallback)((func, delay) => {
+    return (...args) => {
+      if (scrollTimeoutRef.current) {
+        clearTimeout(scrollTimeoutRef.current);
+      }
+      scrollTimeoutRef.current = setTimeout(() => func(...args), delay);
+    };
+  }, []);
+  const getScrollThreshold = (0, import_react.useCallback)(() => {
+    if (typeof scrollThreshold === "string" && scrollThreshold.endsWith("px")) {
+      return parseInt(scrollThreshold.replace("px", ""), 10);
+    }
+    return typeof scrollThreshold === "number" ? scrollThreshold : 0.8;
+  }, [scrollThreshold]);
+  const checkScrollPosition = (0, import_react.useCallback)(
+    (element) => {
+      if (!element || !hasMore || isLoading) return;
+      const threshold = getScrollThreshold();
+      const { scrollTop, scrollHeight, clientHeight } = element;
+      if (scrollHeight <= 0 || clientHeight <= 0) {
+        console.warn("InfiniteScroll: 检测到无效的滚动容器尺寸");
+        return;
+      }
+      const normalizedScrollTop = Math.max(0, scrollTop);
+      let shouldLoadMore = false;
+      if (inverse) {
+        if (typeof threshold === "number" && threshold < 1) {
+          const scrollPercentage = normalizedScrollTop / scrollHeight;
+          shouldLoadMore = scrollPercentage <= 1 - threshold;
+        } else {
+          shouldLoadMore = normalizedScrollTop <= threshold;
+        }
+      } else {
+        if (typeof threshold === "number" && threshold < 1) {
+          const scrollPercentage = (normalizedScrollTop + clientHeight) / scrollHeight;
+          shouldLoadMore = scrollPercentage >= threshold;
+        } else {
+          const remainingHeight = scrollHeight - normalizedScrollTop - clientHeight;
+          shouldLoadMore = remainingHeight <= threshold;
+        }
+      }
+      if (shouldLoadMore) {
+        const now = Date.now();
+        if (now - lastCallTimeRef.current < 500) {
+          return;
+        }
+        lastCallTimeRef.current = now;
+        setIsLoading(true);
+        try {
+          next();
+        } catch (error) {
+          console.error("InfiniteScroll: 加载更多数据时发生错误:", error);
+          if (isMountedRef.current) {
+            setIsLoading(false);
+          }
+        }
+      }
+    },
+    [hasMore, isLoading, next, getScrollThreshold, inverse]
+  );
+  const checkInitialLoad = (0, import_react.useCallback)(() => {
+    const element = scrollableTarget ? document.getElementById(scrollableTarget) : containerRef.current;
+    if (!element || !hasMore || isLoading) return;
+    const { scrollHeight, clientHeight } = element;
+    if (clientHeight <= 0) {
+      console.warn("InfiniteScroll: 容器高度无效，可能容器尚未渲染完成");
+      return;
+    }
+    const needsMoreContent = scrollHeight <= clientHeight || dataLength === 0;
+    if (needsMoreContent) {
+      const now = Date.now();
+      if (now - lastCallTimeRef.current < 500) {
+        return;
+      }
+      lastCallTimeRef.current = now;
+      setIsLoading(true);
+      try {
+        next();
+      } catch (error) {
+        console.error("InfiniteScroll: 初始加载时发生错误:", error);
+        if (isMountedRef.current) {
+          setIsLoading(false);
+        }
+      }
+    }
+  }, [hasMore, isLoading, next, scrollableTarget, dataLength]);
+  const handleScrollInternal = (0, import_react.useCallback)(
+    (event) => {
+      try {
+        const element = scrollableTarget ? document.getElementById(scrollableTarget) : event.target;
+        if (!element || typeof element.scrollTop === "undefined") {
+          console.warn("InfiniteScroll: 无效的滚动目标元素");
+          return;
+        }
+        checkScrollPosition(element);
+        if (onScroll) {
+          onScroll(event);
+        }
+      } catch (error) {
+        console.error("InfiniteScroll: 滚动事件处理时发生错误:", error);
+      }
+    },
+    [checkScrollPosition, onScroll, scrollableTarget]
+  );
+  const handleScroll = (0, import_react.useMemo)(
+    () => throttle(handleScrollInternal, 16),
+    // 约60fps
+    [throttle, handleScrollInternal]
+  );
+  (0, import_react.useEffect)(() => {
+    if (dataLength !== lastDataLength.current) {
+      if (isMountedRef.current) {
+        setIsLoading(false);
+      }
+      lastDataLength.current = dataLength;
+    }
+  }, [dataLength]);
+  (0, import_react.useEffect)(() => {
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
+  (0, import_react.useEffect)(() => {
+    return () => {
+      if (scrollTimeoutRef.current) {
+        clearTimeout(scrollTimeoutRef.current);
+      }
+    };
+  }, []);
+  (0, import_react.useEffect)(() => {
+    const timeoutId = setTimeout(() => {
+      checkInitialLoad();
+    }, 100);
+    return () => clearTimeout(timeoutId);
+  }, [checkInitialLoad, dataLength]);
+  (0, import_react.useEffect)(() => {
+    if (!isLoading && hasMore) {
+      const timeoutId = setTimeout(() => {
+        checkInitialLoad();
+      }, 100);
+      return () => clearTimeout(timeoutId);
+    }
+  }, [isLoading, hasMore, checkInitialLoad]);
+  (0, import_react.useEffect)(() => {
+    const element = scrollableTarget ? document.getElementById(scrollableTarget) : containerRef.current;
+    if (!element) {
+      console.warn("InfiniteScroll: 无法找到滚动容器元素");
+      return;
+    }
+    const scrollHandler = handleScroll;
+    element.addEventListener("scroll", scrollHandler, { passive: true });
+    return () => {
+      if (element) {
+        element.removeEventListener("scroll", scrollHandler);
+      }
+    };
+  }, [handleScroll, scrollableTarget]);
+  const containerStyle = (0, import_react.useMemo)(() => ({
+    ...style,
+    ...height && {
+      height: typeof height === "number" ? `${height}px` : height,
+      overflowY: "auto"
+    },
+    ...inverse && {
+      display: "flex",
+      flexDirection: "column-reverse"
+    }
+  }), [style, height, inverse]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      ref: !scrollableTarget ? containerRef : void 0,
+      className,
+      style: containerStyle
+    },
+    inverse ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, isLoading && hasMore && loader, !hasMore && endMessage, children) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, children, isLoading && hasMore && loader, !hasMore && endMessage)
+  );
+};
+var InfiniteScroll_default = InfiniteScroll;

package/lib/plus/clinetSearch/InfiniteScroll/index.js

@@ -0,0 +1,35 @@
+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/plus/clinetSearch/InfiniteScroll/index.ts
+var InfiniteScroll_exports = {};
+__export(InfiniteScroll_exports, {
+  default: () => import_InfiniteScroll.default
+});
+module.exports = __toCommonJS(InfiniteScroll_exports);
+var import_InfiniteScroll = __toESM(require("./InfiniteScroll"));

package/lib/plus/clinetSearch/InfiniteScroll/types.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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/plus/clinetSearch/InfiniteScroll/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/lib/plus/clinetSearch/index.js

@@ -0,0 +1,205 @@
+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/plus/clinetSearch/index.tsx
+var clinetSearch_exports = {};
+__export(clinetSearch_exports, {
+  default: () => clinetSearch_default
+});
+module.exports = __toCommonJS(clinetSearch_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
+var import_dayjs = __toESM(require("dayjs"));
+var import_InfiniteScroll = __toESM(require("./InfiniteScroll"));
+var import_comprehensiveSearch = __toESM(require("../../pro/comprehensiveSearch"));
+var import_clientName = __toESM(require("../clientName"));
+var import_Add = __toESM(require("./Add"));
+var import_locales = __toESM(require("./locales"));
+var import_useEngineContext = __toESM(require("../../hooks/useEngineContext"));
+var import_useTranslationOriginal = __toESM(require("../../hooks/useTranslationOriginal"));
+var import_index = require("./index.less");
+var ClientSearch = (0, import_react.forwardRef)(
+  ({ onRowClick, resultProps, onAddClient, hasMore, onLoadMore, ...props }, ref) => {
+    var _a, _b, _c;
+    const [modalVisible, setModalVisible] = (0, import_react.useState)(false);
+    const comprehensiveSearchRef = (0, import_react.useRef)(null);
+    const addClientRef = (0, import_react.useRef)(null);
+    const scrollContainerRef = (0, import_react.useRef)(null);
+    const translationOriginal = (0, import_useTranslationOriginal.default)();
+    const context = (0, import_useEngineContext.default)();
+    import_utils.locales.init(
+      import_locales.default,
+      ((_c = (_b = (_a = context.appHelper) == null ? void 0 : _a.utils) == null ? void 0 : _b.storage) == null ? void 0 : _c.get("umi_locale")) || "en"
+    );
+    const handleAdd = () => {
+      setModalVisible(true);
+    };
+    const handleModalCancel = () => {
+      var _a2;
+      setModalVisible(false);
+      (_a2 = addClientRef.current) == null ? void 0 : _a2.reset();
+    };
+    const renderListHeader = () => {
+      return /* @__PURE__ */ import_react.default.createElement("div", { className: "client-search-list-header" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "header-item", style: { width: 110 } }, import_utils.locales.getText("pisell2.text.client-search.name")), /* @__PURE__ */ import_react.default.createElement("div", { className: "header-item", style: { width: 110 } }, import_utils.locales.getText("pisell2.text.client-search.register-time")), /* @__PURE__ */ import_react.default.createElement("div", { className: "header-item", style: { width: 120 } }, import_utils.locales.getText("pisell2.text.client-search.phone")), /* @__PURE__ */ import_react.default.createElement("div", { className: "header-item", style: { width: 135 } }, import_utils.locales.getText("pisell2.text.client-search.email")), /* @__PURE__ */ import_react.default.createElement("div", { className: "header-item", style: { width: 120 } }, import_utils.locales.getText("pisell2.text.client-search.membership")));
+    };
+    const renderResults = (searchResults) => {
+      return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, (searchResults == null ? void 0 : searchResults.length) ? renderListHeader() : null, /* @__PURE__ */ import_react.default.createElement(
+        "div",
+        {
+          ref: scrollContainerRef,
+          id: "client-search_infinite-scroll",
+          style: {
+            height: "calc(100% - 40px)",
+            overflowY: "auto",
+            overflowX: "hidden",
+            display: "flex"
+          }
+        },
+        /* @__PURE__ */ import_react.default.createElement(
+          import_InfiniteScroll.default,
+          {
+            dataLength: searchResults.length,
+            next: onLoadMore || (() => {
+            }),
+            hasMore: hasMore || false,
+            style: { width: "100%" },
+            loader: /* @__PURE__ */ import_react.default.createElement(
+              "div",
+              {
+                style: {
+                  textAlign: "center",
+                  padding: "20px",
+                  color: "#999"
+                }
+              },
+              import_utils.locales.getText("pisell2.text.loading")
+            ),
+            endMessage: /* @__PURE__ */ import_react.default.createElement("div", { style: { textAlign: "center", color: "#999" } }, (searchResults == null ? void 0 : searchResults.length) ? import_utils.locales.getText("pisell2.text.no-more-data") : null),
+            scrollableTarget: "client-search_infinite-scroll"
+          },
+          /* @__PURE__ */ import_react.default.createElement(
+            import_antd.List,
+            {
+              dataSource: searchResults,
+              renderItem: (item, index) => {
+                var _a2, _b2;
+                const membershipText = (_b2 = (_a2 = item.latest_wallet_detail) == null ? void 0 : _a2.wallet) == null ? void 0 : _b2.name;
+                return /* @__PURE__ */ import_react.default.createElement(
+                  import_antd.List.Item,
+                  {
+                    key: item.id,
+                    className: "client-search-list-item"
+                  },
+                  /* @__PURE__ */ import_react.default.createElement(
+                    "div",
+                    {
+                      className: "list-item-content",
+                      onClick: () => onRowClick == null ? void 0 : onRowClick(item, index || 0),
+                      style: { cursor: "pointer" }
+                    },
+                    /* @__PURE__ */ import_react.default.createElement("div", { className: "item-cell", style: { width: 110 } }, /* @__PURE__ */ import_react.default.createElement(import_clientName.default, { dataSource: item })),
+                    /* @__PURE__ */ import_react.default.createElement("div", { className: "item-cell", style: { width: 110 } }, (0, import_dayjs.default)(item.created_at).format("YYYY-MM-DD") || "-"),
+                    /* @__PURE__ */ import_react.default.createElement("div", { className: "item-cell", style: { width: 120 } }, item.phone || "-"),
+                    /* @__PURE__ */ import_react.default.createElement("div", { className: "item-cell", style: { width: 135 } }, /* @__PURE__ */ import_react.default.createElement(
+                      "div",
+                      {
+                        style: {
+                          overflow: "hidden",
+                          textOverflow: "ellipsis",
+                          whiteSpace: "nowrap"
+                        }
+                      },
+                      item.email || "-"
+                    )),
+                    /* @__PURE__ */ import_react.default.createElement("div", { className: "item-cell", style: { width: 120 } }, membershipText && (translationOriginal == null ? void 0 : translationOriginal(membershipText)) ? /* @__PURE__ */ import_react.default.createElement(
+                      import_antd.Tag,
+                      {
+                        color: "gold",
+                        style: {
+                          overflow: "hidden",
+                          whiteSpace: "nowrap",
+                          textOverflow: "ellipsis",
+                          width: "auto",
+                          maxWidth: "100%",
+                          display: "inline-block",
+                          borderRadius: 16,
+                          marginRight: 0
+                        }
+                      },
+                      translationOriginal == null ? void 0 : translationOriginal(membershipText)
+                    ) : "-")
+                  )
+                );
+              }
+            }
+          )
+        )
+      ));
+    };
+    const handleAddClient = (record, isChecked) => {
+      onAddClient == null ? void 0 : onAddClient(record, isChecked);
+      handleModalCancel();
+    };
+    (0, import_react.useImperativeHandle)(ref, () => ({
+      setSearchKeyword: (keyword) => {
+        var _a2, _b2;
+        (_b2 = (_a2 = comprehensiveSearchRef.current) == null ? void 0 : _a2.setSearchKeyword) == null ? void 0 : _b2.call(_a2, keyword);
+      },
+      resetScrollPosition: () => {
+        if (scrollContainerRef.current) {
+          scrollContainerRef.current.scrollTop = 0;
+        }
+      }
+    }));
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
+      import_comprehensiveSearch.default,
+      {
+        ...props,
+        ref: comprehensiveSearchRef,
+        renderType: "modal",
+        onAdd: handleAdd,
+        resultDisplay: renderResults
+      }
+    ), /* @__PURE__ */ import_react.default.createElement(
+      import_Add.default,
+      {
+        containerProps: {
+          className: "pisell-client-search__new-client-modal",
+          title: import_utils.locales.getText("pisell2.text.create-new-client"),
+          open: modalVisible,
+          onCancel: handleModalCancel,
+          width: 680
+        },
+        onChange: handleAddClient,
+        ref: addClientRef
+      }
+    ));
+  }
+);
+var clinetSearch_default = ClientSearch;

package/lib/plus/clinetSearch/index.less

@@ -0,0 +1,91 @@
+.client-search-table {
+  .pisell-lowcode-table-tbody > tr {
+    cursor: pointer;
+
+    &:hover {
+      background-color: #f5f5f5;
+    }
+  }
+
+  .pisell-lowcode-table-thead > tr > th {
+    background-color: #fafafa;
+    font-weight: 600;
+  }
+}
+
+// List样式
+.client-search-list-header {
+  display: flex;
+  background-color: #fafafa;
+  border-bottom: 1px solid #d9d9d9;
+  padding: 12px 16px;
+  font-weight: 600;
+
+  .header-item {
+    flex-shrink: 0;
+    padding-right: 16px;
+    color: rgba(0, 0, 0, 0.85);
+    font-size: 14px;
+  }
+}
+
+.client-search-list-item {
+  cursor: pointer;
+  border-bottom: 1px solid #f0f0f0;
+  padding: 0 !important;
+
+  &:hover {
+    background-color: #f5f5f5;
+  }
+
+  &:last-child {
+    border-bottom: none;
+  }
+
+  .list-item-content {
+    display: flex;
+    width: 100%;
+    padding: 12px 16px;
+
+    .item-cell {
+      flex-shrink: 0;
+      padding-right: 16px;
+      color: rgba(0, 0, 0, 0.85);
+      font-size: 14px;
+      display: flex;
+      align-items: center;
+      overflow: hidden;
+      display: inline-block;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+  }
+
+  // 添加点击事件处理
+  .ant-list-item-meta {
+    pointer-events: none;
+  }
+}
+
+.client-search-form {
+  padding: 16px 0;
+
+  .ant-form-item {
+    margin-bottom: 16px;
+  }
+
+  .ant-input {
+    height: 40px;
+  }
+}
+
+.comprehensive-search {
+  .comprehensive-search__results-container {
+    .client-search-table {
+      .pisell-lowcode-table {
+        border: 1px solid #d9d9d9;
+        border-radius: 6px;
+      }
+    }
+  }
+}