From e558f0ca4c9de7271861601076b2d8e48c513c59 Mon Sep 17 00:00:00 2001
From: 祖安之光 <11848914+light-of-zuan@user.noreply.gitee.com>
Date: 星期二, 18 十一月 2025 14:30:33 +0800
Subject: [PATCH] 修改新增
---
src/utils/exportWord.js | 56 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 56 insertions(+), 0 deletions(-)
diff --git a/src/utils/exportWord.js b/src/utils/exportWord.js
index e0ee5c1..53b0013 100644
--- a/src/utils/exportWord.js
+++ b/src/utils/exportWord.js
@@ -3,6 +3,7 @@
import Docxtemplater from 'docxtemplater';
import JSZipUtils from 'jszip-utils';
import { saveAs } from 'file-saver';
+import ImageModule from 'docxtemplater-image-module-free'; // 新增:图片处理模
// 加载 .docx 模板文件
function loadFile(url, callback) {
@@ -13,6 +14,19 @@
export function download(file, name) {
}
+// 辅助函数:将 base64 图片转为 Uint8Array(图片模块需要此格式)
+function base64ToUint8Array(base64) {
+ // 去掉 base64 前缀(如 "data:image/png;base64,")
+ const base64WithoutPrefix = base64.replace(/^data:image\/\w+;base64,/, '');
+ const binaryString = atob(base64WithoutPrefix);
+ const length = binaryString.length;
+ const uint8Array = new Uint8Array(length);
+ for (let i = 0; i < length; i++) {
+ uint8Array[i] = binaryString.charCodeAt(i);
+ }
+ return uint8Array;
+}
+
// 生成并下载 Word 文档(templatePath是word文档模版地址,data是对应的数据)
export function generateWordDocument(templatePath, data, name) {
@@ -23,13 +37,55 @@
}
try {
+ // 新版创建解析器的正确方式(无需 import AngularParser)
+ const parser = (tag, _variable) => {
+ return {
+ get(scope) {
+ if (scope[tag] !== undefined) {
+ return scope[tag] || '';
+ }
+ // 处理特殊变量(如 $first)
+ if (tag.startsWith('$')) {
+ const varName = tag.slice(1);
+ return scope[varName] || '';
+ }
+ return '';
+ }
+ };
+ };
+ // 1. 配置图片处理规则(核心)
+ const imageModule = new ImageModule({
+ // 获取图片:根据传入的图片数据(base64)转为模块需要的格式
+ getImage: function (tagValue, tagName) {
+ // tagValue:data 中对应图片键的值(必须是 base64 字符串)
+ // tagName:图片占位符的键名(如 "avatar")
+ return base64ToUint8Array(tagValue);
+ },
+ // 设置图片尺寸:返回 [宽度, 高度](单位:px),可动态调整
+ getSize: function (tagValue, tagName) {
+
+ // 示例:根据不同的图片键,返回不同尺寸
+ switch (tagName) {
+ case 'avatar': // 头像:200x200
+ return [200, 200];
+ case 'coverImg': // 封面图:600x300
+ return [600, 300];
+ default: // 默认尺寸:400x300
+ return [80, 130];
+ }
+ }
+ });
// 加载模板文件内容到 PizZip
const zip = new PizZip(content);
const doc = new Docxtemplater(zip, {
paragraphLoop: true,
linebreaks: true,
+ modules: [imageModule] // 关键:注入图片模块
});
+ // const parser = new AngularParser();
+ // doc.setOptions({ parser });
+
// 设置模板中的占位符数据
doc.setData(data);
--
Gitblit v1.9.2