diff --git a/frontend/src/common/component/AppMenu.vue b/frontend/src/common/component/AppMenu.vue index dd89c17c009ff42b35134a22f99afecef051185c..6b36578cf12d240a829d0a342967cb5978ca527f 100644 --- a/frontend/src/common/component/AppMenu.vue +++ b/frontend/src/common/component/AppMenu.vue @@ -16,6 +16,7 @@ depressed @mouseover="runsSelectorOpen = true" @mouseout="runsSelectorOpen = false" + :ripple="false" :color="runsSelectorOpen ? 'dark_primary' : 'primary'" :class="runsSelectorOpen ? 'runs-selected-menu-open' : 'runs-selected-menu'" > Runs: {{ runs.length == 0 ? 'None selected' : runs.join(', ') }} @@ -43,7 +44,7 @@ :key="item.name" flat dark - :class="selected === item.name ? 'menu-item-selected': 'menu-item'" + :class="selected.toLowerCase() === item.name.toLowerCase() ? 'menu-item-selected': 'menu-item'" @click="handleItemClick(item)" >{{ item.title }} @@ -109,15 +110,24 @@ export default { }; }, created() { + this.runs = this.$route.query.runs; //maintain runs state after refresh getRuns().then(({errno, data}) => { this.availableRuns = data; - this.runs = data; + if (!this.runs) this.runs = data; + //use replace here instead of push so that user cannot go back to empty run state + this.$router.replace( { path: this.initialRoute, query: { runs: this.runs }}); }); }, watch: { runs: function(val) { - this.$router.push( {query: { runs: this.runs }}); + if (this.runs) { + this.$router.push( {query: { runs: this.runs }}); + } }, + '$route' (to, from) { //this will get called when back button is hit that changes path or query + this.runs = this.$route.query.runs; + this.selected = this.$route.name; + } }, methods: { handleItemClick: function(item) {