Added Phases to Projects

spaces/pages/products/index.vue

@@ -1,22 +1,20 @@
 <template>
-  <div>
-
-    <div class="flex items-center gap-1">
-      <UButton @click="router.push(`/products/create/`)">+ Artikel</UButton>
-
-      <UInput
-          v-model="searchString"
-          placeholder="Suche..."
-      />
-    </div>
+  <Toolbar>
+    <UButton @click="router.push(`/products/create/`)">+ Artikel</UButton>
 
+    <UInput
+        v-model="searchString"
+        placeholder="Suche..."
+    />
+  </Toolbar>
 
 
+  <div class="table">
     <UTable
-      :rows="filteredRows"
-      :columns="itemColumns"
-      @select="selectItem"
-      :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
+        :rows="filteredRows"
+        :columns="itemColumns"
+        @select="selectItem"
+        :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
     >
       <template #stock-data="{row}">
         {{`${dataStore.getStockByProductId(row.id)} ${(dataStore.units.find(unit => unit.id === row.unit) ? dataStore.units.find(unit => unit.id === row.unit).name : "")}`}}
@@ -27,8 +25,8 @@
       <template #tags-data="{row}">
         <UBadge
             v-if="row.tags.length > 0"
-          v-for="tag in row.tags"
-          class="mr-2"
+            v-for="tag in row.tags"
+            class="mr-2"
         >
           {{tag}}
         </UBadge>
@@ -38,9 +36,8 @@
         {{dataStore.units.find(unit => unit.id === row.unit) ? dataStore.units.find(unit => unit.id === row.unit).name : row.unit}}
       </template>
     </UTable>
-
-
   </div>
+
 </template>
 
 <script setup>