From 60bb41367c720f51853d3400b55cd969d4d38a55 Mon Sep 17 00:00:00 2001
From: utchoang <hoangnm@unitech.vn>
Date: Tue, 13 Apr 2021 13:41:59 +0700
Subject: [PATCH 1/2] fixes the color style of the filter icon

---
 ui/src/components/view/SearchView.vue | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/view/SearchView.vue b/ui/src/components/view/SearchView.vue
index 14a80422beff..4531a8d6eb94 100644
--- a/ui/src/components/view/SearchView.vue
+++ b/ui/src/components/view/SearchView.vue
@@ -104,7 +104,7 @@
             class="filter-button"
             size="small"
             @click="() => { searchQuery = null }">
-            <a-icon type="filter" :theme="Object.keys(searchParams).length > 0 ? 'twoTone' : 'outlined'" />
+            <a-icon type="filter" :theme="isFiltered ? 'twoTone' : 'outlined'" />
           </a-button>
         </a-popover>
       </a-input-search>
@@ -140,7 +140,8 @@ export default {
       fields: [],
       inputKey: null,
       inputValue: null,
-      fieldValues: {}
+      fieldValues: {},
+      isFiltered: false
     }
   },
   beforeCreate () {
@@ -164,6 +165,13 @@ export default {
     if (this.$route && this.$route.query && 'q' in this.$route.query) {
       this.searchQuery = this.$route.query.q
     }
+    this.isFiltered = false
+    this.searchFilters.some(item => {
+      if (this.searchParams[item]) {
+        this.isFiltered = true
+        return true
+      }
+    })
   },
   computed: {
     styleSearch () {
@@ -417,6 +425,7 @@ export default {
         field[item] = undefined
         this.form.setFieldsValue(field)
       })
+      this.isFiltered = false
       this.inputKey = null
       this.inputValue = null
       this.searchQuery = null
@@ -430,6 +439,7 @@ export default {
         if (err) {
           return
         }
+        this.isFiltered = true
         for (const key in values) {
           const input = values[key]
           if (input === '' || input === null || input === undefined) {

From 67a6521ac974224fedde1f0f0c518959177a8402 Mon Sep 17 00:00:00 2001
From: utchoang <hoangnm@unitech.vn>
Date: Tue, 13 Apr 2021 14:10:35 +0700
Subject: [PATCH 2/2] fixes for router leave/enter

---
 ui/src/components/view/SearchView.vue | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/ui/src/components/view/SearchView.vue b/ui/src/components/view/SearchView.vue
index 4531a8d6eb94..4b3582916f05 100644
--- a/ui/src/components/view/SearchView.vue
+++ b/ui/src/components/view/SearchView.vue
@@ -40,7 +40,7 @@
           slot="addonBefore"
           trigger="click"
           v-model="visibleFilter">
-          <template slot="content">
+          <template slot="content" v-if="visibleFilter">
             <a-form
               style="min-width: 170px"
               :form="form"
@@ -158,6 +158,13 @@ export default {
       if (to && to.query && 'q' in to.query) {
         this.searchQuery = to.query.q
       }
+      this.isFiltered = false
+      this.searchFilters.some(item => {
+        if (this.searchParams[item]) {
+          this.isFiltered = true
+          return true
+        }
+      })
     }
   },
   mounted () {
@@ -165,13 +172,6 @@ export default {
     if (this.$route && this.$route.query && 'q' in this.$route.query) {
       this.searchQuery = this.$route.query.q
     }
-    this.isFiltered = false
-    this.searchFilters.some(item => {
-      if (this.searchParams[item]) {
-        this.isFiltered = true
-        return true
-      }
-    })
   },
   computed: {
     styleSearch () {