Merge remote-tracking branch 'origin/feature/useroptions' into feature/useroptions

# Conflicts:
#	src/plugins/routes.js

src/components/finanzer/Overview.vue

@@ -66,7 +66,8 @@
         </v-expand-transition>
       </v-card>
     </v-expand-transition>
-    <TableSkeleton v-if="loading" />
+    <v-progress-linear v-if="loading && users.length !== 0" indeterminate />
+    <TableSkeleton v-if="loading && users.length === 0" />
     <div v-for="user in users" :key="users.indexOf(user)">
       <v-card
         v-if="user.creditList[year] && isFiltered(user)"

src/components/finanzer/Skeleton/UserSkeleton.vue

@@ -0,0 +1,82 @@
+<template>
+  <div>
+    <v-toolbar tile>
+      <v-toolbar-title>
+        <v-row>
+          <v-col>
+            <v-skeleton-loader type="chip" />
+          </v-col>
+          <v-col>
+            <v-skeleton-loader type="chip" />
+          </v-col>
+        </v-row>
+      </v-toolbar-title>
+      <v-spacer />
+      <v-toolbar-items>
+        <v-skeleton-loader type="button" />
+      </v-toolbar-items>
+    </v-toolbar>
+    <v-card style="margin-top: 3px;">
+      <v-card-title><v-skeleton-loader type="heading"/></v-card-title>
+      <v-card-text>
+        <v-form style="margin-left: 15px; margin-right: 15px">
+          <v-row>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+            <v-col>
+              <v-skeleton-loader type="button" />
+            </v-col>
+          </v-row>
+          <v-divider style="margin-bottom: 15px;" />
+          <v-row>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+          </v-row>
+          <v-row>
+            <v-skeleton-loader type="button" />
+          </v-row>
+        </v-form>
+      </v-card-text>
+    </v-card>
+    <v-card style="margin-top: 3px;">
+      <v-card-title><v-skeleton-loader type="chip"/></v-card-title>
+      <v-card-text>
+        <v-form style="margin-left: 15px; margin-right: 15px">
+          <v-row>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+          </v-row>
+          <v-row>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+            <v-col>
+              <v-skeleton-loader type="chip" />
+            </v-col>
+          </v-row>
+        </v-form>
+        <v-skeleton-loader type="button" />
+      </v-card-text>
+    </v-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'UserSkeleton'
+}
+</script>
+
+<style scoped></style>

src/components/finanzer/User.vue

@@ -1,18 +1,26 @@
 <template>
+  <div>
+    <v-content v-if="loading" >
+      <UserSkeleton />
+    </v-content>
     <v-content v-if="activeUser">
       <v-toolbar tile>
-      <v-toolbar-title>{{ activeUser.lastname }}, {{ activeUser.firstname }}</v-toolbar-title>
+        <v-toolbar-title
+          >{{ activeUser.lastname }},
+          {{ activeUser.firstname }}</v-toolbar-title
+        >
         <v-spacer />
         <v-toolbar-items>
-        <v-btn @click="sendMail({ username: activeUser.username })" text>Email senden</v-btn>
+          <v-btn @click="sendMail({ username: activeUser.username })" text
+            >Email senden</v-btn
+          >
         </v-toolbar-items>
       </v-toolbar>
+      <v-progress-linear v-if="activeUser.loading" indeterminate />
       <v-expand-transition>
         <v-card style="margin-top: 3px" v-show="errorMail">
           <v-alert dense :type="computeError(errorMail)">
-          {{
+            {{ errorMessage(errorMail) }}
-          errorMessage(errorMail)
-          }}
           </v-alert>
         </v-card>
       </v-expand-transition>
@@ -25,17 +33,17 @@
                 <v-label>Status:</v-label>
               </v-col>
               <v-col>
-              <v-chip
+                <v-chip outlined :text-color="getLockedColor(activeUser.locked)"
-                outlined
+                  >{{ activeUser.locked ? 'Gesperrt' : 'nicht Gesperrt' }}
-                :text-color="getLockedColor(activeUser.locked)"
+                </v-chip>
-              >{{ activeUser.locked ? 'Gesperrt' : 'nicht Gesperrt' }}</v-chip>
               </v-col>
               <v-col>
                 <v-btn
                   @click="
                     doLock({ user: activeUser, locked: !activeUser.locked })
                   "
