import React from 'react';
import { Table } from 'antd'
import { WeaTable } from 'ecCom'
import { inject, observer } from 'mobx-react';
import EditAgentModal from './editAgentModal'

@inject('salaryFileStore')
@observer
export default class TaxAgentChangeList extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            recordId: '',
            editAgentVisible: false
        }
        this.searchParams = {}
    }

    componentWillMount() {
        const { salaryFileStore: { fetchSingleTaxAgentList }} = this.props;
        this.searchParams = {salaryArchiveId: this.props.id, current: 1}
        fetchSingleTaxAgentList(this.searchParams)
    }

    // 编辑回调
    handleEdit(record) {
        const { salaryFileStore: {setEditAgentVisible} } = this.props;
        this.setState({
            recordId: record.id,
            editAgentVisible: true
        })
    }

    // 获取Columns
    getColumns() {
        const { salaryFileStore: {singleTaxAgentList} } = this.props;
        let columns = []
        if(singleTaxAgentList.columns) {
            columns = [...singleTaxAgentList.columns]
        }
        return columns
    }

    // 页面跳转
    handlePageChange(value) {
        this.searchParams.current = value
        const { salaryFileStore: { fetchSingleTaxAgentList }} = this.props;
        fetchSingleTaxAgentList(this.searchParams)
    }

    render() {
        const { salaryFileStore } = this.props;
        const { singleTaxAgentList } = salaryFileStore
        return (
            <div>
                <WeaTable 
                    dataSource={singleTaxAgentList.list ? singleTaxAgentList.list: []} 
                    columns={this.getColumns()} 
                    pagination={{
                        onChange: (value) => {
this.handlePageChange(value)
},
                        total: singleTaxAgentList.total,
                        showTotal: (total) => `共 ${total} 条`,
                        current: singleTaxAgentList.pageNum
                    }}
                    />
                {
                    this.state.editAgentVisible && <EditAgentModal 
                        currentId={this.props.id}
                        recordId={this.state.recordId}
                        visible={this.state.editAgentVisible}
                        onCancel={() => {
this.setState({editAgentVisible: false})
}}
                    />
                }
            </div>
        )
    }
}