UploadFirmWareDialog.vue

<template>
  <!--本地上传配置文件对话框-->
  <el-dialog v-dialogDrag style="font-size: 10px;"
             width='450px'
             v-if="uploadConfigVisible"
             :title="$t('ProfileManagement.localUpload')"
             :visible.sync="uploadConfigVisible"
             @close="close">
    <el-upload
      action="doUpload"
      :limit="1"
      :before-upload="beforeUpload"
      style="margin-bottom: 10px;">
      <el-button slot="trigger" size="small" type="primary">{{ $t('FirmWareConfiguration.upload')}}</el-button>
      <div slot="tip" class="el-upload__tip">{{$t('common.importBinFile')}}</div>
      <div slot="tip" class="el-upload-list__item-name">{{fileName}}</div>
    </el-upload>
    <el-form :model="form" inline="true"  style="margin-bottom: -10px;" label-width="80px">
      <el-form-item :label="$t('FirmWareConfiguration.deviceType')+':'"  style="margin-bottom: 0px;">
        <el-select  size='mini'  style="width: 152px;" @change='ch' v-model="deviceTypeSelect" :placeholder="$t('FirmWareConfiguration.selectDeviceType')">
          <el-option v-for="item in deviceTypeList" :key="item.deviceTypeKey" :label="item.deviceTypeName"
                     :value="item.deviceTypeKey"></el-option>
        </el-select>
      </el-form-item>
      <!--<el-form-item :label="$t('FirmWareConfiguration.description')+':'"  style="margin-bottom: 3px;margin-left: -2px;">-->
        <!--<el-input type="textarea" autosize v-model="form.description" style="width: 152px;"></el-input>-->
      <!--</el-form-item>-->
    </el-form>
    <el-row style="margin-bottom: 0px;" slot="footer" class="dialog-footer">
      <el-button style="margin-bottom: -10px;" size='mini' type="primary" @click="submitUpload"
                 v-loading.fullscreen.lock="fullscreenLoading">{{$t("ProfileManagement.upload")}}
      </el-button>
      <el-button style="margin-bottom: -10px;" size='mini' @click="close">
        {{$t("common.cancel")}}
      </el-button>
    </el-row>

  </el-dialog>

</template>

<script>
  import ElButton from "../../../../node_modules/element-ui/packages/button/src/button.vue";
  import FirmWareService from '@/domain/services/FirmWareService.js'
  import HelperUtil from '../../../utils/HelperUtil'

  export default {
    components: {ElButton},
    props: ['command'],

    data: function () {
      return {
        deviceTypeList: [
          {
            deviceTypeKey: '0',
            deviceTypeName: this.$t('DeviceConfigurationManagement.traditional')
          },
          {
            deviceTypeKey: '1',
            deviceTypeName: 'SDN'
          }
        ],
        deviceTypeSelect: '0',
        // form:{
        //   deviceType: '',
        //   description: ''
        // },
        uploadConfigVisible: true,

        fileName: '',
        files: '',

        fullscreenLoading: false,
        tableHeight: window.innerHeight * 0.7,
        formLabelWidth: '120px'
      }
    },
    methods: {
      close: function () {
        console.log("关闭")
        this.command.done()
      },

      /**
       * @Description  : 导出文件之前执行
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         :
       */
      beforeUpload (file) {
        console.log(file, '文件')
        this.files = file;
        // const extension = file.name.split('.')[1] === 'conf'
        const extension = file.name.substring(file.name.toString().length-4,file.name.toString().length)==".bin"
//        alert(file.name.substring(file.name.toString().length-5,file.name.toString().length))
//        const extension2 = file.name.split('.')[1] === 'xlsx'
        const isLt2M = file.size / 1024 / 1024 < 5
        if (!extension) {
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.UPLOAD_FILES_CAN_ONLY_BE_IN_BIN_FORMAT))
          return
        }
        // if (!isLt2M) {
        //   this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.UPLOADFILE_SIZE_CODE))
        //   return
        // }
        this.fileName = file.name
        return false // 返回false不会自动上传
      },

      submitUpload: function () {

        let _this = this
        if (this.fileName == "") {
          _this.InfoTip.warningTip(_this, HelperUtil.getCheckStatusCodeObjectByCode(_this.successCode.CHOOSE_UPLOADFILE_CODE))

          return false
        }
        console.log(this.files)
        let fileFormData = new FormData();
        fileFormData.append('file', this.files, this.files.name);
        let loadingInstance = _this.Loading.openLoading();
        FirmWareService.uploadLocalFirmWare(this.files.name, this.deviceTypeSelect,fileFormData).then(result => {
          _this.Loading.closeLoading(loadingInstance)
          _this.InfoTip.successTip(_this, HelperUtil.getStatusCodeObjectByCode(_this.successCode.OTHERS_CODE));
          _this.close();
        }).catch(err => {

          //失败
          _this.Loading.closeLoading(loadingInstance)
          _this.InfoTip.errorTip(_this, err);
//          _this.command.done();
        })
      },
      ch: function (vid) {
        let obj = {}
        obj = this.deviceTypeList.find((item) => {
          return item.deviceTypeKey === vid
        })
        this.deviceTypeSelect = obj.deviceTypeName
      }
    },
    created() {
      console.log('导入配置文件 初始化加载数据')

    }
  }
</script>