From 3bb31e3cb436511682f34a63f677fb966a7f29ea Mon Sep 17 00:00:00 2001
From: Sonia Zorba <sonia.zorba@inaf.it>
Date: Tue, 15 Dec 2020 17:35:28 +0100
Subject: [PATCH] Displayed user info in UI
---
vospace-ui-frontend/src/App.vue | 1 +
.../src/api/mock/data/user.json | 3 +++
vospace-ui-frontend/src/api/mock/index.js | 5 +++++
vospace-ui-frontend/src/api/server/index.js | 22 +++++++++++++++++++
.../src/components/TopMenu.vue | 9 ++++++++
vospace-ui-frontend/src/store.js | 10 ++++++++-
6 files changed, 49 insertions(+), 1 deletion(-)
create mode 100644 vospace-ui-frontend/src/api/mock/data/user.json
diff --git a/vospace-ui-frontend/src/App.vue b/vospace-ui-frontend/src/App.vue
index 4081bff..79f9a9f 100644
--- a/vospace-ui-frontend/src/App.vue
+++ b/vospace-ui-frontend/src/App.vue
@@ -31,6 +31,7 @@ export default {
},
mounted() {
this.$store.dispatch('loadJobs');
+ this.$store.dispatch('loadUserInfo');
}
}
</script>
diff --git a/vospace-ui-frontend/src/api/mock/data/user.json b/vospace-ui-frontend/src/api/mock/data/user.json
new file mode 100644
index 0000000..7a8e8c5
--- /dev/null
+++ b/vospace-ui-frontend/src/api/mock/data/user.json
@@ -0,0 +1,3 @@
+{
+ "username": "anonymous"
+}
diff --git a/vospace-ui-frontend/src/api/mock/index.js b/vospace-ui-frontend/src/api/mock/index.js
index ed27af4..7f03175 100644
--- a/vospace-ui-frontend/src/api/mock/index.js
+++ b/vospace-ui-frontend/src/api/mock/index.js
@@ -3,6 +3,8 @@ import folder1 from 'raw-loader!./data/nodes/folder1.html';
import folder2 from 'raw-loader!./data/nodes/folder2.html';
import job from './data/job';
import jobs from './data/jobs';
+import user from './data/user';
+
import store from '../../store';
const fetch = (mockData, showLoading = true, time = 500) => {
@@ -40,5 +42,8 @@ export default {
},
loadJobs() {
return fetch(jobs, false);
+ },
+ getUserInfo() {
+ return fetch(user, false);
}
}
diff --git a/vospace-ui-frontend/src/api/server/index.js b/vospace-ui-frontend/src/api/server/index.js
index 6162815..0c5e4a9 100644
--- a/vospace-ui-frontend/src/api/server/index.js
+++ b/vospace-ui-frontend/src/api/server/index.js
@@ -50,5 +50,27 @@ export default {
'Cache-Control': 'no-cache'
}
}, true, true);
+ },
+ loadJobs() {
+ let url = BASE_API_URL + 'jobs';
+ return apiRequest({
+ method: 'GET',
+ url: url,
+ withCredentials: true,
+ headers: {
+ 'Cache-Control': 'no-cache'
+ }
+ }, false, true);
+ },
+ getUserInfo() {
+ let url = BASE_API_URL + 'user';
+ return apiRequest({
+ method: 'GET',
+ url: url,
+ withCredentials: true,
+ headers: {
+ 'Cache-Control': 'no-cache'
+ }
+ }, false, false);
}
}
diff --git a/vospace-ui-frontend/src/components/TopMenu.vue b/vospace-ui-frontend/src/components/TopMenu.vue
index 813bddf..707c7e7 100644
--- a/vospace-ui-frontend/src/components/TopMenu.vue
+++ b/vospace-ui-frontend/src/components/TopMenu.vue
@@ -3,6 +3,12 @@
<b-navbar toggleable="lg" type="dark" id="top-menu">
<b-navbar-brand href="#/" class="d-none d-md-block">VOSpace</b-navbar-brand>
<JobsMenuItem />
+ <b-navbar-nav class="ml-auto">
+ <b-nav-item href="login" target="blank_" class="mr-4" v-if="user === 'anonymous'">Login</b-nav-item>
+ <b-nav-item-dropdown :text="user" right v-if="user !== 'anonymous'">
+ <b-dropdown-item href="vospace-logout">Logout</b-dropdown-item>
+ </b-nav-item-dropdown>
+ </b-navbar-nav>
</b-navbar>
</div>
</template>
@@ -13,6 +19,9 @@ import JobsMenuItem from './JobsMenuItem.vue';
export default {
components: {
JobsMenuItem
+ },
+ computed: {
+ user() { return this.$store.state.user }
}
}
</script>
diff --git a/vospace-ui-frontend/src/store.js b/vospace-ui-frontend/src/store.js
index 14255d7..af99d79 100644
--- a/vospace-ui-frontend/src/store.js
+++ b/vospace-ui-frontend/src/store.js
@@ -12,7 +12,8 @@ export default new Vuex.Store({
path: '',
loading: true,
tapeButtonEnabled: false,
- jobs: []
+ jobs: [],
+ user: 'anonymous'
},
mutations: {
setLoading(state, loading) {
@@ -37,6 +38,9 @@ export default new Vuex.Store({
},
addJob(state, job) {
state.jobs.push(job);
+ },
+ setUsername(state, username) {
+ state.user = username;
}
},
actions: {
@@ -72,6 +76,10 @@ export default new Vuex.Store({
loadJobs({ commit }) {
client.loadJobs()
.then(jobs => commit('setJobs', jobs));
+ },
+ loadUserInfo({ commit }) {
+ client.getUserInfo()
+ .then(res => commit('setUsername', res.username));
}
}
});
--
GitLab