import React from 'react';
import { connect } from 'dva';
import { Button, Popconfirm, InputNumber, Row, Col, Form, Input, Table, DatePicker, Select, Upload, Icon } from 'antd';
import { message } from 'antd/lib/index';
import XLSX from 'xlsx';
import ReactToPrint from "react-to-print";

import {
    initQueryFilter, extendRule,
    initFilter,
    setDataFieldValue,
    guid,
    extendInclude
} from '../../../utils/common';
import config from "../../../config";
import moment from 'moment'


class LR007Edit extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: {
            },
        }
    }
    componentDidMount() {
        const json = initFilter(this.props.login.OrgId);
        extendInclude(json, 'Nav_IntegrateDetail.Nav_Law')
        extendInclude(json, 'Nav_IntegrateDetail.Nav_SCSystem')
        this.props.dispatch({
            type: 'app/getDataByPost',
            url: 'LR/LRLawIntegrate/Get',
            payload: json,
            onComplete: (ret) => {
                if (ret) {
                    this.setState({ data: ret })
                }
            }
        })
    }

    onTableBtnExport() {
        let TableWrap = document.getElementById('tableId' + this.state.data.ID);
        let Table = TableWrap.getElementsByTagName('table')[0];
        const wb = XLSX.utils.table_to_book(Table);
        XLSX.writeFile(wb, "法律法规融入表.xlsx")
    }


    render() {
        const { form, dispatch, data } = this.props;
        const { getFieldValue, getFieldDecorator, validateFields, validateFieldsAndScroll, setFieldsValue } = form;
        const tableColumns = [
            {
                title: '法律法规名称', dataIndex: 'Nav_Law.NAME', key: 'Nav_Law.NAME', width: 100,
                render: (t, r) => {
                    return <Input value={t} key={'VERSION' + r.ID} disabled></Input>
                }
            },
            {
                title: '版本号', dataIndex: 'Nav_Law.VERSION_NUM', key: 'Nav_Law.VERSION_NUM', width: 100,
                render: (t, r) => {
                    return <Input value={t} key={'Nav_Law.VERSION_NUM' + r.ID} disabled></Input>
                }
            },
            {
                title: '企业规章制度', dataIndex: 'Nav_SCSystem.NAME', key: 'Nav_SCSystem.NAME', width: 100,
                render: (t, r) => {
                    return <Input disabled value={t} key={'Nav_SCSystem.NAME' + r.ID}></Input>
                }
            },
        ]

        return <>
            <Form>
                <div>
                    <ReactToPrint
                        trigger={() => <Button type={'primary'} icon={'printer'} >打印</Button>}
                        content={() => this.componentRef}
                    />
                    <Button style={{ marginLeft: '8px' }} onClick={() => this.onTableBtnExport()} icon="export" >导出</Button>
                </div>
                <div ref={el => (this.componentRef = el)} style={{ padding: '15px' }} id={'tableId' + this.state.data.ID}>
                    <Row>
                        <Col span={12}>
                            <Form.Item label="年份" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
                                {getFieldDecorator('CODE', {
                                    validateTrigger: 'onBlur',
                                    initialValue: this.state.data.YEAR,
                                    rules: [{ required: true, message: '请输入文件编号' }],
                                })(<Input placeholder={'年份'} disabled />)}
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="融入比例" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
                                {getFieldDecorator('RATE', {
                                    validateTrigger: 'onBlur',
                                    initialValue: this.state.data.RATE,
                                    rules: [{ required: false, message: '请输入融入比例' }],
                                })(<Input placeholder={'融入比例'} disabled />)}
                            </Form.Item>
                        </Col>
                    </Row>
                </div>
                <Table
                    pagination={false}
                    dataSource={this.state.data.Nav_IntegrateDetail ? this.state.data.Nav_IntegrateDetail : []}
                    bordered
                    columns={tableColumns} ></Table>
            </Form>
        </>
    }
}

export default connect(({ login, loading, app }) => ({ login, loading, app }))(Form.create()(LR007Edit));