feat: Add Page Templates text filtering - MEED-6844 - Meeds-io/MIPs#133…

… (#64)
Meeds-io · May 21, 2024 · c6d2676 · c6d2676
1 parent 8b8f50c
commit c6d2676
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/...ut-webapp/src/main/webapp/vue-app/page-templates-management/components/header/Toolbar.vue b/...ut-webapp/src/main/webapp/vue-app/page-templates-management/components/header/Toolbar.vue
@@ -28,7 +28,7 @@
       placeholder: $t('pageTemplates.filter.placeholder'),
       tooltip: $t('pageTemplates.filter.placeholder'),
     }"
-    @filter-text-input-end-typing="$emit('page-templates-filter', $event)">
+    @filter-text-input="$emit('page-templates-filter', $event)">
     <template #left>
       <v-btn
         id="applicationToolbarLeftButton"

diff --git a/...ebapp/src/main/webapp/vue-app/page-templates-management/components/list/PageTemplates.vue b/...ebapp/src/main/webapp/vue-app/page-templates-management/components/list/PageTemplates.vue
@@ -1,7 +1,7 @@
 <template>
   <v-data-table
     :headers="headers"
-    :items="pageTemplates"
+    :items="filteredPageTemplates"
     :loading="loading"
     :disable-sort="$root.isMobile"
     :hide-default-header="$root.isMobile"
@@ -56,6 +56,14 @@ export default {
         },
       ];
     },
+    filteredPageTemplates() {
+      return this.keyword?.length && this.pageTemplates.filter(t => {
+        const name = this.$te(t.name) ? this.$t(t.name) : t.name;
+        const description = this.$te(t.description) ? this.$t(t.description) : t.description;
+        return name?.toLowerCase?.()?.includes(this.keyword.toLowerCase())
+          || this.$utils.htmlToText(description)?.toLowerCase?.()?.includes(this.keyword.toLowerCase());
+      }) || this.pageTemplates;
+    },
   },
   created() {
     this.refreshPageTemplates();