ref: bubble filters up

src/components/Sidebar.vue

@@ -2,15 +2,15 @@
     <div>
         <va-sidebar color="primary" text-color="white" gradient class="sidebar-proper">
             <h3>Category</h3>
-            <category-filter @filter="filter" />
+            <category-filter @filter="$emit('filter', $event)" />
             <h3>GIS Category</h3>
-            <gis-category-filter @filter="filter" />
+            <gis-category-filter @filter="$emit('filter', $event)" />
             <h3>Scanner</h3>
-            <scanner-filter @filter="filter" />
+            <scanner-filter @filter="$emit('filter', $event)" />
             <h3>Organiztion</h3>
-            <org-filter @filter="filter" />
+            <org-filter @filter="$emit('filter', $event)" />
             <h3>Stratum</h3>
-            <stratum-filter @filter="filter" />
+            <stratum-filter @filter="$emit('filter', $event)" />
 
             <!-- <template v-for="item in sidebarItems" :key="item.title">
                 <va-sidebar-item :active="item.active">
@@ -40,24 +40,9 @@ export default {
         // }
     },
     components: { CategoryFilter, GisCategoryFilter, ScannerFilter, OrgFilter, StratumFilter },
-    methods: {
-        filter(filter) {
-            let key;
-            for (key in filter) {
-                if (filter[key] != "Any") {
-                    this.currentFilters[key] = filter[key]
-                } else {
-                    delete this.currentFilters[key]
-                }
-            };
-
-            this.$emit('filter', this.currentFilters);
-        }
-    },
+    methods: {},
     data() {
-        return {
-            currentFilters: {}
-        }
+        return {}
     },
 }
 </script>

src/views/FrontView.vue

@@ -2,7 +2,7 @@
     <div>
         <navbar />
         <div class="central-view">
-            <sidebar @filter="fetchFiltered" />
+            <sidebar @filter="applyFilters" />
             <div class="main-view">
                 <overview-screen :items="items" />
             </div>
@@ -21,6 +21,7 @@ export default {
     data() {
         return {
             items: [],
+            currentFilters: {},
         }
     },
     methods: {
@@ -48,6 +49,18 @@ export default {
                 .then(res => res.json())
                 .then(data => this.items = data)
                 .catch((e) => console.log(e))
+        },
+        applyFilters(filter) {
+            let key;
+            for (key in filter) {
+                if (filter[key] != "Any") {
+                    this.currentFilters[key] = filter[key]
+                } else {
+                    delete this.currentFilters[key]
+                }
+            };
+
+            this.fetchFiltered(this.currentFilters);
         }
     },
     created() {