add history

This commit is contained in:
Tim Gröger 2020-02-16 20:35:13 +01:00
parent a8ae06b3a8
commit 08c8475ac1
6 changed files with 192 additions and 19 deletions

View File

@ -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>

View File

@ -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: {

View File

@ -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

View File

@ -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',

View File

@ -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)

View File

@ -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
}
}