index.js
4.13 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
import React from 'react'
import { Input, Select, Form, Button, Checkbox, Radio, DatePicker} from 'antd'
import Utils from '../../utils/utils';
const FormItem = Form.Item;
const Option = Select.Option;
class FilterForm extends React.Component{
handleFilterSubmit = ()=>{
let fieldsValue = this.props.form.getFieldsValue();
this.props.filterSubmit(fieldsValue);
}
reset = ()=>{
this.props.form.resetFields();
}
initFormList = ()=>{
const { getFieldDecorator } = this.props.form;
const formList = this.props.formList;
const formItemList = [];
if (formList && formList.length>0){
formList.forEach((item,i)=>{
let label = item.label;
let field = item.field;
let initialValue = item.initialValue || '';
let placeholder = item.placeholder;
let width = item.width;
if (item.type == '时间查询'){
const begin_time = <FormItem label="订单时间" key={field}>
{
getFieldDecorator('begin_time')(
<DatePicker showTime={true} placeholder={placeholder} format="YYYY-MM-DD HH:mm:ss"/>
)
}
</FormItem>;
formItemList.push(begin_time)
const end_time = <FormItem label="~" colon={false} key={field}>
{
getFieldDecorator('end_time')(
<DatePicker showTime={true} placeholder={placeholder} format="YYYY-MM-DD HH:mm:ss" />
)
}
</FormItem>;
formItemList.push(end_time)
}else if(item.type == 'INPUT'){
const INPUT = <FormItem label={label} key={field}>
{
getFieldDecorator([field],{
initialValue: initialValue
})(
<Input type="text" placeholder={placeholder} />
)
}
</FormItem>;
formItemList.push(INPUT)
} else if (item.type == 'SELECT') {
const SELECT = <FormItem label={label} key={field}>
{
getFieldDecorator([field], {
initialValue: initialValue
})(
<Select
style={{ width: width }}
placeholder={placeholder}
>
{Utils.getOptionList(item.list)}
</Select>
)
}
</FormItem>;
formItemList.push(SELECT)
} else if (item.type == 'CHECKBOX') {
const CHECKBOX = <FormItem label={label} key={field}>
{
getFieldDecorator([field], {
valuePropName: 'checked',
initialValue: initialValue //true | false
})(
<Checkbox>
{label}
</Checkbox>
)
}
</FormItem>;
formItemList.push(CHECKBOX)
}
})
}
return formItemList;
}
render(){
return (
<Form layout="inline">
{ this.initFormList() }
<FormItem>
<Button type="primary" style={{ margin: '0 20px' }} onClick={this.handleFilterSubmit}>查询</Button>
<Button onClick={this.reset}>重置</Button>
</FormItem>
</Form>
);
}
}
export default Form.create({})(FilterForm);