You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
3.6 KiB
JavaScript
105 lines
3.6 KiB
JavaScript
import React from 'react';
|
|
import { Button, Col, Form, Input, Row, Select, Space, DatePicker } from 'antd';
|
|
import { ClearOutlined, SearchOutlined } from '@ant-design/icons';
|
|
import styles from "../SalaryData.less";
|
|
|
|
const { Option } = Select;
|
|
const SalaryDataRenderSimpleForm = (props) => {
|
|
const [form] = Form.useForm();
|
|
const { handleSearch, handleFormReset, params } = props;
|
|
|
|
React.useEffect(() => {
|
|
form.setFieldsValue({
|
|
name: params?.name,
|
|
phone: params?.phone,
|
|
month: params?.month,
|
|
});
|
|
}, [params]);
|
|
|
|
const onFinish = values => {
|
|
const searchParams = {
|
|
...values,
|
|
month: values.month ? values.month.format('YYYY-MM') : undefined,
|
|
};
|
|
handleSearch && handleSearch(searchParams);
|
|
};
|
|
|
|
const myhandleFormReset = () => {
|
|
form.resetFields();
|
|
handleFormReset && handleFormReset();
|
|
};
|
|
|
|
return (
|
|
<div className={styles.searchFormContainer}>
|
|
<Form
|
|
form={form}
|
|
onFinish={onFinish}
|
|
layout="vertical"
|
|
className={styles.searchForm}
|
|
>
|
|
<Row gutter={16}>
|
|
<Col span={6}>
|
|
<Form.Item
|
|
name="name"
|
|
label="姓名"
|
|
>
|
|
<Input
|
|
placeholder="请输入姓名"
|
|
allowClear
|
|
/>
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={6}>
|
|
<Form.Item
|
|
name="phone"
|
|
label="电话"
|
|
>
|
|
<Input
|
|
placeholder="请输入电话"
|
|
allowClear
|
|
/>
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={6}>
|
|
<Form.Item
|
|
name="month"
|
|
label="月份"
|
|
>
|
|
<DatePicker
|
|
placeholder="请选择月份"
|
|
picker="month"
|
|
style={{ width: '100%' }}
|
|
allowClear
|
|
/>
|
|
</Form.Item>
|
|
</Col>
|
|
<Col span={6}>
|
|
<Form.Item label=" " colon={false}>
|
|
<Space size="middle">
|
|
<Button
|
|
type="primary"
|
|
htmlType="submit"
|
|
icon={<SearchOutlined />}
|
|
className={styles.searchButton}
|
|
>
|
|
查询
|
|
</Button>
|
|
<Button
|
|
onClick={myhandleFormReset}
|
|
icon={<ClearOutlined />}
|
|
className={styles.resetButton}
|
|
>
|
|
重置
|
|
</Button>
|
|
</Space>
|
|
</Form.Item>
|
|
</Col>
|
|
</Row>
|
|
</Form>
|
|
</div>
|
|
);
|
|
|
|
};
|
|
|
|
export default SalaryDataRenderSimpleForm;
|