https://saddleback.com/scripts/Ministries/AppliedFilters.js?v=517cdeafa93af7720f65d0a6f449ca34186eeedc

1export default {
2  props: ['searchQuery', 'selectedCategories', 'selectedCampusId', 'resultCount'],
3
4  emits: ['reset-filter'],
5
6  template: `
7        <div class="applied-filters">
8            <div class="search-results" v-if="searchQuery">
9                {{resultCount}} Results for "{{searchQuery}}"
10            </div>
11            <div class="search-results" v-if="!searchQuery">
12                {{resultCount}} Results
13            </div>
14
15            <div v-for="category in selectedCategories" class="applied-category">
16                {{category}}
17            </div>
18
19            <a
20                v-on:click="resetFilter"
21                :class="{ disabled: !canReset }"
22                class="reset-filter-btn"
23                href="javascript:;"
24            >
25                Clear Filters
26            </a>
27        </div>
28    `,
29
30  data() {
31    return {};
32  },
33
34  computed: {
35    canReset() {
36      return this.selectedCampusId || this.selectedCategories.length;
37    },
38  },
39  methods: {
40    resetFilter() {
41      this.$emit('reset-filter');
42    },
43  },
44};