ADD: filter to paginator

frontend/src/components/Paginator.vue

 <template>
   <div class="paginator">
+    <FilterInput v-model="filterValue"></FilterInput>
     <b-pagination :total-rows="items.length" v-model="currentPage" :per-page="items_per_page"
-                  v-if="items && items.length > items_per_page">
+                  v-if="filterValue == '' && items && items.length > items_per_page">
     </b-pagination>
     <div class="pagination_container">
       <slot name="content_skeleton_item" v-if="items == null || items.length == 0"></slot>
       <slot name="item" v-else
-            v-for="item in items.slice((currentPage-1)*items_per_page, Math.min(items.length, currentPage*items_per_page))"
+            v-for="item in slicer"
             v-bind:item="item"/>
     </div>
     <b-pagination :total-rows="items.length" v-model="currentPage" :per-page="items_per_page"
-                  v-if="items && items.length > items_per_page">
+                  v-if="filterValue == '' && items && items.length > items_per_page">
     </b-pagination>
   </div>
 </template>
 
 <script>
+import FilterInput from '@/components/FilterInput'
+
 export default {
   name: 'Paginator',
+  components: {FilterInput},
   data() {
     return {
-      currentPage: 1
+      currentPage: 1,
+      filterValue: ''
     }
   },
   props: {
@@ -34,6 +39,30 @@ export default {
       default() {
         return 25
       }
+    },
+    filter_function: {
+      type: Function,
+      default() {
+        return function (item, term) {
+          for (const v of Object.values(item)) {
+            window.console.debug(typeof v)
+            if (typeof v === 'string') {
+              if (v.includes(term)) {
+                return true
+              }
+            }
+          }
+          return false
+        }
+      }
+    }
+  },
+  computed: {
+    slicer() {
+      if (this.filterValue === '') {
+        return this.items.slice((this.currentPage - 1) * this.items_per_page, Math.min(this.items.length, this.currentPage * this.items_per_page))
+      }
+      return this.items.filter(x => this.filter_function()(x, this.filterValue))
     }
   }
 }