From e7eb37c7bc3a8366f576ad6289932ef3794cf694 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tim=20Gr=C3=B6ger?= <tim@groeger-clan.de>
Date: Thu, 4 Jun 2020 20:56:03 +0200
Subject: [PATCH] fixed bug ##258

---
 src/components/baruser/CreditLists.vue |  58 ++++++++-----
 src/components/user/AddAmount.vue      | 109 +++++++++++++++++--------
 src/store/modules/barUsers.js          |  55 +++++++------
 src/store/modules/user.js              |  52 ++++++------
 4 files changed, 166 insertions(+), 108 deletions(-)

diff --git a/src/components/baruser/CreditLists.vue b/src/components/baruser/CreditLists.vue
index eab1831..b3674bc 100644
--- a/src/components/baruser/CreditLists.vue
+++ b/src/components/baruser/CreditLists.vue
@@ -3,10 +3,10 @@
     <v-dialog v-model="dialog" max-width="290">
       <v-card>
         <v-card-title class="headline"
-          >Transaktion ist länger als 5 Minuten her!</v-card-title
+          >Transaktion ist länger als 1 Minute her!</v-card-title
         >
         <v-card-text>
-          Da die Transaktion länger als 5 Minutern her ist, kann eine
+          Da die Transaktion länger als 1 Minuter her ist, kann eine
           Stornierung nicht durchgeführt werden. Wende dich bitte an den
           Finanzer.
         </v-card-text>
@@ -39,11 +39,11 @@
             <v-list-item-content>
               <v-progress-linear indeterminate v-if="message.loading" />
               <v-list-item-title>{{ now(message.date) }}</v-list-item-title>
-              <v-list-item-subtitle>{{ message.message }}</v-list-item-subtitle>
+              <v-list-item-subtitle>{{ createMessage(message) }}</v-list-item-subtitle>
               <v-list-item-subtitle class="red--text" v-if="message.storno"
                 >STORNIERT!!!</v-list-item-subtitle
               >
-              <v-list-item-action-text
+              <v-list-item-action-text v-if="under5minutes(message.date)"
                 >Klicken um zu Stornieren
               </v-list-item-action-text>
             </v-list-item-content>
@@ -55,11 +55,14 @@
       <div v-if="isFiltered(user)">
         <v-container>
           <v-card :loading="user.loading">
-            <v-list-item>
+            <v-card-title>
               <v-list-item-title class="title"
                 >{{ user.firstname }} {{ user.lastname }}</v-list-item-title
               >
-            </v-list-item>
+            </v-card-title>
+            <v-card-subtitle v-if="user.limit + user.amount > 0">
+              Nur noch {{ ((user.limit + user.amount)/100).toFixed(2)}} € übrig!!
+            </v-card-subtitle>
             <v-card-text>
               <v-row>
                 <v-col cols="10">
@@ -206,11 +209,11 @@
             :key="messages.indexOf(message)"
             :color="message.error ? 'error' : 'success'"
             bottom
-            :timeout="3000"
+            :timeout="0"
             :multi-line="true"
             v-model="message.visible"
           >
-            {{ message.message }}
+            {{ createMessage(message) }}
           </v-snackbar>
         </v-container>
       </div>
@@ -273,9 +276,10 @@ export default {
       }
     },
     addAmountMore(user) {
+      console.log(user.value * 100)
       this.addAmount({
         username: user.username,
-        amount: Math.abs(user.value * 100),
+        amount: Math.round(Math.abs(user.value * 100)),
         user: user
       })
       setTimeout(() => {
@@ -293,6 +297,29 @@ export default {
           })
         }
       }
