导出表格成为excel文件功能,import的文件在下面

<el-form-item class="btnBox">
    <el-button size="mini" class="greenButton" @click="leadingOut"
               >导出
    </el-button>
</el-form-item>
// 请求方式
import request from "@/utils/request";
import qs from "qs";

data(){
	return{
		url:{
			leadingOut: "/pLineInformation/exportLine", //导出接口
		},
        //查询参数
        queryParams: {
            page: 1,
            limit: 10,
            province: undefined, //所属省
            city: undefined, //所属地市
            organizationId: undefined, //运维单位
            state: undefined, //运行状态
            ifOnlineMonitor: undefined, //是否实现监测
        },
	}
}
methods:{
	const baseURL = process.env.VUE_APP_BASE_API;
	function POSTExport(url, data, name) {
      return request({
        url: baseURL + url,
        method: "post",
        data: data,
        responseType: "arraybuffer",
        }).then((res) => {
        var blob = new Blob([res]);
        var downloadElement = document.createElement("a");
        var href = window.URL.createObjectURL(blob); //创建下载的链接
        downloadElement.href = href;
        downloadElement.download = name + ".xlsx" || "下载文件" + ".xlsx"; // 下载后文件名
        document.body.appendChild(downloadElement);
        downloadElement.click(); //点击下载
        document.body.removeChild(downloadElement); //下载完成移除元素
        window.URL.revokeObjectURL(href); //释放掉blob对象
      });
	}
	//导出按钮事件
    leadingOut() {
      POSTExport(this.url.leadingOut, this.queryParams);
    },
}
//@/utils/request
import axios from "axios";
import { MessageBox, Message, Loading } from "element-ui";
import store from "@/store";
import { getToken } from "@/utils/auth";
let loading;

// create an axios instance
const service = axios.create({
  // baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
  // baseURL: '/api',
  // withCredentials: true, // send cookies when cross-domain requests
  timeout: 50000, // request timeout
});
function startLoading() {
  //使用Element loading-start 方法
  loading = Loading.service({
    lock: true,
    text: "",
    background: "rgba(255, 255, 255, 0.5)",
  });
}
function endLoading() {
  //使用Element loading-close 方法
  loading.close();
}
// request interceptor
service.interceptors.request.use(
  (config) => {
    // do something before request is sent
    startLoading(); // 全局loading
    // if (store.getters.token) {
    //   // let each request carry token
    //   // ['X-Token'] is a custom headers key
    //   // please modify it according to the actual situation
    //   // config.headers['token'] = getToken()
    //   config.headers['token'] = store.getters.token
    // }
    config.headers["token"] = getToken();

    return config;
  },
  (error) => {
    // do something with request error
    console.log(error); // for debug
    return Promise.reject(error);
  }
);

// response interceptor
service.interceptors.response.use(
  /**
   * If you want to get http information such as headers or status
   * Please return  response => response
   */

  /**
   * Determine the request status by custom code
   * Here is just an example
   * You can also judge the status by HTTP Status Code
   */
  (response) => {
    endLoading(); //关闭loading
    const res = response.data;

    // if the custom code is not 20000, it is judged as an error.
    // if (res.code !== 20000) {
    //   Message({
    //     message: res.message || 'Error',
    //     type: 'error',
    //     duration: 5 * 1000
    //   })

    //   // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
    //   if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
    //     // to re-login
    //     MessageBox.confirm('你已被登出,可以取消继续留在该页面,或者重新登录', '确定登出', {
    //       confirmButtonText: '重新登录',
    //       cancelButtonText: '取消',
    //       type: 'warning'
    //     }).then(() => {
    //       store.dispatch('user/resetToken').then(() => {
    //         location.reload()
    //       })
    //     })
    //   }
    //   return Promise.reject(new Error(res.message || 'Error'))
    // } else {
    return res;
    // }
  },
  (error) => {
    console.log("err" + error); // for debug
    endLoading(); //关闭loading
    Message({
      message: error.message,
      type: "error",
      duration: 5 * 1000,
    });
    return Promise.reject(error);
  }
);

export default service;
//qs
'use strict';

var stringify = require('./stringify');
var parse = require('./parse');
var formats = require('./formats');

module.exports = {
    formats: formats,
    parse: parse,
    stringify: stringify
};

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值