ADD: filter in bcd records (closes #178)

frontend/src/views/dnsvs/BCDRecords.vue

@@ -215,10 +215,12 @@
                 </b-card-header>
                 <b-card-body body-class="p-0">
                   <b-collapse :id="'records-'+record_type+'-collapse'" v-model="collapse_states[2+index]">
-                    <b-pagination v-if="loaded && records[record_type].length > per_page" :per_page="per_page"
+                    <FilterInput v-model="filter[record_type]"></FilterInput>
+                    <b-pagination v-if="(!(record_type in filter) || filter[record_type] === '')&& loaded && records[record_type].length > per_page" :per_page="per_page"
                                   align="center" v-model="current_page[record_type]"
                                   :total-rows="records[record_type].length"></b-pagination>
-                    <b-table responsive :items="records[record_type]" :per-page="per_page"
+                    <b-table responsive :filter="filter[record_type]" :items="records[record_type]"
+                             :per-page="(!(record_type in filter) || filter[record_type] === '') ? per_page : null"
                              :current-page="current_page[record_type]"
                              :fields="record_list_fields">
                       <template v-slot:cell(fqdn)="data">
@@ -283,7 +285,7 @@
                         </b-tooltip>
                       </template>
                     </b-table>
-                    <b-pagination v-if="loaded && records[record_type].length > per_page" :per_page="per_page"
+                    <b-pagination v-if="(!(record_type in filter) || filter[record_type] === '') && loaded && records[record_type].length > per_page" :per_page="per_page"
                                   align="center" v-model="current_page[record_type]"
                                   :total-rows="records[record_type].length"></b-pagination>
                   </b-collapse>
@@ -323,12 +325,14 @@ import transactionutil from '@/util/transactionutil'
 import apiutil from '@/util/apiutil'
 import EVLogViewer from '@/components/EVLogViewer'
 import ipaddress from '@/util/ipaddress'
+import FilterInput from '@/components/FilterInput'
 
 export default {
   name: 'BCDRecords',
-  components: {EVLogViewer, Loading, DBEditor},
+  components: {FilterInput, EVLogViewer, Loading, DBEditor},
   data() {
     return {
+      filter: {},
       vlans: null,
       fqdns: null,
       groups: null,