add history
This commit is contained in:
		
							parent
							
								
									a8ae06b3a8
								
							
						
					
					
						commit
						08c8475ac1
					
				| 
						 | 
				
			
			@ -4,6 +4,23 @@
 | 
			
		|||
    <v-container>
 | 
			
		||||
      <AddAmountSkeleton v-if="loading && users.length === 0" />
 | 
			
		||||
    </v-container>
 | 
			
		||||
    <v-navigation-drawer right app clipped :value="menu">
 | 
			
		||||
      <v-list-item-group>
 | 
			
		||||
        <v-list-item
 | 
			
		||||
          v-for="message in messages"
 | 
			
		||||
          three-line
 | 
			
		||||
          :key="messages.indexOf(message)"
 | 
			
		||||
        >
 | 
			
		||||
          <v-list-item-content>
 | 
			
		||||
            <v-list-item-title>{{ now(message.date) }}</v-list-item-title>
 | 
			
		||||
            <v-list-item-subtitle>{{ message.message }}</v-list-item-subtitle>
 | 
			
		||||
            <v-list-item-action-text v-if="under5minutes(message.date)"
 | 
			
		||||
              >Klicken um zurückzusetzen</v-list-item-action-text
 | 
			
		||||
            >
 | 
			
		||||
          </v-list-item-content>
 | 
			
		||||
        </v-list-item>
 | 
			
		||||
      </v-list-item-group>
 | 
			
		||||
    </v-navigation-drawer>
 | 
			
		||||
    <div v-for="user in users" :key="users.indexOf(user)">
 | 
			
		||||
      <div v-if="isFiltered(user)">
 | 
			
		||||
        <v-container>
 | 
			
		||||
| 
						 | 
				
			
			@ -22,7 +39,11 @@
 | 
			
		|||
                        class="creditBtn"
 | 
			
		||||
                        block
 | 
			
		||||
                        @click="
 | 
			
		||||
                          addAmount({ username: user.username, amount: 200 })
 | 
			
		||||
                          addAmount({
 | 
			
		||||
                            username: user.username,
 | 
			
		||||
                            amount: 200,
 | 
			
		||||
                            user: user
 | 
			
		||||
                          })
 | 
			
		||||
                        "
 | 
			
		||||
                        :color="color"
 | 
			
		||||
                        :disabled="user.locked"
 | 
			
		||||
| 
						 | 
				
			
			@ -34,7 +55,11 @@
 | 
			
		|||
                        class="creditBtn"
 | 
			
		||||
                        block
 | 
			
		||||
                        @click="
 | 
			
		||||
                          addAmount({ username: user.username, amount: 100 })
 | 
			
		||||
                          addAmount({
 | 
			
		||||
                            username: user.username,
 | 
			
		||||
                            amount: 100,
 | 
			
		||||
                            user: user
 | 
			
		||||
                          })
 | 
			
		||||
                        "
 | 
			
		||||
                        :color="color"
 | 
			
		||||
                        :disabled="user.locked"
 | 
			
		||||
| 
						 | 
				
			
			@ -46,7 +71,11 @@
 | 
			
		|||
                        class="creditBtn"
 | 
			
		||||
                        block
 | 
			
		||||
                        @click="
 | 
			
		||||
                          addAmount({ username: user.username, amount: 50 })
 | 
			
		||||
                          addAmount({
 | 
			
		||||
                            username: user.username,
 | 
			
		||||
                            amount: 50,
 | 
			
		||||
                            user: user
 | 
			
		||||
                          })
 | 
			
		||||
                        "
 | 
			
		||||
                        :color="color"
 | 
			
		||||
                        :disabled="user.locked"
 | 
			
		||||
| 
						 | 
				
			
			@ -60,7 +89,11 @@
 | 
			
		|||
                        class="creditBtn"
 | 
			
		||||
                        block
 | 
			
		||||
                        @click="
 | 
			
		||||
                          addAmount({ username: user.username, amount: 40 })
 | 
			
		||||
                          addAmount({
 | 
			
		||||
                            username: user.username,
 | 
			
		||||
                            amount: 40,
 | 
			
		||||
                            user: user
 | 
			
		||||
                          })
 | 
			
		||||
                        "
 | 
			
		||||
                        :color="color"
 | 
			
		||||
                        :disabled="user.locked"
 | 
			
		||||
