From 4beb09d2244a06e7e082589f6a2524d1e33cd70d Mon Sep 17 00:00:00 2001 From: utchoang Date: Wed, 16 Dec 2020 15:23:43 +0700 Subject: [PATCH 1/9] add multiple management server support --- public/config.json | 7 +++++- src/main.js | 3 ++- src/permission.js | 6 ++++- src/store/getters.js | 3 ++- src/store/modules/app.js | 13 ++++++++-- src/store/mutation-types.js | 1 + src/views/auth/Login.vue | 47 ++++++++++++++++++++++++++++++++++++- 7 files changed, 73 insertions(+), 7 deletions(-) diff --git a/public/config.json b/public/config.json index f4fda4114..59b19d85d 100644 --- a/public/config.json +++ b/public/config.json @@ -1,5 +1,10 @@ { - "apiBase": "/client/api", + "servers": [ + { + "name": "Manager 1", + "apiBase": "/client/api" + } + ], "docBase": "http://docs.cloudstack.apache.org/en/latest", "appTitle": "CloudStack", "footer": "Licensed under the Apache License, Version 2.0.", diff --git a/src/main.js b/src/main.js index 11ee548b3..6b45f0eeb 100644 --- a/src/main.js +++ b/src/main.js @@ -36,7 +36,8 @@ Vue.use(notifierPlugin) fetch('config.json').then(response => response.json()).then(config => { Vue.prototype.$config = config - Vue.axios.defaults.baseURL = config.apiBase + Vue.axios.defaults.baseURL = config.servers[0].apiBase + new Vue({ router, store, diff --git a/src/permission.js b/src/permission.js index d22c00f62..d40b6d0c2 100644 --- a/src/permission.js +++ b/src/permission.js @@ -26,7 +26,7 @@ import 'nprogress/nprogress.css' // progress bar style import message from 'ant-design-vue/es/message' import notification from 'ant-design-vue/es/notification' import { setDocumentTitle } from '@/utils/domUtil' -import { ACCESS_TOKEN, APIS } from '@/store/mutation-types' +import { ACCESS_TOKEN, APIS, SERVER_MANAGER } from '@/store/mutation-types' NProgress.configure({ showSpinner: false }) // NProgress Configuration @@ -39,6 +39,10 @@ router.beforeEach((to, from, next) => { const title = i18n.t(to.meta.title) + ' - ' + Vue.prototype.$config.appTitle setDocumentTitle(title) } + const server = Vue.ls.get(SERVER_MANAGER) || Vue.prototype.$config.servers[0].apiBase + Vue.axios.defaults.baseURL = server + store.dispatch('SetServer', server) + const validLogin = Vue.ls.get(ACCESS_TOKEN) || Cookies.get('userid') || Cookies.get('userid', { path: '/client' }) if (validLogin) { if (to.path === '/user/login') { diff --git a/src/store/getters.js b/src/store/getters.js index 73042aaf5..40b5b72a3 100644 --- a/src/store/getters.js +++ b/src/store/getters.js @@ -33,7 +33,8 @@ const getters = { asyncJobIds: state => state.user.asyncJobIds, isLdapEnabled: state => state.user.isLdapEnabled, cloudian: state => state.user.cloudian, - zones: state => state.user.zones + zones: state => state.user.zones, + server: state => state.app.server } export default getters diff --git a/src/store/modules/app.js b/src/store/modules/app.js index e68cf4417..7c65a796b 100644 --- a/src/store/modules/app.js +++ b/src/store/modules/app.js @@ -26,7 +26,8 @@ import { DEFAULT_FIXED_SIDEMENU, DEFAULT_FIXED_HEADER_HIDDEN, DEFAULT_CONTENT_WIDTH_TYPE, - DEFAULT_MULTI_TAB + DEFAULT_MULTI_TAB, + SERVER_MANAGER } from '@/store/mutation-types' const app = { @@ -43,7 +44,8 @@ const app = { color: null, inverted: true, multiTab: true, - metrics: false + metrics: false, + server: '' }, mutations: { SET_SIDEBAR_TYPE: (state, type) => { @@ -95,6 +97,10 @@ const app = { }, SET_METRICS: (state, bool) => { state.metrics = bool + }, + SET_SERVER: (state, server) => { + Vue.ls.set(SERVER_MANAGER, server) + state.server = server } }, actions: { @@ -139,6 +145,9 @@ const app = { }, SetMetrics ({ commit }, bool) { commit('SET_METRICS', bool) + }, + SetServer ({ commit }, server) { + commit('SET_SERVER', server) } } } diff --git a/src/store/mutation-types.js b/src/store/mutation-types.js index caec6a443..e81c1516e 100644 --- a/src/store/mutation-types.js +++ b/src/store/mutation-types.js @@ -30,6 +30,7 @@ export const DEFAULT_MULTI_TAB = 'DEFAULT_MULTI_TAB' export const APIS = 'APIS' export const ZONES = 'ZONES' export const ASYNC_JOB_IDS = 'ASYNC_JOB_IDS' +export const SERVER_MANAGER = 'SERVER_MANAGER' export const CONTENT_WIDTH_TYPE = { Fluid: 'Fluid', diff --git a/src/views/auth/Login.vue b/src/views/auth/Login.vue index 5f9587204..8f40217c5 100644 --- a/src/views/auth/Login.vue +++ b/src/views/auth/Login.vue @@ -35,6 +35,23 @@ {{ $t('label.login.portal') }} + + + + + {{ server.name }} + + + Single Sign-On + + + + + {{ server.name }} + + + @@ -110,8 +144,11 @@ diff --git a/src/main.js b/src/main.js index affb500fd..a6f434c8e 100644 --- a/src/main.js +++ b/src/main.js @@ -37,7 +37,7 @@ Vue.use(toLocaleDatePlugin) fetch('config.json').then(response => response.json()).then(config => { Vue.prototype.$config = config - Vue.axios.defaults.baseURL = config.servers[0].apiBase + Vue.axios.defaults.baseURL = config.servers[0].apiHost + config.servers[0].apiBase new Vue({ router, diff --git a/src/permission.js b/src/permission.js index d40b6d0c2..d865b43e4 100644 --- a/src/permission.js +++ b/src/permission.js @@ -39,8 +39,13 @@ router.beforeEach((to, from, next) => { const title = i18n.t(to.meta.title) + ' - ' + Vue.prototype.$config.appTitle setDocumentTitle(title) } - const server = Vue.ls.get(SERVER_MANAGER) || Vue.prototype.$config.servers[0].apiBase - Vue.axios.defaults.baseURL = server + + const servers = Vue.prototype.$config.servers + const serverStorage = Vue.ls.get(SERVER_MANAGER) + const serverFilter = servers.filter(ser => ser.apiHost + ser.apiBase === serverStorage.apiHost + serverStorage.apiBase) + const server = serverFilter[0] || servers[0] + + Vue.axios.defaults.baseURL = server.apiHost + server.apiBase store.dispatch('SetServer', server) const validLogin = Vue.ls.get(ACCESS_TOKEN) || Cookies.get('userid') || Cookies.get('userid', { path: '/client' }) diff --git a/src/views/auth/Login.vue b/src/views/auth/Login.vue index d6962db6a..ce52cf189 100644 --- a/src/views/auth/Login.vue +++ b/src/views/auth/Login.vue @@ -42,11 +42,11 @@ v-decorator="[ 'server', { - initialValue: server + initialValue: server.apiHost + server.apiBase } ]" @change="onChangeServer"> - + {{ item.name }} @@ -109,11 +109,11 @@ v-decorator="[ 'server', { - initialValue: server + initialValue: server.apiHost + server.apiBase } ]" @change="onChangeServer"> - + {{ item.name }} @@ -172,7 +172,7 @@ export default { } }, created () { - this.server = Vue.ls.get(SERVER_MANAGER) || this.$config.servers[0].apiBase + this.server = Vue.ls.get(SERVER_MANAGER) || this.$config.servers[0] }, mounted () { this.fetchData() @@ -217,7 +217,7 @@ export default { validateFields(validateFieldsKey, { force: true }, (err, values) => { if (!err) { - this.axios.defaults.baseURL = this.server + this.axios.defaults.baseURL = this.server.apiHost + this.server.apiBase store.dispatch('SetServer', this.server) if (customActiveKey === 'cs') { @@ -262,7 +262,9 @@ export default { } }, onChangeServer (server) { - this.server = server + const servers = this.$config.servers || [] + const serverFilter = servers.filter(ser => ser.apiHost + ser.apiBase === server) + this.server = serverFilter[0] || {} } } } From 21f57497d9801bbc4b9a089ac171f316d2e18b5a Mon Sep 17 00:00:00 2001 From: utchoang Date: Tue, 19 Jan 2021 13:22:21 +0700 Subject: [PATCH 7/9] fixes for server manager not found in localstorage --- src/permission.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/permission.js b/src/permission.js index 00b5d1f6d..38535c3a6 100644 --- a/src/permission.js +++ b/src/permission.js @@ -42,7 +42,11 @@ router.beforeEach((to, from, next) => { const servers = Vue.prototype.$config.servers const serverStorage = Vue.ls.get(SERVER_MANAGER) - const serverFilter = servers.filter(ser => ser.apiHost + ser.apiBase === serverStorage.apiHost + serverStorage.apiBase) + let apiFullPath = null + if (serverStorage) { + apiFullPath = serverStorage.apiHost + serverStorage.apiBase + } + const serverFilter = servers.filter(ser => ser.apiHost + ser.apiBase === apiFullPath) const server = serverFilter[0] || servers[0] Vue.axios.defaults.baseURL = server.apiHost + server.apiBase From 36a3503f12386c2f6cac5c57469edbe954c79d1a Mon Sep 17 00:00:00 2001 From: utchoang Date: Tue, 19 Jan 2021 16:47:58 +0700 Subject: [PATCH 8/9] Check to avoid apiHost not found in config.json --- src/main.js | 2 +- src/permission.js | 8 ++++---- src/views/auth/Login.vue | 12 ++++++------ 3 files changed, 11 insertions(+), 11 deletions(-) diff --git a/src/main.js b/src/main.js index 7d960c9e6..24c848719 100644 --- a/src/main.js +++ b/src/main.js @@ -37,7 +37,7 @@ Vue.use(toLocaleDatePlugin) fetch('config.json').then(response => response.json()).then(config => { Vue.prototype.$config = config - Vue.axios.defaults.baseURL = config.servers[0].apiHost + config.servers[0].apiBase + Vue.axios.defaults.baseURL = config.servers[0].apiHost || '' + config.servers[0].apiBase loadLanguageAsync().then(() => { new Vue({ diff --git a/src/permission.js b/src/permission.js index 38535c3a6..13c3c5767 100644 --- a/src/permission.js +++ b/src/permission.js @@ -42,14 +42,14 @@ router.beforeEach((to, from, next) => { const servers = Vue.prototype.$config.servers const serverStorage = Vue.ls.get(SERVER_MANAGER) - let apiFullPath = null + let apiFullPath = '' if (serverStorage) { - apiFullPath = serverStorage.apiHost + serverStorage.apiBase + apiFullPath = serverStorage.apiHost || '' + serverStorage.apiBase } - const serverFilter = servers.filter(ser => ser.apiHost + ser.apiBase === apiFullPath) + const serverFilter = servers.filter(ser => ser.apiHost || '' + ser.apiBase === apiFullPath) const server = serverFilter[0] || servers[0] - Vue.axios.defaults.baseURL = server.apiHost + server.apiBase + Vue.axios.defaults.baseURL = server.apiHost || '' + server.apiBase store.dispatch('SetServer', server) const validLogin = Vue.ls.get(ACCESS_TOKEN) || Cookies.get('userid') || Cookies.get('userid', { path: '/client' }) diff --git a/src/views/auth/Login.vue b/src/views/auth/Login.vue index ce52cf189..fb172f022 100644 --- a/src/views/auth/Login.vue +++ b/src/views/auth/Login.vue @@ -42,11 +42,11 @@ v-decorator="[ 'server', { - initialValue: server.apiHost + server.apiBase + initialValue: server.apiHost || '' + server.apiBase } ]" @change="onChangeServer"> - + {{ item.name }} @@ -109,11 +109,11 @@ v-decorator="[ 'server', { - initialValue: server.apiHost + server.apiBase + initialValue: server.apiHost || '' + server.apiBase } ]" @change="onChangeServer"> - + {{ item.name }} @@ -217,7 +217,7 @@ export default { validateFields(validateFieldsKey, { force: true }, (err, values) => { if (!err) { - this.axios.defaults.baseURL = this.server.apiHost + this.server.apiBase + this.axios.defaults.baseURL = this.server.apiHost || '' + this.server.apiBase store.dispatch('SetServer', this.server) if (customActiveKey === 'cs') { @@ -263,7 +263,7 @@ export default { }, onChangeServer (server) { const servers = this.$config.servers || [] - const serverFilter = servers.filter(ser => ser.apiHost + ser.apiBase === server) + const serverFilter = servers.filter(ser => ser.apiHost || '' + ser.apiBase === server) this.server = serverFilter[0] || {} } } From 0379654eac4d726ce933c81339eb723530acc014 Mon Sep 17 00:00:00 2001 From: utchoang Date: Wed, 20 Jan 2021 07:59:54 +0700 Subject: [PATCH 9/9] Fix for clear code. --- src/main.js | 2 +- src/permission.js | 6 +++--- src/views/auth/Login.vue | 12 ++++++------ 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/main.js b/src/main.js index 24c848719..bffed7604 100644 --- a/src/main.js +++ b/src/main.js @@ -37,7 +37,7 @@ Vue.use(toLocaleDatePlugin) fetch('config.json').then(response => response.json()).then(config => { Vue.prototype.$config = config - Vue.axios.defaults.baseURL = config.servers[0].apiHost || '' + config.servers[0].apiBase + Vue.axios.defaults.baseURL = (config.servers[0].apiHost || '') + config.servers[0].apiBase loadLanguageAsync().then(() => { new Vue({ diff --git a/src/permission.js b/src/permission.js index 13c3c5767..d931f5f5a 100644 --- a/src/permission.js +++ b/src/permission.js @@ -44,12 +44,12 @@ router.beforeEach((to, from, next) => { const serverStorage = Vue.ls.get(SERVER_MANAGER) let apiFullPath = '' if (serverStorage) { - apiFullPath = serverStorage.apiHost || '' + serverStorage.apiBase + apiFullPath = (serverStorage.apiHost || '') + serverStorage.apiBase } - const serverFilter = servers.filter(ser => ser.apiHost || '' + ser.apiBase === apiFullPath) + const serverFilter = servers.filter(ser => (ser.apiHost || '') + ser.apiBase === apiFullPath) const server = serverFilter[0] || servers[0] - Vue.axios.defaults.baseURL = server.apiHost || '' + server.apiBase + Vue.axios.defaults.baseURL = (server.apiHost || '') + server.apiBase store.dispatch('SetServer', server) const validLogin = Vue.ls.get(ACCESS_TOKEN) || Cookies.get('userid') || Cookies.get('userid', { path: '/client' }) diff --git a/src/views/auth/Login.vue b/src/views/auth/Login.vue index fb172f022..a1e038799 100644 --- a/src/views/auth/Login.vue +++ b/src/views/auth/Login.vue @@ -42,11 +42,11 @@ v-decorator="[ 'server', { - initialValue: server.apiHost || '' + server.apiBase + initialValue: (server.apiHost || '') + server.apiBase } ]" @change="onChangeServer"> - + {{ item.name }} @@ -109,11 +109,11 @@ v-decorator="[ 'server', { - initialValue: server.apiHost || '' + server.apiBase + initialValue: (server.apiHost || '') + server.apiBase } ]" @change="onChangeServer"> - + {{ item.name }} @@ -217,7 +217,7 @@ export default { validateFields(validateFieldsKey, { force: true }, (err, values) => { if (!err) { - this.axios.defaults.baseURL = this.server.apiHost || '' + this.server.apiBase + this.axios.defaults.baseURL = (this.server.apiHost || '') + this.server.apiBase store.dispatch('SetServer', this.server) if (customActiveKey === 'cs') { @@ -263,7 +263,7 @@ export default { }, onChangeServer (server) { const servers = this.$config.servers || [] - const serverFilter = servers.filter(ser => ser.apiHost || '' + ser.apiBase === server) + const serverFilter = servers.filter(ser => (ser.apiHost || '') + ser.apiBase === server) this.server = serverFilter[0] || {} } }