Files
newfreeplanet_OLD/src/components/CBarCode/CBarCode.ts
2024-11-19 19:19:14 +01:00

84 lines
1.8 KiB
TypeScript
Executable File

import { defineComponent, onMounted, ref, toRef, watch, toRefs } from 'vue'
import { tools } from '@src/store/Modules/tools'
import { useQuasar } from 'quasar'
import { useI18n } from '@/boot/i18n'
import { toolsext } from '@store/Modules/toolsext'
import JsBarcode from 'jsbarcode'
export default defineComponent({
name: 'CBarCode',
props: {
value: {
type: String,
required: true,
},
format: {
type: String,
required: false,
default: 'CODE128',
},
text: {
type: String,
required: false,
default: '',
},
width: {
type: Number,
required: false,
default: 2,
},
height: {
type: Number,
required: false,
default: 100,
},
fontsize: {
type: Number,
required: false,
default: 16,
},
},
setup(props, { emit }) {
const $q = useQuasar()
const { t } = useI18n();
// Converti le props in riferimenti reattivi
const { value, format, width, height, fontsize } = toRefs(props);
// Funzione per disegnare il codice a barre
const drawBarcode = () => {
JsBarcode("#C" + value.value, value.value, {
format: format.value,
width: width.value,
height: height.value,
displayValue: true,
lineColor: "#000",
font: "monospace",
margin: 1,
textMargin: 0,
marginTop: 0,
fontSize: fontsize.value,
textPosition:"bottom",
});
}
// Chiamato quando il componente è montato
onMounted(() => {
drawBarcode();
})
// Watcher per aggiornamenti delle proprietà
watch([value, format, width, height, fontsize], () => {
drawBarcode();
})
return {
tools,
toolsext,
fontsize,
}
},
})