| 
						 | 
				
			
			@ -72,7 +105,11 @@
 | 
			
		|||
                        class="creditBtn"
 | 
			
		||||
                        block
 | 
			
		||||
                        @click="
 | 
			
		||||
                          addAmount({ username: user.username, amount: 20 })
 | 
			
		||||
                          addAmount({
 | 
			
		||||
                            username: user.username,
 | 
			
		||||
                            amount: 20,
 | 
			
		||||
                            user: user
 | 
			
		||||
                          })
 | 
			
		||||
                        "
 | 
			
		||||
                        :color="color"
 | 
			
		||||
                        :disabled="user.locked"
 | 
			
		||||
| 
						 | 
				
			
			@ -84,7 +121,11 @@
 | 
			
		|||
                        class="creditBtn"
 | 
			
		||||
                        block
 | 
			
		||||
                        @click="
 | 
			
		||||
                          addAmount({ username: user.username, amount: 10 })
 | 
			
		||||
                          addAmount({
 | 
			
		||||
                            username: user.username,
 | 
			
		||||
                            amount: 10,
 | 
			
		||||
                            user: user
 | 
			
		||||
                          })
 | 
			
		||||
                        "
 | 
			
		||||
                        :color="color"
 | 
			
		||||
                        :disabled="user.locked"
 | 
			
		||||
| 
						 | 
				
			
			@ -113,6 +154,17 @@
 | 
			
		|||
              >
 | 
			
		||||
            </v-card-text>
 | 
			
		||||
          </v-card>
 | 
			
		||||
          <v-snackbar
 | 
			
		||||
            v-for="message in messages"
 | 
			
		||||
            :key="messages.indexOf(message)"
 | 
			
		||||
            :color="message.error ? 'error' : 'success'"
 | 
			
		||||
            bottom
 | 
			
		||||
            :timeout="3000"
 | 
			
		||||
            :multi-line="true"
 | 
			
		||||
            v-model="message.visible"
 | 
			
		||||
          >
 | 
			
		||||
            {{ message.message }}
 | 
			
		||||
          </v-snackbar>
 | 
			
		||||
        </v-container>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
