ImportSubnetDialog.vue

<template>

  <!--导入文件对话框-->
  <el-dialog
    @close="close"
    v-dialogDrag style="font-size: 10px;" width='450px'
    v-if="importSubnetVisible"
    :title="$t('SubnetConfigurationManagement.importSubnetData')"
    :visible.sync="importSubnetVisible">
    <el-upload
      action="doUpload"
      :limit="1"
      :before-upload="beforeUpload">
      <el-button slot="trigger" size="small" type="primary">{{$t('common.selectFileBtn')}}</el-button>
      <div slot="tip" class="el-upload__tip">{{$t('common.importMessage')}}</div>
      <div slot="tip" class="el-upload-list__item-name">{{fileName}}</div>
    </el-upload>
    <span slot="footer" class="dialog-footer">
        <el-button size='mini' type="primary" @click="submitUpload()">{{$t('common.ok')}}</el-button>
       <el-button size='mini'   @click="close">{{$t('common.cancel')}}</el-button>
      </span>
  </el-dialog>

</template>


<script>
  import ElButton from "../../../../node_modules/element-ui/packages/button/src/button.vue";
  import SubnetService from '@/domain/services/SubnetService.js'
  import HelperUtil from"../../../utils/HelperUtil";
  export default {
    components: {ElButton},
    props: ['command'],

    data:function(){
     return {
       importSubnetVisible: true,

       fileName: '',
       files: '',


       // 数据加载过程中，覆盖界面
       fullscreenLoading: false,
     }
    },
    methods: {
      close() {

        this.command.done()
      },

      /**
       * @Description  ：导出文件之前执行
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         :
       */
      beforeUpload(file) {

        this.files = file;
        const extension = file.name.split('.')[1] === 'xls'
        const extension2 = file.name.split('.')[1] === 'xlsx'
        const isLt2M = file.size / 1024 / 1024 < 5
        if (!extension && !extension2) {
          //上传文件只能是 xls、xlsx格式!
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.UPLOADFILE_FORMAT_CODE))
          return
        }
        if (!isLt2M) {
          //上传文件大小不能超过 5MB!
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.UPLOADFILE_SIZE_CODE))
          return
        }
        this.fileName = file.name;
        return false // 返回false不会自动上传
      },


      /**
       * @Description  ：提交导出
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         :
       */
      submitUpload: function () {

        let _this = this


        if (_this.fileName == "") {
          //请选择要上传的文件
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.CHOOSE_UPLOADFILE_CODE))
          return false
        }

        let fileFormData = new FormData();


        fileFormData.append('file', _this.files, _this.files.name);
        SubnetService.uploadSubnet(fileFormData).then(result => {
          //成功
          _this.InfoTip.successTip(_this,HelperUtil.getStatusCodeObjectByCode(this.successCode.OTHERS_CODE));

          _this.close()
        }).catch(err => {
          //失败
          _this.InfoTip.errorTip(_this,err);

        })

      },


    },
    created() {
      console.log('导入子网初始化加载数据')

    },


  }
</script>