vue element el-upload导入,导出(excel)功能

vue element el-upload导入导出功能

util.js文件夹

import Axios from 'axios'
const server = process.env.VUE_APP_BASE_API
import request from '@/utils/request'
import {
  Message
} from 'element-ui'
import store from '@/store'
import { getToken } from '@/utils/auth'
export default {
  uploadExcel (url, data) {
    return request({
      url,
      method: 'post',
      headers: {
        'Content-Type': 'multipart/form-data'
      },
      data
    })
  },
  getUploadUrl (url) {
    if (url) {
      return server + url
    } else {
      return server + "/sys/oss/driverUpload"
    }
  },
  exportData (url, data) { //导出文件
    url = server + url
    return request({
      url: url,
      method: 'get',
      params: data,
      responseType: 'blob',
      headers: {
        'Content-Type': 'application/json;charset=UTF-8',
        "Authorization": getToken()
      }
    })
  },
  //下载execl
  exportExcel (res, name) {
    const blob = new Blob([res])
    const fileName = name + '.xlsx'
    const elink = document.createElement('a')
    elink.download = fileName
    elink.style.display = 'none'
    elink.href = URL.createObjectURL(blob)
    document.body.appendChild(elink)
    elink.click()
    URL.revokeObjectURL(elink.href)
    document.body.removeChild(elink)
  },
  getData (url, data) {
    return request({
      url,
      method: "get",
      params: data
    })
  },
  postJson (url, data) {
    return request({
      url,
      method: 'post',
      data
    })
  },
  postJsonNoToken (url, data) {
    return request({
      url,
      headers: {
        isToken: false
      },
      method: 'post',
      data
    })
  },
  dateFormatter (value) {
    let date = new Date(value)
    let Y = date.getFullYear()
    let m = date.getMonth() + 1
    let d = date.getDate()
    let H = date.getHours()
    let i = date.getMinutes()
    let s = date.getSeconds()
    if (m < 10) {
      m = '0' + m
    }
    if (d < 10) {
      d = '0' + d
    }
    if (H < 10) {
      H = '0' + H
    }
    if (i < 10) {
      i = '0' + i
    }
    if (s < 10) {
      s = '0' + s
    }
    let t = Y + '-' + m + '-' + d + ' ' + H + ':' + i + ':' + s
    return t
  },
  dateFormat (value) {
    let date = new Date(value)
    let Y = date.getFullYear()
    let m = date.getMonth() + 1
    let d = date.getDate()
    let H = date.getHours()
    let i = date.getMinutes()
    let s = date.getSeconds()
    if (m < 10) {
      m = '0' + m
    }
    if (d < 10) {
      d = '0' + d
    }
    if (H < 10) {
      H = '0' + H
    }
    if (i < 10) {
      i = '0' + i
    }
    if (s < 10) {
      s = '0' + s
    }
    let t = Y + '-' + m + '-' + d
    return t
  },
  // 两位小数
  checkInput (val, max) {
    val = String(val).replace(/^(\-)*(\d+)\.(\d{2}).*$/, '$1$2.$3') // 只能输入两个小数
    if (val > max) val = max
    val = String(val).replace(/[^\d.]/g, '') // 清除数字和小数点以外的字符
    val = String(val).replace(/^\./g, '') // 验证第一个字符是数字
    val = String(val).replace(/\.{2,}/g, '.') // 只出现一个小数点
    val = String(val)
      .replace('.', '$#$')
      .replace(/\./g, '')
      .replace('$#$', '.') // 只出现一次小数点
    if (String(val).indexOf('.') < 0 && val !== '') {
      // 以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
      val = parseFloat(val)
    }
    return val
  }

}

用的vue页面引入
import Util from '@/utils/util’

// 导出开票
    handleExport () {
      Util.exportData("/invoiceWeb/exportInvoiceBatch", this.queryParams).then(
        (res) => {
          Util.exportExcel(res, "导出开票"); //映引入封装方法
        }
      );
    },