diff --git a/README.md b/README.md index 365ec3e..8902b57 100644 --- a/README.md +++ b/README.md @@ -14,16 +14,23 @@ ## Installing ```shell -npm install xe-utils vxe-table@next vxe-table-plugin-export-pdf@next jspdf +npm install vxe-table@next vxe-table-plugin-export-pdf@next jspdf ``` ```javascript // ... import VXETable from 'vxe-table' import VXETablePluginExportPDF from 'vxe-table-plugin-export-pdf' +import jspdf from 'jspdf' // ... -VXETable.use(VXETablePluginExportPDF) +// 方式1:NPM 安装,注入 jspdf 对象 +VXETable.use(VXETablePluginExportPDF, { + jspdf +}) + +// 方式2:CDN 安装,只要确保 window.jspdf 存在即可 +// VXETable.use(VXETablePluginExportPDF) ``` ## Options @@ -50,10 +57,11 @@ VXETable.use(VXETablePluginExportPDF) ```javascript // ... +import VXETable from 'vxe-table' import VXETablePluginExportPDF from 'vxe-table-plugin-export-pdf' // ... -VXETablePluginExportPDF.setup({ +VXETable.use(VXETablePluginExportPDF, { // Set default font fontName: 'SourceHanSans-Normal', // Font maps @@ -102,9 +110,9 @@ export default { methods: { exportEvent() { this.$refs.xTable.exportData({ + // fontName: 'SourceHanSans-Normal', // Set the font, default first filename: 'MyExport', - type: 'pdf', - fontName: 'SourceHanSans-Normal' // Set font + type: 'pdf' }) } } diff --git a/index.ts b/index.ts index 8fc13a4..6230d02 100644 --- a/index.ts +++ b/index.ts @@ -1,8 +1,9 @@ import XEUtils from 'xe-utils' import { VXETableCore, VxeTableConstructor, VxeTablePropTypes, VxeTableDefines, VxeGlobalInterceptorHandles } from 'vxe-table' -import jsPDF from 'jspdf' +import type jsPDF from 'jspdf' let vxetable: VXETableCore +let globalJsPDF: any declare module 'vxe-table' { export namespace VxeTablePropTypes { @@ -19,6 +20,7 @@ interface VXETablePluginExportPDFFonts { } interface VXETablePluginExportPDFOptions { + jspdf?: any fontName?: string; fonts?: VXETablePluginExportPDFFonts[]; beforeMethod?: Function; @@ -95,12 +97,17 @@ function exportPDF (params: VxeGlobalInterceptorHandles.InterceptorExportParams) } let fontConf: VXETablePluginExportPDFFonts | null | undefined const fontName = options.fontName || globalOptions.fontName - if (fonts && fontName) { - fontConf = fonts.find(item => item.fontName === fontName) + if (fonts) { + if (fontName) { + fontConf = fonts.find(item => item.fontName === fontName) + } + if (!fontConf) { + fontConf = fonts[0] + } } const exportMethod = () => { /* eslint-disable new-cap */ - const doc = new jsPDF({ orientation: 'landscape' }) + const doc: jsPDF = new (globalJsPDF || (window as any).jspdf)({ orientation: 'landscape' }) // 设置字体 doc.setFontSize(10) doc.internal.pageSize.width = pdfWidth @@ -177,14 +184,16 @@ function pluginSetup (options: VXETablePluginExportPDFOptions) { * 基于 vxe-table 表格的扩展插件,支持导出 pdf 格式 */ export const VXETablePluginExportPDF = { - setup: pluginSetup, + config: pluginSetup, install (vxetable: VXETableCore, options?: VXETablePluginExportPDFOptions) { // 检查版本 if (!/^(4)\./.test(vxetable.version)) { console.error('[vxe-table-plugin-export-pdf] Version vxe-table 4.x is required') } - vxetable.setup({ + globalJsPDF = options ? options.jspdf : null + + vxetable.config({ export: { types: { pdf: 1 diff --git a/package.json b/package.json index dcde6d9..a81b7e2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vxe-table-plugin-export-pdf", - "version": "3.1.0", + "version": "4.0.0", "description": "基于 vxe-table 表格的扩展插件,支持导出 pdf 格式", "scripts": { "lib": "gulp build" @@ -53,8 +53,8 @@ "sass": "^1.55.0", "typescript": "^4.6.4", "vue": "^3.3.4", - "vxe-table": "^4.5.10", - "xe-utils": "^3.5.13" + "vxe-table": "^4.5.18", + "xe-utils": "^3.5.18" }, "peerDependencies": { "vxe-table": "^4.5.0" diff --git a/types/index.d.ts b/types/index.d.ts index 276ccf9..4d15928 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -7,6 +7,7 @@ interface VXETablePluginExportPDFFonts { } interface VXETablePluginExportPDFOptions { + jspdf?: any fontName?: string; fonts?: VXETablePluginExportPDFFonts[]; beforeMethod?: Function;