import React from 'react'
import { WeaHelpfulTip, WeaDatePicker, WeaInput } from 'ecCom';
import { Modal, Row, Col, Button } from 'antd'
import { inject, observer } from 'mobx-react';

@inject('declareStore')
@observer
export default class GenerateModal extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            date: ""
        }
    }

    // 生成申报表
    handleGenerate() {
        const { declareStore: { saveDeclare }} = this.props;
        saveDeclare(this.state.date).then(() => {
            this.props.onGenerate()
        })
    }

    render() {
        return (
            <Modal visible={this.props.visible} onCancel={() => this.props.onCancel()} width={800}
            footer={
                <Button type="primary" onClick={() => {this.handleGenerate()}}>生成申报表</Button>
            }>
                <div style={{height: "47px", lineHeight: "47px", borderBottom: "1px solid #eee"}}>
                    <span style={{fontSize: "14px", marginLeft: "20px"}}>申报</span>
                    <WeaHelpfulTip
                        style={{float: "right", marginRight: "40px"}}   
                        width={200}
                        title="提示：一个薪资所属月下一个个税扣缴义务人的所有核算数据都归档后才可以申报"
                        placement="topLeft"
                    />
                </div>
                <div style={{marginTop: '10px', padding: "20px"}}>
                    <Row style={{lineHeight: "40px"}}>
                        <Col span={8} >薪资所属月</Col>
                        <Col span={16}>
                            <WeaDatePicker
                                style={{width: "200px"}}
                                format="yyyy-MM"
                                value={this.state.date}
                                onChange={value => this.setState({date: value})}
                            />
                            </Col>
                    </Row>
                </div>
            </Modal>
        )
    }
}