# 公共SearchForm 查询表单组件
## default 组件默认的配置key(唯一标识)

|参数             |类型                 |说明                        |
|---------------  |--------------------|----------------------------|
|name             |string              |查询控件的label              |
|index            |number              |在该表单中的排序             |
|type             |number              |控件类型              |
|id               |string              |表单绑定的key （传给后端的）              |
|rules            |object              |表单的校验              |
|rules.ruleType   |string              |校验类型，function: 为方法校验，可自定义校验方法，接收布尔值; RegExp: 为正则校验|             
|rules. messgae   |string              |校验的提示信息，不传默认显示 控件name + 不符合规则 | 
|rules. ruleName  |string or bumber    |ruleType为function 时ruleName 为自定义方法名,方法从公共方法mathManage.js中引入，ruleType为RegExp 时ruleName 为对应的正则从rule.js配置表中配置，接收number为正则表中的key ；|         
|placeholder      |string              |控件的placeholder |  
|styles           |object              |控件样式 |  
|items            |array               |当控件类型为下拉组件时的选项数据 |  
|formItems        |string              |控件的labelCol wrapperCol 配置，有三个取值，min : 针对 label字节较短 max ：label字节较长 不设置：默认正常 |
|defaultValue     |any                 |控件的默认值 |  
|timeKey          |array               |控件类型type=2即为日期选择控件时，传入两个key的数组，用于格式化日期数据，返回对应的key:value,例如['creatTime','endTime] 返回{creatTime:'2020-6-1 13:51:00',endTime:'2020-12-1 13:51:00'} | 
|config           |object              |控件的属性配置,与antd的控件属性保持一致 |  

用法示例：

组件引入：
    import SearchForm from '../SearchForm';

    // 针对需动态拿组件数据源的组件通过props传入配置
    let priceMtrchants = [
        {
            name: '应用',
            index: 3,
            type: 1,
            id: 'ClientId',
            placeholder:'请选择应用',
            items: MetrchantsList,
        }
    ]

    非动态拿数据源的通过配置表配置
    default:[
        {
            name: 'Username',
            index: 1,
            type: 0,
            id: 'Username',
            placeholder:'',
            styles:{},
            formItems:'max'
        },
    ],

     // 初始化查询表单
    init = (values) => {
        this.setState({ 
            condition: values 
        },() => {
            this.getMerchantsResource() // 查询数据源
        });
    }

    // 查询
    search = () => {
        const { postData,condition } = this.state;
        postData.PageIndex=1
        this.setState({ 
            condition,
            postData 
        },() => {
            this.getMerchantsResource() // 查询数据源
        });
    }

    // 获取表单组件数据
    getFormData=(params)=>{
        this.setState({
          condition: params,
        })
    }

    <SearchForm name="priceMerchants"
        addData={priceMtrchants}
        init={this.init} 
        search={this.search} 
        getFormData={this.getFormData} 
    />