import { message } from "antd/lib/index";
import { Button, Popconfirm, Row, Col, Form, Input, Select, Table } from 'antd';
import React from 'react';
import { initFilter, extendRule, extendInclude, setDataFieldValue, guid, initQueryFilter } from "../../../utils/common";
import ReactToPrint from "react-to-print";
import styles from  '../../CustomPages/HI/StepForm.css';
import WFViewComponent from '../../Lib/WFViewComponent'
import XLSX from 'xlsx';
import { connect } from 'dva';
import moment from 'moment';
import config from "../../../config";

const Option = Select.Option;
class OG025Summary extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: null,
            BtnAgreeDisplay: 'none',
            assessUser: '',
            allYear: [],
            selectYear: 2020
        };
    };

    componentDidMount() {
        this.loadData();
        var tmp = []
        for (let index = 1999; index < 3000; index++) {
            tmp.push({
                ID: index,
                NAME: index
            })
        }
        this.setState({ 
            allYear: tmp
         })
    }
    loadData = (year) => {
        let json = initFilter(this.props.login.OrgId);
        let currentYear = new Date().getFullYear()
        json['Parameter1']=year || currentYear;
        this.props.dispatch({
            type: 'app/getDataByPost',
            payload: json,
            url: 'OG/EventReport/GetCurrentYearEvent',
            onComplete: (ret) => {
                if (ret) {             
                    this.setState({ 
                        data: ret
                     })
                }
            }
        });
    }
    getRate(){
        let ret = 0
        if(this.state.data && this.state.data.PROCESSED_EVENTS && this.state.data.TOTAL_EVENTS){
            ret = this.state.data.PROCESSED_EVENTS / this.state.data.TOTAL_EVENTS * 100 + '%'
        }
        return ret
    }
    render() {
        const { data } = this.state;
        return <div>
            <div style={{ padding: '10px', textAlign: 'center'}}>
                年&nbsp;&nbsp;&nbsp;&nbsp;度：
                <Select value={this.state.selectYear} style={{ width: '40%' }}
                    onChange={selVlue => {
                        this.setState({ selectYear: selVlue })
                        this.loadData(selVlue)
                }}>
                {
                    this.state.allYear ? this.state.allYear.map((d, idx) => {
                    return <Option key={d.ID} value={d.ID} label={d.NAME}>
                        {d.NAME}
                    </Option>
                    }) : ''
                }
                </Select>
            </div>
            <div style={{ padding: '10px', textAlign: 'center'}}>
                已处理份数：<Input value={data ? data.PROCESSED_EVENTS : 0} style={{ width: '40%'}}/>
            </div>
            <div style={{ padding: '10px', textAlign: 'center'}}>
                上报总份数：<Input value={data ? data.TOTAL_EVENTS : 0} style={{ width: '40%'}}/>
            </div>
            <div style={{ padding: '10px', textAlign: 'center'}}>
                处理比例：<Input value={this.getRate()}  style={{ width: '40%'}}/>
            </div>            
        </div>
    }

}

export default connect(({ login, app }) => ({ login, app }))(OG025Summary) 