Files
temu-plugin/src/components/print/customProvider.js
yanran200730 4b6e221369 修复bug
2024-10-29 21:36:51 +08:00

130 lines
4.5 KiB
JavaScript

/* eslint-disable no-undef */
import { hiprint } from 'vue-plugin-hiprint'
export const customProvider = function () {
const addElementTypes = function (context) {
context.removePrintElementTypes('customProvider')
context.addPrintElementTypes('customProvider', [
new hiprint.PrintElementTypeGroup('', [
{
tid: 'providerModule1.html',
title: 'temu条码',
data: 'XS888888888',
type: 'html',
formatter: function (data, options, sukData) {
const elId = options.elId || 'barCode-' + new Date().getTime()
const codeWidth = parseInt((options.width - 22) * 0.85)
let printData = {
labelCode: 123456789,
productSkuId: `XXXXXXXXXXXXXX`,
skuExtCode: 'XXXXXXXXXXXXXX',
skuSpecName: 'XXXXX'
}
options.elId = `${elId}`
if (sukData) {
printData = sukData
}
$('body').append(`<div id="codewrapper-${elId}" style="width: ${codeWidth}pt">
<svg id="${elId}" width="100%" display="block" height="100%" class="hibarcode_imgcode" preserveAspectRatio="none slice"></svg>
</div>`)
JsBarcode('#' + elId, printData.labelCode, {
format: 'CODE128B',
width: 2,
height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,
margin: 0,
displayValue: false
})
const codeHtml = $(`#codewrapper-${elId}`).html()
$(`body>#codewrapper-${elId}`).remove()
const resizeObserver = new ResizeObserver(() => {
JsBarcode('#' + elId, printData.labelCode, {
format: "CODE128B",
width: 2,
height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,
margin: 0,
displayValue: false
})
})
setTimeout(() => {
const node = document.getElementById(`temuBarCode-${elId}`)
if (node) {
resizeObserver.observe(node)
}
}, 0)
var html = `
<div class="temuBarCode" id="temuBarCode-${elId}">
<div class="temuBarCode-top">
<div class="hiprint-printElement-text-content hiprint-printElement-content">${printData.skuExtCode || printData.productSkcId}</div>
<div class="hiprint-printElement-text-content hiprint-printElement-content">${printData.skuSpecName}</div>
</div>
<div class="temuBarCode-middle">
<div class="hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code" style="width: 100%">
${codeHtml}
</div>
</div>
<div class="temuBarCode-bottom">
<div class="hiprint-printElement-text-content hiprint-printElement-content">${printData.productSkuId}</div>
<div class="hiprint-printElement-text-content hiprint-printElement-content">Made in China</div>
</div>
</div>
`
return html
},
options: {
width: 316,
height: 120,
elId: ''
},
printElementType: {
}
},
// {
// tid: 'providerModule1.barcode',
// title: '条形码',
// data: 'XS888888888',
// type: 'text',
// options: {
// field: 'barcode',
// testData: 'XS888888888',
// height: 32,
// fontSize: 12,
// lineHeight: 18,
// textAlign: 'left',
// textType: 'barcode',
// hideTitle: false
// }
// },
// {
// tid: 'providerModule1.qrcode',
// title: '二维码',
// data: 'XS888888888',
// type: 'text',
// options: {
// field: '',
// testData: '',
// height: 32,
// fontSize: 12,
// lineHeight: 18,
// textType: 'qrcode',
// hideTitle: false
// }
// },
{
tid: 'providerModule1.image',
title: '图片',
data: 'https://foruda.gitee.com/avatar/1677050350324030848/5400665_ccsimple_1591166830.png!avatar200',
type: 'image'
}
])
])
}
return {
addElementTypes
}
}