| 
						 | 
				
			
			@ -158,8 +210,63 @@ export default {
 | 
			
		|||
    ...mapGetters({
 | 
			
		||||
      users: 'barUsers/users',
 | 
			
		||||
      filter: 'barUsers/filter',
 | 
			
		||||
      loading: 'barUsers/usersLoading'
 | 
			
		||||
    })
 | 
			
		||||
      loading: 'barUsers/usersLoading',
 | 
			
		||||
      messages: 'barUsers/messages',
 | 
			
		||||
      menu: 'barUsers/menu'
 | 
			
		||||
    }),
 | 
			
		||||
    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
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    now() {
 | 
			
		||||
      return now => {
 | 
			
		||||
        var actual = new Date()
 | 
			
		||||
        var zero = new Date(0)
 | 
			
		||||
        var date = new Date(actual - now)
 | 
			
		||||
        console.log(date)
 | 
			
		||||
        if (date.getFullYear() === zero.getFullYear()) {
 | 
			
		||||
          if (date.getMonth() === zero.getMonth()) {
 | 
			
		||||
            if (date.getDate() === zero.getDate()) {
 | 
			
		||||
              if (date.getHours() === zero.getDate()) {
 | 
			
		||||
                if (date.getMinutes() < 1) {
 | 
			
		||||
                  return 'vor ' + date.getSeconds() + ' Sekunden'
 | 
			
		||||
                } else if (date.getMinutes() < 10) {
 | 
			
		||||
                  return 'vor ' + date.getMinutes() + ' Minuten'
 | 
			
		||||
                } else {
 | 
			
		||||
                  return now.getHours() + ':' + now.getMinutes()
 | 
			
		||||
                }
 | 
			
		||||
              } else {
 | 
			
		||||
                return now.getHours() + ':' + now.getMinutes()
 | 
			
		||||
              }
 | 
			
		||||
            }
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        return (
 | 
			
		||||
          now.getDate() +
 | 
			
		||||
          '.' +
 | 
			
		||||
          now.getMonth() +
 | 
			
		||||
          '.' +
 | 
			
		||||
          now.getFullYear() +
 | 
			
		||||
          ' ' +
 | 
			
		||||
          now.getHours() +
 | 
			
		||||
          ':' +
 | 
			
		||||
          now.getMinutes()
 | 
			
		||||
        )
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -16,10 +16,13 @@
 | 
			
		|||
          :search-input.sync="filter"
 | 
			
		||||
        >
 | 
			
		||||
          <template v-slot:prepend-inner>
 | 
			
		||||
            <v-icon>{{search_person}}</v-icon>
 | 
			
		||||
            <v-icon>{{ search_person }}</v-icon>
 | 
			
		||||
          </template>
 | 
			
		||||
        </v-autocomplete>
 | 
			
		||||
        <v-btn text @click="addUser">Hinzufügen</v-btn>
 | 
			
		||||
        <v-btn @click="clickMenu" icon>
 | 
			
		||||
          <v-icon>{{ menuIcon }}</v-icon>
 | 
			
		||||
        </v-btn>
 | 
			
		||||
      </v-toolbar-items>
 | 
			
		||||
    </v-toolbar>
 | 
			
		||||
  </div>
 | 
			
		||||
| 
						 | 
				
			
			@ -27,7 +30,7 @@
 | 
			
		|||
 | 
			
		||||
<script>
 | 
			
		||||
import { mapGetters, mapActions } from 'vuex'
 | 
			
		||||
import { mdiAccountSearch } from '@mdi/js'
 | 
			
		||||
import { mdiAccountSearch, mdiMenu } from '@mdi/js'
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'SearchBar',
 | 
			
		||||
| 
						 | 
				
			
			@ -36,7 +39,8 @@ export default {
 | 
			
		|||
    return {
 | 
			
		||||
      user: null,
 | 
			
		||||
      filter: '',
 | 
			
		||||
      search_person: mdiAccountSearch
 | 
			
		||||
      search_person: mdiAccountSearch,
 | 
			
		||||
      menuIcon: mdiMenu
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  created() {
 | 
			
		||||
| 
						 | 
				
			
			@ -46,17 +50,24 @@ export default {
 | 
			
		|||
    ...mapActions({
 | 
			
		||||
      getAllUsers: 'barUsers/getAllUsers',
 | 
			
		||||
      addCreditList: 'barUsers/addCreditList',
 | 
			
		||||
      setFilter: 'barUsers/setFilter'
 | 
			
		||||
      setFilter: 'barUsers/setFilter',
 | 
			
		||||
      activateMenu: 'barUsers/activateMenu',
 | 
			
		||||
      deactivateMenu: 'barUsers/deactivateMenu'
 | 
			
		||||
    }),
 | 
			
		||||
    addUser() {
 | 
			
		||||
      this.addCreditList(this.user)
 | 
			
		||||
      this.user = null
 | 
			
		||||
    },
 | 
			
		||||
    clickMenu() {
 | 
			
		||||
      if (this.menu) this.deactivateMenu()
 | 
			
		||||
      else this.activateMenu()
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  computed: {
 | 
			
		||||
    ...mapGetters({
 | 
			
		||||
      allUsers: 'barUsers/allUsers',
 | 
			
		||||
      loading: 'barUsers/allUsersLoading'
 | 
			
		||||
      loading: 'barUsers/allUsersLoading',
 | 
			
		||||
      menu: 'barUsers/menu'
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  watch: {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -2,7 +2,7 @@ import Vue from 'vue'
 | 
			
		|||
import App from './App.vue'
 | 
			
		||||
import router from './router'
 | 
			
		||||
import store from './store'
 | 
			
		||||
import vuetify from './plugins/vuetify';
 | 
			
		||||
import vuetify from './plugins/vuetify'
 | 
			
		||||
 | 
			
		||||
Vue.config.productionTip = false
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,7 +1,7 @@
 | 
			
		|||
//const main = 'https://192.168.5.128:5000/'
 | 
			
		||||
const main = 'http://localhost:5000/'
 | 
			
		||||
//const main = 'http://localhost:5000/'
 | 
			
		||||
//const main = 'http://192.168.5.118:5000/'
 | 
			
		||||
//const main = 'https://groeger-clan.duckdns.org:5000/'
 | 
			
		||||
const main = 'https://groeger-clan.duckdns.org:5000/'
 | 
			
		||||
 | 
			
		||||
const url = {
 | 
			
		||||
  login: main + 'login',
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -15,8 +15,8 @@ import FinanzerNavigation from '../components/finanzer/FinanzerNavigation'
 | 
			
		|||
import Overview from '../components/finanzer/Overview'
 | 
			
		||||
import User from '../components/finanzer/User'
 | 
			
		||||
import ServiceManagement from '../components/vorstand/ServiceManagement'
 | 
			
		||||
import Config from "@/components/user/Config";
 | 
			
		||||
import Jobs from "@/components/user/Jobs";
 | 
			
		||||
import Config from '@/components/user/Config'
 | 
			
		||||
import Jobs from '@/components/user/Jobs'
 | 
			
		||||
 | 
			
		||||
Vue.use(VueRouter)
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -7,7 +7,8 @@ const state = {
 | 
			
		|||
  filter: '',
 | 
			
		||||
  usersLoading: false,
 | 
			
		||||
  allUsersLoading: false,
 | 
			
		||||
  message: ''
 | 
			
		||||
  message: [],
 | 
			
		||||
  menu: false
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const mutations = {
 | 
			
		||||
| 
						 | 
				
			
			@ -71,6 +72,38 @@ const mutations = {
 | 
			
		|||
  },
 | 
			
		||||
  setAllUsersLoading: (state, value) => {
 | 
			
		||||
    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.'
 | 
			
		||||
    }
 | 
			
		||||
    state.message.unshift({
 | 
			
		||||
      message: message,
 | 
			
		||||
      error: data.error,
 | 
			
		||||
      visible: true,
 | 
			
		||||
      date: new Date()
 | 
			
		||||
    })
 | 
			
		||||
    console.log(state.message)
 | 
			
		||||
  },
 | 
			
		||||
  setMenu: (state, value) => {
 | 
			
		||||
    state.menu = value
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -98,7 +131,17 @@ const actions = {
 | 
			
		|||
        { headers: { Token: rootState.login.user.accessToken } }
 | 
			
		||||
      )
 | 
			
		||||
      commit('setUsers', { [response.data.username]: response.data })
 | 
			
		||||
      commit('addMessage', {
 | 
			
		||||
        user: data.user,
 | 
			
		||||
        amount: data.amount,
 | 
			
		||||
        error: false
 | 
			
		||||
      })
 | 
			
		||||
    } catch (e) {
 | 
			
		||||
      commit('addMessage', {
 | 
			
		||||
        user: data.user,
 | 
			
		||||
        amount: data.amount,
 | 
			
		||||
        error: true
 | 
			
		||||
      })
 | 
			
		||||
      if (e.response)
 | 
			
		||||
        if (e.response.status === 401) dispatch('logout', null, { root: true })
 | 
			
		||||
    }
 | 
			
		||||
| 
						 | 
				
			
			@ -136,6 +179,12 @@ const actions = {
 | 
			
		|||
  },
 | 
			
		||||
  setFilter({ commit }, data) {
 | 
			
		||||
    commit('setFilter', data)
 | 
			
		||||
  },
 | 
			
		||||
  activateMenu({ commit }) {
 | 
			
		||||
    commit('setMenu', true)
 | 
			
		||||
  },
 | 
			
		||||
  deactivateMenu({ commit }) {
 | 
			
		||||
    commit('setMenu', false)
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -154,6 +203,12 @@ const getters = {
 | 
			
		|||
  },
 | 
			
		||||
  allUsersLoading: state => {
 | 
			
		||||
    return state.allUsersLoading
 | 
			
		||||
  },
 | 
			
		||||
  messages: state => {
 | 
			
		||||
    return state.message
 | 
			
		||||
  },
 | 
			
		||||
  menu: state => {
 | 
			
		||||
    return state.menu
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue