Added Frontend

frontend/components/displayProjectsInPhases.vue

@@ -0,0 +1,43 @@
+<script setup>
+
+const phasesCounter = ref({})
+
+const setupPage = async () => {
+  const projects = (await useEntities("projects").select()).filter(i => !i.archived)
+
+  projects.forEach(project => {
+    if(project.phases && project.phases.length > 0){
+      let activePhase = project.phases.find(p => p.active)
+
+      if(phasesCounter.value[activePhase.label]) {
+        phasesCounter.value[activePhase.label] += 1
+      } else {
+        phasesCounter.value[activePhase.label] = 1
+      }
+
+    } else {
+      if(phasesCounter.value["Keine Phase"]) {
+        phasesCounter.value["Keine Phase"] += 1
+      } else {
+        phasesCounter.value["Keine Phase"] = 1
+      }
+    }
+  })
+}
+
+setupPage()
+
+</script>
+
+<template>
+  <table class="w-full">
+    <tr v-for="label in Object.keys(phasesCounter)">
+      <td>{{label}}</td>
+      <td>{{ phasesCounter[label] }} Stk</td>
+    </tr>
+  </table>
+</template>
+
+<style scoped>
+
+</style>