Close #42: Fixed the login/logout smooth transition

as well as refactoring vuex storage.

web/src/components/CMS/fetchUpdateItems.vue

+<template>
+  <div>
+    <slot :response="response" :loading="loading"></slot>
+  </div>
+</template>
+
+<script>
+// require modules
+const _ = require('lodash');
+let host = require('../js/const').apiHost;
+
+export default {
+  name: "fetchUpdateItems",
+  data() {
+    return {
+      loading: true,
+      response: '',
+      isDev: process.env.NODE_ENV === 'development'
+    }
+  },
+  computed: {
+    jwt: function () {
+      return this.$store.getters['User/jwt']
+    },
+  },
+  methods: {
+    getItems() {
+      const vm = this;
+
+      // console.log(host)
+
+      if(vm.isDev) {
+        host = require('../js/const').devApiHost;
+      }
+
+      // console.log(vm.isExperimental)
+
+      let url = `${host}/api/update-items`;
+
+      const jwt = vm.jwt;
+      if(jwt === null) {
+        vm.loading = false;
+        vm.response = null;
+        return
+      }
+
+      fetch(url, {
+        method: 'GET',
+        mode: 'cors',
+        cache: 'no-cache',
+        headers: {
+          Authorization: `Bearer ${jwt}`
+        }
+      })
+        .then(response => response.json())
+        .then((response) => {
+          // /* eslint-disable no-console */
+          // console.log(response);
+
+          setTimeout(() => {
+            vm.loading = false;
+            vm.response = response
+          }, 10);
+        });
+    }
+  },
+  mounted() {
+    const vm = this
+    // /* eslint-disable no-console */
+    // console.log(vm.locus);
+    vm.getItems();
+  },
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file

web/src/store/modules/Param.js

-const namespaced = true
-
-const state = {
-  cutoff: 0.005,
-  pvalueCutoff: 0.001,
-  proteinList: [],
-  assays: ['appl'],
-  marker: 'All',
-  parameter: 'All'
-}
-
-const mutations = {
-  SET_CUT_OFF (state, cutoff) {
-    state.cutoff = cutoff
-  },
-  SET_P_VALUE_CUT_OFF (state, pvalue) {
-    state.pvalueCutoff = pvalue
-  },
-  SET_PROTEIN_LIST (state, proteinList) {
-    state.proteinList = proteinList
-  },
-  ADD_PROTEIN (state, protein) {
-    if(state.proteinList.findIndex(d => d.proteinId === protein.proteinId) <0) {
-      state.proteinList.push(protein)
-    }
-  },
-  REMOVE_PROTEIN (state, proteinIdx) {
-    state.proteinList.splice(proteinIdx, 1);
-  },
-}
-
-const getters = {
-  cutoff: state => state.cutoff,
-  pvalueCutoff: state => state.pvalueCutoff,
-  proteinList: state => state.proteinList,
-}
-
-const actions = {
-  setCutOff ({ commit }, cutoff) {
-    commit('SET_CUT_OFF', cutoff)
-  },
-  setPValueCutOff ({ commit }, pvalue) {
-    commit('SET_P_VALUE_CUT_OFF', pvalue)
-  },
-  setProteinList ({ commit }, proteinList) {
-    commit('SET_PROTEIN_LIST', proteinList)
-  },
-  addProtein ({ commit }, protein) {
-    commit('ADD_PROTEIN', protein)
-  },
-  removeProtein ({ commit }, protein) {
-    commit('REMOVE_PROTEIN', protein)
-  }
-}
-
-export default {
-  namespaced,
-  state,
-  mutations,
-  getters,
-  actions
-}

web/src/store/modules/User.js

+const namespaced = true
+
+const state = {
+  jwt: null,
+  userData: null,
+}
+
+const mutations = {
+  SET_JWT (state, jwt) {
+    state.jwt = jwt
+  },
+  SET_USER_DATA (state, userData) {
+    state.userData = userData
+  },
+  LOG_OUT (state) {
+    state.jwt = null
+    state.userData = null
+  },
+}
+
+const getters = {
+  jwt: state => state.jwt,
+  userData: state => state.userData,
+}
+
+const actions = {
+  setJwt ({ commit }, jwt) {
+    commit('SET_JWT', jwt)
+  },
+  setUserData ({ commit }, userData) {
+    commit('SET_USER_DATA', userData)
+  },
+  logOut ({ commit }) {
+    commit('LOG_OUT')
+  },
+}
+
+export default {
+  namespaced,
+  state,
+  mutations,
+  getters,
+  actions
+}