lu-lowcode-package-form 0.10.5 → 0.10.7

package/package.json

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

package/src/App.jsx

@@ -174,61 +174,7 @@ function App() {
 
 
           <FormContainerWrapper cols={cols} className="" ref={formRef} >
-            <Field.WithSingleSelect
-              isRequired={true} ref={testRef}
-              request={async (params) => {
-                return { code: 0, data: { list: [{ label: '选项1', value: '1', tianchong2: { label: '选项2', value: '2'} ,tcinput1: "1111" ,  }, { label: '选项2', value: '2' }, { label: '选项3', value: '3' }] } }
-              }}
-              option_label="label"
-              option_value="value"
-              fillRules={[
-                {
-                  "id": "636d3924-0298-4e9b-809a-26d4a10d7b19",
-                  "type": 0,
-                  "source": "tianchong2",
-                  "target": "tianchong2",
-                  "subRules": [
-                  ]
-                },
-                {
-                  "id": "636d3924-0298-4e9b-809a-26d4a10d7b11",
-                  "type": 0,
-                  "source": "tcinput1",
-                  "target": "tcinput1",
-                  "subRules": [
-                  ]
-                },
-
-              ]} label="测试填充1" __id="tianchong1" />
-              <Field.WithSingleSelect
-                isRequired={true} ref={testRef}
-                request={async (params) => {
-                  return { code: 0, data: { list: [{ label: '选项1', value: '1', }, { label: '选项2', value: '2' ,tcinput1: "8989",tcinput2: "2222" }, { label: '选项3', value: '3' }] } }
-                }}
-                option_label="label"
-                option_value="value"
-                fillRules={[
-                  {
-                    "id": "636d3924-0298-4e9b-809a-16d4a10d7b29",
-                    "type": 0,
-                    "source": "tcinput1",
-                    "target": "tcinput1",
-                    "subRules": [
-                    ]
-                  },
-                  {
-                    "id": "636d3924-0298-4e9b-809a-26d4a10d7b29",
-                    "type": 0,
-                    "source": "tcinput2",
-                    "target": "tcinput2",
-                    "subRules": [
-                    ]
-                  },
-  
-                ]} label="测试填充2" __id="tianchong2" />
-            <Field.Input label="测试被填充1" __id="tcinput1" />
-            <Field.Input label="测试被填充2" __id="tcinput2" />
-
+           
             <Field.UserSelect label="选择用户" __id="userselect" defaultValue={[{ id: 1, username: "十天" }]} />
             <Layout.FormGroupTitle title={"基本信息"} />
             <Field.WithSingleSelect
@@ -286,8 +232,69 @@ function App() {
             <Layout.FormRow layout={'1'}>
             <Field.Number label="测试规则" isRequired={true} __id="ceshi_rule1" />
             </Layout.FormRow>
+           
+
             <Layout.FormRow layout={'1'}>
               <Field.Table label="子表格" __id="table"  >
+                 
+            <Field.WithSingleSelect
+              isRequired={true} ref={testRef}
+              request={async (params) => {
+                return { code: 0, data: { list: [{ label: '选项1', value: '1', tianchong2: { label: '选项2', value: '2'} ,tcinput1: "1111" ,  }, { label: '选项2', value: '2' }, { label: '选项3', value: '3' }] } }
+              }}
+              option_label="label"
+              option_value="value"
+              fillRules={[
+                {
+                  "id": "636d3924-0298-4e9b-809a-26d4a10d7b19",
+                  "type": 0,
+                  "source": "tianchong2",
+                  "target": "tianchong2",
+                  "subRules": [
+                  ]
+                },
+                {
+                  "id": "636d3924-0298-4e9b-809a-26d4a10d7b11",
+                  "type": 0,
+                  "source": "tcinput1",
+                  "target": "tcinput1",
+                  "subRules": [
+                  ]
+                },
+
+              ]} label="测试填充1" __id="tianchong1" />
+              <Field.WithSingleSelect
+                isRequired={true} ref={testRef}
+                request={async (params) => {
+                  console.log("WithSingleSelect params", params)
+                  if (!params?.label) return { code: 0, data: { list:  [{ label: '选项1', value: '1', }] } }
+                  await new Promise(resolve => setTimeout(resolve, 200))
+                  return { code: 0, data: { list: [{ label: '选项1', value: '1', }, { label: '选项2', value: '2' ,tcinput1: "8989",tcinput2: "2222" }, { label: '选项3', value: '3' }] } }
+                }}
+                option_label="label"
+                option_value="value"
+                option_search="label"
+                fillRules={[
+                  {
+                    "id": "636d3924-0298-4e9b-809a-16d4a10d7b29",
+                    "type": 0,
+                    "source": "tcinput1",
+                    "target": "tcinput1",
+                    "subRules": [
+                    ]
+                  },
+                  {
+                    "id": "636d3924-0298-4e9b-809a-26d4a10d7b29",
+                    "type": 0,
+                    "source": "tcinput2",
+                    "target": "tcinput2",
+                    "subRules": [
+                    ]
+                  },
+  
+                ]} label="测试填充2" __id="tianchong2" />
+            <Field.Input label="测试被填充1" __id="tcinput1" />
+            <Field.Input label="测试被填充2" __id="tcinput2" />
                 <Field.Number label="税率（%）" __id="shuilv_table" withIds={[
                   "shuilv"
                 ]}
@@ -547,8 +554,13 @@ function App() {
 
                 ]
               }} />
