boying-pda/src/views/modules/common/excelUpload.vue

<template>
    <div>
      <!-- 弹窗, 上传文件 -->
      <el-upload
        :action="url"
        :before-upload="beforeUploadHandle"
        :on-success="successHandle"
        multiple
        :show-file-list="false"
        style="text-align: center;">
        <el-button type="primary">点击上传</el-button>
      </el-upload>
    </div>
</template>

<script>
  export default {
    data () {
      return {
        url: '',
        num: 0,
        successNum: 0,
        fileList: [],
        rollList: {}
      }
    },
    methods: {
      init (id) {
        this.url = this.$http.adornUrl(`/file/excel/upload?token=${this.$cookie.get('token')}`)
        this.visible = true
      },
      // 上传之前
      beforeUploadHandle (file) {
        if (file.type !== "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" && file.type !== "application/vnd.ms-excel" ) {
          this.$message.error('只支持xls、xlsx、格式的文件！')
          return false
        }
        this.num++
      },
      // 上传成功
      successHandle (response, file, fileList) {
        if (response && response.code === 0) {
          this.rollList = response
          this.childClick()
        } else {
          this.$message.error(response.msg)
        }
      },
      childClick () {
        this.$emit('excelUploadChild', this.rollList)
      }
    },
    created() {
      this.init()
    }
  }
</script>

<style scoped>

</style>