<template>
    <el-container>
        <el-main>
            <el-row>
                <el-row>
                    <el-col :span="24"><div class="grid-content"><p>请导入原始/理货数据：</p></div></el-col>
                </el-row>
                <el-row>
                    <el-col :span="24"><div class="grid-content"><h1>Please import original / tally data：</h1></div></el-col>
                </el-row>
            </el-row>
                <el-row style="margin-top: 60px">
                    <el-col :offset="4" :span="7" style="background-color: white;padding-top: 20px;padding-bottom: 20px;border-radius: 10px">
                        <el-upload
                                class="upload-demo"
                                action=""
                                :http-request="uploadOri"
                                :limit=1
                                :on-exceed="fileExceed"
                                accept="application/vnd.ms-excel,application/vnd.ms-excels"
                                ref="fileupload"
                                v-loading.fullscreen.lock="loading"
                                element-loading-text="正在上传原始数据"
                                element-loading-spinner="el-icon-loading"
                                element-loading-background="rgba(0,0,0,0.3)"
                        >
                            <el-button size="medium" type="primary">点击上传原始数据</el-button>
                            <div slot="tip" class="el-upload__tip">只能上传excel文件</div>
                        </el-upload>
                    </el-col>
                    <el-col :offset="2" :span="7" style="background-color: white;padding-top: 20px;padding-bottom: 20px;border-radius: 10px">
                        <el-upload
                                class="upload-demo"
                                action=""
                                :http-request="uploadTal"
                                :limit=1
                                :on-exceed="fileExceed2"
                                accept="application/vnd.ms-excel,application/vnd.ms-excels"
                                ref="fileupload"
                                v-loading.fullscreen.lock="loadings"
                                element-loading-text="正在上传理货数据"
                                element-loading-spinner="el-icon-loading"
                                element-loading-background="rgba(0,0,0,0.3)">
                            <el-button size="medium" type="success">点击上传理货数据</el-button>
                            <div slot="tip" class="el-upload__tip">只能上传excel文件</div>
                        </el-upload>
                    </el-col>
                </el-row>
        </el-main>
    </el-container>
</template>
<!--自定义CSS-->
<style scoped>
    .el-container{text-align: center}
    .el-main{margin:0 auto;height:400px;}
    p{font-size:25px;font-weight: bold;}
    .row-bg{padding:30px 0;}
    .el-form-item {margin-bottom: 0px;}
    .el-loading-spinner{
        top:60%;
        width: 120%;
    }
</style>

<script>
    import {upfile,upfiles} from "../../api/technological";
    export default {
        data() {
            return {
                loading:false,
                loadings:false,
                fileList: [],
            };
        },
        methods:{
            // excel 原始导入
            fileExceed(){
                this.$message.error('别贪心！一次只能上传一个哦~');
            },
            // 自定义上传 excel
            uploadOri (item) {
                this.loading = true;
                const form = new FormData()
                form.append('file', item.file);
                upfile(form).then(res =>{
                    if(res.data.count >0){
                        this.loading = false;
                        return this.$message.error('主单导入失败')
                    }else {
                        this.loading = false;
                        this.$message.success('主单导入成功')
                    }
                }).catch((e) => {})
            },
            // excel 理货导入
            fileExceed2(){
                this.$message.error('别贪心！一次只能上传一个哦~');
            },
            // 自定义上传 excel
            uploadTal (item) {
                this.loadings = true;
                const form = new FormData()
                form.append('file', item.file);
                upfiles(form).then(res =>{
                    if(res.data.count >0){
                        this.loadings = false;
                        return this.$message.error('主单导入失败')
                    }else {
                        this.loadings = false;
                        this.$message.success('主单导入成功')
                    }
                }).catch((e) => {})
            },
        },
        computed:{
        },
        /*渲染方法*/
        activated(){
        },
    };
</script>