+    },
+    createMessage(message) {
+      var text = ''
+      if (message.error) {
+        text =
+                'Konnte ' +
+                (message.amount / 100).toFixed(2) +
+                '€ zu ' +
+                message.user.firstname +
+                ' ' +
+                message.user.lastname +
+                ' hinzufügen.'
+      } else {
+        text =
+                '' +
+                (message.amount / 100).toFixed(2) +
+                '€ wurde zu ' +
+                message.user.firstname +
+                ' ' +
+                message.user.lastname +
+                ' hinzugefügt.'
+      }
+      return text
     }
   },
   computed: {
@@ -306,18 +333,7 @@ export default {
     under5minutes() {
       return now => {
         var actual = new Date()
-        var zero = new Date(0)
-        var date = new Date(actual - now)
-        if (
-          date.getFullYear() === zero.getFullYear() &&
-          date.getMonth() === zero.getMonth() &&
-          date.getDate() === zero.getDate()
-        ) {
-          if (date.getMinutes() < 6) {
-            return true
-          }
-        }
-        return false
+        return actual - now < 60000
       }
     },
     now() {
diff --git a/src/components/user/AddAmount.vue b/src/components/user/AddAmount.vue
index 00b90d0..57cb55c 100644
--- a/src/components/user/AddAmount.vue
+++ b/src/components/user/AddAmount.vue
@@ -3,10 +3,10 @@
     <v-dialog v-model="dialog" max-width="290">
       <v-card>
         <v-card-title class="headline"
-          >Transaktion ist länger als 5 Minuten her!</v-card-title
+          >Transaktion ist länger als 15 Sekunden her!</v-card-title
         >
         <v-card-text>
-          Da die Transaktion länger als 5 Minutern her ist, kann eine
+          Da die Transaktion länger als 15 Sekunden her ist, kann eine
           Stornierung nicht durchgeführt werden. Wende dich bitte an den
           Finanzer.
         </v-card-text>
@@ -32,19 +32,23 @@
           three-line
           :key="messages.indexOf(message)"
         >
-          <v-list-item three-line inactive @click="storno(message)">
-            <v-list-item-content>
-              <v-progress-linear indeterminate v-if="message.loading" />
-              <v-list-item-title>{{ now(message.date) }}</v-list-item-title>
-              <v-list-item-subtitle>{{ message.message }}</v-list-item-subtitle>
-              <v-list-item-subtitle class="red--text" v-if="message.storno"
-                >STORNIERT!!!</v-list-item-subtitle
-              >
-              <v-list-item-action-text
-                >Klicken um zu Stornieren
-              </v-list-item-action-text>
-            </v-list-item-content>
-          </v-list-item>
+          <div v-if="message">
+            <v-list-item three-line inactive @click="storno(message)">
+              <v-list-item-content>
+                <v-progress-linear indeterminate v-if="message.loading" />
+                <v-list-item-title>{{ now(message.date) }}</v-list-item-title>
+                <v-list-item-subtitle>
+                  {{ createMessage(message) }}
+                </v-list-item-subtitle>
+                <v-list-item-subtitle class="red--text" v-if="message.storno"
+                  >STORNIERT!!!
+                </v-list-item-subtitle>
+                <v-list-item-action-text v-if="under5minutes(message.date)"
+                  >Klicken um zu Stornieren
+                </v-list-item-action-text>
+              </v-list-item-content>
+            </v-list-item>
+          </div>
         </div>
       </v-list-item-group>
     </v-navigation-drawer>
@@ -121,11 +125,22 @@
                 >
               </v-col>
               <v-col cols="8">
-                <v-text-field outlined type="number" v-model="value" label="Benutzerdefinierter Betrag" :disabled="user.locked"></v-text-field>
+                <v-text-field
+                  outlined
+                  type="number"
+                  v-model="value"
+                  label="Benutzerdefinierter Betrag"
+                  :disabled="user.locked"
+                ></v-text-field>
               </v-col>
               <v-col cols="4">
-                <v-btn fab :color="color" @click="addAmountMore()" :disabled="user.locked">
-                  <v-icon>{{plus}}</v-icon>
+                <v-btn
+                  fab
+                  :color="color"
+                  @click="addAmountMore()"
+                  :disabled="user.locked"
+                >
+                  <v-icon>{{ plus }}</v-icon>
                 </v-btn>
               </v-col>
             </v-row>
@@ -151,22 +166,35 @@
       </v-card-text>
     </v-card>
     <v-snackbar
+
       v-for="message in messages"
       :key="messages.indexOf(message)"
       :color="message.error ? 'error' : 'success'"
       bottom
-      :timeout="3000"
+      :timeout="0"
       :multi-line="true"
       v-model="message.visible"
+      vertical
     >
-      {{ message.message }}
+      <div class="title">
+        {{ createMessage(message) }}
+      </div>
+      <div>
+        {{now(message.date)}}
+      </div>
+      <v-btn color="white" icon @click="message.visible = false">
+        <v-icon>
+          {{close}}
+        </v-icon>
+      </v-btn>
     </v-snackbar>
   </v-container>
 </template>
 
 <script>
 import { mapGetters, mapActions } from 'vuex'
-import { mdiMenu, mdiPlus } from '@mdi/js'
+// eslint-disable-next-line no-unused-vars
+import { mdiMenu, mdiPlus, mdiClose } from '@mdi/js'
 import AddAmountSkeleton from './Skeleton/AddAmountSkeleton'
 export default {
   name: 'AddAmount',
@@ -180,7 +208,8 @@ export default {
       dialog: false,
       componentRenderer: 0,
       timer: '',
-      menuIcon: mdiMenu
+      menuIcon: mdiMenu,
+      close: mdiClose
     }
   },
   created() {
@@ -221,6 +250,29 @@ export default {
       setTimeout(() => {
         this.value = null
       }, 300)
+    },
+    createMessage(message) {
+      var text = ''
+      if (message.error) {
+        text =
+          'Konnte ' +
+          (message.amount / 100).toFixed(2) +
+          '€ zu ' +
+          message.user.firstname +
+          ' ' +
+          message.user.lastname +
+          ' hinzufügen.'
+      } else {
+        text =
+          '' +
+          (message.amount / 100).toFixed(2) +
+          '€ wurde zu ' +
+          message.user.firstname +
+          ' ' +
+          message.user.lastname +
+          ' hinzugefügt.'
+      }
+      return text
     }
   },
   computed: {
@@ -234,18 +286,7 @@ export default {
     under5minutes() {
       return now => {
         var actual = new Date()
-        var zero = new Date(0)
-        var date = new Date(actual - now)
-        if (
-          date.getFullYear() === zero.getFullYear() &&
-          date.getMonth() === zero.getMonth() &&
-          date.getDate() === zero.getDate()
-        ) {
-          if (date.getMinutes() < 6) {
-            return true
-          }
-        }
-        return false
+       return actual - now < 15000
       }
     },
     now() {
diff --git a/src/store/modules/barUsers.js b/src/store/modules/barUsers.js
index e82b2b9..3959fe9 100644
--- a/src/store/modules/barUsers.js
+++ b/src/store/modules/barUsers.js
@@ -7,7 +7,7 @@ const state = {
   filter: '',
   usersLoading: false,
   allUsersLoading: false,
-  message: [],
+  messages: [],
   menu: false,
   locked: false
 }
@@ -34,6 +34,7 @@ const mutations = {
         existuser.locked = users[user].locked
         existuser.amount = users[user].amount
         existuser.type = users[user].type
+        existuser.limit = users[user].limit
       } else {
         state.users.push({
           username: users[user].username,
@@ -42,7 +43,8 @@ const mutations = {
           locked: users[user].locked,
           amount: users[user].amount,
           type: users[user].type,
-          loading: false
+          loading: false,
+          limit: users[user].limit
         })
       }
     }
@@ -75,39 +77,38 @@ const mutations = {
     state.allUsersLoading = value
   },
   addMessage: (state, data) => {
-    var message = ''
-    if (data.error) {
-      message =
-        'Konnte ' +
-        (data.amount / 100).toFixed(2) +
-        '€ zu ' +
-        data.user.firstname +
-        ' ' +
-        data.user.lastname +
-        ' hinzufügen.'
-    } else {
-      message =
-        '' +
-        (data.amount / 100).toFixed(2) +
-        '€ wurde zu ' +
-        data.user.firstname +
-        ' ' +
-        data.user.lastname +
-        ' hinzugefügt.'
+    var message = null
+    if (state.messages.length > 0) {
+      if (state.messages[0].user.id === data.user.id && !data.error) {
+        message = state.messages[0]
+        if ((new Date() - state.messages[0].date) / 1000 < 2) {
+          clearTimeout(message.timeout)
+          console.log('done')
+          message.amount = message.amount + data.amount
+          message.visible = true
+          message.date = new Date()
+          message.timeout = setTimeout(() => {message.visible = false}, 5000)
+          return
+        }
+        else {
+          message.visible = false
+        }
+      }
     }
-    state.message.unshift({
-      message: message,
+    let message2 = {
       user: data.user,
       error: data.error,
       storno: false,
       loading: false,
       visible: true,
       amount: data.amount,
-      date: new Date()
-    })
+      date: new Date(),
+      timeout: setTimeout(() => {message2.visible = false}, 5000)
+    }
+    state.messages.unshift(message2)
   },
   updateMessage: (state, data) => {
-    var message = state.message.find(msg => {
+    var message = state.messages.find(msg => {
       return msg.date - data.date === 0 ? true : false
     })
     if (message) {
@@ -328,7 +329,7 @@ const getters = {
     return state.allUsersLoading
   },
   messages: state => {
-    return state.message
+    return state.messages
   },
   menu: state => {
     return state.menu
diff --git a/src/store/modules/user.js b/src/store/modules/user.js
index c25ea1a..b85dad9 100644
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -8,7 +8,7 @@ const state = {
   addLoading: false,
   error: '',
   days: [],
-  message: [],
+  messages: [],
   status: []
 }
 
@@ -159,39 +159,39 @@ const mutations = {
     }
   },
   addMessage: (state, data) => {
-    var message = ''
-    if (data.error) {
-      message =
-        'Konnte ' +
-        (data.amount / 100).toFixed(2) +
-        '€ zu ' +
-        data.user.firstname +
-        ' ' +
-        data.user.lastname +
-        ' hinzufügen.'
-    } else {
-      message =
-        '' +
-        (data.amount / 100).toFixed(2) +
-        '€ wurde zu ' +
-        data.user.firstname +
-        ' ' +
-        data.user.lastname +
-        ' hinzugefügt.'
+    var message = null
+    if (state.messages.length > 0) {
+      if (state.messages[0].user.id === data.user.id && !data.error) {
+        message = state.messages[0]
+        if ((new Date() - state.messages[0].date) / 1000 < 2) {
+          clearTimeout(message.timeout)
+          console.log('done')
+          message.amount = message.amount + data.amount
+          message.visible = true
+          message.date = new Date()
+          message.timeout = setTimeout(() => {message.visible = false}, 300000)
+          return
+        }
+        else {
+          message.visible = false
+        }
+      }
     }
-    state.message.unshift({
-      message: message,
+    let message2 = {
       user: data.user,
       error: data.error,
       storno: false,
       loading: false,
       visible: true,
       amount: data.amount,
-      date: new Date()
-    })
+      date: new Date(),
+      timeout: setTimeout(() => {message2.visible = false}, 300000)
+    }
+    state.messages.unshift(message2)
+
   },
   updateMessage: (state, data) => {
-    var message = state.message.find(msg => {
+    var message = state.messages.find(msg => {
       return msg.date - data.date === 0 ? true : false
     })
     if (message) {
@@ -346,7 +346,7 @@ const getters = {
     return state.days
   },
   messages: state => {
-    return state.message
+    return state.messages
   },
   status: state => {
     return state.status