diff --git a/src/api/erp/product/product/index.ts b/src/api/erp/product/product/index.ts index 7270a803..3b8fbb3d 100644 --- a/src/api/erp/product/product/index.ts +++ b/src/api/erp/product/product/index.ts @@ -7,6 +7,7 @@ export interface ProductVO { barCode: string // 产品条码 isCode?: boolean qrcodeUrl?: string + templateJson?: string | any categoryId: number // 产品类型编号 subCategoryId: number // 产品类型子类编号 subCategoryName: string // 产品类型子类名称 diff --git a/src/components/QrcodeActionCard/index.vue b/src/components/QrcodeActionCard/index.vue index ca74d771..7477e779 100644 --- a/src/components/QrcodeActionCard/index.vue +++ b/src/components/QrcodeActionCard/index.vue @@ -63,6 +63,9 @@ const props = withDefaults( printPaperHeight?: number printMaxWidth?: number printMaxHeight?: number + templateJsonUrl?: string + templateJson?: any + printData?: Record }>(), { imageUrl: '', @@ -82,7 +85,10 @@ const props = withDefaults( printPaperWidth: 80, printPaperHeight: 80, printMaxWidth: 180, - printMaxHeight: 120 + printMaxHeight: 120, + templateJsonUrl: '', + templateJson: undefined, + printData: () => ({}) } ) @@ -202,26 +208,88 @@ const handlePreview = () => { }) } +const replaceTemplateValues = (templateJson: any, printData: Record) => { + if (!templateJson?.panels) return templateJson + + return { + ...templateJson, + panels: templateJson.panels.map((panel: any) => ({ + ...panel, + printElements: panel.printElements?.map((element: any) => { + if (!element?.options?.qid) return element + + const qid = element.options.qid + const value = printData[qid] + + if (value === undefined || value === null) return element + + const newOptions = { ...element.options } + + if (qid === 'qrcodeUrl') { + newOptions.src = value + newOptions.testData = value + } else { + newOptions.field = qid + if (newOptions.testData === undefined || newOptions.testData === '') { + newOptions.testData = String(value) + } + } + + return { + ...element, + options: newOptions + } + }) || [] + })) + } +} + const handlePrint = async () => { if (!props.imageUrl || !props.showPrint) return - const printSize = await resolvePrintSize(props.imageUrl) - const imageWidth = printSize.width - const imageHeight = printSize.height - const printId = props.printId === undefined || props.printId === null ? '' : String(props.printId) - const idAreaHeight = printId ? 14 : 0 - const paperHeight = imageHeight + idAreaHeight + + let templateJson: any + let printData: Record + + printData = { + qrcodeUrl: props.imageUrl, + printId: props.printId === undefined || props.printId === null ? '' : String(props.printId), + ...props.printData + } + + if (props.templateJson) { + templateJson = replaceTemplateValues(props.templateJson, printData) + } else if (props.templateJsonUrl) { + try { + const response = await request.get({ url: props.templateJsonUrl }) + templateJson = typeof response.data === 'string' ? JSON.parse(response.data) : response.data + templateJson = replaceTemplateValues(templateJson, printData) + } catch (error) { + console.error('获取打印模板失败', error) + message.error('获取打印模板失败') + return + } + } else { + const printSize = await resolvePrintSize(props.imageUrl) + const imageWidth = printSize.width + const imageHeight = printSize.height + const printId = props.printId === undefined || props.printId === null ? '' : String(props.printId) + const idAreaHeight = printId ? 14 : 0 + const paperHeight = imageHeight + idAreaHeight + + templateJson = buildQrcodeTemplateJson(props.imageUrl, printId, imageWidth, imageHeight, paperHeight) + } + + const paperSize = templateJson?.panels?.[0] ? { + width: templateJson.panels[0].width, + height: templateJson.panels[0].height + } : { width: 80, height: 80 } + hiprintPreviewDialogRef.value?.open({ title: props.printTitle, - printData: { - qrcodeUrl: props.imageUrl, - printId - }, - templateJson: buildQrcodeTemplateJson(props.imageUrl, printId, imageWidth, imageHeight, paperHeight), + printData, + templateJson, withDefaultQrcodeLayout: false, - paperSize: { - width: imageWidth, - height: paperHeight - } + paperSize }) } diff --git a/src/views/erp/product/product/ProductForm.vue b/src/views/erp/product/product/ProductForm.vue index 784f2609..cf6db022 100644 --- a/src/views/erp/product/product/ProductForm.vue +++ b/src/views/erp/product/product/ProductForm.vue @@ -163,6 +163,8 @@ :refresh-url="getQrcodeRefreshUrl()" :refresh-disabled="!formData.id || !formData.barCode" refresh-confirm-text="确认刷新该产品二维码吗?" + :template-json="formData.templateJson" + :print-data="buildPrintData()" @refresh-success="handleQrcodeRefreshSuccess" /> @@ -296,6 +298,7 @@ const formData = ref({ barCode: undefined, isCode: undefined, qrcodeUrl: undefined, + templateJson: undefined, categoryId: undefined, unitId: undefined, status: undefined, @@ -511,9 +514,14 @@ const open = async (type: string, id?: number) => { ['name', 'code'], '模具' ) + const templateJson = productData?.templateJson + const parsedTemplateJson = typeof templateJson === 'string' + ? JSON.parse(templateJson) + : templateJson formData.value = { ...formData.value, ...productData, + templateJson: parsedTemplateJson, devices, molds } @@ -538,6 +546,17 @@ const getQrcodeRefreshUrl = () => { return `/erp/product/regenerate-code?id=${formData.value.id}&code=${encodeURIComponent(String(formData.value.barCode))}` } +const buildPrintData = () => { + return { + id: formData.value.id, + name: formData.value.name, + barCode: formData.value.barCode, + standard: formData.value.standard, + remark: formData.value.remark, + qrcodeUrl: formData.value.qrcodeUrl + } +} + const handleQrcodeRefreshSuccess = async (data: any) => { if (!formData.value.id) return if (data?.qrcodeUrl) { diff --git a/src/views/mes/printTemplate/PrintTemplateDesigner.vue b/src/views/mes/printTemplate/PrintTemplateDesigner.vue index c3f57bf2..f004929b 100644 --- a/src/views/mes/printTemplate/PrintTemplateDesigner.vue +++ b/src/views/mes/printTemplate/PrintTemplateDesigner.vue @@ -82,7 +82,6 @@ const baseElements = [ { tid: 'qrcodeModule.qrcode', label: '二维码' }, { tid: 'defaultModule.longText', label: '长文' }, { tid: 'defaultModule.table', label: '表格' }, - { tid: 'defaultModule.html', label: 'HTML' }, { tid: 'defaultModule.hline', label: '横线' }, { tid: 'defaultModule.vline', label: '竖线' }, { tid: 'defaultModule.rect', label: '矩形' },