105 lines
2.2 KiB
TypeScript
Executable File
105 lines
2.2 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: 50,
|
|
},
|
|
widthlines: {
|
|
type: Number,
|
|
required: false,
|
|
default: 2,
|
|
},
|
|
show_at_right: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false,
|
|
},
|
|
height: {
|
|
type: String,
|
|
required: false,
|
|
default: '100',
|
|
},
|
|
gap: {
|
|
type: String,
|
|
required: false,
|
|
default: '0',
|
|
},
|
|
fontsize: {
|
|
type: String,
|
|
required: false,
|
|
default: '16',
|
|
},
|
|
},
|
|
setup(props, { emit }) {
|
|
const $q = useQuasar()
|
|
const { t } = useI18n();
|
|
|
|
// Converti le props in riferimenti reattivi
|
|
const { value, format, width, widthlines, height, fontsize } = toRefs(props);
|
|
|
|
// Funzione per disegnare il codice a barre
|
|
const drawBarcode = () => {
|
|
try {
|
|
if (value.value && value.value.length > 2) {
|
|
JsBarcode("#C" + value.value, value.value, {
|
|
format: format.value,
|
|
width: widthlines.value,
|
|
height: tools.convstrToNum(height.value),
|
|
displayValue: true,
|
|
lineColor: "#000",
|
|
font: "monospace",
|
|
margin: 0,
|
|
textMargin: 0,
|
|
marginTop: 0,
|
|
fontSize: tools.convstrToNum(fontsize.value),
|
|
textPosition: "bottom",
|
|
});
|
|
}
|
|
} catch (e) {
|
|
|
|
}
|
|
}
|
|
|
|
// Chiamato quando il componente è montato
|
|
onMounted(() => {
|
|
drawBarcode();
|
|
})
|
|
|
|
// Watcher per aggiornamenti delle proprietà
|
|
watch([value, format, width, height, fontsize], () => {
|
|
drawBarcode();
|
|
})
|
|
|
|
return {
|
|
tools,
|
|
toolsext,
|
|
fontsize,
|
|
}
|
|
},
|
|
})
|