src/boot/axios.ts

@@ -2,6 +2,7 @@ import axios, { AxiosInstance } from 'axios';
 import { boot } from 'quasar/wrappers';
 import config from '../config';
 import { Store } from 'vuex';
+import { StateInterface } from 'src/store';
 
 declare module 'vue/types/vue' {
   interface Vue {
@@ -9,14 +10,14 @@ declare module 'vue/types/vue' {
   }
 }
 
-export default boot<Store<any>>(({ Vue, store }) => {
+export default boot<Store<StateInterface>>(({ Vue, store }) => {
   // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
   Vue.prototype.$axios = axios;
   axios.defaults.baseURL = config.baseURL;
 
   axios.interceptors.request.use(config => {
-    const session: FG.Session = store.getters['user/session'];
+    const session = store.state.user.session;
-    if (session) {
+    if (session.token) {
       config.headers = {'Authorization': 'Token ' + session.token};
     }
     return config;

src/boot/login.ts

@@ -1,15 +1,15 @@
 import { boot } from 'quasar/wrappers';
+import { StateInterface } from 'src/store';
 import { RouteRecord } from 'vue-router';
 import { Store } from 'vuex';
-import { StateInterface } from 'src/store';
 
 export default boot<Store<StateInterface>>(({ router, store }) => {
   router.beforeEach((to, from, next) => {
     store
       .dispatch('user/loadFromLocalStorage')
       .then(() => {
-        const user: FG.User = <FG.User>store.getters['user/user'];
+        const user = store.state.user.user;
-        const session: FG.Session = <FG.Session>store.getters['user/session'];
+        const session = store.state.user.session;
 
         if (session.expires >= new Date()) {
           store.dispatch('user/doLogout').catch(error => {console.warn(error)});

src/boot/plugins.ts

@@ -215,6 +215,4 @@ export default boot<Store<StateInterface>>(({ Vue, router, store }) => {
   // save plugins in VM-variable
   // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
   Vue.prototype.$flaschengeistPlugins = loadedPlugins;
-  console.log(loadedPlugins);
-  console.log(Vue.prototype.$flaschengeistPlugins);
 });

src/components/navigation/EssentialLink.vue

@@ -48,8 +48,7 @@ export default defineComponent({
         const substring = props.title
           .substring(startIndex, endIndex)
           .replace(/"/g, '');
-        console.log(substring);
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
-        console.log('loadFromStore');
         return <string>root.$store.getters[substring];
       }
       return props.title;

src/layouts/MainLayout.vue

@@ -101,6 +101,8 @@ import ShortCutLink from 'components/navigation/ShortCutLink.vue';
 import { Screen } from 'quasar';
 import { LoadedPlugins, PluginMainLink } from 'boot/plugins';
 import { defineComponent, ref, computed } from '@vue/composition-api';
+import { Store } from 'vuex';
+import { StateInterface } from 'src/store';
 
 const links = [
   {
@@ -170,8 +172,9 @@ export default defineComponent({
     });
 
     function logout() {
-      ctx.root.$store
+      const store = <Store<StateInterface>>ctx.root.$store;
-        .dispatch('user/logout', ctx.root.$store.getters['user/session'].token)
+      store
+        .dispatch('user/logout', store.state.user.session.token)
         .catch(error => {
           console.warn(error);
         });

src/plugins/user/components/settings/Main.vue

@@ -90,11 +90,16 @@
 
 <script lang="ts">
 import { computed, defineComponent, ref } from '@vue/composition-api';
+import { Store } from 'vuex';
+import { StateInterface } from 'src/store';
+
 export default defineComponent({
   name: 'Main',
-  setup(_, { root: { $store } }) {
+  setup(_, { root }) {
+    const store = <Store<StateInterface>>root.$store;
+
     const user = computed<FG.User>(() => {
-      return <FG.User>$store.getters['user/user'];
+      return store.state.user.user;
     });
 
     const firstname = ref(user.value.firstname);
@@ -128,7 +133,7 @@ export default defineComponent({
           new_password: new_password.value
         });
       }
-      $store.dispatch('user/updateUser', change_values).catch(error => {
+      store.dispatch('user/updateUser', change_values).catch(error => {
         console.warn(error);
       });
     }

src/plugins/user/components/settings/Sessions.vue

@@ -38,6 +38,9 @@
 
 <script lang="ts">
 import { defineComponent } from '@vue/composition-api';
+import { Store } from 'vuex';
+import { StateInterface } from 'src/store';
+
 export default defineComponent({
   name: 'Sessions',
   props: {
@@ -46,6 +49,8 @@ export default defineComponent({
     }
   },
   setup(_, { root }) {
+    const store = <Store<StateInterface>>root.$store;
+
     function getBrowserIcon(browser: string) {
       return browser == 'firefox'
         ? 'mdi-firefox'
@@ -55,6 +60,7 @@ export default defineComponent({
         ? 'mdi-apple-safari'
         : 'mdi-help';
     }
+
     function getPlatformIcon(platform: string) {
       return platform == 'linux'
         ? 'mdi-linux'
@@ -66,12 +72,12 @@ export default defineComponent({
     }
 
     function deleteSession(token: string) {
-      root.$store.dispatch('sessions/deleteSession', token).catch(error => {
+      store.dispatch('sessions/deleteSession', token).catch(error => {
         console.warn(error);
       });
     }
     function isThisSession(token: string) {
-      return root.$store.getters['user/session'].token == token;
+      return store.state.user.session.token == token;
     }
 
     return {

src/plugins/user/pages/Settings.vue

@@ -33,27 +33,27 @@ import { computed, defineComponent, onBeforeMount } from '@vue/composition-api';
 import CircularProgress from 'components/loading/CircularProgress.vue';
 import Sessions from '../components/settings/Sessions.vue';
 import Main from '../components/settings/Main.vue';
+import { Store } from 'vuex';
+import { StateInterface } from 'src/store';
+
 export default defineComponent({
   // name: 'PageName'
   components: { CircularProgress, Sessions, Main },
   setup(_, { root }) {
+    const store = <Store<StateInterface>>root.$store;
+
     onBeforeMount(() => {
-      root.$store.dispatch('sessions/getSessions').catch(error => {
+      store.dispatch('sessions/getSessions').catch(error => {
         console.warn(error);
       });
     });
-    const sessions = computed(
+    const sessions = computed(() => store.state.sessions.sessions);
-      () => <FG.Session[]>root.$store.getters['sessions/sessions']
-    );
 
     function showRootGetters() {
-      //ctx.root.$store.dispatch('sessions/getSessions');
       console.log(sessions.value);
     }
 
-    const sessionsLoading = computed(
+    const sessionsLoading = computed(() => store.state.sessions.loading);
-      () => <boolean>root.$store.getters['sessions/loading']
-    );
 
     return {
       showRootGetters,

src/plugins/user/pages/User.vue

@@ -24,18 +24,19 @@
 
 <script lang="ts">
 import { defineComponent, computed } from '@vue/composition-api';
-import { UserStateInterface } from '../store/user';
 import { mainLink } from '../plugin';
+import { Store } from 'vuex';
+import { StateInterface } from 'src/store';
 
 export default defineComponent({
   // name: 'PageName'
   setup(_, { root }) {
-    const userObj = computed(
+    const store = <Store<StateInterface>>root.$store;
-      () => <UserStateInterface>root.$store.getters['user/user']
+
-    );
+    const userObj = computed(() => store.state.user.user);
-    const sessionObj = computed(
+
-      () => <UserStateInterface>root.$store.getters['user/session']
+    const sessionObj = computed(() => store.state.user.session);
-    );
+
     const checkMain = computed(() => {
       return mainLink.name == root.$route.name;
     });

src/plugins/user/store/user.ts

@@ -102,10 +102,10 @@ const actions: ActionTree<UserStateInterface, StateInterface> = {
     dispatch('doLogout', token).finally(() => {void Router.push({ name: 'login' });});
   },
 
-  updateUser({ commit, getters }, data) {
+  updateUser({ commit, state }, data) {
     commit('setLoginLoading', true);
     axios
-      .put(`/users/${getters.user.userid}`, data)
+      .put(`/users/${state.user.userid}`, data)
       .catch(error => {
         console.log(error);
       })

src/store/index.ts

@@ -1,4 +1,6 @@
 import { store } from 'quasar/wrappers';
+import { SessionInterface } from 'src/plugins/user/store/session';
+import { UserStateInterface } from 'src/plugins/user/store/user';
 import Vuex from 'vuex';
 
 /*
@@ -6,7 +8,8 @@ import Vuex from 'vuex';
  * directly export the Store instantiation
  */
 export interface StateInterface {
-
+  user: UserStateInterface,
+  sessions: SessionInterface
 }