<template>
    <el-upload
        :action="uploadUrl"
        :before-upload="beforeUpload"
        :headers="headers"
        :show-file-list="false"
        ref="upload"
        :on-success="onSuccess"
        class="uploader"
        :on-error="onfail"
    >
        <el-button icon="el-icon-upload2" slot="trigger" size="small" class="filter-item">导入</el-button>
    </el-upload>
</template>

<script>
import resolveUrl from 'resolve-url';
import axios from 'axios';
export default {
    name: 'ExcelUpload',
    props: {
        uri: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            uploadUrl: ''
        };
    },
    computed: {
        headers() {
            return {
                Authorization: 'Bearer ' + localStorage.getItem('token')
            };
        }
    },
    created() {
        this.uploadUrl = resolveUrl(this.$baseUrl, this.uri);
    },
    methods: {
        upload() {},
        onfail(e) {
            console.log(e);
            this.$message.error('失败');
            this.changeSelect();
        },
        onSuccess() {
            this.$message.success('上传成功');
            this.changeSelect();
        },
        beforeUpload() {
            return this.$confirm('确认要导入文件数据吗?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            });
        },
        changeSelect() {
            this.$emit('change');
        }
    }
};
</script>

<style lang="less" scoped>
.uploader {
    display: inline-block;
    margin: 0 10px;
}
</style>