-            <Field.SingleSelect mode="single" label="测试单选" __id="select1" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.SingleSelect>
+            
+            <Field.SingleSelect mode="single"  option_value={"id"} label="测试单选" __id="select1" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.SingleSelect>
             <Field.MultipleSelect mode="multiple" label="测多选" __id="select2" options={[{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }]}></Field.MultipleSelect>
+            <Field.MultipleSelect mode="multiple"  option_label={"label"} option_value={"value"} label="测多选2"  __id="select2222" request={async (params) => {
+              console.log("MultipleSelect params", params)
+              return { code: 0, data: { list: [{ label: '选项1', value: '1' }, { label: '选项2', value: '2' }] } }
+            }}></Field.MultipleSelect>
             <Field.TreeSelect label="分组名" __id="title11"></Field.TreeSelect>
             <Field.Switch label="开关" __id="switch"></Field.Switch>
             <Layout.FormGroupTitle title={"嘟嘟嘟嘟嘟"} />

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

@@ -11,18 +11,31 @@ const SearchSelect = forwardRef(({ addWrapper = true, form, fieldName, fieldsVal
     const [fetching, setFetching] = useState(false);
     useEffect(() => {
         // console.log("SearchSelect useEffect props", props)
-        // console.log(`SearchSelect ${fieldName} value`, value)
+       console.log(`SearchSelect ${fieldName} value`, value)
         if (value && nOptions.length > 0) {
             let item = nOptions.find(item => item.value == value?.value || item.value == value)
             if (item && !isEqual(item, value)){
                console.log("new value /////",item)
                typeof onChange === 'function' && onChange(item)
             }
+            
+            // 没有找到与value相等的选项，说明该项数据可能尚未加载，此时需要重新加载数据 
+            if (!item) loadSelectOptions()
         }
     },[value])
+    // useEffect(() => {
+    //     initData(requestParams)
+    // }, [requestParams, fieldsValue])
+    
+    // useEffect(() => {
+    //     console.log("SearchSelect useEffect fieldsValue", fieldsValue)
+    //     initData(requestParams)
+    // }, [fieldsValue])
+    
     useEffect(() => {
+        console.log("SearchSelect useEffect requestParams", requestParams)
         initData(requestParams)
-    }, [requestParams, fieldsValue])
+    }, [requestParams])
     // useEffect(() => {
     //     console.log("WithSingleSelect useEffect fieldsValue",fieldsValue)
     //     if(fieldsValue)
@@ -32,6 +45,19 @@ const SearchSelect = forwardRef(({ addWrapper = true, form, fieldName, fieldsVal
     //         onChange(undefined)
     //     }
     // },[fieldsValue])
+
+    const loadSelectOptions = async () => {
+        if (request && option_search){
+            const selectOptions = await fetchOptions({...requestParams, [option_search]:  value?.label})
+            if (selectOptions && selectOptions.length > 0) {
+                let item = selectOptions.find(item => item.value == value?.value || item.value == value)
+                if (item && !isEqual(item, value)){
+                    console.log("new value /////",item)
+                    typeof onChange === 'function' && onChange(item)
+                 }
+            }
+        }
+    }
     const initData = async (params) => {
         let item = null
         const ruleParams = {}

package/src/components/form-container/index.jsx

@@ -503,6 +503,7 @@ const FormContainer = forwardRef(({ cols = 1, children, mode = "view" }, ref) =>
                                         }
                                     }
                                 }
+                                
                                 return result;
                             }}
                         >