feat:生成图片更新

.env.development

@@ -11,15 +11,15 @@ ENV = 'development'
 # VITE_ADMIN_PROXY_PATH = http://123.157.250.162:8089/api/ # 测试线上
 # VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/ # 测试线上-过期
 # VITE_ADMIN_PROXY_PATH = http://localhost:9999/
-VITE_ADMIN_PROXY_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
-# VITE_ADMIN_PROXY_PATH = https://stgl.pj.gov.cn/api # 正式环境线上
+# VITE_ADMIN_PROXY_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
+VITE_ADMIN_PROXY_PATH = https://stgl.pj.gov.cn/api # 正式环境线上
 
 # 图片访问基础地址
 # VITE_IMAGE_BASE_PATH = http://123.157.250.162:8089/api/ # 测试线上
 # VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089/api/ # 测试线上-过期
 # VITE_IMAGE_BASE_PATH = http://localhost:9999
-VITE_IMAGE_BASE_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
-# VITE_IMAGE_BASE_PATH = https://stgl.pj.gov.cn/api/ # 正式环境线上
+# VITE_IMAGE_BASE_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
+VITE_IMAGE_BASE_PATH = https://stgl.pj.gov.cn/api/ # 正式环境线上
 
 # 代码生成服务地址
 VITE_GEN_PROXY_PATH = http://192.168.110.156:5003

src/views/wallet/wallet-recharge-invoice/index.vue

@@ -86,6 +86,12 @@
 							:downloadName="`${row.code}-${row.deptOrUser}-${row.payeeDept}-发票-${row.updateTime}`" />
 					</template>
 				</el-table-column>
+				<el-table-column prop="stampPicUrl" min-width="120" label="发票图片">
+					<template #default="{ row }">
+						<preview-image :src="row.picUrl" download
+							:downloadName="`${row.code}-${row.deptOrUser}-${row.payeeDept}-发票-${row.updateTime}`" />
+					</template>
+				</el-table-column>
 				<el-table-column prop="remark" label="备注" show-overflow-tooltip />
 				<el-table-column width="250" label="时间">
 					<template #default="{ row }">

src/views/wallet/wallet-recharge-invoice/print-dialog.vue

@@ -247,6 +247,13 @@ const waitForFrames = async (count: number) => {
 	}
 }
 
+const captureFilter = (node: Node) => {
+	if (!(node instanceof HTMLElement)) return true
+	if (node.classList.contains("el-loading-mask")) return false
+	if (node.classList.contains("el-loading-spinner")) return false
+	return true
+}
+
 const withReceiptCaptureStyle = async <T,>(fn: () => Promise<T>) => {
 	const el = receiptRef.value
 	if (!el) return fn()
@@ -278,8 +285,9 @@ const genImage = async (): Promise<Blob | void | null> => {
 		return await htmlToImage.toBlob(receiptRef.value!, {
 			canvasWidth: 661.5,
 			canvasHeight: 359.1,
-			backgroundColor: "transparent",
+			backgroundColor: "#ffffff",
 			pixelRatio: 3,
+			filter: captureFilter,
 		})
 	}).catch((error) => {
 		console.error(error)
@@ -374,7 +382,8 @@ const handlePrint = async () => {
 				canvasWidth: 661.5,
 				canvasHeight: 359.1,
 				pixelRatio: 4,
-				backgroundColor: "transparent",
+				backgroundColor: "#ffffff",
+				filter: captureFilter,
 			})
 		})
 		printJS({ printable: pngBase64, type: "image", targetStyles: ["*"], maxWidth: 661.5 })