-              >{{ activeUser.locked ? 'Entperren' : 'Sperren' }}</v-btn>
+                  >{{ activeUser.locked ? 'Entperren' : 'Sperren' }}
+                </v-btn>
               </v-col>
             </v-row>
             <v-divider style="margin-bottom: 15px;" />
@@ -71,7 +79,8 @@
                     autoLock: autoLock.value
                   })
                 "
-            >Speichern</v-btn>
+                >Speichern
+              </v-btn>
             </v-row>
           </v-form>
         </v-card-text>
@@ -82,7 +91,11 @@
           <v-form style="margin-left: 15px; margin-right: 15px">
             <v-row>
               <v-col>
-              <v-text-field :rules="[isNumber]" label="Betrag" v-model="amount"></v-text-field>
+                <v-text-field
+                  :rules="[isNumber]"
+                  label="Betrag"
+                  v-model="amount"
+                ></v-text-field>
               </v-col>
               <v-col>
                 <v-select
@@ -141,9 +154,7 @@
                       getLastColor(activeUser.creditList[year][1].last)
                     "
                   >
-                  {{
+                    {{ (activeUser.creditList[year][1].last / 100).toFixed(2) }}
-                  (activeUser.creditList[year][1].last / 100).toFixed(2)
-                  }}
                   </v-chip>
                 </v-col>
                 <v-col>
@@ -178,17 +189,19 @@
         </v-card>
       </div>
     </v-content>
+  </div>
 </template>
 
 <script>
 import Table from './Table'
 import { mapGetters, mapActions } from 'vuex'
