Corrected Incoming Invoice

Added Column Selection to Customers,Vendors and Contacts

spaces/pages/vendors/index.vue

@@ -6,16 +6,40 @@
         v-model="searchString"
         placeholder="Suche..."
     />
+
+    <USelectMenu
+        v-model="selectedColumns"
+        multiple
+        :options="columnTemplate"
+        :uiMenu="{width:'w-40'}"
+        :popper="{placement: 'bottom-start'}"
+        by="key"
+    >
+      <UButton
+          color="gray"
+          variant="ghost"
+          class="flex-1 justify-between"
+          icon="i-heroicons-view-columns"
+      />
+
+      <template #option="{ option }">
+        {{option.label}}
+      </template>
+    </USelectMenu>
   </Toolbar>
 
 
   <div class="table">
     <UTable
         :rows="filteredRows"
-        :columns="itemColumns"
+        :columns="selectedColumns"
         @select="selectItem"
         :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
-    />
+    >
+      <template #address-data="{row}">
+        {{row.infoData.street ? `${row.infoData.street}, ` : ''}}{{row.infoData.special ? `${row.infoData.special},` : ''}} {{(row.infoData.zip || row.infoData.city) ? `${row.infoData.zip} ${row.infoData.city}, ` : ''}} {{row.infoData.country}}
+      </template>
+    </UTable>
   </div>
 
 </template>
@@ -30,7 +54,24 @@ const dataStore = useDataStore()
 const router = useRouter()
 const mode = ref("show")
 
-const itemColumns = [
+const columnTemplate = ref([
+  {
+    key: 'vendorNumber',
+    label: "Lieferantennr.",
+    sortable: true
+  },
+  {
+    key: "name",
+    label: "Name",
+    sortable: true
+  },
+  {
+    key: "address",
+    label: "Adresse",
+    sortable: true
+  }
+])
+const selectedColumns = ref([
   {
     key: 'vendorNumber',
     label: "Lieferantennr.",
@@ -41,7 +82,7 @@ const itemColumns = [
     label: "Name",
     sortable: true
   }
-]
+])
 
 
 const selectItem = (item) => {