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
import React from 'react';
import { Button, Col, Form, Input, Row, DatePicker } from 'antd';
const FormItem = Form.Item;
/**
* table 查询
*
* @type {React.ComponentClass<RcBaseFormProps & Omit<FormComponentProps, keyof FormComponentProps>>}
*/
const TableSearch = Form.create()(props => {
const { handleSearch } = props;
const { getFieldDecorator, validateFields, form } = props.form;
function onSubmit(e) {
e.preventDefault();
validateFields((err, fields) => {
const buildTime = (fieldValue, key) => {
const res = {};
if (fieldValue && fieldValue.length >= 2) {
const keySuffix = key.substring(0, 1).toUpperCase() + key.substring(1);
res[`start${keySuffix}`] = fieldValue[0].format('YYYY-MM-DD HH:mm:ss');
res[`end${keySuffix}`] = fieldValue[1].format('YYYY-MM-DD HH:mm:ss');
}
return res;
};
const timeFields = ['createTime'];
const buildSearchParams = fields2 => {
let res = {};
Object.keys(fields).map(objectKey => {
const fieldValue = fields2[objectKey];
if (timeFields.indexOf(objectKey) !== -1) {
// 处理时间
res = {
...res,
...buildTime(fieldValue, objectKey),
};
} else if (fieldValue !== undefined) {
res[objectKey] = fieldValue;
}
return true;
});
return res;
};
const searchParams = buildSearchParams(fields);
if (handleSearch) {
handleSearch(searchParams);
}
});
}
function handleFormReset() {
form.resetFields();
}
return (
<Form onSubmit={onSubmit} layout="inline">
<Row gutter={{ md: 8, lg: 24, xl: 48 }}>
<Col md={8} sm={24}>
<FormItem label="订单ID">
{getFieldDecorator('id')(<Input placeholder="请输入订单ID" />)}
</FormItem>
</Col>
<Col md={8} sm={24}>
<FormItem label="订单号">
{getFieldDecorator('orderNo')(<Input placeholder="请输入订单号" />)}
</FormItem>
</Col>
<Col md={8} sm={24}>
<FormItem label="服务号">
{getFieldDecorator('serviceNumber')(<Input placeholder="请输入服务号" />)}
</FormItem>
</Col>
</Row>
<Row gutter={{ md: 8, lg: 24, xl: 48 }}>
<Col md={8} sm={24}>
<FormItem label="创建时间">
{getFieldDecorator('createTime')(<DatePicker.RangePicker />)}
</FormItem>
</Col>
<Col md={8} sm={24}>
<span>
<Button type="primary" htmlType="submit">
查询
</Button>
<Button style={{ marginLeft: 8 }} onClick={handleFormReset}>
重置
</Button>
</span>
</Col>
</Row>
</Form>
);
});
export default TableSearch;