Added Error Display in Invoice Creation

pages/createDocument/edit/[[id]].vue

@@ -264,6 +264,26 @@ const removePosition = (id) => {
 
 }
 
+const findDocumentErrors = computed(() => {
+    let errors = []
+
+    if(itemInfo.value.customer === null) errors.push({message: "Es ist kein Kunde ausgewählt", type: "breaking"})
+    if(itemInfo.value.letterhead === null) errors.push({message: "Es ist kein Briefpapier ausgewählt", type: "breaking"})
+    if(itemInfo.value.address.street === null) errors.push({message: "Es ist keine Straße im Adressat angegeben ausgewählt", type: "breaking"})
+    if(itemInfo.value.address.zip === null) errors.push({message: "Es ist keine Postleitzahl im Adressat angegeben ausgewählt", type: "breaking"})
+    if(itemInfo.value.address.city === null) errors.push({message: "Es ist keine Stadt im Adressat angegeben ausgewählt", type: "breaking"})
+
+    if(itemInfo.value.project === null) errors.push({message: "Es ist kein Projekt ausgewählt", type: "info"})
+
+    itemInfo.value.rows.forEach(row => {
+      if(row.mode === "normal" && !row.product) errors.push({message: `In Position ${row.pos} ist kein Artikel ausgewählt`, type: "breaking"})
+      if(row.mode === "service" && !row.service) errors.push({message: `In Position ${row.pos} ist keine Leistung ausgewählt`, type: "breaking"})
+    })
+
+
+  return errors
+})
+
 const documentTotal = computed(() => {
   let totalNet = 0
   let total19 = 0
@@ -516,6 +536,25 @@ setupPage()
 
 
         <div v-if="item.label === 'Editor'">
+
+          <UAlert
+              class="my-5"
+            title="Probleme:"
+            :color="findDocumentErrors.filter(i => i.type === 'breaking').length > 0 ? 'rose' : ''"
+            variant="outline"
+              v-if="findDocumentErrors.length > 0"
+          >
+            <template #description>
+              <ul class="list-disc ml-5">
+                <li v-for="error in findDocumentErrors" :class="[...error.type === 'breaking' ? ['text-rose-600'] : ['text-gray-700']]">
+                  {{error.message}}
+                </li>
+              </ul>
+            </template>
+
+          </UAlert>
+
+
           <InputGroup>
             <div class="w-1/3 mr-5">
               <UFormGroup