feat: 数组容器add模式，支持最大行数限制 (#121)

jd-opensource · Jan 11, 2022 · a13988f · a13988f
1 parent 9b64f38
commit a13988f
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 1 deletion.
diff --git a/packages/drip-form/src/container/ArrayContainer/index.tsx b/packages/drip-form/src/container/ArrayContainer/index.tsx
@@ -36,6 +36,7 @@ type ArrayProps = {
       beforeText: string
       serialLang: 'number' | 'CN'
     }
+    maxAddCount: number
     [propName: string]: unknown
   }
   containerMap: ContainerType
@@ -111,9 +112,15 @@ const ArrayContainer: FC<Props & RenderFnProps & ArrayProps> = ({
       serialLang: 'number',
     },
     showNo,
+    maxAddCount,
   } = uiProp
   // 是否为add加减模式
   const isAdd = useMemo(() => mode === 'add', [mode])
+  // 加减模式，判断是否超过了最大可添加行数
+  const notExceedMaxCount = useMemo(
+    () => maxAddCount === undefined || maxAddCount > fieldData.length,
+    [maxAddCount, fieldData]
+  )
   // 是否是元祖模式
   const isTuple = useMemo(() => ['normal', 'tuple'].includes(mode), [mode])
   const { addItem, deltItem } = useArray({ fieldKey, dispatch, fieldData })
@@ -253,7 +260,7 @@ const ArrayContainer: FC<Props & RenderFnProps & ArrayProps> = ({
             )
           }
         )}
-        {isAdd && (
+        {isAdd && notExceedMaxCount && (
           <div
             className="array-item--add"
             // TODO 非object、array类型是否需要添加默认值，当前undeined

diff --git a/packages/generator/src/fields/container/array.field.ts b/packages/generator/src/fields/container/array.field.ts
@@ -76,6 +76,15 @@ const config: Field = {
           type: 'text',
         },
       },
+      {
+        fieldKey: 'maxAddCount',
+        type: 'number',
+        title: '最大添加行数',
+        ui: {
+          type: 'number',
+          vcontrol: 'return props.formData.ui.mode == "add"',
+        },
+      },
       {
         fieldKey: 'showNo',
         type: 'boolean',