import React from 'react';
import { Drawer, message, Modal } from 'kts-xui';
import { Space, Upload } from 'kts-components-antd-x4';
import agent from '../../Server';
import {
    CloudDownloadOutlined,
    CloudUploadOutlined
} from '@ant-design/icons';
import DigitalAssets from '..';
interface IProps {
    onClose: () => void;
    onSuccess?: () => void;
    data: {
        url: string,
        downloadurl: string,
    }
    type: number;
}
export default class Component extends React.Component<IProps, any>{
    private list: any[] = [];
    constructor(props: any) {
        super(props);
        this.state = {
            downloadUrl: '',
            data: this.props.data,
            excel: true,
            errorModal: false,
            errorInfo: '',
            downloadFilePath: '',
            fileList: [],
            uploadConfig: DigitalAssets.remoteConfig,
        };
        console.log(DigitalAssets.remoteConfig);
    }
    handleCancel = () => {
        this.setState({
            errorModal: false
        });
    }
    handleOk = () => {
        if (this.state.downloadFilePath.indexOf('http') >= 0 || this.state.downloadFilePath.indexOf('//') === 0) {
            window.open(this.state.downloadFilePath);
        } else {
            window.open(this.state.uploadConfig.domain + this.state.downloadFilePath);
        }
    }
    onChange = (info: any) => {
        const status = info.file.status;
        let fileList = info.fileList;
        this.setState({ fileList });
        if (status === 'done') {
            const returnCode = info.file.response.status.returnCode;
            if (returnCode === '99999') {
                message.warning('系统异常');
            } else {
                if (info.file.response.ok) {
                    if (info.file.response.body.allSuccess) {
                        //message.success('上传成功！');
                    } else {
                        let downloadFilePath = info.file.response.body.downloadFilePath;
                        if (downloadFilePath && downloadFilePath.indexOf('http') < 0) {
                            downloadFilePath = `/zone/invoice/biz-logging/downloadFile?filepath=${downloadFilePath}`;
                        }
                        const errorCount = info.file.response.body.errorCount;
                        const successCount = info.file.response.body.successCount;
                        let errorText = `录入成功${successCount} 条,失败${errorCount} 条!`;
                        this.setState({
                            excel: false,
                            errorModal: !!errorCount,
                            errorInfo: errorText,
                            downloadFilePath: downloadFilePath
                        });
                        if (!!errorCount === false) {
                            message.success('上传成功！');
                        }
                    }
                    this.props.onSuccess!();
                } else {
                    message.error(info.file.response.status.description);
                }

            }
        } else if (status === 'error') {
            message.error(`${info.file.name} 文件上传失败.`);
        }
    }
    render() {
        let { domain } = this.state.uploadConfig;
        const propsData = this.state.data;
        const url = domain + propsData.url;
        let downloadUrl = '';
        if (propsData.downloadurl.indexOf('http') >= 0 || propsData.downloadurl.indexOf('//') === 0) {
            downloadUrl = propsData.downloadurl;
        } else {
            downloadUrl = domain + propsData.downloadurl;
        }
        const headers = {
            Authorization: this.state.uploadConfig.token!
        };
        const props = {
            name: 'file',
            multiple: false,
            action: url,
            fileList: this.state.fileList,
            headers: headers,
            onChange: this.onChange,

        };
        return (
            <Drawer
                title="Excel上传"
                visible={true}
                onClose={this.props.onClose}
            >
                <div style={{ display: 'flex', justifyContent: 'space-evenly' }}>
                    <div>
                        <a href={downloadUrl} target="_blank" style={{ color: 'inherit' }}><CloudDownloadOutlined style={{ width: '100%', fontSize: 54 }} />
                            <h3>Excel 模板下载</h3>
                        </a>
                    </div>
                    <div style={{ textAlign: 'center' }}>
                        <a style={{ color: 'inherit' }}>
                            <Upload {...props}>
                                <CloudUploadOutlined style={{ width: '100%', fontSize: 54, }} />
                            </Upload>
                            <h3>Excel 上传</h3>
                        </a>
                    </div>
                </div>
                <Modal
                    title={'提示'}
                    okText={'下载'}
                    visible={this.state.errorModal}
                    onCancel={this.handleCancel}
                    onOk={this.handleOk}
                >
                    {this.state.errorInfo} 点击下载按钮下载失败记录。
                </Modal>
            </Drawer>
        )
    }
}