在网上找的一个表格转excel插件，经过修改后使其适用于iview中的table组件

let idTmr;

const getExplorer = () => {

    let explorer = window.navigator.userAgent;

    //ie

    if (explorer.indexOf("MSIE") >= 0) {

        return 'ie';

    }

    //firefox

    else if (explorer.indexOf("Firefox") >= 0) {

        return 'Firefox';

    }

    //Chrome

    else if (explorer.indexOf("Chrome") >= 0) {

        return 'Chrome';

    }

    //Opera

    else if (explorer.indexOf("Opera") >= 0) {

        return 'Opera';

    }

    //Safari

    else if (explorer.indexOf("Safari") >= 0) {

        return 'Safari';

    }

}

const method = (ref,name) => { 

    //整个表格拷贝到EXCEL中

    if (getExplorer() == 'ie') {

        let curTbl = ref;

        let oXL = new ActiveXObject("Excel.Application");

        //创建AX对象excel

        let oWB = oXL.Workbooks.Add();

        //获取workbook对象

        let xlsheet = oWB.Worksheets(1);

        //激活当前sheet

        let sel = document.body.createTextRange();

        sel.moveToElementText(curTbl);

        //把表格中的内容移到TextRange中

        sel.select;

        //全选TextRange中内容

        sel.execCommand("Copy");

        //复制TextRange中内容

        xlsheet.Paste();

        //粘贴到活动的EXCEL中

        oXL.Visible = true;

        //设置excel可见属性

        try {

            let fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");

        } catch (e) {

            print("Nested catch caught " + e);

        } finally {

            oWB.SaveAs(fname);

            oWB.Close(savechanges = false);

            //xls.visible = false;

            oXL.Quit();

            oXL = null;

            // 结束excel进程，退出完成

            window.setInterval("Cleanup();", 1);

            idTmr = window.setInterval("Cleanup();", 1);

        }

    } else {

        tableToExcel(ref,name)

    }

}

const Cleanup = () => {

    window.clearInterval(idTmr);

}

const tableToExcel = (function() {

    // 编码要用utf-8不然默认gbk会出现中文乱码

    let uri = 'data:application/vnd.ms-excel;base64,',

        template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><meta charset="UTF-8"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',

        base64 = function(s) {

            return window.btoa(unescape(encodeURIComponent(s)));

        },

        format = (s, c) => {

            return s.replace(/{(\w+)}/g,

                (m, p) => {

                    return c[p];

                })

        }

    return (table, name) => {

        let ctx = {

            worksheet: name,

            table

        }

        //创建下载

        let link = document.createElement('a');

        link.setAttribute('href', uri + base64(format(template, ctx)));

        link.setAttribute('download', name); 

        // window.location.href = uri + base64(format(template, ctx))

        link.click();

    }

})()

export default (theadData, tbodyEle, dataname = 'Worksheet') => {

    // 写入key过滤不显示的td

    let thArr = [];

    // 建立节点

    let table = document.createElement('table');

    let thead = document.createElement('thead');

    let tbody = tbodyEle.$el.getElementsByClassName('ivu-table-tbody')[0].cloneNode(true);

    //  建立thead中的tr

    let thTr = document.createElement('tr');

    //  遍历写入th表头

    for(let i of theadData){

        thArr.push(i.key);

        let th = document.createElement('th');

        let text = document.createTextNode(i.title);

        th.appendChild(text);

        thTr.appendChild(th);

    }

    thead.appendChild(thTr);

    table.appendChild(thead);

    table.appendChild(tbody)

    console.log(table)

    method(table.innerHTML, dataname);

}

示例

<template>

  <div>

    <Table :columns="columns" :data="data" size="small" ref="table"></Table>

    <br>

    <Button type="primary" size="large" @click="exportData()">

      <Icon type="ios-download-outline"></Icon> Export source data</Button>

  </div>

</template>

<script>

import excel from './tableToExcel.js'

export default {

  name: 'HelloWorld',

  data() {

    return {

      columns: [{

          title: '序号',

          type: 'index',

          width: 60,

          align: 'center'

        },

        {

          title: '姓名',

          width: 100,

          key: 'xingming'

        },

        {

          title: '个人账号',

          key: 'grzh'

        },

        {

          title: '证件号码',

          key: 'zjhm'

        },

        {

          title: '未通过原因',

          key: 'cwxx'

        }

      ],

      data: [{

        xingming: '张三',

        grzh: '11231',

        zjhm: '123123123123123',

        cwxx: '未通过原因',

      }, {

        xingming: '张三',

        grzh: '11231',

        zjhm: '123123123123123',

        cwxx: '未通过原因',

      }]

    }

  },

  methods: {

    exportData() {

      excel(this.columns, this.$refs.table, '错误报告');

    }

  }

}

</script>

