From 73f82ae9dd1803df4500db78ccf5d658b53bfe62 Mon Sep 17 00:00:00 2001 From: Hoang Nguyen Date: Wed, 28 Apr 2021 13:45:42 +0700 Subject: [PATCH 1/5] ui: Save the tab and re-activate it after submitting the form. (#4962) * save the tab and reactivate it after submitting the form. * fix for quota resource Fixes #4961 --- ui/src/components/view/ResourceView.vue | 20 ++++++++++++++++++- ui/src/views/network/PublicIpResource.vue | 7 +++++-- .../plugins/quota/QuotaSummaryResource.vue | 7 +++++-- 3 files changed, 29 insertions(+), 5 deletions(-) diff --git a/ui/src/components/view/ResourceView.vue b/ui/src/components/view/ResourceView.vue index 333f582ad0e..013310feba0 100644 --- a/ui/src/components/view/ResourceView.vue +++ b/ui/src/components/view/ResourceView.vue @@ -83,6 +83,10 @@ export default { component: DetailsTab }] } + }, + historyTab: { + type: String, + default: '' } }, data () { @@ -128,6 +132,7 @@ export default { ) }).join('&') ) + this.$emit('onTabChange', key) }, showTab (tab) { if ('networkServiceFilter' in tab) { @@ -158,7 +163,20 @@ export default { } }, setActiveTab () { - this.activeTab = this.$route.query.tab ? this.$route.query.tab : this.tabs[0].name + if (this.$route.query.tab) { + this.activeTab = this.$route.query.tab + return + } + if (!this.historyTab || !this.$route.meta.tabs || this.$route.meta.tabs.length === 0) { + this.activeTab = this.tabs[0].name + return + } + const tabIdx = this.$route.meta.tabs.findIndex(tab => tab.name === this.historyTab) + if (tabIdx === -1) { + this.activeTab = this.tabs[0].name + } else { + this.activeTab = this.historyTab + } } } } diff --git a/ui/src/views/network/PublicIpResource.vue b/ui/src/views/network/PublicIpResource.vue index 2c97f93bde0..e80ed175ea4 100644 --- a/ui/src/views/network/PublicIpResource.vue +++ b/ui/src/views/network/PublicIpResource.vue @@ -33,7 +33,9 @@ v-if="isPublicIpAddress && 'id' in resource" :loading="loading" :resource="resource" - :tabs="tabs" /> + :historyTab="activeTab" + :tabs="tabs" + @onTabChange="(tab) => { this.activeTab = tab }" /> @@ -63,7 +65,8 @@ export default { tabs: [{ name: 'details', component: () => import('@/components/view/DetailsTab.vue') - }] + }], + activeTab: '' } }, mixins: [mixinDevice], diff --git a/ui/src/views/plugins/quota/QuotaSummaryResource.vue b/ui/src/views/plugins/quota/QuotaSummaryResource.vue index 381f94e0928..abc6e2d6f8d 100644 --- a/ui/src/views/plugins/quota/QuotaSummaryResource.vue +++ b/ui/src/views/plugins/quota/QuotaSummaryResource.vue @@ -19,7 +19,9 @@ + :tabs="tabs" + :historyTab="activeTab" + @onTabChange="(tab) => { this.activeTab = tab }"/>