sync

src/components/papers/FilterView.vue

@@ -1,7 +1,7 @@
 <script lang="ts">
 export default {
   updated() {
-    this.$emit('paperFilter', this.paperFilter)
+    this.$emit('filter', this.filter)
   },
   data() {
     return {
@@ -51,7 +51,7 @@ export default {
           key: 'WA',
         },
       ],
-      paperFilter: {
+      filter: {
         type: {
           key: '',
           value: '',
@@ -83,7 +83,7 @@ export default {
       <legend>Kategorie</legend>
       <select
         class="w-40 p-2 bg-background-100 dark:bg-background-900 rounded-lg"
-        v-model="paperFilter.type">
+        v-model="filter.type">
         <option
           v-for="(type, i) of paperTypes"
           :key="i"
@@ -93,7 +93,7 @@ export default {
       </select>
       <button 
         class="pl-2"
-        @click.prevent="paperFilter.type = { key: '', value: ''}"
+        @click.prevent="filter.type = { key: '', value: ''}"
         title="zurücksetzen"
         >✖
       </button>
@@ -102,12 +102,12 @@ export default {
       <legend>Einreicher</legend>
       <select 
         class="w-40 p-2 bg-background-100 dark:bg-background-900 rounded-lg"
-        v-model="paperFilter.originator">
+        v-model="filter.originator">
         <option v-for="(originator, i) of paperOriginators" :key="i">{{ originator }}</option>
       </select>
       <button 
         class="pl-2"
-        @click.prevent="paperFilter.originator = ''"
+        @click.prevent="filter.originator = ''"
         title="zurücksetzen"
         >✖
       </button>

src/components/papers/TopicList.vue

@@ -3,30 +3,30 @@ import { type Papers } from '@/App.vue'
 
 export default {
   props: {
-    papers: Array<any>,
-    paperQuery: Object,
-    paperFilter: Object,
+    search: Object,
+    filter: Object,
+    topics: Object,
   },
   computed: {
     filteredData() {
-      const paperQuery: String = this.paperQuery?.value
-      let filteredPapers: Papers[] = this.papers
+      const paperQuery: String = this.search?.value
+      let filteredTopics: any = this.topics?.paper
       if (paperQuery !== '') {
-        filteredPapers = this.papers.filter((paper) => {
+        filteredTopics = this.topics?.paper.filter((paper: any) => {
           return paper.name.toLowerCase().includes(paperQuery.toLowerCase()) || paper.content.toLowerCase().includes(paperQuery.toLowerCase()) || paper.reference.toLowerCase().includes(paperQuery.toLowerCase())
         })
       }
-      if (this.paperFilter?.type !== '') {
-        filteredPapers = filteredPapers.filter((paper) => {
-          return paper.reference.includes(this.paperFilter?.type.key) && paper.paper_type.includes(this.paperFilter?.type.value)
+      if (this.filter?.type !== '') {
+        filteredTopics = filteredTopics.filter((topic: any) => {
+          return topic.reference.includes(this.filter?.type.key) && topic.paper_type.includes(this.filter?.type.value)
         })
       }
-      if (this.paperFilter?.originator !== '') {
-        filteredPapers = filteredPapers.filter((paper) => {
-          return paper.originator.includes(this.paperFilter?.originator)
+      if (this.filter?.originator !== '') {
+        filteredTopics = filteredTopics.filter((topic: any) => {
+          return topic.originator.includes(this.filter?.originator)
         })
       }
-      return filteredPapers
+      return filteredTopics
     }, 
   },
   methods: {
@@ -43,7 +43,7 @@ export default {
 
 <template>
   <ul
-    v-if="filteredData.length"
+    v-if="filteredData"
     class="w-full grid grid-flow-row gap-2 my-2"
   >
     <p>Wir konnten {{ filteredData.length }} Einträge finden</p>
@@ -60,11 +60,11 @@ export default {
       </article>
     </li>
   </ul>
-  <p
+<!--   <p
     class="flex place-content-center my-60 text-lg"
-    v-else-if="papers.length"
+    v-else-if="topics?.length"
     >Für dieses Anfrage liegen uns keine Ergebnisse vor.
-  </p>
+  </p> -->
   <p
     class="flex place-content-center my-60 text-lg"
     v-else