<template>
    <div>
        <el-dialog
                title="属性导入"
                :visible.sync="isVisible"
                width="30%"
                :before-close="close">
            <div class="main-button">
                <el-upload
                        class="upload-demo"
                        :action="uploadUrl"
                        :data="sxdrData"
                        :on-success="uploadSuccess"
                        :show-file-list="false"
                        multiple
                >
                    <el-button type="primary">上传</el-button>
                    <el-button  type="primary" @click="downloadTemplate">下载模板</el-button>
                </el-upload>
            </div>
           <ul>
               <li v-for="(item,index) in errorData" :key="index">{{item}}</li>
           </ul>
            <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
        </el-dialog>
    </div>
</template>

<script>

    export default {
        name: "sxdr",
        props: {
            sxdrVisible: {
                type: Boolean,
                default: false
            },
            dylx: {
                type: String,
            },
            bsm: {
                type: String
            }
        },
        data() {
            return {
                uploadUrl: '',
                isVisible: false,
                sxdrData: {
                    bsm: ''
                },
                errorData:[]
            }
        },
        mounted(){
            this.$store.state.sxdrType='';
        },
        methods: {
            loading(){
                debugger
              switch (this.dylx) {
                  case "zd":
                      this.$store.state.sxdrType='zd';
                      break;
                  case "dz":
                      this.$store.state.sxdrType='dz';
                      break;
                  case "zrz":
                      this.$store.state.sxdrType='zrz';
                      break;
                  case "h":
                      this.$store.state.sxdrType="h";
                      break;
                  default:
                      break;
              }
            },
            reset(){
              this.errorData=[];
              this.uploadUrl='';
              this.sxdrData={bsm:''};
              this.$store.state.sxdrType='';
            },
            close() {
                this.$emit('close')
                this.reset();
            },
            downloadTemplate() {
                window.open(`/api/tx/excelGeo/zdTemplate?type=`+this.dylx);
            },
            uploadSuccess(res, file, fileList) {
                if (res.success) {
                    this.$message.success("上传成功")
                    this.loading();
                    this.close()
                } else {
                    this.$message.error("上传失败")
                    this.errorData=res.result
                }
            }
        },
        watch: {
            sxdrVisible(val) {
                this.isVisible = val;
            },
            dylx(val) {
                switch (val) {
                    case "zd":
                        this.uploadUrl = "/api/tx/excelGeo/Zdimport";
                        break;
                    default:
                        break;
                }
            },
            bsm(val) {
                this.sxdrData.bsm = val;
            }
        }
    }
</script>

<style scoped lang="less">
    .main-button{
        display: -webkit-flex;
        display: flex;
        flex-direction: column-reverse;
        flex-wrap:nowrap;
    }
    ul{
        margin-top: 20px;
        li{
            line-height: 15px;
            color: red;
        }
    }
</style>