# Form
根据配置数据生成Form

## props

### Form

| 参数 | 说明 | 类型 | 默认值 |
| :-----| :---- | :---- | :---- |
| groupNumber | 每行分组数量 | number | 1
| formItems | formItem配置 | FormItem[] |

#### FormItem

> 更多参数配置，参考antd formItem配置

| 参数 | 说明 | 类型 | 默认值 |
| :-----| :---- | :---- | :---- |
| type | 类型 | FormItemTypes | input
| ghost | 是否隐藏 | string boolean |
| required | 是否必填 | string boolean |
| options | 组件配置项，具体字段参考对应组件的配置 | object

#### FormItemTypes
| 属性 | 值 | 说明 | 配置项 |
| :-----| :---- | :---- | :---- | 
| INPUT | input | 输入框 | [查看](https://ant.design/components/input-cn/#header)
| SWITCH | switch | 切换 | [查看](https://ant.design/components/switch-cn/#header)
| SELECT | select | 下拉框 |  参考Select api
| NUMBER | number | 数字输入框 | 参考Number api
| DATE_PICKER | datePicker | 日期选择 | [查看](https://ant.design/components/date-picker-cn/#header)
| RANGE_PICKER | rangePicker | 日期范围选择 | [查看](https://ant.design/components/date-picker-cn/#header)
| CHECKBOX_GROUP | checkboxGroup | 多选 | [查看](https://ant.design/components/checkbox-cn/#header)

### Number
> 基于antd input-number封装，支持金额格式化、整数限制。更多API 请参考antd InputNumber

| 参数 | 说明 | 类型 | 默认值 |
| :-----| :---- | :---- | :---- |
| isAmount? | 金额format | boolean |
| isInteger? | 整数限制，为true时只允许输入整数 | boolean |

### Select
> 基于antd select封装，支持传入url获取数据。更多API 请参考antd Select

| 参数 | 说明 | 类型 | 默认值 |
| :-----| :---- | :---- | :---- |
| url | 获取数据url | string |
| fieldNames | label value显示的字段 | { label: string; value: string } | { label: 'label', value: 'value' }
| cacheKey? | 缓存key，需全局唯一，只获取一次数据 | boolean | false
| query? | 查询参数 | object
| extra? | 客户扩展数据，被form嵌套下参数才生效 | string[]
| waitQuery? | 等待query参数完整，请求数据（未实现） | (query: string \| object): boolean
| autoSelected? | 为true时当value为空时默认选中第1个 | boolean

### ModalTableInput
> 基于ModalTable封装适用form的input

| 参数 | 说明 | 类型 | 默认值 |
| :-----| :---- | :---- | :---- |
| modalTable | modalTable配置，参考ModalTable组件 | ModalTableProps |

## 示例

### formItems配置项示例
```js
const formItems = [
  {
    name: 'uNm'
  },
  {
    name: 'age',
    type: FormItemTypes.NUMBER,
    required: '!!${uNm}', // 根据uNm 控制是否必填
    options: { // options 组件配置项
      isInteger: true
    }
  },
  {
    name: 'child',
    type: FormItemTypes.SELECT,
    options: {
      url: '/api/getUsers',
      query: '{"where":{"partner":${uNm}}}', // 基于其他字段动态生成query
      extra: ['sex','cunm=childName'] // 扩展出sex，childName并重命为cunm
    }
  }
]
```