|
|
@@ -1,50 +1,79 @@
|
|
|
-import Docxtemplater from 'docxtemplater'
|
|
|
-import PizZip from 'pizzip'
|
|
|
-import JSZipUtils from 'jszip-utils'
|
|
|
-import { saveAs } from 'file-saver'
|
|
|
-
|
|
|
-/**
|
|
|
- 4. 导出docx
|
|
|
- 5. @param { String } tempDocxPath 模板文件路径
|
|
|
- 6. @param { Object } data 文件中传入的数据
|
|
|
- 7. @param { String } fileName 导出文件名称
|
|
|
-*/
|
|
|
-export const exportDocx = (tempDocxPath, data, fileName) => {
|
|
|
- // 读取并获得模板文件的二进制内容
|
|
|
- JSZipUtils.getBinaryContent(tempDocxPath, (error, content) => {
|
|
|
- if (error) {
|
|
|
- console.error("获取文件时出现错误:", error);
|
|
|
- throw error;
|
|
|
+import JSZip from 'jszip';
|
|
|
+import { saveAs } from 'file-saver';
|
|
|
+import JSZipUtils from 'jszip-utils';
|
|
|
+import Docxtemplater from 'docxtemplater';
|
|
|
+import ImageModule from 'docxtemplater-image-module-free';
|
|
|
+
|
|
|
+const loadImage = async (tagValue) => {
|
|
|
+ try {
|
|
|
+ const response = await fetch(tagValue);
|
|
|
+ if (!response.ok) {
|
|
|
+ throw new Error('Network response was not ok');
|
|
|
}
|
|
|
- console.log("Content type:", typeof content);
|
|
|
- console.log("获取到的内容:", content);
|
|
|
- console.log("获取到的内容长度:", content.byteLength);
|
|
|
- const uint8Array = new Uint8Array(content);
|
|
|
- console.log("文件内容字节:", uint8Array);
|
|
|
- const zip = new PizZip(content)
|
|
|
- const doc = new Docxtemplater().loadZip(zip)
|
|
|
- console.log(doc)
|
|
|
- doc.setData(data)
|
|
|
- try {
|
|
|
- // render the document (replace all occurences of {first_name} by John, {last_name} by Doe, ...)
|
|
|
- doc.render()
|
|
|
- } catch (error) {
|
|
|
- const e = {
|
|
|
- message: error.message,
|
|
|
- name: error.name,
|
|
|
- stack: error.stack,
|
|
|
- properties: error.properties
|
|
|
+ const blob = await response.blob();
|
|
|
+ return URL.createObjectURL(blob);
|
|
|
+ } catch (error) {
|
|
|
+ console.error('There was a problem with the fetch operation:', error);
|
|
|
+ return null; // 返回 null 或者合适的错误处理
|
|
|
+ }
|
|
|
+};
|
|
|
+export const exportDocx = async (tempDocxPath, dataList, zipFileName) => {
|
|
|
+ try {
|
|
|
+ // 加载模板文件
|
|
|
+ const content = await new Promise((resolve, reject) => {
|
|
|
+ JSZipUtils.getBinaryContent(tempDocxPath, (error, content) => {
|
|
|
+ if (error) {
|
|
|
+ reject(error);
|
|
|
+ } else {
|
|
|
+ resolve(content);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ // 初始化 JSZip 实例，用于打包多个文件
|
|
|
+ const zip = new JSZip();
|
|
|
+
|
|
|
+ // 遍历每一条数据，生成单独的 .docx 文件
|
|
|
+ for (let i = 0; i < dataList.length; i++) {
|
|
|
+ const data = dataList[i];
|
|
|
+
|
|
|
+ const imageOptions = {
|
|
|
+ async getImage(tagValue) {
|
|
|
+ const imageUrl = await loadImage(tagValue);
|
|
|
+ console.log(imageUrl, "我在这里");
|
|
|
+ return imageUrl;
|
|
|
+ },
|
|
|
+ getSize() {
|
|
|
+ return [150, 150];
|
|
|
+ },
|
|
|
+ };
|
|
|
+ const doc = new Docxtemplater(zip, {
|
|
|
+ modules: new ImageModule(imageOptions),
|
|
|
+ });
|
|
|
+ doc.render({
|
|
|
+ image: "logo.png",
|
|
|
+ });
|
|
|
+ const zipContent = doc.getZip(); // 获取 zip 对象
|
|
|
+ if (!zipContent) {
|
|
|
+ throw new Error('Docxtemplater failed to load zip content.');
|
|
|
}
|
|
|
- console.log({
|
|
|
- error: e
|
|
|
- })
|
|
|
- // The error thrown here contains additional information when logged with JSON.stringify (it contains a property object).
|
|
|
- throw error
|
|
|
+
|
|
|
+ // 生成 .docx 文件
|
|
|
+ const out = await zipContent.generateAsync({
|
|
|
+ type: 'blob',
|
|
|
+ mimeType: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
|
|
|
+ });
|
|
|
+
|
|
|
+ // 将生成的 .docx 文件添加到 zip 包中
|
|
|
+ zip.file(`document_${i + 1}.docx`, out);
|
|
|
}
|
|
|
- const out = doc.getZip().generate({
|
|
|
- type: 'blob',
|
|
|
- mimeType: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
|
|
|
- }) // Output the document using Data-URI
|
|
|
- saveAs(out, fileName)
|
|
|
- })
|
|
|
-}
|
|
|
+
|
|
|
+ // 生成 zip 文件并保存
|
|
|
+ const zipBlob = await zip.generateAsync({ type: 'blob' });
|
|
|
+ saveAs(zipBlob, zipFileName);
|
|
|
+ console.log(`文件已成功生成并打包为 ${zipFileName}`);
|
|
|
+ } catch (error) {
|
|
|
+ console.error('导出文件时出错:', error);
|
|
|
+ throw error;
|
|
|
+ }
|
|
|
+};
|
