quasar.conf.js

@@ -24,7 +24,7 @@ module.exports = configure(function(ctx) {
     // app boot file (/src/boot)
     // --> boot files are part of "main.js"
     // https://quasar.dev/quasar-cli/boot-files
-    boot: ['composition-api', 'axios', 'login', 'plugins'],
+    boot: ['composition-api', 'axios', 'login', 'plugins', 'loading'],
 
     // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
     css: ['app.scss'],

src/boot/loading.ts

@@ -0,0 +1,10 @@
+import { boot } from 'quasar/wrappers';
+import { Loading } from 'quasar';
+
+// "async" is optional;
+// more info on params: https://quasar.dev/quasar-cli/cli-documentation/boot-files#Anatomy-of-a-boot-file
+export default boot(async (/* { app, router, Vue ... } */) => {
+  Loading.setDefaults({
+    spinner: () => import('src/components/loading/DarkCircularProgress.vue')
+  });
+});

src/plugins/user/store/user.ts

@@ -56,9 +56,6 @@ const mutations: MutationTree<UserStateInterface> = {
 const actions: ActionTree<UserStateInterface, StateInterface> = {
   login({ commit }, data: LoginData) {
     commit('setLoginLoading', true);
-    Loading.setDefaults({
-      spinner: () => import('src/components/loading/DarkCircularProgress.vue')
-    });
     Loading.show({
       message: 'Du wirst eingeloggt'
     });
@@ -83,7 +80,7 @@ const actions: ActionTree<UserStateInterface, StateInterface> = {
       });
   },
 
-  doLogout({commit}, token: string) {
+  doLogout({ commit }, token: string) {
     Loading.show({ message: 'Du wirst ausgeloggt' });
     void axios
       .delete(`/auth/${token}`)
@@ -98,8 +95,10 @@ const actions: ActionTree<UserStateInterface, StateInterface> = {
       });
   },
 
-  logout({ dispatch}, token: string) {
-    dispatch('doLogout', token).finally(() => {void Router.push({ name: 'login' });});
+  logout({ dispatch }, token: string) {
+    dispatch('doLogout', token).finally(() => {
+      void Router.push({ name: 'login' });
+    });
   },
 
   updateUser({ commit, state }, data) {
@@ -117,19 +116,9 @@ const actions: ActionTree<UserStateInterface, StateInterface> = {
   loadFromLocalStorage({ commit }) {
     console.log('load from store');
     let data = LocalStorage.getItem('user');
-    commit(
-      'setUser',
-      data
-        ? data
-        : empty_user
-    );
+    commit('setUser', data ? data : empty_user);
     data = LocalStorage.getItem('session');
-    commit(
-      'setSession',
-      data
-        ? data
-        : empty_session
-    );
+    commit('setSession', data ? data : empty_session);
     commit('showState');
   }
 };

src/store/index.ts

@@ -1,6 +1,5 @@
 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';
 import { UserStateInterface } from 'src/plugins/user/store/user';
 
@@ -9,12 +8,11 @@ import { UserStateInterface } from 'src/plugins/user/store/user';
  * directly export the Store instantiation
  */
 export interface StateInterface {
-  user: UserStateInterface,
-  sessions: SessionInterface
+  user: UserStateInterface;
+  sessions: SessionInterface;
 }
 
-
-export default store(function ({ Vue }) {
+export default store(function({ Vue }) {
   Vue.use(Vuex);
 
   const Store = new Vuex.Store<StateInterface>({