【js】——前端無插件導出excel:自定義sheet、插入圖片、設置打印、頁邊距、頁腳等

背景

前段時間因一個需求後端沒法完成,因此交給前端來實現,導出表格,須要實現:
一、支持多個sheet,而且有本身的name
二、根據要求合併單元格,設置單元格的寬高
三、在表格內有各自的二維碼
四、打印的頁邊距爲左右各0.5cm
五、打印多頁的話,固定表頭
六、設置頁腳前端

實現

導出後,以下圖所示:
圖片描述git

圖片描述

源碼

https://github.com/pangpangni...
略凌亂,歡迎指正及優化。github

思路

用現有的js導出excel的插件,沒法實現,因此只能手寫各類樣式代碼;
關於打印、頁腳之類無從下手的要求,須要導出後,複製一份,原文件拖進sublime,查看源碼,複製的那份用wps打開,設置打印、頁腳。而後複製的那份拖進sublime,對比兩個文件的代碼有什麼不一樣,就基本能夠知道打印、頁腳的代碼。後端

Bug

一、只能用wps打開,若是用excel打開的話,會報錯
二、wps打開後,若是修改了內容,保存後再打開,二維碼消失優化

重點代碼

一、設置頁腳及頁邊距spa

<style>
      <!-- @page
        {mso-footer-data:"&C\\7B2C &P \\9875\\FF0C\\5171 &N \\9875";
        margin:0.748in 0.195in 0.748in 0.195in;
        mso-header-margin:0.51in;
        mso-footer-margin:0.51in;}
      -->
    </style>

二、文字折行插件

<td colspan="4" style="font-size:13px;vertical-align:middle;">
   送貨人:
   <br style='mso-data-placement:same-cell;'/>
   <br style='mso-data-placement:same-cell;'/>
   日 期 :
</td>

三、打印固定表頭excel

<x:ExcelName>
   <x:Name>Print_Titles</x:Name>
   <x:SheetIndex>1</x:SheetIndex>
   <x:Formula>=3D'2773'!$1:$7</x:Formula>
</x:ExcelName>
<x:ExcelName>
   <x:Name>Print_Titles</x:Name>
   <x:SheetIndex>1</x:SheetIndex>
   <x:Formula>=3D'2773'!$1:7</x:Formula>
</x:ExcelName>

四、插入圖片
目前只支持插入轉成base64的圖code

<img src=3D'code2773.xml' />
------BOUNDARY_0008----
Content-Location: file:///C:/0E8D990C/SongHuoDan/code2773.xml
Content-Transfer-Encoding: base64
Content-Type: image/jpeg

iVBORw0KGgoA...省略掉...Qn9mxgAAAABJRU5ErkJggg==
------BOUNDARY_0008----
Content-Location: file:///C:/0E8D990C/SongHuoDan/code2774.xml
Content-Transfer-Encoding: base64
Content-Type: image/jpeg

其餘的請自行摸索……orm

注意

一、請嚴格按照格式拼接代碼(空格、空行等)
二、注意分割線boundary="----BOUNDARY_0008----",BOUNDARY_0008能夠改爲別的

相關文章
相關標籤/搜索