53 lines
1.4 KiB
Vue
53 lines
1.4 KiB
Vue
<script setup lang="ts">
|
|
|
|
const labelPrinter = useLabelPrinterStore()
|
|
|
|
const showPrinterInfo = ref(false)
|
|
|
|
const handleClick = async () => {
|
|
if(labelPrinter.connected) {
|
|
showPrinterInfo.value = true
|
|
} else {
|
|
await labelPrinter.connect('ble')
|
|
}
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<!-- Printer Button -->
|
|
|
|
<UModal v-model="showPrinterInfo">
|
|
<UCard>
|
|
<template #header>
|
|
<div class="flex items-center justify-between">
|
|
<h3 class="text-lg font-semibold">Drucker Informationen</h3>
|
|
<UButton icon="i-heroicons-x-mark" variant="ghost" @click="showPrinterInfo = false" />
|
|
</div>
|
|
</template>
|
|
<p>Seriennummer: {{labelPrinter.info.serial}}</p>
|
|
<p>MAC: {{labelPrinter.info.mac}}</p>
|
|
<p>Modell: {{labelPrinter.info.modelId}}</p>
|
|
<p>Charge: {{labelPrinter.info.charge}}</p>
|
|
<p>Hardware Version: {{labelPrinter.info.hardwareVersion}}</p>
|
|
<p>Software Version: {{labelPrinter.info.softwareVersion}}</p>
|
|
</UCard>
|
|
</UModal>
|
|
|
|
<UButton
|
|
:icon="labelPrinter.connected ? 'i-heroicons-printer' : 'i-heroicons-printer'"
|
|
:color="labelPrinter.connected ? 'green' : 'gray'"
|
|
variant="soft"
|
|
class="w-full justify-start"
|
|
:loading="labelPrinter.connectLoading"
|
|
@click="handleClick"
|
|
>
|
|
<span v-if="labelPrinter.connected">Drucker verbunden</span>
|
|
<span v-else>Drucker verbinden</span>
|
|
</UButton>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |