From a7a135eb654c0906709363d4a5ca5af07bf8762b Mon Sep 17 00:00:00 2001 From: Sonia Zorba <sonia.zorba@inaf.it> Date: Mon, 8 Feb 2021 11:12:27 +0100 Subject: [PATCH] Loading animation improvements --- .gitignore | 1 + .../src/main/resources/auth.properties | 2 +- vospace-ui-frontend/src/App.vue | 4 ++-- vospace-ui-frontend/src/api/server/index.js | 4 +++- vospace-ui-frontend/src/components/Jobs.vue | 17 ++++++++++++++++- vospace-ui-frontend/src/store.js | 8 +++++++- 6 files changed, 30 insertions(+), 6 deletions(-) diff --git a/.gitignore b/.gitignore index fcc5e23..3c2e894 100644 --- a/.gitignore +++ b/.gitignore @@ -4,4 +4,5 @@ **/dist/* .env.local nbactions.xml +nb-configuration.xml .env.development.local diff --git a/vospace-ui-backend/src/main/resources/auth.properties b/vospace-ui-backend/src/main/resources/auth.properties index 621a3ef..7f4bad0 100644 --- a/vospace-ui-backend/src/main/resources/auth.properties +++ b/vospace-ui-backend/src/main/resources/auth.properties @@ -3,6 +3,6 @@ client_secret=@client_secret@ rap_uri=@rap_uri@ gms_uri=@gms_uri@ -groups_autoload=false +groups_autoload=true store_state_on_login_endpoint=true scope=openid email profile read:rap diff --git a/vospace-ui-frontend/src/App.vue b/vospace-ui-frontend/src/App.vue index 79f9a9f..9af1920 100644 --- a/vospace-ui-frontend/src/App.vue +++ b/vospace-ui-frontend/src/App.vue @@ -9,7 +9,7 @@ — Powered by <img alt="IA2 logo" src="./assets/ia2-logo-footer.png"> <strong class="text-primary"><a href="http://www.ia2.inaf.it/" target="blank_">IA2</a></strong> — </footer> - <div id="loading" v-if="loading"> + <div id="loading" v-if="loading" class="loading"> <div class="spinner-wrapper"> <b-spinner variant="primary" style="width: 3rem; height: 3rem;" label="Loading"></b-spinner> </div> @@ -61,7 +61,7 @@ export default { left: 0; } -#loading { +.loading { position: fixed; top: 0; bottom: 0; diff --git a/vospace-ui-frontend/src/api/server/index.js b/vospace-ui-frontend/src/api/server/index.js index a4b485f..32fc75c 100644 --- a/vospace-ui-frontend/src/api/server/index.js +++ b/vospace-ui-frontend/src/api/server/index.js @@ -16,7 +16,9 @@ function apiRequest(options, showLoading = true, handleValidationErrors = false) } else { resolve(response.data); } - store.commit('setLoading', false); + if (showLoading) { + store.commit('setLoading', false); + } }) .catch(error => { store.commit('setLoading', false); diff --git a/vospace-ui-frontend/src/components/Jobs.vue b/vospace-ui-frontend/src/components/Jobs.vue index 7abb1ea..c117dc4 100644 --- a/vospace-ui-frontend/src/components/Jobs.vue +++ b/vospace-ui-frontend/src/components/Jobs.vue @@ -17,13 +17,28 @@ </tr> </tbody> </table> + <div id="jobs-loading" v-if="jobsLoading" class="loading"> + <div class="spinner-wrapper"> + <b-spinner variant="primary" style="width: 3rem; height: 3rem;" label="Loading"></b-spinner> + </div> + </div> </div> </template> <script> export default { computed: { - jobs() { return this.$store.state.jobs } + jobs() { return this.$store.state.jobs }, + jobsLoading() { return this.$store.state.jobsLoading } + }, + mounted() { + this.loadJobs(); + this.$store.commit('setLoading', false); + }, + methods: { + loadJobs() { + this.$store.dispatch('loadJobs'); + } } } </script> diff --git a/vospace-ui-frontend/src/store.js b/vospace-ui-frontend/src/store.js index 8cd9bd8..f1278db 100644 --- a/vospace-ui-frontend/src/store.js +++ b/vospace-ui-frontend/src/store.js @@ -13,6 +13,7 @@ export default new Vuex.Store({ loading: true, asyncButtonEnabled: false, jobs: [], + jobsLoading: true, user: 'anonymous', nodeToDelete: null, writable: false @@ -41,6 +42,9 @@ export default new Vuex.Store({ addJob(state, job) { state.jobs.push(job); }, + setJobsLoading(state, loading) { + state.jobsLoading = loading; + }, setUsername(state, username) { state.user = username; }, @@ -83,8 +87,10 @@ export default new Vuex.Store({ }); }, loadJobs({ commit }) { + commit('setJobsLoading', true); client.loadJobs() - .then(jobs => commit('setJobs', jobs)); + .then(jobs => commit('setJobs', jobs)) + .finally(() => commit('setJobsLoading', false)); }, loadUserInfo({ commit }) { client.getUserInfo() -- GitLab