刘忠健 7ec4019875 删除注释 9 maanden geleden
..
assets 8b724be698 EXCEL模块提交 1 jaar geleden
src 7ec4019875 删除注释 9 maanden geleden
.gitignore 4663f85bfa 修复column值为字符串问题 1 jaar geleden
.npmignore 8b724be698 EXCEL模块提交 1 jaar geleden
.prettierrc 3edd0e3068 更新 1 jaar geleden
package.json 7ec4019875 删除注释 9 maanden geleden
readme.md 532e4df36f 更新合并单元 1 jaar geleden
sync.ffs_db 4663f85bfa 修复column值为字符串问题 1 jaar geleden
tsconfig.json 64796ad83c 更新vue3 1 jaar geleden
发布教程.md 8b724be698 EXCEL模块提交 1 jaar geleden
测试文档.md 8b724be698 EXCEL模块提交 1 jaar geleden

readme.md

excel组件

基础依赖

write-excel-file

文档:https://www.npmjs.com/package/write-excel-file

安装

# npm 安装 
npm i @ycxxkj/excel
# yarn 安装
yarn add @ycxxkj/excel

api说明

使用示例

第1步,引入库文件

import { ExcelWriter } from "@ycxxkj/excel";

第2步,写导出方法

###2.1 分页查询

    /**
     * 分页查询数据并导出
     * @param {*} params 
     * @returns 
     */
    async output(params) {
        let data = [];//要导出的数据
        let next = true;//是否有下一页,true为有,false为最后1页
        let count = 0;// 计数
        let maxPage = 1000;//最大查询页数,避免死循环
        while (next) {
            //如果有数据,就查询
            let pageRes = await this.list(params);//查询1页数据
            console.log("#debug#🚀 ~ file: Order.js:23 ~ output ~ params:", params, pageRes)
            if (pageRes.code != 0) {
                break;//有错误就不查询下一页了
            }
            let pageData = pageRes.data;//本页的数据
            pageData.data.forEach((item, index) => {
                data.push(item);//将本页数据压入要导出的数据数组
            });
            if (pageData.current_page >= pageData.last_page) {
                next = false;//如果当前页数大于等于最后一页的页数,表示没有下一页
                break;
            }
            params.page = params.page + 1;//查询下一页
            count++;
            if (count > maxPage) {
                next = false;//如果 超过最大查询页数,就跳出循环
                break;//避免死循环
            }
        }
        await this._dealOutput(data);//导出数据
        return { code: 0 };//返回结果
    },

2.2 数据处理

方式1:通过定义表头与表体 (不支持合并单元格)

    //=========私有方法================
    /**
     * 根据数据,构造打印EXCEL表格
     * @param {*} data 
     */
    async _dealOutput(data) {
        /**
         * 导出的文件配置
         */
        let options = {
            fileName: "教师导出.xlsx",//文件名
        };
        /**
         * 导出的表头
         */
        let header = [
            { key: "id", title: "ID", type: Number, },
            { key: "name", title: "名称", width: 10 },
            { key: "phone", title: "手机号", width: 15 },
            { key: "real_name", title: "账号名称", width: 15 },
            { key: "login_name", title: "账号", width: 22 },
            { key: "nick_name", title: "昵称", width: 22 },
            { key: "school_name", title: "学校", width: 22 },
            { key: "role_name", title: "角色", width: 12 },
            { key: "money", title: "余额", width: 10, type: Number },
            { key: "valid", title: "是否有效", width: 12 },
        ];//表头根据实际数据构造

        let columns = [];//excel文件的列配置
        header.forEach((item, index) => {
            let columnItem = {};
            if (item?.width) {
                columnItem.width = item.width;//设置行宽
            }
            columns.push(columnItem);
        })
        options.columns = columns;//设置列
        options.border = true;//设置边框,true为有边框,false为无边框
        let excelDataBody = [];//excel的表体数据
        data.forEach((item, index) => {
            let body = {
                id: item.id,
                name: item.name,
                phone: item.phone,
                real_name: item?.admin?.real_name,
                login_name: item?.admin?.login_name,
                nick_name: item?.admin?.nick_name,
                school_name: item?.school?.name ?? "",
                role_name: item?.admin?.adminRole?.name ?? "",
                money: item.money,
                valid: item.valid == 1 ? "有效" : "无效"
            };//body根据实际数据构造
            excelDataBody.push(body);//把数据压入表体数组
        });

        ExcelWriter.outputExcel(header, excelDataBody, options);//导出excel
    }

方式2 定义单元格内容

数据data项的参数,支持write-excel-file中的Cell Parameters值

        async _dealOutput() {
            //数据组合逻辑自行实现		
			let data = [
				{ poi: "A1", value: "表名", span: 4, align: "center" },
				{ poi: "A2", value: "姓名" },
				{ poi: "A3", value: "张三" },
				{ poi: "A4", value: "李四" },
				{ poi: "B2", value: "性别", span: 2 },
				{ poi: "B3", value: "男", span: 3 },
				{ poi: "B4", value: "女", rowSpan: 2, span: 2, alignVertical: "center", align: "center" },
				{ poi: "d2", borderColor: "#ff0000" },
				{ poi: "A6", borderColor: "#ff0000" },
				{ poi: "D6", value: "" }
			];
			
			ExcelWriter.outputExcelByData(data, { border: true, fileName: "测试导出.xlsx" });
		}

第3步,调用导出方法

let params={
    pageSize:1000,
    page:1,
    //... 其它条件自己添加
}
let res = await output(params);//执行完后,浏览器会自己下载excel文件