+import UserSkeleton from "./Skeleton/UserSkeleton";
 export default {
   name: 'User',
   props: {
     id: String
   },
-  components: { Table },
+  components: {UserSkeleton, Table },
   data() {
     return {
       isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.',
@@ -328,7 +341,8 @@ export default {
       activeUser: 'finanzerUsers/activeUser',
       errorMail: 'finanzerUsers/errorMail',
       months: 'finanzerUsers/months',
-      selectYears: 'finanzerUsers/selectYears'
+      selectYears: 'finanzerUsers/selectYears',
+      loading: 'finanzerUsers/addUserLoading'
     })
   },
   watch: {

src/store/modules/barUsers.js

@@ -89,7 +89,7 @@ const actions = {
     commit('setUsersLoading', false)
   },
   async addAmount({ commit, rootState, dispatch }, data) {
-    commit('updateUser', {username: data.username, loading: true})
+    commit('updateUser', { username: data.username, loading: true })
     try {
       const response = await axios.post(
         url.barAddAmount,
@@ -101,10 +101,10 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
-    commit('updateUser', {username: data.username, loading: false})
+    commit('updateUser', { username: data.username, loading: false })
   },
   async addCreditList({ commit, rootState, dispatch }, data) {
-    commit('updateUser', {username: data.username, loading: true})
+    commit('updateUser', { username: data.username, loading: true })
     try {
       const response = await axios.post(
         url.barGetUser,
@@ -116,7 +116,7 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
-    commit('updateUser', {username: data.username, loading: false})
+    commit('updateUser', { username: data.username, loading: false })
   },
   async getAllUsers({ commit, rootState, dispatch }) {
     commit('setAllUsersLoading', true)
@@ -153,7 +153,7 @@ const getters = {
   },
   allUsersLoading: state => {
     return state.allUsersLoading
-  },
+  }
 }
 
 export default {

src/store/modules/finanzerUsers.js

@@ -26,7 +26,9 @@ const state = {
     { value: 12, text: 'Dezember' }
   ],
   allUsersLoading: false,
-  usersLoading: false
+  usersLoading: false,
+  emailLoading: false,
+  addUserLoading: false
 }
 
 const mutations = {
@@ -227,6 +229,12 @@ const mutations = {
   },
   setUsersLoading: (state, value) => {
     state.usersLoading = value
+  },
+  setEMailLoading: (state, value) => {
+    state.emailLoading = value
+  },
+  setAddUserLoading: (state, value) => {
+    state.addUserLoading = value
   }
 }
 
@@ -267,7 +275,7 @@ const actions = {
     commit('setActiveUser', username)
   },
   async addAmount({ commit, rootState, dispatch }, data) {
-    commit('updateUsers', {username: data.user.username, loading: true})
+    commit('updateUsers', { username: data.user.username, loading: true })
     try {
       const response = await axios.post(
         url.finanzerAddAmount,
@@ -291,10 +299,10 @@ const actions = {
         if (err.response.status === 401)
           dispatch('logout', null, { root: true })
     }
-    commit('updateUsers', {username: data.user.username, loading: false})
+    commit('updateUsers', { username: data.user.username, loading: false })
   },
   async addCredit({ commit, rootState, dispatch }, data) {
-    commit('updateUsers', {username: data.user.username, loading: true})
+    commit('updateUsers', { username: data.user.username, loading: true })
     try {
       const response = await axios.post(
         url.finanzerAddCredit,
@@ -318,9 +326,10 @@ const actions = {
         if (err.response.status === 401)
           dispatch('logout', null, { root: true })
     }
-    commit('updateUsers', {username: data.user.username, loading: false})
+    commit('updateUsers', { username: data.user.username, loading: false })
   },
   async doLock({ commit, rootState, dispatch }, data) {
+    commit('updateUsers', { username: data.user.username, loading: true })
     try {
       const response = await axios.post(
         url.lockUser,
@@ -332,8 +341,10 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
+    commit('updateUsers', { username: data.user.username, loading: false })
   },
   async saveConfig({ commit, rootState, dispatch }, data) {
+    commit('updateUsers', { username: data.user.username, loading: true })
     try {
       const response = await axios.post(
         url.finanzerSetConfig,
@@ -349,8 +360,10 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
+    commit('updateUsers', { username: data.user.username, loading: false })
   },
   async addUser({ commit, rootState, dispatch }, data) {
+    commit('setAddUserLoading', true)
     try {
       const response = await axios.post(
         url.finanzerAddUser,
@@ -362,8 +375,10 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
+    commit('setAddUserLoading', false)
   },
   async sendMails({ commit, rootState, dispatch }) {
+    commit('setEMailLoading', true)
     try {
       const response = await axios.get(url.finanzerSendAllMail, {
         headers: { Token: rootState.login.user.accessToken }
@@ -373,8 +388,10 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
+    commit('setEMailLoading', false)
   },
   async sendMail({ commit, rootState, dispatch }, data) {
+    commit('updateUsers', { username: data.username, loading: true })
     try {
       const response = await axios.post(
         url.finanzerSendOneMail,
@@ -386,6 +403,7 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
+    commit('updateUsers', { username: data.username, loading: false })
   },
   createYears({ commit }) {
     commit('setYears')
@@ -434,6 +452,9 @@ const getters = {
   },
   usersLoading: state => {
     return state.usersLoading
+  },
+  addUserLoading: state => {
+    return state.addUserLoading
   }
 }
 

src/store/modules/serviceManagement.js

@@ -248,10 +248,10 @@ const actions = {
     }
   },
   setDayLoading({ commit, getters }, date) {
-    commit('setDayLoading', {date, getters})
+    commit('setDayLoading', { date, getters })
   },
-  setDayNotLoading({commit, getters}, date) {
+  setDayNotLoading({ commit, getters }, date) {
-    commit('setDayNotLoading', {date, getters})
+    commit('setDayNotLoading', { date, getters })
   }
 }
 const getters = {

src/store/modules/user.js

@@ -136,7 +136,7 @@ const mutations = {
 
 const actions = {
   async getUser({ commit, rootState, dispatch }) {
-    commit("setLoading", true)
+    commit('setLoading', true)
     try {
       const response = await axios.get(url.userMain, {
         headers: { Token: rootState.login.user.accessToken }
@@ -147,7 +147,7 @@ const actions = {
       if (e.response)
         if (e.response.status === 401) dispatch('logout', null, { root: true })
     }
-    commit("setLoading", false)
+    commit('setLoading', false)
   },
   async addAmount({ commit, rootState, dispatch }, amount) {
     commit('setAddLoading', true)