[gui] Remember filters when navigate between pages

web/server/vue-cli/src/components/Layout/TheHeader.vue

@@ -62,7 +62,9 @@
         :key="item.name"
         :to="{
           name: item.route,
-          query: item.query || {}
+          query: queries[item.route] === undefined
+            ? item.query || {}
+            : queries[item.route]
         }"
         :class="item.active.includes($route.name) &&
           'v-btn--active router-link-active'"
@@ -165,6 +167,7 @@ export default {
 
   computed: {
     ...mapGetters([
+      "queries",
       "authParams",
       "isAuthenticated",
       "announcement",

web/server/vue-cli/src/components/Run/RunNameColumn.vue

@@ -3,7 +3,14 @@
     <v-list-item-content>
       <v-list-item-title>
         <router-link
-          :to="{ name: 'reports', query: reportFilterQuery }"
+          :to="{ name: 'reports',
+                 query: {
+                   ...(queries['reports'] === undefined
+                     ? defaultReportFilterValues
+                     : queries['reports']),
+                   ...reportFilterQuery
+                 }
+          }"
           class="name mr-2"
         >
           {{ name }}
@@ -53,7 +60,13 @@
         </v-btn>
 
         <v-btn
-          :to="{ name: 'statistics', query: statisticsFilterQuery }"
+          :to="{ name: 'statistics',
+                 query: {
+                   ...(queries['statistics'] === undefined
+                     ? defaultStatisticsFilterValues
+                     : queries['statistics']),
+                   ...statisticsFilterQuery
+                 } }"
           class="show-statistics"
           title="Show statistics"
           color="green"
@@ -108,8 +121,12 @@
 </template>
 
 <script>
+import { mapGetters } from "vuex";
 import { RunDescription } from "@/components/Run";
 
+import { defaultReportFilterValues } from "@/components/Report/ReportFilter";
+import { defaultStatisticsFilterValues } from "@/components/Statistics";
+
 import { DetectionStatusMixin, StrToColorMixin } from "@/mixins";
 import { DetectionStatusIcon } from "@/components/Icons";
 
@@ -130,6 +147,17 @@ export default {
     openCheckCommandDialog: { type: Function, default: () => {} },
     reportFilterQuery: { type: Object, default: () => {} },
     statisticsFilterQuery: { type: Object, default: () => {} },
+  },
+  data() {
+    return {
+      defaultReportFilterValues,
+      defaultStatisticsFilterValues
+    };
+  },
+  computed: {
+    ...mapGetters([
+      "queries"
+    ])
   }
 };
 </script>

web/server/vue-cli/src/main.js

@@ -22,6 +22,7 @@ import {
   GET_CURRENT_PRODUCT,
   GET_CURRENT_PRODUCT_CONFIG
 } from "@/store/actions.type";
+import { CLEAR_QUERIES, SET_QUERIES } from "@/store/mutations.type";
 import convertOldUrlToNew from "./router/backward-compatible-url";
 
 import router from "./router";
@@ -84,6 +85,13 @@ router.beforeResolve((to, from, next) => {
   });
 });
 
+router.afterEach(to => {
+  if (to.name === "products")
+    store.commit(CLEAR_QUERIES, { except: [ "products" ] });
+
+  store.commit(SET_QUERIES, { location: to.name, query: to.query });
+});
+
 new Vue({
   router,
   store,

web/server/vue-cli/src/store/index.js

@@ -6,6 +6,7 @@ import config from "./modules/config";
 import error from "./modules/error";
 import product from "./modules/product";
 import serverInfo from "./modules/server-info";
+import url from "./modules/url";
 
 import report from "./modules/report";
 import statistics from "./modules/statistics";
@@ -20,6 +21,7 @@ export default new Vuex.Store({
     product,
     report,
     statistics,
-    serverInfo
+    serverInfo,
+    url
   }
 });

web/server/vue-cli/src/store/modules/url.js

@@ -0,0 +1,34 @@
+import { CLEAR_QUERIES, SET_QUERIES } from "../mutations.type";
+
+const state = {
+  queries: {}
+};
+
+const getters = {
+  queries(state) {
+    return state.queries;
+  }
+};
+
+const mutations = {
+  [CLEAR_QUERIES](state, { except }) {
+    if (except) {
+      Object.keys(state.queries).forEach(key => {
+        if (!except.includes(key))
+          delete state.queries[key];
+      });
+    } else {
+      state.queries = {};
+    }
+  },
+
+  [SET_QUERIES](state, { location, query }) {
+    state.queries[location] = query;
+  }
+};
+
+export default {
+  state,
+  mutations,
+  getters
+};

web/server/vue-cli/src/store/mutations.type.js

@@ -15,3 +15,6 @@ export const SET_ANNOUNCEMENT = "setAnnouncement";
 
 export const ADD_ERROR = "addError";
 export const CLEAR_ERRORS = "clearErrors";
+
+export const CLEAR_QUERIES = "clearQueries";
+export const SET_QUERIES = "setQueries";

web/server/vue-cli/src/views/ProductDetail.vue

@@ -1,8 +1,6 @@
 <template>
   <v-container id="product" fluid>
-    <keep-alive>
-      <router-view />
-    </keep-alive>
+    <router-view />
   </v-container>
 </template>
 

web/server/vue-cli/src/views/RunHistoryList.vue

@@ -199,9 +199,6 @@
 import _ from "lodash";
 import { format, max, min, parse } from "date-fns";
 
-import { defaultReportFilterValues } from "@/components/Report/ReportFilter";
-import { defaultStatisticsFilterValues } from "@/components/Statistics";
-
 import {
   AnalyzerStatisticsBtn,
   AnalyzerStatisticsDialog,
@@ -517,16 +514,14 @@ export default {
       return {
         run: history.runName,
         "run-tag": history.versionTag || undefined,
-        "detected-before": history.versionTag ? undefined : history.time,
-        ...defaultReportFilterValues
+        "detected-before": history.versionTag ? undefined : history.time
 
       };
     },
 
     getStatisticsFilterQuery(history) {
       return {
-        run: history.runName,
-        ...defaultStatisticsFilterValues
+        run: history.runName
       };
     }
   }

web/server/vue-cli/src/views/RunList.vue

@@ -172,9 +172,6 @@
 <script>
 import _ from "lodash";
 
-import { defaultReportFilterValues } from "@/components/Report/ReportFilter";
-import { defaultStatisticsFilterValues } from "@/components/Statistics";
-
 import {
   AnalyzerStatisticsBtn,
   AnalyzerStatisticsDialog,
@@ -446,16 +443,14 @@ export default {
 
     getReportFilterQuery(run) {
       return {
-        run: run.name,
-        ...defaultReportFilterValues
+        run: run.name
 
       };
     },
 
     getStatisticsFilterQuery(run) {
       return {
-        run: run.name,
-        ...defaultStatisticsFilterValues
+        run: run.name
       };
     }
   }