lu-lowcode-package-form 0.10.55 → 0.10.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lu-lowcode-package-form",
-  "version": "0.10.55",
+  "version": "0.10.57",
   "dependencies": {
     "@ant-design/icons": "^4.8.1",
     "@dnd-kit/core": "^6.1.0",

package/src/components/field/select/search-select.jsx

@@ -1,7 +1,7 @@
 
 
 import { Input, Select as OriginalSelect, Spin } from 'antd';
-import React, { useEffect, useState, forwardRef, useCallback } from 'react';
+import React, { useEffect, useState, forwardRef, useCallback ,useRef} from 'react';
 import { BaseWrapper } from "../base"
 import { debounce, isEqual } from 'lodash';
 
@@ -9,6 +9,9 @@ import { debounce, isEqual } from 'lodash';
 const SearchSelect = forwardRef(({ addWrapper = true, form, fieldName, fieldsValue, shouldUpdateKey,value, type, defaultValue, onChange, option_label, option_value, option_search, options, request, requestParams, callError, subRequest, sub_option_label = "label", mode = "single", sub_option_value = "id", rightIconRender, rightIcon, rightIconClick,recordFieldsChange, ...props }, ref) => {
     const [nOptions, setNOptions] = React.useState([])
     const [fetching, setFetching] = useState(false);
+    
+    const currentPageRef = useRef(1);
+    const [isAllLoaded, setIsAllLoaded] = useState(false)
     useEffect(() => {
         // console.log("SearchSelect useEffect props", props)
         if (value) {
@@ -74,6 +77,7 @@ const SearchSelect = forwardRef(({ addWrapper = true, form, fieldName, fieldsVal
         
         let item = null
         const ruleParams = {}
+        currentPageRef.current = 1
         if (request && typeof request === 'function') {
             debounceFetchOptions(params, ruleParams)
         }
@@ -171,7 +175,25 @@ const SearchSelect = forwardRef(({ addWrapper = true, form, fieldName, fieldsVal
         }
     }
 
-
+    const handleScroll = (event) => {
+        const { target } = event;
+        if (target.scrollTop + target.clientHeight >= target.scrollHeight) {
+            // 滚动到底部，加载更多数据
+            loadMoreOptions();
+        }
+    };
+    
+    const loadMoreOptions = async () => {
+        if (request && option_value) {
+            const nextPageParams = { ...requestParams, page: currentPageRef.current  + 1, pageSize: currentPageSize };
+            debounceFetchOptions(nextPageParams, null, (newOptions) => {
+                if (newOptions && newOptions.length > 0) {
+                    setNOptions(prevOptions => [...prevOptions, ...newOptions]);
+                    currentPageRef.current = currentPageRef.current + 1;
+                }
+            });
+        }
+    };
     return addWrapper ? (
         <BaseWrapper {...props}>
             <OriginalSelect
@@ -185,6 +207,7 @@ const SearchSelect = forwardRef(({ addWrapper = true, form, fieldName, fieldsVal
                 onChange={handleChange}
                 style={{ width: '100%', flex: 1 }}
                 options={nOptions}
+                onPopupScroll={typeof request === 'function' ? handleScroll : null} 
                 mode={mode} >
 
             </OriginalSelect>
@@ -203,6 +226,7 @@ const SearchSelect = forwardRef(({ addWrapper = true, form, fieldName, fieldsVal
             onChange={handleChange}
             style={{ width: '100%' }}
             options={nOptions}
+            onPopupScroll={typeof request === 'function' ? handleScroll : null} 
             mode={mode}  >
 
         </OriginalSelect>