<template>
    <div>
        <a-modal title="试题导入" :visible="visible" @ok="handleOk" :confirmLoading="confirmLoading" @cancel="handleCancel"
            width="700px" :maskClosable="false" :width="900">
            <template slot="footer">
                <a-button key="back" @click="handleCancel">
                    取消
                </a-button>
                <a-button :loading="loading" key="submit" type="primary" @click="sureUpload">
                    上传
                </a-button>
                <!-- <a-button key="submit" type="primary" @click="handleOk">
                    查看上传列表
                </a-button> -->
            </template>
            <div class="modal-box">
                <a-spin :spinning="spinning">
                    <a-upload-dragger v-if="visible" name="formFile" :multiple="true" :showUploadList="false"
                        :action="TIP+'/api/services/File/File/Upload?md5='+md5"
                        accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,.txt"
                        @change="handleChange" :beforeUpload="beforeUpload">
                        <p class="ant-upload-drag-icon">
                            <a-icon type="inbox" />
                        </p>
                        <p class="ant-upload-text">点击或将文件拖拽到这里上传</p>
                        <p class="ant-upload-hint">
                            支持扩展名：.doc .docx .txt...
                        </p>
                    </a-upload-dragger>
                </a-spin>
                <p style="margin-top:16px">已选文件：{{fileData.name||'无'}}</p>
            </div>
        </a-modal>
    </div>
</template>
<script>
    import { getFileMD5, getFileID } from '@/utils/tools'
    import { QuestionResolve } from '@/api/api'
    export default {
        components: {
        },
        data() {
            return {
                loading: false,
                spinning: false,
                md5: '',
                TIP: process.env.VUE_APP_BaseTIP,
                confirmLoading: false,
                visible: false,
                form: this.$form.createForm(this),
                type: '',
                detail: '',
                fileData: {},
            };
        },
        mounted() {

        },
        methods: {
            showModal(type) {
                console.log(type, 'type')
                this.visible = true;
                this.type = type;
            },
            beforeUpload(file, fileList) {
                console.log(file, 'file')
                console.log(fileList, 'fileList')
                this.fileData = file;
                return false;
                return new Promise((resolve, reject) => {
                    getFileMD5(file, md5 => {
                        console.log(md5, 'md5')
                        this.md5 = md5;
                        return resolve(true)
                    })
                })
            },
            handleChange(info) {
                const status = info.file.status;
                if (status !== 'uploading') {
                    console.log(info.file, info.fileList);
                }
                if (status === 'done') {
                    // this.$message.success(`${info.file.name} file uploaded successfully.`);
                    console.log(info, 'info')
                    let type = null,
                        typeID = '';
                    if (this.$parent.ChapterId) {
                        type = 0;
                        typeID = this.$parent.ChapterId
                    }
                    if (this.$parent.KnowledgePointIdList.length > 0) {
                        type = 1;
                        typeID = this.$parent.KnowledgePointIdList[0]
                    }
                    let data = {
                        fileId: info.file.response.result,
                        disciplineId: this.$parent.activeSubject.id,//学科id
                        targetId: typeID,//目标文件
                        targetType: type//类型
                    }
                    console.log(data, 'params')
                    this.spinning = true;
                    QuestionResolve(data).then(res => {
                        this.$message.success('上传成功！')
                        this.spinning = false;
                        this.$router.push({
                            name: 'questionImportList'
                         })
                    }).catch(err => {
                        this.$message.error('上传失败，请重新上传！')
                        this.spinning = false;
                    })
                } else if (status === 'error') {
                    this.$message.error(`${info.file.name} 文件上传失败.`);
                }
            },
            sureUpload() {
                if (JSON.stringify(this.fileData) === '{}') {
                    this.$message.error('请选择上传的文件！');
                    return;
                }
                this.loading = true;
                this.spinning = true;
                getFileID(this.fileData).then(res => {
                    let type = null,
                        typeID = '';
                    if (this.$parent.ChapterId) {
                        type = 0;
                        typeID = this.$parent.ChapterId
                    }
                    if (this.$parent.KnowledgePointIdList.length > 0) {
                        type = 1;
                        typeID = this.$parent.KnowledgePointIdList[0]
                    }
                    let data = {
                        fileId: res,
                        disciplineId: this.$parent.activeSubject.id,//学科id
                        targetId: typeID,//目标文件
                        targetType: type//类型
                    }
                    console.log(data, 'params')
                    QuestionResolve(data).then(rel => {
                        this.$message.success('上传成功！');
                        this.spinning = false;
                        this.loading = false;
                        this.$router.push({
                            name: 'questionImportList'
                         })
                    }).catch(err => {
                        this.$message.error('上传失败，请重新上传！')
                        this.spinning = false;
                        this.loading = false;
                    })
                }).catch(err => {
                    this.loading = false;
                })
            },
            handleOk(e) {
                this.visible = false;
                this.$router.push({
                    name: 'questionImportList'
                })
            },
            handleCancel(e) {
                this.fileData = {};
                this.visible = false;
                this.spinning = false;
                this.loading = false;
            },
        }
    };
</script>
<style scoped>

</style>