zoukankan      html  css  js  c++  java
  • js 导出多sheet表格

    var tablesToExcel = (function() {
      var uri = "data:application/vnd.ms-excel;base64,",
        html_start = `<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">`,
        template_ExcelWorksheet = `<x:ExcelWorksheet><x:Name>{SheetName}</x:Name><x:WorksheetSource HRef="sheet{SheetIndex}.htm"/></x:ExcelWorksheet>`,
        template_ListWorksheet = `<o:File HRef="sheet{SheetIndex}.htm"/>`,
        template_HTMLWorksheet =
          `
    ------=_NextPart_dummy
    Content-Location: sheet{SheetIndex}.htm
    Content-Type: text/html; charset=utf-8
    
    ` +
          html_start +
          `
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <link id="Main-File" rel="Main-File" href="../WorkBook.htm">
        <link rel="File-List" href="filelist.xml">
    </head>
    <body><table  border="1">{SheetContent}</table></body>
    </html>`,
        template_WorkBook =
          `MIME-Version: 1.0
    X-Document-Type: Workbook
    Content-Type: multipart/related; boundary="----=_NextPart_dummy"
    
    ------=_NextPart_dummy
    Content-Location: WorkBook.htm
    Content-Type: text/html; charset=utf-8
    
    ` +
          html_start +
          `
    <head>
    <meta name="Excel Workbook Frameset">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="File-List" href="filelist.xml">
    <!--[if gte mso 9]><xml>
     <x:ExcelWorkbook>
        <x:ExcelWorksheets>{ExcelWorksheets}</x:ExcelWorksheets>
        <x:ActiveSheet>0</x:ActiveSheet>
     </x:ExcelWorkbook>
    </xml><![endif]-->
    </head>
    <frameset>
        <frame src="sheet0.htm" name="frSheet">
        <noframes><body><p>This page uses frames, but your browser does not support them.</p></body></noframes>
    </frameset>
    </html>
    {HTMLWorksheets}
    Content-Location: filelist.xml
    Content-Type: text/xml; charset="utf-8"
    
    <xml xmlns:o="urn:schemas-microsoft-com:office:office">
        <o:MainFile HRef="../WorkBook.htm"/>
        {ListWorksheets}
        <o:File HRef="filelist.xml"/>
    </xml>
    ------=_NextPart_dummy--
    `,
        base64 = function(s) {
          return window.btoa(unescape(encodeURIComponent(s)));
        },
        format = function(s, c) {
          return s.replace(/{(w+)}/g, function(m, p) {
            return c[p];
          });
        };
      return function(tables, filename) {
        var context_WorkBook = {
          ExcelWorksheets: "",
          HTMLWorksheets: "",
          ListWorksheets: ""
        };
        tables.forEach((item, index) => {
          var SheetName = item.name;
          context_WorkBook.ExcelWorksheets += format(template_ExcelWorksheet, {
            SheetIndex: index,
            SheetName: SheetName
          });
          context_WorkBook.HTMLWorksheets += format(template_HTMLWorksheet, {
            SheetIndex: index,
            SheetContent: item.html
          });
          context_WorkBook.ListWorksheets += format(template_ListWorksheet, {
            SheetIndex: index
          });
        });
        var link = document.createElement("A");
        link.href = uri + base64(format(template_WorkBook, context_WorkBook));
        link.download = filename || "Workbook.xls";
        link.target = "_blank";
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      };
    })();
    var sheet_1 = `<thead><tr><th>这是sheet1的表头</th></tr><thead><tbody><tr><td>这是sheet1的表体</td></tr><tbody>`;
    var sheet_2 = `<thead><tr><th>这是sheet2的表头</th></tr><thead><tbody><tr><td>这是sheet2的表体</td></tr><tbody>`;
    var sheets = [
      { name: "合并详情", html: sheet_1 },
      { name: "发票详情", html: sheet_2 }
    ];
    tablesToExcel(sheets, "导出的excel");
    

      

  • 相关阅读:
    kubeadm部署K8S集群v1.16.3
    MySQL5.7Gtid主从复制总是遇到日志被清等出现无法正常主从复制
    ORACLE数据库SQL优化 not in 与not exits
    某控股公司OA系统ORACLE DG搭建
    阿里云ECS服务器上搭建keepalived+mha+mysql5.6+gtid+一主两从+脚本判断架构踩的坑
    生产案例:开发不小心把某个表数据清了,没有逻辑备份,有物理备份
    生产案例:突然产生大量的归档日志,导致磁盘空间满了无法登陆数据库
    maxscale读写分离
    MYSQL EXPLAIN执行计划命令详解(支持更新中)
    vue 解决 post请求下载文件,下载的文件损坏打不开,结果乱码
  • 原文地址:https://www.cnblogs.com/wangyunhui/p/13645482.html
Copyright © 2011-2022 走看看