/*
 * Creator:     gjg
 * CreatDate:   2022-05-18
 * descripts：  查询基础数据修改日志
*/
import React from 'react';
import { Form, Row, Col, Select, Button, Table,  Input } from 'antd';
import { $http } from '../../containers/config/https';
import RangeDatePicker from 'components/rangePicker/index';
import CommonPagination from 'components/pagination';
import store from 'store';

const { Option } = Select;
const {TextArea} = Input;
const formLayout = {
    labelCol: { span: 7 },
    wrapperCol: { span: 14 },
}
const formLayoutDoc = {
    labelCol: { span: 7 },
    wrapperCol: { span: 17 },
}

const searchColConfig = {
    xs: { span: 24 },
    sm: { span: 12 },
    md: { span: 10 },
    lg: { span: 6}
  }
const BaseDataModifyLog = Form.create()(
    class BaseDataModifyLog extends React.Component {
        constructor(props) {
            super(props);
            let userData = JSON.parse(sessionStorage.getItem('userData'))
            this.state={
                userData:userData,
                tableData: [],
                total: 0,
                page: 1,
                pageSize: 20,
                size: "small",
                startDate: undefined,
                endDate:undefined,
            }
        }

        componentDidMount() {
            document.querySelector('.ant-table-body').style.height = store.getState().tableHeight.y + 60 + 'px';
            this.getTableColumns()
            this.handleQuery()
        }

        // 获取主列表columns
        getTableColumns = () => {
            let { language } = this.state;
            let data = {
                params: [{
                    compontName: "BaseDataModifyLog", 
                    type: 'C', 
                }]
            }
            $http.post('urlS', this, {
                code: '01040073',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let arr = res.result && res.result.C.length > 0 ? res.result.C:'';
                        let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                        console.log("filterArr",filterArr)
                        this.setState({ columns: filterArr, widthTotal: res.totalWidth })
                    }
                }
            })
        }

        startChange(date) {
            this.setState({
                startDate: date,
            })
        }
        endChange(date) {
            this.setState({
                endDate: date,
            })
        }
        onChange = (e) => {
            this.setState({ page: e, pageSize: this.state.pageSize, }, () => {
                // 重新调用查询方法
                let { values } = this.state;
                this.getFindData(values);
            })
        }
        onShowSizeChange = (page, pageSize) => {
            this.setState({ page: 1, pageSize: pageSize }, () => {
                // 重新调用查询方法
                let { values } = this.state;
                this.getFindData(values, "search");
            })
        }
        showTotal(total) {
            return `共 ${total} 条`;
        }
        // 点击查询
        handleQuery = () => {
            this.props.form.validateFields((err, values) => {
                if (!err) {
                    this.setState({
                        values,
                    }, () => {
                        this.onShowSizeChange("1", this.state.pageSize)
                    })
                }
            })
        }
        //获取查询数据
        getFindData = (values, e) => {
            if (this.state.total == 0) {
                this.setState({
                    searchLoading: true
                })
            }
            let { page, pageSize, } = this.state;
            let data = {}
            data = {
                params: [{
                    startDate: this.state.startDate,
                    endDate: this.state.endDate
                }],
                pagination: [{
                    pageSize: pageSize,
                    currentPage: page,
                }]
            }
            $http.post('urlS', this, {
                code: '01040259',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        this.setState({
                            searchLoading: false,
                            rowId: "",
                            search: e
                        })
                        this.setState({
                            tableData: res.result.rows, 
                            total: res.result.total,
                        })
                    }
                },
            })
        }

        render() {
            let columns=this.state.columns
            let tableData=this.state.tableData
            return(
                <div >
                <Form>
                    <Row  style={{ margin: "0", padding: "14px 0 0 1px" }}>
                        <Col {...searchColConfig} style={{ padding: "4px 14px" }}>  
                            <RangeDatePicker isChange={true} label={  '修改日期：' } format='YYYY-MM-DD' width={'300px'}
                                locale={this.state.userData.language}
                                startDate={this.state.startDate} endDate={this.state.endDate}
                                startChange={this.startChange.bind(this)} endChange={this.endChange.bind(this)}  />
                        </Col>
                        <Col span={4}>
                            <Button style={{ margin: '3px 0 0 10px' }} type="primary" onClick={this.handleQuery}>{'查询'}</Button>
                        </Col>
                    </Row>
                    <div style={{ widht: '100%', height: '1px', background: '#f0f2f5' }}></div>
                    <div>
                        <Table
                                columns={columns}
                                dataSource={tableData}
                                pagination={false}
                                bordered
                                style={{ height: store.getState().tableHeight.y + 60 + 'px', overflow: "auto" }}
                            />
                            <CommonPagination size={this.state.size} pageSize={this.state.pageSize} current={this.state.page} total={this.state.total} search={this.state.search}
                                onShowSizeChange={this.onShowSizeChange.bind(this)} complete={true} dataSource={this.state.tableData}
                                    onChange={this.onChange.bind(this)} />
                    </div>
                </Form>
            </div>
            )
        }
    }
)

export default BaseDataModifyLog    