From 78cd3efad3e679901a8bdc747211121262168631 Mon Sep 17 00:00:00 2001 From: Anton Date: Wed, 8 May 2024 11:52:01 +0200 Subject: [PATCH] Small fixes for global search [SCI-10681] --- .../vue/global_search/container.vue | 89 ++++++++++++++++-- .../groups/helpers/link_template.vue | 10 +- .../vue/navigation/quick_search.vue | 13 ++- app/views/layouts/application.html.erb | 1 + config/locales/en.yml | 3 +- .../assets/stylesheets/fonts/SN-icon-font.eot | Bin 34214 -> 34334 bytes .../assets/stylesheets/fonts/SN-icon-font.svg | 1 + .../assets/stylesheets/fonts/SN-icon-font.ttf | Bin 34028 -> 34148 bytes .../stylesheets/fonts/SN-icon-font.woff | Bin 34104 -> 34224 bytes .../stylesheets/fonts/SN-icon-font.woff2 | Bin 14472 -> 14536 bytes vendor/assets/stylesheets/sn-icon-font.css | 15 +-- 11 files changed, 108 insertions(+), 24 deletions(-) diff --git a/app/javascript/vue/global_search/container.vue b/app/javascript/vue/global_search/container.vue index d866f4771..3490165c2 100644 --- a/app/javascript/vue/global_search/container.vue +++ b/app/javascript/vue/global_search/container.vue @@ -8,12 +8,36 @@
-
- - - -
+ + + +
+
-
+
@@ -136,6 +164,8 @@ export default { filters: {}, localQuery: this.query, filterModalOpened: false, + previousQueries: [], + invalidQuery: false, activeGroup: null, totalElements: 0, searchGroups: [ @@ -154,9 +184,6 @@ export default { }; }, computed: { - invalidQuery() { - return this.localQuery.length < 2; - }, activeFilters() { return Object.keys(this.filters).filter((key) => { if (key === 'created_at' || key === 'updated_at') { @@ -166,6 +193,12 @@ export default { } return this.filters[key]; }); + }, + canOpenHistory() { + return this.previousQueries.length > 0 && this.localQuery.length === 0; + }, + reversedPreviousQueries() { + return [...this.previousQueries].reverse(); } }, created() { @@ -197,6 +230,8 @@ export default { if (this.filters.group) { this.activeGroup = this.filters.group; } + + this.previousQueries = JSON.parse(localStorage.getItem('quickSearchHistory') || '[]'); }, methods: { calculateTotalElements() { @@ -217,8 +252,38 @@ export default { this.filters.group = this.activeGroup; }, + setQuery(query) { + this.localQuery = query; + this.invalidQuery = false; + this.$refs.historyContainer.isOpen = false; + }, changeQuery(event) { + if (event.target.value === this.localQuery) { + return; + } + this.localQuery = event.target.value; + + if (event.target.value.length < 2) { + this.invalidQuery = true; + return; + } + + this.invalidQuery = false; + this.saveQuery(); + }, + saveQuery() { + if (this.localQuery.length > 1) { + if (this.previousQueries[this.previousQueries.length - 1] === this.localQuery) return; + + this.previousQueries.push(this.localQuery); + + if (this.previousQueries.length > 5) { + this.previousQueries.shift(); + } + localStorage.setItem('quickSearchHistory', JSON.stringify(this.previousQueries)); + this.$refs.historyContainer.isOpen = false; + } }, applyFilters(filters) { this.filters = filters; @@ -226,6 +291,10 @@ export default { this.activeGroup = this.filters.group; }, + resetGroup() { + this.activeGroup = null; + this.filters.group = null; + }, resetFilters() { this.filters = { created_at: { diff --git a/app/javascript/vue/global_search/groups/helpers/link_template.vue b/app/javascript/vue/global_search/groups/helpers/link_template.vue index 3de291e45..831cdd1c7 100644 --- a/app/javascript/vue/global_search/groups/helpers/link_template.vue +++ b/app/javascript/vue/global_search/groups/helpers/link_template.vue @@ -1,7 +1,13 @@