forked from huge/frontEnd/hugeOA

Mr Ke
2020-05-29 a4f102defd2c7918617717f3307b6a3ef63859ff
src/components/common/SearchFormView/index.jsx
@@ -9,7 +9,7 @@
import { Row, Col, Form, Input, Button, Select, DatePicker, Divider, Card } from 'antd';
import moment from 'moment';
const { RangePicker } = DatePicker;
const { RangePicker, MonthPicker } = DatePicker;
import './index.scss';
// data参数:数据模板
@@ -106,8 +106,16 @@
        });
    };
    //月份选择器
    monthPickerChange = (name, m, d) => {
        this.props.setFormData({
            ...this.props.formData,
            [name]: d
        })
    }
    render() {
        const { formData = {}, data = [], children } = this.props;
        const { formData = {}, data = [], children, width = "25%", showReset = true } = this.props;
        let size = 'default';
        return (
@@ -117,7 +125,7 @@
                        {data.length > 0 &&
                            data.map((item, idx) => (
                                <Card.Grid key={idx} style={{ width: '20%' }} hoverable={false} >
                                <Card.Grid key={idx} style={{ width }} hoverable={false} >
                                    {(() => {
                                        switch (item.type) {
                                            case 'select':
@@ -128,13 +136,13 @@
                                                            style={{ width: '100%' }}
                                                            placeholder={item.name}
                                                            value={formData[item.key]}
                                                            allowClear
                                                            // allowClear
                                                            onChange={this.handleSelectChange(item.key)}>
                                                            {item.list &&
                                                                item.list.map(item => (
                                                                    <Select.Option
                                                                        value={item.id}
                                                                        key={item.id}>
                                                                        value={item.value}
                                                                        key={item.value}>
                                                                        {item.name}
                                                                    </Select.Option>
                                                                ))}
@@ -171,7 +179,7 @@
                                                return (
                                                    <Form.Item label={item.label}>
                                                        <RangePicker
                                                            style={{ width: '100%'}}
                                                            style={{ width: '100%' }}
                                                            size={size}
                                                            ranges={{
                                                                Today: [moment(), moment()],
@@ -201,6 +209,22 @@
                                                        />
                                                    </Form.Item>
                                                );
                                            case 'monthPicker':
                                                return (
                                                    <Form.Item label={item.label}>
                                                        <MonthPicker
                                                            style={{ width: '100%' }}
                                                            size={size}
                                                            placeholder={item.name}
                                                            onChange={(date, dateString) => {
                                                                console.log(date, dateString);
                                                                this.monthPickerChange(item.key, date, dateString);
                                                            }}
                                                            value={formData[item.key] ? moment(formData[item.key], 'YYYY-MM') : undefined}
                                                        />
                                                    </Form.Item>
                                                )
                                            // case 'br':
                                            //     return (
                                            //         <Col span={24} style={{ marginBottom: '10px' }} />
@@ -211,7 +235,7 @@
                                    })()}
                                </Card.Grid>
                            ))}
                        <Card.Grid style={{ width: '20%' }}>
                        <Card.Grid style={{ width }}>
                            <Row type="flex" gutter={20} align="middle" align="middle" style={{ height: 40 }}>
                                <Col>
                                    <Button
@@ -223,15 +247,18 @@
                                        查询
                                </Button>
                                </Col>
                                <Col>
                                    <Button
                                        size={size}
                                        onClick={() => {
                                            this.onClick('reset');
                                        }}>
                                        重置
                                </Button>
                                </Col>
                                {
                                    showReset ?
                                        <Col>
                                            <Button
                                                size={size}
                                                onClick={() => {
                                                    this.onClick('reset');
                                                }}>
                                                重置
                                            </Button>
                                        </Col> : null
                                }
                                {
                                    children &&
                                    <Col>