From baa06b60fba47859d4dc9e425ddd5751076cd852 Mon Sep 17 00:00:00 2001
From: flfeders <f.federspiel@federspiel.tech>
Date: Tue, 30 Jul 2024 12:01:07 +0200
Subject: [PATCH] Cahnges

---
 components/MainNav.vue                  |   4 +
 composables/usePrintLabel.js            |  26 +++++
 pages/createDocument/edit/[[id]].vue    |  17 ++--
 pages/products/[mode]/[[id]].vue        |   9 +-
 pages/settings/labels/[mode]/[[id]].vue | 126 ++++++++++++++++++++++++
 pages/settings/labels/index.vue         | 113 +++++++++++++++++++++
 6 files changed, 282 insertions(+), 13 deletions(-)
 create mode 100644 composables/usePrintLabel.js
 create mode 100644 pages/settings/labels/[mode]/[[id]].vue
 create mode 100644 pages/settings/labels/index.vue

diff --git a/components/MainNav.vue b/components/MainNav.vue
index 2ddabf8..e978419 100644
--- a/components/MainNav.vue
+++ b/components/MainNav.vue
@@ -209,6 +209,10 @@ const links = computed(() => {
           label: "Reparaturprozesse",
           to: "/repairs/prozess/",
           icon: "i-heroicons-bars-3-solid"
+        },{
+          label: "Labels",
+          to: "/settings/labels/",
+          icon: "i-heroicons-bars-3-solid"
         }
       ]
     },
diff --git a/composables/usePrintLabel.js b/composables/usePrintLabel.js
new file mode 100644
index 0000000..959156c
--- /dev/null
+++ b/composables/usePrintLabel.js
@@ -0,0 +1,26 @@
+
+import Handlebars from "handlebars";
+
+export const usePrintLabel = async (printServerId,printerName , rawZPL ) => {
+    const supabase = useSupabaseClient()
+    const dataStore = useDataStore()
+
+    await supabase.from("printJobs").insert({
+        tenant: dataStore.currentTenant,
+        rawContent: rawZPL,
+        printerName: printerName,
+        printServer: printServerId
+    })
+
+
+
+}
+
+export const useGenerateZPL = (rawZPL,data) => {
+    let template = Handlebars.compile(rawZPL)
+
+    return template(data)
+}
+
+
+
diff --git a/pages/createDocument/edit/[[id]].vue b/pages/createDocument/edit/[[id]].vue
index a595c8e..60f09bf 100644
--- a/pages/createDocument/edit/[[id]].vue
+++ b/pages/createDocument/edit/[[id]].vue
@@ -313,7 +313,7 @@ const getDocumentData = () => {
     vorname: contactData ? contactData.firstName : "",
     nachname: contactData ? contactData.lastName : ""
   }))
-  console.log(templateEndText({zahlungsziel_in_tagen: 14}))
+  console.log(templateEndText({zahlungsziel_in_tagen: itemInfo.value.paymentDays}))
 
 
 
