import React from 'react';
import { Table, Drawer, Button, Pagination } from 'kts-xui';
import { KtsForm, AdvancedSearch } from 'kts-components';
import { taskStatusEnum, findLabel } from '../../../CommonComponents/FiledsEnum';
import agent from '../../../Server';
interface IProps {
    onClose: () => void;
    importInvoice: (list) => void;
    taskUuid: string;
}
export default class SellerImport extends React.Component<IProps, any> {
    columns = [
        {
            title: '任务单号',
            dataIndex: 'taskNo',
            ellipsis: true,
            width: 160,

        }, {
            title: '采集方',
            dataIndex: 'verifiedParty',
            ellipsis: true,
            width: 200,
        }, {
            title: '任务状态',
            width: 110,
            dataIndex: 'status',
            render: text => {
                return findLabel(text, taskStatusEnum)
            }
        }, {
            title: '关联单据',
            dataIndex: 'originalDocList',
            width: 120,
            ellipsis: true,
            render: (text) => {
                if (text && text.length > 0) {
                    let originalDocuments = text.reduce((acc, obj) => {
                        acc.push(obj.originalDocument);
                        return acc;
                    }, [])
                    let str = originalDocuments.join('/');
                    return str
                }
            }
        }, {
            title: '创建人',
            dataIndex: 'creator',
            width: 100,
            ellipsis: true,
        }, {
            title: '备注',
            width: 140,
            dataIndex: 'remark',
            ellipsis: true,
        },
    ];
    constructor(props) {
        super(props);
        this.state = {
            selectedRowKeys: [],
            pageMeta: {
                pageNum: 1,
                pageSize: 10,
                pages: 0,
                total: 0,
            },
            list: [

            ],
        }
    }
    onSubmitSchema = (value) => {
        console.log(value);
    }
    componentDidMount() {
        const params = {
            pageNum: 1,
            pageSize: 10
        };
        this.getData(params);
    }
    getData = async (params) => {
        params = {
            ...params,
            taskUuid: this.props.taskUuid
        }
        const res: any = await agent.post('/collector/task/getRelationTask', params, this);
        if (res.er) {
            return;
        } else if (res.res) {
            this.setState({
                // pageMeta: res.res.pageMeta,
                list: res.res
            });
        }
    }
    /**
     * 导入发票
     */
    onImport = () => {
        const { selectedRowKeys } = this.state;
        this.props.importInvoice(selectedRowKeys);
    }
    onPageChange = (pageNum, pageSize) => {
        this.setState({
            pageMeta: {
                ...this.state.pageMeta,
                pageNum,
                pageSize
            }
        }, () => {
            this.onRefresh();
        });
    }
    onRefresh = () => {
        const params = {
            ...this.state.params,
            ...this.state.pageMeta,
        };
        this.getData(params);
    }
    onSearch = (data = {}) => {
        this.setState({
            params: data,

        });
        const params = {
            ...data,
            ...this.state.pageMeta,
            pageNum: 1,
            pageSize: 10
        };
        this.getData(params);
    }
    topExpand = () => {
        return (
            <AdvancedSearch
                width={480}
                height={44}
                compact={true}
                defaultKey="taskNo"
                placeholder="请输入任务单号"
                searchFormSubmit={this.onSearch}
            >
                <KtsForm
                    labelCol={9}
                    wrapperCol={15}
                    labelAlign="left"
                    compact={true}
                    schema={{
                        type: 'object',
                        properties: {
                            taskNo: {
                                type: 'string',
                                title: '任务单号',
                            },
                            creator: {
                                type: 'string',
                                title: '创建人',
                            },
                            remark: {
                                type: 'string',
                                title: '备注',
                            },
                        },
                    }}
                >
                </KtsForm>
            </AdvancedSearch>
        );
    }
    onClose = () => {
        this.props.onClose();
    }
    render() {
        const dataSource = this.state.list;
        const { selectedRowKeys } = this.state;
        const rowSelection = {
            onChange: (selectedRowKeys) => {
                this.setState({
                    selectedRowKeys
                });
            },
            getCheckboxProps: (record: any) => ({
                disabled: record.status!==3,
            }),
            selectedRowKeys
        }
        return (
            <Drawer
                title='关联核验任务'
                onClose={this.props.onClose}
                visible={true}
                width={1000}
                footer={<div
                    style={{
                        textAlign: 'right',
                    }}
                >
                    <Button onClick={this.onClose} style={{ marginRight: 8 }}>
                        取消
                    </Button>
                    <Button onClick={this.onImport} type="primary">
                        导入
                    </Button>
                </div>}
            >
                {/* <div style={{ marginBottom: 10 }}>{this.topExpand()}</div> */}
                <Table
                    rowSelection={rowSelection}
                    dataSource={dataSource}
                    columns={this.columns}
                    pagination={false}
                    rowKey="taskUuid"
                >
                </Table>
                {/* <Pagination onChange={this.onPageChange} showTotal={(total, range) => `第 ${range[0]}-${range[1]} 条,  共有 ${total} 条`} style={{ padding: '16px 0', flex: 'none', background: 'white', textAlign: 'center' }} total={pageMeta.total} pageSize={pageMeta.pageSize} current={pageMeta.pageNum} showSizeChanger={true} /> */}
            </Drawer>
        );
    }
}