Added Automatic ZIP Completion

composables/useZipCheck.js

@@ -0,0 +1,11 @@
+
+
+export const useZipCheck = async (zip) => {
+    const supabase = useSupabaseClient()
+
+    console.log((await supabase.from("citys").select().eq("zip",Number(zip)).maybeSingle()).data)
+
+    const result = (await supabase.from("citys").select().eq("zip",Number(zip)).maybeSingle()).data
+
+    return result ? result.short : null
+}

pages/customers/[mode]/[[id]].vue

@@ -1,4 +1,5 @@
 <script setup>
+
 definePageMeta({
   middleware: "auth"
 })
@@ -48,6 +49,10 @@ const cancelEditorCreate = () => {
 
 }
 
+const setCityByZip = async () => {
+    itemInfo.value.infoData.city = await useZipCheck(itemInfo.value.infoData.zip)
+}
+
 setupPage()
 </script>
 
@@ -301,6 +306,7 @@ setupPage()
     >
       <UInput
           v-model="itemInfo.infoData.zip"
+          @focusout="setCityByZip"
       />
     </UFormGroup>
     <UFormGroup

pages/vendors/[mode]/[[id]].vue

@@ -32,16 +32,8 @@ const setupPage = () => {
 
 }
 
-const editItem = async () => {
-  router.push(`/vendors/edit/${currentItem.value.id}`)
-}
-
-const cancelEditorCreate = () => {
-  if(currentItem.value) {
-    router.push(`/vendors/show/${currentItem.value.id}`)
-  } else {
-    router.push(`/vendors`)
-  }
+const setCityByZip = async () => {
+  itemInfo.value.infoData.city = await useZipCheck(itemInfo.value.infoData.zip)
 }
 
 setupPage()
@@ -63,7 +55,7 @@ setupPage()
         Erstellen
       </UButton>
       <UButton
-          @click="cancelEditorCreate"
+          @click="router.push(currentItem.id ? `/vendors/show/${currentItem.id}` : '/vendors/show')"
           color="red"
           class="ml-2"
           v-if="mode === 'edit' || mode === 'create'"
@@ -72,7 +64,7 @@ setupPage()
       </UButton>
       <UButton
           v-if="mode === 'show'"
-          @click="editItem"
+          @click="router.push(`/vendors/edit/${currentItem.id}`)"
       >
         Bearbeiten
       </UButton>
@@ -88,13 +80,13 @@ setupPage()
         <div class="w-1/2 mr-5">
           <UCard>
             <div v-if="currentItem.infoData" class="text-wrap">
-              <p v-if="currentItem.infoData.street">Straße + Hausnummer: {{currentItem.infoData.street}}</p>
-              <p v-if="currentItem.infoData.zip && currentItem.infoData.city">PLZ + Ort: {{currentItem.infoData.zip}} {{currentItem.infoData.city}}</p>
-              <p v-if="currentItem.infoData.tel">Telefon: {{currentItem.infoData.tel}}</p>
-              <p v-if="currentItem.infoData.email">E-Mail: {{currentItem.infoData.email}}</p>
-              <p v-if="currentItem.infoData.web">Web: {{currentItem.infoData.web}}</p>
-              <p v-if="currentItem.infoData.ustid">USt-Id: {{currentItem.infoData.ustid}}</p>
-              <p v-if="currentItem.notes">Notizen:<br> {{currentItem.notes}}</p>
+              <p>Straße + Hausnummer: {{currentItem.infoData.street ? currentItem.infoData.street : ""}}</p>
+              <p>PLZ + Ort: {{currentItem.infoData.zip}} {{currentItem.infoData.city}}</p>
+              <p>Telefon: {{currentItem.infoData.tel}}</p>
+              <p>E-Mail: {{currentItem.infoData.email}}</p>
+              <p>Web: {{currentItem.infoData.web}}</p>
+              <p>USt-Id: {{currentItem.infoData.ustid}}</p>
+              <p>Notizen:<br> {{currentItem.notes}}</p>
             </div>
           </UCard>
           <UCard class="mt-5">
@@ -176,6 +168,7 @@ setupPage()
     >
       <UInput
           v-model="itemInfo.infoData.zip"
+          @focusout="setCityByZip"
       />
     </UFormGroup>
     <UFormGroup