@@ -364,9 +364,13 @@ const generateDocument = async () => {
 
   const {data,error} = await supabase.storage.from("files").download(path)
 
+  console.log(data)
+  console.log(error)
+
   uri.value = await useCreatePdf(getDocumentData(), await data.arrayBuffer())
   //alert(uri.value)
   showDocument.value = true
+  console.log(uri.value)
 }
 
 const onChangeTab = (index) => {
@@ -407,7 +411,8 @@ const saveDocument = async () => {
     description: itemInfo.value.description,
     startText: itemInfo.value.startText,
     endText: itemInfo.value.endText,
-    rows: itemInfo.value.rows
+    rows: itemInfo.value.rows,
+    contactPerson: itemInfo.value.contactPerson
   }
 
   let data = null
@@ -420,12 +425,6 @@ const saveDocument = async () => {
 
   await router.push(`/createDocument/edit/${data[0].id}`)
 
-
-
-
-
-
-
 }
 
 const closeDocument = async () => {
@@ -1177,6 +1176,7 @@ setupPage()
           </UFormGroup>
         </div>
         <div v-else-if="item.label === 'Vorschau'">
+
           <!--            <UButton
                         @click="generateDocument"
                       >
@@ -1188,6 +1188,7 @@ setupPage()
               type="application/pdf"
               class="w-full previewDocument"
           />
+
         </div>
       </template>
     </UTabs>
diff --git a/pages/products/[mode]/[[id]].vue b/pages/products/[mode]/[[id]].vue
index fce6462..a8ffbea 100644
--- a/pages/products/[mode]/[[id]].vue
+++ b/pages/products/[mode]/[[id]].vue
@@ -44,7 +44,6 @@ const setupPage = async () => {
     itemInfo.value = await useSupabaseSelectSingle("products",route.params.id,"*")
   }
 
-  if(mode.value === "edit") itemInfo.value = itemInfo.value
 
 }
 
@@ -59,11 +58,10 @@ const cancelEditorCreate = () => {
 
 
 const printLabel = async (content) => {
-  let label = await useSupabaseSelectSingle("labels",1,"*")
-  console.log(label)
-  let zpl = label.zpl.replace("{{barcodeContent}}",content)
+  const label = await useSupabaseSelectSingle("printLabels",1,'*')
 
-  await useZebraPstPrnt(zpl)
+
+  usePrintLabel('0dbe30f3-3008-4cde-8a7c-e785b1c22bfc','ZD411',useGenerateZPL(label.handlebarsZPL,{barcode:itemInfo.value.articleNumber }))
 
 }
 
@@ -142,6 +140,7 @@ setupPage()
           />
 
           <UButton @click="printLabel(itemInfo.ean)">Print Label</UButton>
+          {{itemInfo}}
 
           <span v-if="itemInfo.manufacturer">Hersteller: {{itemInfo.manufacturer}}<br></span>
           <span v-if="itemInfo.manufacturerNumber">Herstellernummer: {{itemInfo.manufacturerNumber}}<br></span>
diff --git a/pages/settings/labels/[mode]/[[id]].vue b/pages/settings/labels/[mode]/[[id]].vue
new file mode 100644
index 0000000..0095ffe
--- /dev/null
+++ b/pages/settings/labels/[mode]/[[id]].vue
@@ -0,0 +1,126 @@
+
+
+<template>
+    <UDashboardNavbar >
+      <template #left>
+        <UButton
+            icon="i-heroicons-chevron-left"
+            variant="outline"
+            @click="router.push(`/settings/labels`)"
+        >
+          Labels
+        </UButton>
+      </template>
+      <template #center>
+        <h1
+            v-if="itemInfo"
+            class="text-xl font-medium"
+        >{{itemInfo.name ? `Label: ${itemInfo.name}` : (mode === 'create' ? 'Label erstellen' : 'Label bearbeiten')}}</h1>
+      </template>
+    </UDashboardNavbar>
+
+    <UTabs
+      :items="[{label: 'Informationen'}]"
+      v-if="mode === 'show' && itemInfo"
+      class="p-5"
+      v-model="openTab"
+    >
+      <template #item="{item}">
+        <UCard class="mt-5">
+          <div
+              v-if="item.label === 'Informationen'"
+              class="flex flex-row"
+          >
+            <div class="w-1/2 mr-5">
+              <UDivider>Allgemeines</UDivider>
+              <Toolbar>
+                <UButton @click="usePrintLabel('0dbe30f3-3008-4cde-8a7c-e785b1c22bfc','ZD411',useGenerateZPL(itemInfo.handlebarsZPL,{barcode:'XXX'}))">Test Druck</UButton>
+
+              </Toolbar>
+              <p>Name: {{itemInfo.name}}</p>
+              <p>Breite in Zoll: {{itemInfo.widthInch}}"</p>
+              <p>Höhe in Zoll: {{itemInfo.heightInch}}"</p>
+              <p>ZPL:</p>
+              <pre>{{itemInfo.handlebarsZPL}}</pre>
+
+            </div>
+            <div class="w-1/2">
+              <UDivider>Vorschau</UDivider>
+              <img
+                  class="mx-auto mt-5"
+                  v-if="demoZPL"
+                  :src="`https://api.labelary.com/v1/printers/8dpmm/labels/${itemInfo.widthInch}x${itemInfo.heightInch}/0/${demoZPL}`"
+              />
+            </div>
+          </div>
+
+        </UCard>
+      </template>
+    </UTabs>
+
+
+
+
+
+
+
+</template>
+
+<script setup>
+
+defineShortcuts({
+  'backspace': () => {
+    router.push("/settings/labels")
+  },
+  'arrowleft': () => {
+    if(openTab.value > 0){
+      openTab.value -= 1
+    }
+  },
+  'arrowright': () => {
+    if(openTab.value < 3) {
+      openTab.value += 1
+    }
+  },
+})
+
+const router = useRouter()
+const supabase = useSupabaseClient()
+const dataStore = useDataStore()
+const mode = useRoute().params.mode
+const openTab = ref(0)
+
+const itemInfo = ref({})
+
+const setupPage = async () => {
+  itemInfo.value = await useSupabaseSelectSingle("printLabels",useRoute().params.id,'*')
+  renderDemoZPL()
+}
+
+const demoZPL = ref("")
+const renderDemoZPL = () => {
+  let template = Handlebars.compile(itemInfo.value.handlebarsZPL)
+
+  demoZPL.value = template({barcode: "XXX"})
+}
+
+const printLabel = async () => {
+  await supabase.from("printJobs").insert({
+    tenant: dataStore.currentTenant,
+    rawContent: useGenerateZPL(itemInfo.value.handlebarsZPL,{barcode:"XXX"}),
+    printerName: "ZD411",
+    printServer: "0dbe30f3-3008-4cde-8a7c-e785b1c22bfc"
+  })
+}
+
+
+setupPage()
+
+
+</script>
+
+<style scoped>
+img {
+  border: 1px solid black
+}
+</style>
\ No newline at end of file
diff --git a/pages/settings/labels/index.vue b/pages/settings/labels/index.vue
new file mode 100644
index 0000000..c25247e
--- /dev/null
+++ b/pages/settings/labels/index.vue
@@ -0,0 +1,113 @@
+
+
+<template>
+  <UDashboardNavbar
+    title="Labels"
+  >
+    <template #right>
+      <UInput
+          id="searchinput"
+          v-model="searchString"
+          icon="i-heroicons-funnel"
+          autocomplete="off"
+          placeholder="Suche..."
+          class="hidden lg:block"
+          @keydown.esc="$event.target.blur()"
+      >
+        <template #trailing>
+          <UKbd value="/" />
+        </template>
+      </UInput>
+
+      <UButton @click="router.push(`/settings/labels/create`)" disabled>+ Label</UButton>
+    </template>
+  </UDashboardNavbar>
+<!--  <UDashboardToolbar>
+
+  </UDashboardToolbar>-->
+
+  <UTable
+    :rows="items"
+    :columns="columns"
+    @select="(i) => router.push(`/settings/labels/show/${i.id}`)"
+    class="w-full"
+    :ui="{ divide: 'divide-gray-200 dark:divide-gray-800' }"
+    :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Artikel anzuzeigen' }"
+  >
+    <template #name-data="{row}">
+      <span
+          v-if="row === filteredRows[selectedItem]"
+          class="text-primary-500 font-bold">{{row.name}}</span>
+      <span v-else>
+        {{row.name}}
+      </span>
+
+    </template>
+  </UTable>
+</template>
+
+<script setup>
+
+definePageMeta({
+  middleware: "auth"
+})
+
+defineShortcuts({
+  '/': () => {
+    //console.log(searchinput)
+    //searchinput.value.focus()
+    document.getElementById("searchinput").focus()
+  },
+  '+': () => {
+    router.push("/settings/labels/create")
+  },
+  'Enter': {
+    usingInput: true,
+    handler: () => {
+      router.push(`/settings/labels/show/${filteredRows.value[selectedItem.value].id}`)
+    }
+  },
+  'arrowdown': () => {
+    if(selectedItem.value < filteredRows.value.length - 1) {
+      selectedItem.value += 1
+    } else {
+      selectedItem.value = 0
+    }
+  },
+  'arrowup': () => {
+    if(selectedItem.value === 0) {
+      selectedItem.value = filteredRows.value.length - 1
+    } else {
+      selectedItem.value -= 1
+    }
+  }
+})
+
+const router = useRouter()
+
+const items = ref([])
+const selectedItem = ref(0)
+
+const setupPage = async () => {
+    items.value = await useSupabaseSelect("printLabels","*")
+}
+
+setupPage()
+
+const templateColumns = [{key: 'name',label:'Name'},{key: 'widthInch',label:'Breite in Zoll'},{key: 'heightInch',label:'Höhe in Zoll'}]
+const selectedColumns = ref(templateColumns)
+const columns = computed(() => templateColumns.filter((column) => selectedColumns.value.includes(column)))
+
+const searchString = ref('')
+
+const filteredRows = computed(() => {
+
+  return useSearch(searchString.value, items.value)
+
+})
+
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file