适用于iview的表格转Excel插件的更多相关文章

  1. vue+iview中的table表格导出excel表格

    一.iveiw框架中table中有exportCsv()方法可以导出.csv后缀文件,类似于excel文件,但是并不是excel文件. 二.实现table表格导出excel文件利用Blob.js 和 ...

  2. 不需要高价购买BI工具，掌握这个Excel插件就能碾压大数据

    ​曾几何时,EXCEL在数据界可谓是独树一帜,引领风骚,在职场中无人不知,无人不晓.但是随着大数据的出现,EXCEL便风光不再,江河日下,一度被其他大数据工具挤到了后面,逐渐被边缘化了.而我是一个EX ...

  3. 【小o地图Excel插件版】计算两点间驾车路径，获取途径道路、驾车距离、耗时等信息

    小o地图Excel插件版:一款基于Excel软件开发的地图软件,提供基于Excel表格进行地理数据挖掘.地理数据分析.地图绘制.地图图表等功能的工具类软件.具有易用.高效.稳定的特点,能够满足地理数据 ...

  4. 【小o地图Excel插件版】不止能做图表，还能抓58、大众点评网页数据...

    小o地图Excel插件版:一款基于Excel软件开发的地图软件,提供基于Excel表格进行地理数据挖掘.地理数据分析.地图绘制.地图图表等功能的工具类软件.具有易用.高效.稳定的特点,能够满足地理数据 ...

  5. 导出Excel插件——Export-CSV ---20150610

    出处:http://bbs.hcharts.cn/thread-99-1-1.html   导出Excel插件——Export-CSV 一.插件信息 插件名:Export-CSV(导出Execl文件) ...

  6. 强力推荐！五款能让你成为Excel“高手”的Excel插件

    excel是大家日常生活中经常用到一款表格软件,虽然软件本身的功能已经非常齐全了,但是插件可以进一步加强软件的功能,为用户提供更好的体验,提高工作效率,需要的用户快来看看吧. 1.Smartbi 首推 ...

  7. 支持10种格式的 HTML 表格导出 jQuery 插件

    HTML 表格导出 jQuery 插件可以帮助用户导出 HTML 表格到 JSON.XML.PNG.CSV.TXT.SQL.MS-Word.MS-Excel.MS-PowerPoint 和 PDF 格 ...

  8. 用VBA计算WPS 表格ET EXCEL中的行数和列数的多重方法

    用VBA计算WPS 表格ET EXCEL中的行数和列数 每种方法中上面的是Excel的行数,下面的是Excel的列数. 方法1: ActiveSheet.UsedRange.Rows.Count Ac ...

  9. ExtJS4.2学习(13)基于表格的扩展插件---rowEditing

    鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-24/182.html --------------- ...

随机推荐

  1. CRC校验8

    什么是CRC校验? CRC即循环冗余校验码:是数据通信领域中最常用的一种查错校验码,其特征是信息字段和校验字段的长度可以任意选定.循环冗余检查(CRC)是一种数据传输检错功能,对数据进行多项式计算,并 ...

  2. pig分组统计例子

    1.选取数据样本 在pig安装目录下有一个文件tutorial/data/excite-small.log,其中的数据分为3列,中间用制表符分隔,第一列为用户ID,第二列为Unix时间戳,第三列为查询 ...

  3. 06 python操作MySQL和redis（进阶）

    python操作mysql.redis 阶段一.mysql事务 主要用于处理操作量大,复杂度高的数据.比如说,在人员管理系统中,你删除一个人员,你即需要删除人员的基本资料,也要删除和该人员相关的信息, ...

  4. python集合、函数实例

    集合 1.list ==>允许重复的集合,可修改 2.tuple ==>允许重复的集合,不可修改 3.dict ==> 4.set ==>不允许重复的集合,相当于不可重复的列表 ...

  5. latex03-LaTeX中的中文处理办法

    编译含中文的tex文件的前提有三个: 默认编译器为XeLaTeX: 编辑器的默认字体编码格式为UTF-8: 引入ctex的宏包. 效果: 源码: %导言区 \documentclass{article ...

  6. BZOJ：2038: [2009国家集训队]小Z的袜子(hose)（莫队算法模板）

    题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=2038 解题心得: 第一次接触莫队算法,很神奇,很巧妙.莫队算法主要就是用来解决多次询问时 ...

  7. urllib.request.urlretrieve()

    urllib模块提供的urlretrieve()函数.urlretrieve()方法直接将远程数据下载到本地. urlretrieve(url, filename=None, reporthook=N ...

  8. ajax同步和异步的切换

    ajax为网页提供了非常不错的异步机制,但是有时候两个ajax放在一起,希望第一个完成后再继续第二个ajax的执行.这时候可以将第一个ajax代码带上同步参数即可,如下: $.ajax({ async ...

  9. 4269: 再见Xor

    4269: 再见Xor 链接 分析: 和SGU 275唯一不同的就是需要求出次小值,那么异或出最大值的所有元素中,找到最小的,去除即可. 代码: #include<bits/stdc++.h&g ...

  10. PADS9.5打开Altium designer09的原理图

    1. 打开PADS Logic原理图工具,文件---导入 2. 选择Protel DXP这个选项,找到相应的文件即可打开.