Skip to content
This repository was archived by the owner on Oct 30, 2025. It is now read-only.

Plugin: Export XLSX

Jump to bottom
Dushusir edited this page May 17, 2023 · 35 revisions

EN

Introduction

Luckysheet is exported to an XLSX file, the front end passes in the luckysheet json, and the back end returns the XLSX file stream.

Online experience address: Luckysheet Demo

Function

The following Luckysheet configurations already support exporting to xlsx files

Cell

sheet.data[row][column]

  • v: the original value of the content
  • bg: background
  • ff: font
  • fc: font color
  • bl: bold font
  • it: font italic
  • fs: font size
  • cl: enable strikethrough
  • ht: center horizontally
  • vt: vertical center
  • tr: text rotation
  • tb: Text word wrapping
  • ct: number format (beta)
  • f: formula (beta)
  • ps: comments
  • rich text

worksheet properties

  • sheet.defaultRowHeight: default row height
  • sheet.defaultColWidth: default column width
  • sheet.hyperlink: hyperlink

worksheet configuration

  • sheet.config.borderInfo: border
  • sheet.config.merge: merge cells
  • sheet.config.rowlen: row height
  • sheet.config.columnlen: column width
  • sheet.config.rowhidden: hide rows
  • sheet.config.colhidden: Hidden columns

workbook configuration

  • scaling ratio
  • Maximum line number
  • Maximum column number
  • Activate now
  • sheet name
  • Activate selection
  • Horizontal scroll bar position
  • Vertical scroll bar position

use

1. Download executable file

Download the executable lucky-export-linux for deployment to a linux server

Address: [to be released]

2. Upload to server

Use an FTP tool such as FileZilla to transfer the lucky-export-linux file to any empty directory on the server, such as the /software/lucky directory

Fix Permission denied issue

cd /software/lucky
chmod 777 lucky-export-linux

3. Start the service

linux

cd /software/lucky
# Run the test directly in the current window, you can change the port as needed
./lucky-export-linux -p 3001
# Keep running in the background
nohup ./lucky-export-linux -p 3001 >lucky-export-linux.out 2>&1 &

After execution, Ctrl+C can exit the interaction

Check whether the startup is successful

ps aux | grep lucky-export-linux

Printing out information like this means that the startup is successful

4. Front-end configuration

Option One

The front end of Luckysheet already supports the export button on the toolbar through configuration

luckysheet. create({
     plugins:[{
         name: 'exportXlsx',
         config:{
             url:'http://[YOUR_SERVER_IP]:3001/luckyToXlsx'
         }
     }]
})

Among them, you need to update your own server interface address url

Option Two

custom export button

<button id="export-xlsx">Export XLSX</button>

Listen and request the interface to export XLSX files

const exportBtn = document. getElementById('export-xlsx');
exportBtn.addEventListener('click', fetchAndDownloadXlsx);

function downloadXlsx(data, filename) {
     const blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
     const url = URL.createObjectURL(blob);
     const link = document. createElement('a');
     link.href = url;
     link.download = filename;
     link. click();
     URL.revokeObjectURL(url);
}

function fetchAndDownloadXlsx(url,success,fail) {
     // Pay attention to initialize luckysheet in advance
     const luckyJson = luckysheet.toJson();

     fetch('http://localhost:3001/luckyToXlsx', {
         method: 'POST',
         headers: {
             'Content-Type': 'application/json'
         },
         body: JSON.stringify(luckyJson)
     })
         .then((response) => response.blob())
         .then((blob) => {
             const filename = luckyJson.title + '.xlsx';
             downloadXlsx(blob, filename);
         })
         .catch((error) => {
             console.error('fetch error:', error);
         });
}

ZH

介绍

Luckysheet导出到XLSX文件，前端传入luckysheet json，后端返回XLSX文件流。

在线体验地址：Luckysheet Demo

功能

以下Luckysheet的配置已支持导出到xlsx文件

单元格

sheet.data[row][column]

  • v: 内容的原始值
  • bg: 背景
  • ff: 字体
  • fc: 字体颜色
  • bl: 字体加粗
  • it: 字体斜体
  • fs: 字体大小
  • cl: 启用删除线
  • ht: 水平居中
  • vt: 垂直居中
  • tr: 文字旋转
  • tb: 文本自动换行
  • ct: 数字格式(beta)
  • f: 公式(beta)
  • ps: 批注
  • 富文本

worksheet属性

  • sheet.defaultRowHeight：默认行高
  • sheet.defaultColWidth：默认列宽
  • sheet.hyperlink：超链接

worksheet配置

  • sheet.config.borderInfo：边框
  • sheet.config.merge：合并单元格
  • sheet.config.rowlen：行高
  • sheet.config.columnlen：列宽
  • sheet.config.rowhidden：隐藏行
  • sheet.config.colhidden：隐藏列

workbook配置

  • 缩放比例
  • 最大行号
  • 最大列号
  • 是否激活
  • sheet 名称
  • 激活选区
  • 横向滚动条位置
  • 竖向滚动条位置

使用

1. 下载可执行文件

下载用于部署到linux服务器上的可执行文件 lucky-export-linux

地址：[待发布]

2. 上传到服务器

使用 FTP 工具比如 FileZilla，传输 lucky-export-linux 文件到服务器任意空白目录，比如/software/lucky目录下

修复 Permission denied 问题

cd /software/lucky
chmod 777 lucky-export-linux

3. 启动服务

linux

cd /software/lucky
# 当前窗口直接运行测试，可以根据需要更改端口
./lucky-export-linux -p 3001
# 保持后台运行
nohup ./lucky-export-linux -p 3001 >lucky-export-linux.out 2>&1 &

执行后 Ctrl+C 退出交互即可

查询是否启动成功

ps aux|grep lucky-export-linux

打印出类似这样的信息就是启动成功

4. 前端配置

方案一

Luckysheet前端已经支持通过配置开启工具栏的导出按钮

luckysheet.create({
    plugins:[{
        name:'exportXlsx',
        config:{
            url:'http://[YOUR_SERVER_IP]:3001/luckyToXlsx'
        }
    }]
})

其中需要更新自己服务器接口地址url

方案二

自定义导出按钮

<button id="export-xlsx">Export XLSX</button>

监听并请求接口导出XLSX文件

const exportBtn = document.getElementById('export-xlsx');
exportBtn.addEventListener('click', fetchAndDownloadXlsx);

function downloadXlsx(data, filename) {
    const blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
    const url = URL.createObjectURL(blob);
    const link = document.createElement('a');
    link.href = url;
    link.download = filename;
    link.click();
    URL.revokeObjectURL(url);
}

function fetchAndDownloadXlsx(url,success,fail) {
    // 注意提前初始化luckysheet
    const luckyJson = luckysheet.toJson();

    fetch('http://localhost:3001/luckyToXlsx', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(luckyJson)
    })
        .then((response) => response.blob())
        .then((blob) => {
            const filename = luckyJson.title + '.xlsx';
            downloadXlsx(blob, filename);
        })
        .catch((error) => {
            console.error('fetch error:', error);
        });
}

Clone this wiki locally