Flaschengeist/flaschengeist-frontend
Flaschengeist
/
flaschengeist-frontend
7
0
Fork 1
Code Issues Pull Requests Projects Releases Activity

used prettier on code

This commit is contained in:
Tim Gröger 2020-01-14 22:01:24 +01:00
parent 40fdb109a6
commit 4374eaa3d7
18 changed files with 1794 additions and 1418 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/App.vue
View File

@ -1,24 +1,20 @@
<template> <template>
<v-app> <v-app>
<router-view/> <router-view />
<v-footer <v-footer app>
app
>
<span class="px-4">&copy; {{ new Date().getFullYear()}} Studentenclub Wu 5 e.v.</span> <span class="px-4">&copy; {{ new Date().getFullYear()}} Studentenclub Wu 5 e.v.</span>
</v-footer> </v-footer>
</v-app> </v-app>
</template> </template>
<script> <script>
export default { export default {
name: 'App', name: 'App',
components: { components: {},
},
data: () => ({ data: () => ({
// //
}), })
}; }
</script> </script>

90
src/components/TitleBar.vue
View File

@ -1,59 +1,51 @@
<template> <template>
<v-app-bar <v-app-bar app clipped-left hide-on-scroll color="blue accent-4" class="elevation-4" dark>
app <v-btn icon>
clipped-left <v-img src="@/assets/logo-big.png" contain height="40"></v-img>
hide-on-scroll </v-btn>
color="blue accent-4" <v-toolbar-title>WU5-Dashboard</v-toolbar-title>
class="elevation-4" <v-spacer />
dark> <v-btn icon v-if="isFinanzer" href="finanzer">
<v-icon>attach_money</v-icon>
<v-btn icon> </v-btn>
<v-img src="@/assets/logo-big.png" contain height="40"></v-img> <v-btn icon v-if="isBar" href="bar">
</v-btn> <v-icon>local_bar</v-icon>
<v-toolbar-title>WU5-Dashboard</v-toolbar-title> </v-btn>
<v-spacer/> <v-btn v-if="isLoggedIn" @click="logout">Logout</v-btn>
<v-btn icon v-if="isFinanzer" href="finanzer"> </v-app-bar>
<v-icon>attach_money</v-icon>
</v-btn>
<v-btn icon v-if="isBar" href="bar">
<v-icon>local_bar</v-icon>
</v-btn>
<v-btn v-if="isLoggedIn" @click="logout">Logout</v-btn>
</v-app-bar>
</template> </template>
<script> <script>
import {mapActions} from "vuex"; import { mapActions } from 'vuex'
export default { export default {
name: "TitleBar", name: 'TitleBar',
computed: { computed: {
isBar() { isBar() {
try { try {
return this.$store.getters.getGroup.includes('bar') ? true : false return this.$store.getters.getGroup.includes('bar') ? true : false
} catch (e) { } catch (e) {
return false return false
} }
}, },
isFinanzer() { isFinanzer() {
try { try {
return this.$store.getters.getGroup.includes('moneymaster') ? true : false return this.$store.getters.getGroup.includes('moneymaster')
} catch (e) { ? true
return false : false
} } catch (e) {
}, return false
isLoggedIn() { }
return this.$store.getters.getToken },
} isLoggedIn() {
}, return this.$store.getters.getToken
methods: {
...mapActions([
'logout'
])
}
} }
},
methods: {
...mapActions(['logout'])
}
}
</script> </script>
<style scoped> <style scoped>
</style> </style>

212
src/components/baruser/CreditLists.vue
View File

@ -1,107 +1,127 @@
<template> <template>
<div> <div>
<div v-for="user in users" :key="users.indexOf(user)"> <div v-for="user in users" :key="users.indexOf(user)">
<v-container> <v-container>
<v-card> <v-card>
<v-list-item> <v-list-item>
<v-list-item-title class="title">{{user.firstname}} {{user.lastname}}</v-list-item-title> <v-list-item-title class="title">{{user.firstname}} {{user.lastname}}</v-list-item-title>
</v-list-item> </v-list-item>
<v-card-text> <v-card-text>
<v-row> <v-row>
<v-col cols="10"> <v-col cols="10">
<v-row> <v-row>
<v-col> <v-col>
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 200})" <v-btn
:color="color" :disabled="user.locked">2 € class="creditBtn"
</v-btn> block
</v-col> @click="addAmount({username: user.username, amount: 200})"
<v-col> :color="color"
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 100})" :disabled="user.locked"
:color="color" :disabled="user.locked">1 € >2 €</v-btn>
</v-btn> </v-col>
</v-col> <v-col>
<v-col> <v-btn
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 50})" class="creditBtn"
:color="color" :disabled="user.locked"> block
0,50 € @click="addAmount({username: user.username, amount: 100})"
</v-btn> :color="color"
</v-col> :disabled="user.locked"
</v-row> >1 €</v-btn>
<v-row> </v-col>
<v-col> <v-col>
<v-btn class="creditBtn" block @click="addAmount({username:user.username, amount: 40})" <v-btn
:color="color" :disabled="user.locked"> class="creditBtn"
0,40 € block
</v-btn> @click="addAmount({username: user.username, amount: 50})"
</v-col> :color="color"
<v-col> :disabled="user.locked"
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 20})" >0,50 €</v-btn>
:color="color" :disabled="user.locked"> </v-col>
0,20 € </v-row>
</v-btn> <v-row>
</v-col> <v-col>
<v-col> <v-btn
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 10})" class="creditBtn"
:color="color" :disabled="user.locked"> block
0,10 € @click="addAmount({username:user.username, amount: 40})"
</v-btn> :color="color"
</v-col> :disabled="user.locked"
</v-row> >0,40 €</v-btn>
</v-col> </v-col>
<v-col align-self="center"> <v-col>
<v-row> <v-btn
<v-list-item> class="creditBtn"
<v-list-item-action-text :class="getColor(user.type)"> block
{{(user.amount/100).toFixed(2)}} € @click="addAmount({username: user.username, amount: 20})"
</v-list-item-action-text> :color="color"
</v-list-item> :disabled="user.locked"
</v-row> >0,20 €</v-btn>
</v-col> </v-col>
</v-row> <v-col>
<v-alert v-if="user.locked" type="error">{{user.firstname}} darf nicht mehr anschreiben. {{user.firstname}} sollte sich lieber mal beim Finanzer melden.</v-alert> <v-btn
</v-card-text> class="creditBtn"
</v-card> block
</v-container> @click="addAmount({username: user.username, amount: 10})"
</div> :color="color"
:disabled="user.locked"
>0,10 €</v-btn>
</v-col>
</v-row>
</v-col>
<v-col align-self="center">
<v-row>
<v-list-item>
<v-list-item-action-text
:class="getColor(user.type)"
>{{(user.amount/100).toFixed(2)}} €</v-list-item-action-text>
</v-list-item>
</v-row>
</v-col>
</v-row>
<v-alert
v-if="user.locked"
type="error"
>{{user.firstname}} darf nicht mehr anschreiben. {{user.firstname}} sollte sich lieber mal beim Finanzer melden.</v-alert>
</v-card-text>
</v-card>
</v-container>
</div> </div>
</div>
</template> </template>
<script> <script>
import { mapGetters, mapActions } from 'vuex'; import { mapGetters, mapActions } from 'vuex'
export default { export default {
name: "CreditLists", name: 'CreditLists',
props: { props: {},
}, data() {
data () { return {
return { color: 'green accent-4'
color: 'green accent-4',
}
},
created() {
this.getUsers()
// eslint-disable-next-line no-console
console.log(this.users)
},
methods: {
...mapActions({
addAmount: 'barUsers/addAmount',
getUsers: 'barUsers/getUsers'
}),
getColor(type) {
return type === 'credit' ? 'title green--text' : 'title red--text'
}
},
computed: {
...mapGetters({users: 'barUsers/users'})
}
} }
},
created() {
this.getUsers()
// eslint-disable-next-line no-console
console.log(this.users)
},
methods: {
...mapActions({
addAmount: 'barUsers/addAmount',
getUsers: 'barUsers/getUsers'
}),
getColor(type) {
return type === 'credit' ? 'title green--text' : 'title red--text'
}
},
computed: {
...mapGetters({ users: 'barUsers/users' })
}
}
</script> </script>
<style scoped> <style scoped>
.creditBtn { .creditBtn {
margin: 2px; margin: 2px;
} }
</style> </style>

84
src/components/baruser/SearchBar.vue
View File

@ -1,50 +1,54 @@
<template> <template>
<div> <div>
<v-toolbar> <v-toolbar>
<v-spacer/> <v-spacer />
<v-toolbar-items> <v-toolbar-items>
<v-autocomplete outlined return-object v-model="user" style="margin-top: 3px" <v-autocomplete
placeholder="Suche Person" :items="allUsers" item-text="fullName" outlined
prepend-inner-icon="search" full-width/> return-object
<v-btn text @click="addUser">Hinzufügen</v-btn> v-model="user"
</v-toolbar-items> style="margin-top: 3px"
</v-toolbar> placeholder="Suche Person"
</div> :items="allUsers"
item-text="fullName"
prepend-inner-icon="search"
full-width
/>
<v-btn text @click="addUser">Hinzufügen</v-btn>
</v-toolbar-items>
</v-toolbar>
</div>
</template> </template>
<script> <script>
import { mapGetters, mapActions } from 'vuex'; import { mapGetters, mapActions } from 'vuex'
export default { export default {
name: "SearchBar", name: 'SearchBar',
props: { props: {},
data() {
}, return {
data () { user: null
return {
user: null,
}
},
created() {
this.getAllUsers()
},
methods : {
...mapActions({
getAllUsers: 'barUsers/getAllUsers',
addCreditList: 'barUsers/addCreditList'
}),
addUser() {
this.addCreditList(this.user)
this.user = null
}
},
computed: {
...mapGetters({ allUsers: 'barUsers/allUsers'}),
}
} }
},
created() {
this.getAllUsers()
},
methods: {
...mapActions({
getAllUsers: 'barUsers/getAllUsers',
addCreditList: 'barUsers/addCreditList'
}),
addUser() {
this.addCreditList(this.user)
this.user = null
}
},
computed: {
...mapGetters({ allUsers: 'barUsers/allUsers' })
}
}
</script> </script>
<style scoped> <style scoped>
</style> </style>

516
src/components/finanzer/Overview.vue
View File

@ -1,227 +1,323 @@
<template> <template>
<div> <div>
<v-toolbar tile> <v-toolbar tile>
<v-toolbar-title>Gesamtübersicht</v-toolbar-title> <v-toolbar-title>Gesamtübersicht</v-toolbar-title>
<v-spacer/> <v-spacer />
<v-toolbar-items> <v-toolbar-items>
<v-btn text icon @click="countYear(false)"><v-icon>keyboard_arrow_left</v-icon></v-btn> <v-btn text icon @click="countYear(false)">
<v-list-item><v-list-item-title class="title">{{year}}</v-list-item-title></v-list-item> <v-icon>keyboard_arrow_left</v-icon>
<v-btn text icon @click="countYear(true)" :disabled="isActualYear"><v-icon>keyboard_arrow_right</v-icon></v-btn> </v-btn>
</v-toolbar-items> <v-list-item>
<v-spacer/> <v-list-item-title class="title">{{year}}</v-list-item-title>
<v-toolbar-items> </v-list-item>
<v-btn text @click="sendMails">Emails senden</v-btn> <v-btn text icon @click="countYear(true)" :disabled="isActualYear">
<v-text-field v-model="filter" style="margin-top: 3px" append-icon="search" outlined></v-text-field> <v-icon>keyboard_arrow_right</v-icon>
</v-toolbar-items> </v-btn>
</v-toolbar> </v-toolbar-items>
<v-spacer />
<v-toolbar-items>
<v-btn text @click="sendMails">Emails senden</v-btn>
<v-text-field v-model="filter" style="margin-top: 3px" append-icon="search" outlined></v-text-field>
</v-toolbar-items>
</v-toolbar>
<v-expand-transition>
<v-card style="margin-top: 3px" v-show="errorMails">
<v-row>
<v-spacer />
<v-btn
text
icon
style="margin-right: 5px"
@click="errorExpand ? errorExpand = false : errorExpand = true"
>
<v-icon :class="isExpand(errorExpand)" dense>$expand</v-icon>
</v-btn>
</v-row>
<v-expand-transition> <v-expand-transition>
<v-card style="margin-top: 3px" v-show="errorMails"> <div v-show="errorExpand">
<v-row> <v-alert
<v-spacer/> v-for="error in errorMails"
<v-btn text icon style="margin-right: 5px" :key="errorMails.indexOf(error)"
@click="errorExpand ? errorExpand = false : errorExpand = true"> dense
<v-icon :class="isExpand(errorExpand)" dense>$expand</v-icon> :type="computeError(error.error)"
</v-btn> >{{errorMessage(error)}}</v-alert>
</v-row> </div>
<v-expand-transition>
<div v-show="errorExpand">
<v-alert v-for="error in errorMails" :key="errorMails.indexOf(error)"
dense
:type="computeError(error.error)"
>{{errorMessage(error)}}
</v-alert>
</div>
</v-expand-transition>
</v-card>
</v-expand-transition> </v-expand-transition>
<div v-for="user in users" :key="users.indexOf(user)"> </v-card>
<v-card v-if="user.creditList[year] && isFiltered(user)" </v-expand-transition>
style="margin-top: 3px"> <div v-for="user in users" :key="users.indexOf(user)">
<v-card-title>{{user.lastname}}, {{user.firstname}}</v-card-title> <v-card v-if="user.creditList[year] && isFiltered(user)" style="margin-top: 3px">
<Table v-bind:user="user" v-bind:year="year"/> <v-card-title>{{user.lastname}}, {{user.firstname}}</v-card-title>
<v-container fluid> <Table v-bind:user="user" v-bind:year="year" />
<v-row align="start" align-content="start"> <v-container fluid>
<v-row align="start" align-content="start">
<v-col>
<v-row>
<v-col>
<v-label>Vorjahr:</v-label>
</v-col>
<v-col>
<v-chip
outlined
:text-color="getLastColor(user.creditList[year][1].last)"
>{{(user.creditList[year][1].last / 100).toFixed(2)}}</v-chip>
</v-col>
</v-row>
<v-row>
<v-col>
<v-label>Gesamt:</v-label>
</v-col>
<v-col>
<v-chip
outlined
x-large
:text-color="getLastColor(getAllSum(user.creditList[year][2].sum ,user.creditList[year][1].last))"
>
{{(getAllSum(user.creditList[year][2].sum ,user.creditList[year][1].last) /
100).toFixed(2)}}
</v-chip>
</v-col>
</v-row>
</v-col>
<v-col align-self="center">
<v-row>
<v-col>
<v-label>Status:</v-label>
</v-col>
<v-col>
<v-chip
outlined
:text-color="getLockedColor(user.locked)"
>{{user.locked ? 'Gesperrt': 'nicht Gesperrt'}}</v-chip>
</v-col>
</v-row>
<v-card outlined>
<v-row>
<v-card-title class="subtitle-2">Geld transferieren</v-card-title>
<v-spacer />
<v-btn text icon style="margin-right: 5px" @click="setExpand(user)">
<v-icon :class="isExpand(user.expand)" dense>$expand</v-icon>
</v-btn>
</v-row>
<v-expand-transition>
<v-card-text v-show="user.expand">
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col> <v-col>
<v-row> <v-text-field :rules="[isNumber]" label="Betrag" v-model="amount"></v-text-field>
<v-col>
<v-label>Vorjahr:</v-label>
</v-col>
<v-col>
<v-chip outlined :text-color="getLastColor(user.creditList[year][1].last)">
{{(user.creditList[year][1].last / 100).toFixed(2)}}
</v-chip>
</v-col>
</v-row>
<v-row>
<v-col>
<v-label>Gesamt:</v-label>
</v-col>
<v-col>
<v-chip outlined x-large
:text-color="getLastColor(getAllSum(user.creditList[year][2].sum ,user.creditList[year][1].last))">
{{(getAllSum(user.creditList[year][2].sum ,user.creditList[year][1].last) /
100).toFixed(2)}}
</v-chip>
</v-col>
</v-row>
</v-col> </v-col>
<v-col align-self="center"> <v-col>
<v-row> <v-select
<v-col> return-object
<v-label>Status: </v-label> v-model="type"
</v-col> label="Typ"
<v-col> :items="[{value: 'amount', text: 'Schulden'}, {value: 'credit', text: 'Guthaben'}]"
<v-chip outlined :text-color="getLockedColor(user.locked)">{{user.locked ? 'Gesperrt': 'nicht Gesperrt'}}</v-chip> item-text="text"
</v-col> item-value="value"
</v-row> ></v-select>
<v-card outlined>
<v-row>
<v-card-title class="subtitle-2">Geld transferieren</v-card-title>
<v-spacer/>
<v-btn text icon style="margin-right: 5px" @click="setExpand(user)">
<v-icon :class="isExpand(user.expand)" dense>$expand</v-icon>
</v-btn>
</v-row>
<v-expand-transition>
<v-card-text v-show="user.expand">
<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-col>
<v-col>
<v-select return-object v-model="type" label="Typ"
:items="[{value: 'amount', text: 'Schulden'}, {value: 'credit', text: 'Guthaben'}]"
item-text="text" item-value="value"></v-select>
</v-col>
</v-row>
<v-row>
<v-col>
<v-select return-object v-model="selectedYear" label="Jahr"
:items="years" item-text="text"
item-value="value"></v-select>
</v-col>
<v-col>
<v-select return-object v-model="selectedMonth" label="Monat"
:items="months" item-text="text"
item-value="value"></v-select>
</v-col>
</v-row>
</v-form>
<v-btn block @click="add(user)">Hinzufügen</v-btn>
</v-card-text>
</v-expand-transition>
</v-card>
</v-col> </v-col>
</v-row> </v-row>
</v-container> <v-row>
</v-card> <v-col>
</div> <v-select
return-object
v-model="selectedYear"
label="Jahr"
:items="years"
item-text="text"
item-value="value"
></v-select>
</v-col>
<v-col>
<v-select
return-object
v-model="selectedMonth"
label="Monat"
:items="months"
item-text="text"
item-value="value"
></v-select>
</v-col>
</v-row>
</v-form>
<v-btn block @click="add(user)">Hinzufügen</v-btn>
</v-card-text>
</v-expand-transition>
</v-card>
</v-col>
</v-row>
</v-container>
</v-card>
</div> </div>
</div>
</template> </template>
<script> <script>
import Table from "./Table"; import Table from './Table'
import { mapGetters, mapActions } from 'vuex' import { mapGetters, mapActions } from 'vuex'
export default { export default {
name: "Overview", name: 'Overview',
components: {Table}, components: { Table },
props: { props: {},
}, data() {
data () { return {
return { errorExpand: false,
errorExpand: false, filter: '',
filter: "",
amount: null,
isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.',
type: {value: 'credit', text: 'Guthaben'},
selectedYear: {value: new Date().getFullYear(), text: new Date().getFullYear()},
selectedMonth: {value: new Date().getMonth() + 1, text: ["Januar", "Februar", "März", "April", "Mai", "Juni",
"Juli", "August", "September", "Oktober", "November", "Dezember"
][new Date().getMonth()]}
}
},
created() {
// eslint-disable-next-line no-console
console.log(this.getData(this.createYears()))
},
methods: {
...mapActions({createYears: 'finanzerUsers/createYears',
addAmount: 'finanzerUsers/addAmount',
addCredit: 'finanzerUsers/addCredit',
countYear: 'finanzerUsers/countYear',
sendMails: 'finanzerUsers/sendMails'}),
async getData(promise) {
return await promise
},
getLastColor (value) {
return value < 0 ? 'red' : 'green'
},
getAllSum(sum, lastYear) {
return lastYear + sum
},
getLockedColor (value) {
return value ? 'red' : 'green'
},
computeError(error) {
if (error) return 'error'
else return 'success'
},
errorMessage(error) {
if (error.error) return 'Konnte Email an ' + error.user.firstname + ' ' + error.user.lastname + ' nicht senden!'
else return 'Email wurde an ' + error.user.firstname + ' ' + error.user.lastname + ' versandt.'
},
setExpand(user) {
user.expand ? user.expand=false : user.expand=true
},
isExpand(value) {
return value ? 'rotate' : ''
},
// eslint-disable-next-line no-unused-vars
add(user) {
if (this.type.value === 'amount') {
this.addAmount({user: user, amount: this.amount, year: this.selectedYear.value, month: this.selectedMonth.value})
}
if (this.type.value === 'credit') {
this.addCredit( {user: user, credit: this.amount, year: this.selectedYear.value, month: this.selectedMonth.value})
}
this.createDefault(this.amount, this.type, this.selectedYear, this.selectedMonth)
},
isFiltered(user) {
return user.firstname.toLowerCase().includes(this.filter.toLowerCase()) || user.lastname.toLowerCase().includes(this.filter.toLowerCase())
},
createDefault() {
this.amount = null
this.type = {value: 'credit', text: 'Guthaben'}
this.selectedYear = {value: new Date().getFullYear(), text: new Date().getFullYear()}
this.selectedMonth = {value: new Date().getMonth() + 1, text: ["Januar", "Februar", "März", "April", "Mai", "Juni",
"Juli", "August", "September", "Oktober", "November", "Dezember"
][new Date().getMonth()]}
},
},
computed: {
isActualYear() {
return this.year === new Date().getFullYear()
},
...mapGetters({users: 'finanzerUsers/users',
errorMails: 'finanzerUsers/errorMails',
year: 'finanzerUsers/year',
years: 'finanzerUsers/years',
months: 'finanzerUsers/months'})
}
amount: null,
isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.',
type: { value: 'credit', text: 'Guthaben' },
selectedYear: {
value: new Date().getFullYear(),
text: new Date().getFullYear()
},
selectedMonth: {
value: new Date().getMonth() + 1,
text: [
'Januar',
'Februar',
'März',
'April',
'Mai',
'Juni',
'Juli',
'August',
'September',
'Oktober',
'November',
'Dezember'
][new Date().getMonth()]
}
} }
},
created() {
// eslint-disable-next-line no-console
console.log(this.getData(this.createYears()))
},
methods: {
...mapActions({
createYears: 'finanzerUsers/createYears',
addAmount: 'finanzerUsers/addAmount',
addCredit: 'finanzerUsers/addCredit',
countYear: 'finanzerUsers/countYear',
sendMails: 'finanzerUsers/sendMails'
}),
async getData(promise) {
return await promise
},
getLastColor(value) {
return value < 0 ? 'red' : 'green'
},
getAllSum(sum, lastYear) {
return lastYear + sum
},
getLockedColor(value) {
return value ? 'red' : 'green'
},
computeError(error) {
if (error) return 'error'
else return 'success'
},
errorMessage(error) {
if (error.error)
return (
'Konnte Email an ' +
error.user.firstname +
' ' +
error.user.lastname +
' nicht senden!'
)
else
return (
'Email wurde an ' +
error.user.firstname +
' ' +
error.user.lastname +
' versandt.'
)
},
setExpand(user) {
user.expand ? (user.expand = false) : (user.expand = true)
},
isExpand(value) {
return value ? 'rotate' : ''
},
// eslint-disable-next-line no-unused-vars
add(user) {
if (this.type.value === 'amount') {
this.addAmount({
user: user,
amount: this.amount,
year: this.selectedYear.value,
month: this.selectedMonth.value
})
}
if (this.type.value === 'credit') {
this.addCredit({
user: user,
credit: this.amount,
year: this.selectedYear.value,
month: this.selectedMonth.value
})
}
this.createDefault(
this.amount,
this.type,
this.selectedYear,
this.selectedMonth
)
},
isFiltered(user) {
return (
user.firstname.toLowerCase().includes(this.filter.toLowerCase()) ||
user.lastname.toLowerCase().includes(this.filter.toLowerCase())
)
},
createDefault() {
this.amount = null
this.type = { value: 'credit', text: 'Guthaben' }
this.selectedYear = {
value: new Date().getFullYear(),
text: new Date().getFullYear()
}
this.selectedMonth = {
value: new Date().getMonth() + 1,
text: [
'Januar',
'Februar',
'März',
'April',
'Mai',
'Juni',
'Juli',
'August',
'September',
'Oktober',
'November',
'Dezember'
][new Date().getMonth()]
}
}
},
computed: {
isActualYear() {
return this.year === new Date().getFullYear()
},
...mapGetters({
users: 'finanzerUsers/users',
errorMails: 'finanzerUsers/errorMails',
year: 'finanzerUsers/year',
years: 'finanzerUsers/years',
months: 'finanzerUsers/months'
})
}
}
</script> </script>
<style scoped> <style scoped>
.rotate { .rotate {
transform: rotate(180deg); transform: rotate(180deg);
} }
</style> </style>

223
src/components/finanzer/Table.vue
View File

@ -1,118 +1,125 @@
<template> <template>
<v-data-table <v-data-table dense :headers="headers" :items="user.creditList[year]" :hide-default-footer="true">
dense <template v-slot:item.jan_amount="{ item }">
:headers="headers" <v-chip outlined :text-color="getColor(item, item.jan_amount)">
:items="user.creditList[year]" {{(item.jan_amount /
:hide-default-footer="true"> 100).toFixed(2)}}
<template v-slot:item.jan_amount="{ item }"> </v-chip>
<v-chip outlined :text-color="getColor(item, item.jan_amount)">{{(item.jan_amount / </template>
100).toFixed(2)}} <template v-slot:item.feb_amount="{ item }">
</v-chip> <v-chip outlined :text-color="getColor(item, item.feb_amount)">
</template> {{(item.feb_amount /
<template v-slot:item.feb_amount="{ item }"> 100).toFixed(2)}}
<v-chip outlined :text-color="getColor(item, item.feb_amount)">{{(item.feb_amount / </v-chip>
100).toFixed(2)}} </template>
</v-chip> <template v-slot:item.maer_amount="{ item }">
</template> <v-chip outlined :text-color="getColor(item, item.maer_amount)">
<template v-slot:item.maer_amount="{ item }"> {{(item.maer_amount /
<v-chip outlined :text-color="getColor(item, item.maer_amount)">{{(item.maer_amount / 100).toFixed(2)}}
100).toFixed(2)}} </v-chip>
</v-chip> </template>
</template> <template v-slot:item.apr_amount="{ item }">
<template v-slot:item.apr_amount="{ item }"> <v-chip outlined :text-color="getColor(item, item.apr_amount)">
<v-chip outlined :text-color="getColor(item, item.apr_amount)">{{(item.apr_amount / {{(item.apr_amount /
100).toFixed(2)}} 100).toFixed(2)}}
</v-chip> </v-chip>
</template> </template>
<template v-slot:item.mai_amount="{ item }"> <template v-slot:item.mai_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.mai_amount)">{{(item.mai_amount / <v-chip outlined :text-color="getColor(item, item.mai_amount)">
100).toFixed(2)}} {{(item.mai_amount /
</v-chip> 100).toFixed(2)}}
</template> </v-chip>
<template v-slot:item.jun_amount="{ item }"> </template>
<v-chip outlined :text-color="getColor(item, item.jun_amount)">{{(item.jun_amount / <template v-slot:item.jun_amount="{ item }">
100).toFixed(2)}} <v-chip outlined :text-color="getColor(item, item.jun_amount)">
</v-chip> {{(item.jun_amount /
</template> 100).toFixed(2)}}
<template v-slot:item.jul_amount="{ item }"> </v-chip>
<v-chip outlined :text-color="getColor(item, item.jul_amount)">{{(item.jul_amount / </template>
100).toFixed(2)}} <template v-slot:item.jul_amount="{ item }">
</v-chip> <v-chip outlined :text-color="getColor(item, item.jul_amount)">
</template> {{(item.jul_amount /
<template v-slot:item.aug_amount="{ item }"> 100).toFixed(2)}}
<v-chip outlined :text-color="getColor(item, item.aug_amount)">{{(item.aug_amount / </v-chip>
100).toFixed(2)}} </template>
</v-chip> <template v-slot:item.aug_amount="{ item }">
</template> <v-chip outlined :text-color="getColor(item, item.aug_amount)">
<template v-slot:item.sep_amount="{ item }"> {{(item.aug_amount /
<v-chip outlined :text-color="getColor(item, item.sep_amount)">{{(item.sep_amount / 100).toFixed(2)}}
100).toFixed(2)}} </v-chip>
</v-chip> </template>
</template> <template v-slot:item.sep_amount="{ item }">
<template v-slot:item.okt_amount="{ item }"> <v-chip outlined :text-color="getColor(item, item.sep_amount)">
<v-chip outlined :text-color="getColor(item, item.okt_amount)">{{(item.okt_amount / {{(item.sep_amount /
100).toFixed(2)}} 100).toFixed(2)}}
</v-chip> </v-chip>
</template> </template>
<template v-slot:item.nov_amount="{ item }"> <template v-slot:item.okt_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.nov_amount)">{{(item.nov_amount / <v-chip outlined :text-color="getColor(item, item.okt_amount)">
100).toFixed(2)}} {{(item.okt_amount /
</v-chip> 100).toFixed(2)}}
</template> </v-chip>
<template v-slot:item.dez_amount="{ item }"> </template>
<v-chip outlined :text-color="getColor(item, item.dez_amount)">{{(item.dez_amount / <template v-slot:item.nov_amount="{ item }">
100).toFixed(2)}} <v-chip outlined :text-color="getColor(item, item.nov_amount)">
</v-chip> {{(item.nov_amount /
</template> 100).toFixed(2)}}
<template v-slot:item.sum="{ item }"> </v-chip>
<v-chip outlined :text-color="getColor(item, item.sum)">{{(item.sum / 100).toFixed(2)}}</v-chip> </template>
</template> <template v-slot:item.dez_amount="{ item }">
</v-data-table> <v-chip outlined :text-color="getColor(item, item.dez_amount)">
{{(item.dez_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.sum="{ item }">
<v-chip outlined :text-color="getColor(item, item.sum)">{{(item.sum / 100).toFixed(2)}}</v-chip>
</template>
</v-data-table>
</template> </template>
<script> <script>
export default { export default {
name: "Table", name: 'Table',
props: { props: {
user: Object, user: Object,
year: Number, year: Number
},
data() {
return {
headers: [
{
text: 'Schulden / Guthaben',
align: 'left',
sortable: false,
value: 'type'
}, },
data () { { text: 'Januar in EUR', value: 'jan_amount' },
return { { text: 'Februar in EUR', value: 'feb_amount' },
headers: [ { text: 'März in EUR', value: 'maer_amount' },
{ { text: 'April in EUR', value: 'apr_amount' },
text: 'Schulden / Guthaben', { text: 'Mai in EUR', value: 'mai_amount' },
align: 'left', { text: 'Juni in EUR', value: 'jun_amount' },
sortable: false, { text: 'Juli in EUR', value: 'jul_amount' },
value: 'type' { text: 'August in EUR', value: 'aug_amount' },
}, { text: 'September in EUR', value: 'sep_amount' },
{text: 'Januar in EUR', value: 'jan_amount'}, { text: 'Oktober in EUR', value: 'okt_amount' },
{text: 'Februar in EUR', value: 'feb_amount'}, { text: 'November in EUR', value: 'nov_amount' },
{text: 'März in EUR', value: 'maer_amount'}, { text: 'Dezember in EUR', value: 'dez_amount' },
{text: 'April in EUR', value: 'apr_amount'}, { text: 'Summe in EUR', value: 'sum' }
{text: 'Mai in EUR', value: 'mai_amount'}, ]
{text: 'Juni in EUR', value: 'jun_amount'},
{text: 'Juli in EUR', value: 'jul_amount'},
{text: 'August in EUR', value: 'aug_amount'},
{text: 'September in EUR', value: 'sep_amount'},
{text: 'Oktober in EUR', value: 'okt_amount'},
{text: 'November in EUR', value: 'nov_amount'},
{text: 'Dezember in EUR', value: 'dez_amount'},
{text: 'Summe in EUR', value: 'sum'}
],
}
},
methods: {
getColor (item, value) {
if (item.type === 'Summe') {
return value < 0 ? 'red' : 'green'
}
return item.type === 'Guthaben' ? 'green' : 'red'
},
}
} }
},
methods: {
getColor(item, value) {
if (item.type === 'Summe') {
return value < 0 ? 'red' : 'green'
}
return item.type === 'Guthaben' ? 'green' : 'red'
}
}
}
</script> </script>
<style scoped> <style scoped>
</style> </style>

502
src/components/finanzer/User.vue
View File

@ -1,212 +1,310 @@
<template> <template>
<div> <div>
<v-toolbar tile> <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-spacer />
<v-toolbar-items> <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-items>
</v-toolbar> </v-toolbar>
<v-expand-transition> <v-expand-transition>
<v-card style="margin-top: 3px" v-show="errorMail"> <v-card style="margin-top: 3px" v-show="errorMail">
<v-alert dense :type="computeError(errorMail)"> <v-alert dense :type="computeError(errorMail)">{{errorMessage(errorMail)}}</v-alert>
{{errorMessage(errorMail)}} </v-card>
</v-alert> </v-expand-transition>
</v-card> <v-card style="margin-top: 3px;">
</v-expand-transition> <v-card-title>Konfiguration</v-card-title>
<v-card style="margin-top: 3px;"> <v-card-text>
<v-card-title>Konfiguration</v-card-title> <v-form style="margin-left: 15px; margin-right: 15px">
<v-card-text> <v-row>
<v-form style="margin-left: 15px; margin-right: 15px"> <v-col>
<v-row> <v-label>Status:</v-label>
<v-col> </v-col>
<v-label>Status: </v-label> <v-col>
</v-col> <v-chip
<v-col> outlined
<v-chip outlined :text-color="getLockedColor(activeUser.locked)">{{activeUser.locked ? 'Gesperrt': 'nicht Gesperrt'}}</v-chip> :text-color="getLockedColor(activeUser.locked)"
</v-col> >{{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> <v-col>
</v-col> <v-btn
</v-row> @click="doLock({user: activeUser, locked: !activeUser.locked})"
<v-divider style="margin-bottom: 15px;"/> >{{activeUser.locked ? 'Entperren' : 'Sperren'}}</v-btn>
<v-row> </v-col>
<v-col> </v-row>
<v-text-field :rules="[isNumber]" label="Betrag des Sperrlimits in € (EURO)" v-model="limit"></v-text-field> <v-divider style="margin-bottom: 15px;" />
</v-col> <v-row>
<v-col> <v-col>
<v-select return-object v-model="autoLock" label="Automatische Sperre" :items="[{value: true, text: 'Aktiviert'}, {value: false, text: 'Deaktiviert'}]" <v-text-field
item-text="text" item-value="value"/> :rules="[isNumber]"
</v-col> label="Betrag des Sperrlimits in € (EURO)"
</v-row> v-model="limit"
<v-row> ></v-text-field>
<v-btn block @click="saveConfig({user: activeUser, limit: limit, autoLock: autoLock.value})">Speichern</v-btn> </v-col>
</v-row> <v-col>
</v-form> <v-select
</v-card-text> return-object
</v-card> v-model="autoLock"
<v-card style="margin-top: 3px;"> label="Automatische Sperre"
<v-card-title>Geld transferieren</v-card-title> :items="[{value: true, text: 'Aktiviert'}, {value: false, text: 'Deaktiviert'}]"
<v-card-text> item-text="text"
<v-form style="margin-left: 15px; margin-right: 15px"> item-value="value"
<v-row> />
<v-col> </v-col>
<v-text-field :rules="[isNumber]" label="Betrag" </v-row>
v-model="amount"></v-text-field> <v-row>
</v-col> <v-btn
<v-col> block
<v-select return-object v-model="type" label="Typ" @click="saveConfig({user: activeUser, limit: limit, autoLock: autoLock.value})"
:items="[{value: 'amount', text: 'Schulden'}, {value: 'credit', text: 'Guthaben'}]" >Speichern</v-btn>
item-text="text" item-value="value"></v-select> </v-row>
</v-col> </v-form>
</v-row> </v-card-text>
<v-row> </v-card>
<v-col> <v-card style="margin-top: 3px;">
<v-select return-object v-model="selectedYear" label="Jahr" <v-card-title>Geld transferieren</v-card-title>
:items="selectYears" item-text="text" <v-card-text>
item-value="value"></v-select> <v-form style="margin-left: 15px; margin-right: 15px">
</v-col> <v-row>
<v-col> <v-col>
<v-select return-object v-model="selectedMonth" label="Monat" <v-text-field :rules="[isNumber]" label="Betrag" v-model="amount"></v-text-field>
:items="months" item-text="text" </v-col>
item-value="value"></v-select> <v-col>
</v-col> <v-select
</v-row> return-object
</v-form> v-model="type"
<v-btn block @click="add">Hinzufügen</v-btn> label="Typ"
</v-card-text> :items="[{value: 'amount', text: 'Schulden'}, {value: 'credit', text: 'Guthaben'}]"
</v-card> item-text="text"
<div v-for="year in years" :key="years.indexOf(year)"> item-value="value"
<v-card style="margin-top: 3px;"> ></v-select>
<v-card-title>{{year}}</v-card-title> </v-col>
<Table v-bind:user="activeUser" v-bind:year="year"/> </v-row>
<v-container fluid> <v-row>
<v-col> <v-col>
<v-row> <v-select
<v-col> return-object
<v-label>Vorjahr:</v-label> v-model="selectedYear"
</v-col> label="Jahr"
<v-col> :items="selectYears"
<v-chip outlined :text-color="getLastColor(activeUser.creditList[year][1].last)"> item-text="text"
{{(activeUser.creditList[year][1].last / 100).toFixed(2)}} item-value="value"
</v-chip> ></v-select>
</v-col> </v-col>
<v-col> <v-col>
<v-label>Gesamt:</v-label> <v-select
</v-col> return-object
<v-col> v-model="selectedMonth"
<v-chip outlined x-large label="Monat"
:text-color="getLastColor(getAllSum(activeUser.creditList[year][2].sum ,activeUser.creditList[year][1].last))"> :items="months"
{{(getAllSum(activeUser.creditList[year][2].sum ,activeUser.creditList[year][1].last) / item-text="text"
100).toFixed(2)}} item-value="value"
</v-chip> ></v-select>
</v-col> </v-col>
</v-row> </v-row>
</v-col> </v-form>
</v-container> <v-btn block @click="add">Hinzufügen</v-btn>
</v-card> </v-card-text>
</div> </v-card>
<div v-for="year in years" :key="years.indexOf(year)">
<v-card style="margin-top: 3px;">
<v-card-title>{{year}}</v-card-title>
<Table v-bind:user="activeUser" v-bind:year="year" />
<v-container fluid>
<v-col>
<v-row>
<v-col>
<v-label>Vorjahr:</v-label>
</v-col>
<v-col>
<v-chip
outlined
:text-color="getLastColor(activeUser.creditList[year][1].last)"
>{{(activeUser.creditList[year][1].last / 100).toFixed(2)}}</v-chip>
</v-col>
<v-col>
<v-label>Gesamt:</v-label>
</v-col>
<v-col>
<v-chip
outlined
x-large
:text-color="getLastColor(getAllSum(activeUser.creditList[year][2].sum ,activeUser.creditList[year][1].last))"
>
{{(getAllSum(activeUser.creditList[year][2].sum ,activeUser.creditList[year][1].last) /
100).toFixed(2)}}
</v-chip>
</v-col>
</v-row>
</v-col>
</v-container>
</v-card>
</div> </div>
</div>
</template> </template>
<script> <script>
import Table from "./Table"; import Table from './Table'
import {mapGetters, mapActions} from 'vuex'; import { mapGetters, mapActions } from 'vuex'
export default { export default {
name: "User", name: 'User',
components: {Table}, components: { Table },
data () { data() {
return { return {
isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.', isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.',
limit: null, limit: null,
autoLock: null, autoLock: null,
amount: null, amount: null,
type: {value: 'credit', text: 'Guthaben'}, type: { value: 'credit', text: 'Guthaben' },
selectedYear: {value: new Date().getFullYear(), text: new Date().getFullYear()}, selectedYear: {
selectedMonth: {value: new Date().getMonth() + 1, text: ["Januar", "Februar", "März", "April", "Mai", "Juni", value: new Date().getFullYear(),
"Juli", "August", "September", "Oktober", "November", "Dezember" text: new Date().getFullYear()
][new Date().getMonth()]} },
selectedMonth: {
} value: new Date().getMonth() + 1,
}, text: [
created() { 'Januar',
this.limit = (this.activeUser.limit / 100).toFixed(2) 'Februar',
this.autoLock = {value: this.activeUser.autoLock, text: this.activeUser.autoLock? "Aktiviert" : "Deaktiviert"} 'März',
}, 'April',
methods: { 'Mai',
...mapActions({ 'Juni',
addAmount: 'finanzerUsers/addAmount', 'Juli',
addCredit: 'finanzerUsers/addCredit', 'August',
sendMail: 'finanzerUsers/sendMail', 'September',
doLock: 'finanzerUsers/doLock', 'Oktober',
saveConfig: 'finanzerUsers/saveConfig'}), 'November',
getLastColor (value) { 'Dezember'
return value < 0 ? 'red' : 'green' ][new Date().getMonth()]
}, }
getAllSum(sum, lastYear) {
return lastYear + sum
},
getLockedColor (value) {
return value ? 'red' : 'green'
},
add() {
if (this.type.value === 'amount') {
this.addAmount( {user: this.activeUser, amount: this.amount, year: this.selectedYear.value, month: this.selectedMonth.value})
}
if (this.type.value === 'credit') {
this.addCredit({user: this.activeUser, credit: this.amount, year: this.selectedYear.value, month: this.selectedMonth.value})
}
this.createDefault()
},
createDefault() {
// eslint-disable-next-line no-unused-vars
let year = new Date().getFullYear()
// eslint-disable-next-line no-unused-vars
let month = new Date().getMonth()
this.amount = null
this.type = {value: 'credit', text: 'Guthaben'}
this.selectedYear = {value: new Date().getFullYear(), text: new Date().getFullYear()}
this.selectedMonth = {value: new Date().getMonth() + 1, text: ["Januar", "Februar", "März", "April", "Mai", "Juni",
"Juli", "August", "September", "Oktober", "November", "Dezember"
][new Date().getMonth()]}
},
computeError(error) {
if (error) {
if (error.error) return 'error'
else return 'success'
}
},
errorMessage(error) {
if (error) {
if (error.error) return 'Konnte Email an ' + error.user.firstname + ' ' + error.user.lastname + ' nicht senden!'
else return 'Email wurde an ' + error.user.firstname + ' ' + error.user.lastname + ' versandt.'
}
}
},
computed: {
years() {
let years = []
for (let year in this.activeUser.creditList) {
years.unshift(parseInt(year))
}
return years
},
...mapGetters({activeUser: 'finanzerUsers/activeUser',
errorMail: 'finanzerUsers/errorMail',
months: 'finanzerUsers/months',
selectYears: 'finanzerUsers/selectYears'})
},
watch: {
activeUser(newVal) {
this.limit = (newVal.limit / 100).toFixed(2)
this.autoLock = {value: newVal.autoLock, text: newVal.autoLock? "Aktiviert" : "Deaktiviert"}
}
}
} }
},
created() {
this.limit = (this.activeUser.limit / 100).toFixed(2)
this.autoLock = {
value: this.activeUser.autoLock,
text: this.activeUser.autoLock ? 'Aktiviert' : 'Deaktiviert'
}
},
methods: {
...mapActions({
addAmount: 'finanzerUsers/addAmount',
addCredit: 'finanzerUsers/addCredit',
sendMail: 'finanzerUsers/sendMail',
doLock: 'finanzerUsers/doLock',
saveConfig: 'finanzerUsers/saveConfig'
}),
getLastColor(value) {
return value < 0 ? 'red' : 'green'
},
getAllSum(sum, lastYear) {
return lastYear + sum
},
getLockedColor(value) {
return value ? 'red' : 'green'
},
add() {
if (this.type.value === 'amount') {
this.addAmount({
user: this.activeUser,
amount: this.amount,
year: this.selectedYear.value,
month: this.selectedMonth.value
})
}
if (this.type.value === 'credit') {
this.addCredit({
user: this.activeUser,
credit: this.amount,
year: this.selectedYear.value,
month: this.selectedMonth.value
})
}
this.createDefault()
},
createDefault() {
// eslint-disable-next-line no-unused-vars
let year = new Date().getFullYear()
// eslint-disable-next-line no-unused-vars
let month = new Date().getMonth()
this.amount = null
this.type = { value: 'credit', text: 'Guthaben' }
this.selectedYear = {
value: new Date().getFullYear(),
text: new Date().getFullYear()
}
this.selectedMonth = {
value: new Date().getMonth() + 1,
text: [
'Januar',
'Februar',
'März',
'April',
'Mai',
'Juni',
'Juli',
'August',
'September',
'Oktober',
'November',
'Dezember'
][new Date().getMonth()]
}
},
computeError(error) {
if (error) {
if (error.error) return 'error'
else return 'success'
}
},
errorMessage(error) {
if (error) {
if (error.error)
return (
'Konnte Email an ' +
error.user.firstname +
' ' +
error.user.lastname +
' nicht senden!'
)
else
return (
'Email wurde an ' +
error.user.firstname +
' ' +
error.user.lastname +
' versandt.'
)
}
}
},
computed: {
years() {
let years = []
for (let year in this.activeUser.creditList) {
years.unshift(parseInt(year))
}
return years
},
...mapGetters({
activeUser: 'finanzerUsers/activeUser',
errorMail: 'finanzerUsers/errorMail',
months: 'finanzerUsers/months',
selectYears: 'finanzerUsers/selectYears'
})
},
watch: {
activeUser(newVal) {
this.limit = (newVal.limit / 100).toFixed(2)
this.autoLock = {
value: newVal.autoLock,
text: newVal.autoLock ? 'Aktiviert' : 'Deaktiviert'
}
}
}
}
</script> </script>
<style scoped> <style scoped>
</style> </style>

34
src/plugins/routes.js
View File

@ -1,20 +1,20 @@
const main = 'http://192.168.5.118:5000/'; const main = 'http://192.168.5.118:5000/'
const url = { const url = {
login: main + 'login', login: main + 'login',
getFinanzerMain: main + 'getFinanzerMain', getFinanzerMain: main + 'getFinanzerMain',
bar: main + 'bar', bar: main + 'bar',
barGetUser: main + 'barGetUser', barGetUser: main + 'barGetUser',
barAddAmount: main + 'baradd', barAddAmount: main + 'baradd',
finanzerAddAmount: main + 'finanzerAddAmount', finanzerAddAmount: main + 'finanzerAddAmount',
finanzerAddCredit: main + 'finanzerAddCredit', finanzerAddCredit: main + 'finanzerAddCredit',
searchUser: main + 'search', searchUser: main + 'search',
getAllUser: main + 'barGetUsers', getAllUser: main + 'barGetUsers',
lockUser: main + 'finanzerLock', lockUser: main + 'finanzerLock',
finanzerSetConfig: main + 'finanzerSetConfig', finanzerSetConfig: main + 'finanzerSetConfig',
finanzerAddUser: main + 'finanzerAddUser', finanzerAddUser: main + 'finanzerAddUser',
finanzerSendAllMail: main + 'finanzerSendAllMail', finanzerSendAllMail: main + 'finanzerSendAllMail',
finanzerSendOneMail: main + 'finanzerSendOneMail' finanzerSendOneMail: main + 'finanzerSendOneMail'
}; }
export default url; export default url

14
src/plugins/vuetify.js
View File

@ -1,11 +1,11 @@
import Vue from 'vue'; import Vue from 'vue'
import Vuetify from 'vuetify/lib'; import Vuetify from 'vuetify/lib'
import 'material-design-icons-iconfont' import 'material-design-icons-iconfont'
Vue.use(Vuetify); Vue.use(Vuetify)
export default new Vuetify({ export default new Vuetify({
icons: { icons: {
iconfont: 'md', iconfont: 'md'
} }
}); })

33
src/router/index.js
View File

@ -1,36 +1,34 @@
import Vue from 'vue' import Vue from 'vue'
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
import FinanzerView from "@/views/FinanzerView"; import FinanzerView from '@/views/FinanzerView'
import Login from "@/views/Login"; import Login from '@/views/Login'
import store from "@/store/index"; import store from '@/store/index'
import BarView from "@/views/BarView"; import BarView from '@/views/BarView'
Vue.use(VueRouter) Vue.use(VueRouter)
const routes = [ const routes = [
{ {
path: "/login", path: '/login',
name: "login", name: 'login',
component: Login component: Login
}, },
{ {
path: "/finanzer", path: '/finanzer',
name: "finanzer", name: 'finanzer',
component: FinanzerView component: FinanzerView
}, },
{ {
path: "/bar", path: '/bar',
name: "bar", name: 'bar',
component: BarView component: BarView
}, },
{ {
path: '*', path: '*',
redirect: { redirect: {
name: "login" name: 'login'
} }
}, }
] ]
const router = new VueRouter({ const router = new VueRouter({
@ -40,7 +38,7 @@ const router = new VueRouter({
}) })
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
store.dispatch('fetchAccessToken'); store.dispatch('fetchAccessToken')
let sites = ['/finanzer', '/bar'] let sites = ['/finanzer', '/bar']
if (sites.includes(to.fullPath)) { if (sites.includes(to.fullPath)) {
if (to.fullPath === '/finanzer') { if (to.fullPath === '/finanzer') {
@ -64,10 +62,9 @@ router.beforeEach((to, from, next) => {
} else if (store.state.login.user.group.includes('bar')) { } else if (store.state.login.user.group.includes('bar')) {
next('/bar') next('/bar')
} }
} }
} }
next(); next()
}); })
export default router export default router

8
src/store/index.js
View File

@ -1,8 +1,8 @@
import Vue from 'vue'; import Vue from 'vue'
import Vuex from 'vuex'; import Vuex from 'vuex'
import login from './modules/login'; import login from './modules/login'
import finanzerUsers from './modules/finanzerUsers' import finanzerUsers from './modules/finanzerUsers'
import barUsers from "@/store/modules/barUsers"; import barUsers from '@/store/modules/barUsers'
Vue.use(Vuex) Vue.use(Vuex)

225
src/store/modules/barUsers.js
View File

@ -1,115 +1,138 @@
import axios from 'axios'; import axios from 'axios'
import url from '@/plugins/routes'; import url from '@/plugins/routes'
const state = { const state = {
users: [], users: [],
allUsers: [] allUsers: []
}; }
const mutations = { const mutations = {
setAllUsers: (state, users) => { setAllUsers: (state, users) => {
state.allUsers = [] state.allUsers = []
state.allUsers = users state.allUsers = users
for (let i = 0; i < state.allUsers.length; i++) { for (let i = 0; i < state.allUsers.length; i++) {
state.allUsers[i].fullName = state.allUsers[i].firstname + " " + state.allUsers[i].lastname state.allUsers[i].fullName =
} state.allUsers[i].firstname + ' ' + state.allUsers[i].lastname
}, }
setUsers: (state, users) => { },
// eslint-disable-next-line no-console setUsers: (state, users) => {
console.log(users) // eslint-disable-next-line no-console
for (let user in users) { console.log(users)
// eslint-disable-next-line no-console for (let user in users) {
console.log(user) // eslint-disable-next-line no-console
let existuser = state.users.find(a => {return user === a.username}) console.log(user)
let existuser = state.users.find(a => {
return user === a.username
})
if (existuser) { if (existuser) {
existuser.sername = users[user].username existuser.sername = users[user].username
existuser.firstname = users[user].firstname existuser.firstname = users[user].firstname
existuser.lastname = users[user].lastname existuser.lastname = users[user].lastname
existuser.locked = users[user].locked existuser.locked = users[user].locked
existuser.amount = users[user].amount existuser.amount = users[user].amount
existuser.type = users[user].type existuser.type = users[user].type
} else { } else {
state.users.push({ state.users.push({
username: users[user].username, username: users[user].username,
firstname: users[user].firstname, firstname: users[user].firstname,
lastname: users[user].lastname, lastname: users[user].lastname,
locked: users[user].locked, locked: users[user].locked,
amount: users[user].amount, amount: users[user].amount,
type: users[user].type type: users[user].type
})
}
}
// eslint-disable-next-line no-console
console.log(state.users)
mutations.sortUsers(state)
},
sortUsers: (state) => {
state.users = state.users.sort((a,b) => {
if (a.lastname > b.lastname) return 1
if (a.lastname < b.lastname) return -1
if (a.firstname > b.firstname) return 1
if (a.firstname < b.firstname) return -1
return 0
}) })
}, }
}
}; // eslint-disable-next-line no-console
console.log(state.users)
mutations.sortUsers(state)
},
sortUsers: state => {
state.users = state.users.sort((a, b) => {
if (a.lastname > b.lastname) return 1
if (a.lastname < b.lastname) return -1
if (a.firstname > b.firstname) return 1
if (a.firstname < b.firstname) return -1
return 0
})
}
}
const actions = { const actions = {
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
async getUsers({commit, rootState, dispatch}) { async getUsers({ commit, rootState, dispatch }) {
try { try {
const response = await axios.get(url.bar, {headers: {Token: rootState.login.user.accessToken}}) const response = await axios.get(url.bar, {
// eslint-disable-next-line no-console headers: { Token: rootState.login.user.accessToken }
console.log(response.data) })
commit('setUsers', response.data) // eslint-disable-next-line no-console
} catch (e) { console.log(response.data)
if (e.response) if (e.response.status === 401) dispatch('logout', null, {root: true}) commit('setUsers', response.data)
} } catch (e) {
}, if (e.response)
async addAmount({commit, rootState, dispatch}, data) { if (e.response.status === 401) dispatch('logout', null, { root: true })
try {
const response = await axios.post(url.barAddAmount, {userId: data.username, amount: data.amount}, {headers: {Token: rootState.login.user.accessToken}})
commit('setUsers', {[response.data.username]: response.data})
} catch (e) {
if (e.response) if (e.response.status === 401) dispatch('logout', null, {root: true})
}
},
async addCreditList({commit, rootState, dispatch}, data) {
try {
const response = await axios.post(url.barGetUser, {userId: data.username}, {headers: {Token: rootState.login.user.accessToken}})
commit('setUsers', {[response.data.username]: response.data})
} catch (e) {
if (e.response) if (e.response.status === 401) dispatch('logout', null, {root: true})
}
},
async getAllUsers({commit, rootState, dispatch}) {
// eslint-disable-next-line no-console
console.log('hier bin ich')
try {
const response = await axios.post(url.searchUser, {searchString: ""}, {headers: {Token: rootState.login.user.accessToken}})
// eslint-disable-next-line no-console
console.log(response)
commit('setAllUsers', response.data)
} catch (e) {
// eslint-disable-next-line no-console
console.log(e)
if (e.response) if (e.response.data === 401) dispatch('logout', null, {root: true})
}
} }
},
}; async addAmount({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.barAddAmount,
{ userId: data.username, amount: data.amount },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('setUsers', { [response.data.username]: response.data })
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async addCreditList({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.barGetUser,
{ userId: data.username },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('setUsers', { [response.data.username]: response.data })
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async getAllUsers({ commit, rootState, dispatch }) {
// eslint-disable-next-line no-console
console.log('hier bin ich')
try {
const response = await axios.post(
url.searchUser,
{ searchString: '' },
{ headers: { Token: rootState.login.user.accessToken } }
)
// eslint-disable-next-line no-console
console.log(response)
commit('setAllUsers', response.data)
} catch (e) {
// eslint-disable-next-line no-console
console.log(e)
if (e.response)
if (e.response.data === 401) dispatch('logout', null, { root: true })
}
}
}
const getters = { const getters = {
users: (state) => { return state.users }, users: state => {
allUsers: (state) => { return state.allUsers } return state.users
}; },
allUsers: state => {
return state.allUsers
}
}
export default { export default {
namespaced: true, namespaced: true,
state, state,
mutations, mutations,
actions, actions,
getters getters
} }

724
src/store/modules/finanzerUsers.js
View File

@ -1,311 +1,443 @@
import axios from 'axios'; import axios from 'axios'
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
import url from '@/plugins/routes' import url from '@/plugins/routes'
const state = { const state = {
users: [], users: [],
activeUser: { activeUser: {
username: null, username: null
}, },
allUsers: [], allUsers: [],
user: null, user: null,
errorMails: null, errorMails: null,
errorMail: null, errorMail: null,
year: new Date().getFullYear(), year: new Date().getFullYear(),
years: [], years: [],
months: [ months: [
{value: 1, text: 'Januar'}, { value: 1, text: 'Januar' },
{value: 2, text: 'Februar'}, { value: 2, text: 'Februar' },
{value: 3, text: 'März'}, { value: 3, text: 'März' },
{value: 4, text:'April'}, { value: 4, text: 'April' },
{value: 5, text: 'Mai'}, { value: 5, text: 'Mai' },
{value: 6, text: 'Juni'}, { value: 6, text: 'Juni' },
{value: 7, text: 'Juli'}, { value: 7, text: 'Juli' },
{value: 8, text: 'August'}, { value: 8, text: 'August' },
{value: 9, text: 'September'}, { value: 9, text: 'September' },
{value: 10, text: 'Oktober'}, { value: 10, text: 'Oktober' },
{value: 11, text: 'November'}, { value: 11, text: 'November' },
{value: 12, text: 'Dezember'} { value: 12, text: 'Dezember' }
], ]
}; }
const mutations = { const mutations = {
setAllUsers: (state, users) => { setAllUsers: (state, users) => {
state.allUsers = [] state.allUsers = []
state.allUsers = users state.allUsers = users
for (let i = 0; i < state.allUsers.length; i++) { for (let i = 0; i < state.allUsers.length; i++) {
state.allUsers[i].fullName = state.allUsers[i].firstname + " " + state.allUsers[i].lastname state.allUsers[i].fullName =
} state.allUsers[i].firstname + ' ' + state.allUsers[i].lastname
},
setActiveUser: (state, user) => {
if (state.activeUser.username === user.username) {
state.activeUser = {username: null}
} else {
state.activeUser = user
}
state.errorMail = null
},
setUsers: (state, users) => {
// eslint-disable-next-line no-console
console.log('users', users)
for (let user in users) {
// eslint-disable-next-line no-console
console.log('user', user)
let list = {}
for (let creditList in users[user]['creditList']) {
let amount = mutations.createAmount(users[user]['creditList'][creditList])
let credit = mutations.createCredit(users[user]['creditList'][creditList])
let sum = mutations.createSum(credit, amount)
list[creditList] = [{...credit}, {...amount}, {...sum}]
}
let existUser = state.users.find(a => {return a.username === user})
// eslint-disable-next-line no-console
console.log(existUser)
if (existUser) {
existUser.username = users[user].username
existUser.firstname = users[user].firstname
existUser.lastname = users[user].lastname
existUser.limit = users[user].limit
existUser.locked = users[user].locked
existUser.autoLock = users[user].autoLock
existUser.creditList = list
} else {
state.users.push({
username: users[user].username,
firstname: users[user].firstname,
lastname: users[user].lastname,
limit: users[user].limit,
locked: users[user].locked,
autoLock: users[user].autoLock,
creditList: list,
expand: false
})
}
}
mutations.sortUsers(state)
// eslint-disable-next-line no-console
console.log(state.users)
},
createAmount(creditList) {
let amount = {
type:'Schulden',
jan_amount: 0 - creditList.jan.depts,
feb_amount: 0 - creditList.feb.depts,
maer_amount: 0 - creditList.maer.depts,
apr_amount:0 - creditList.apr.depts,
mai_amount: 0 - creditList.mai.depts,
jun_amount: 0 - creditList.jun.depts,
jul_amount: 0 - creditList.jul.depts,
aug_amount: 0 - creditList.aug.depts,
sep_amount: 0 - creditList.sep.depts,
okt_amount: 0 - creditList.okt.depts,
nov_amount: 0 - creditList.nov.depts,
dez_amount: 0 - creditList.dez.depts,
last: 0 - creditList['last']
}
amount.sum = amount.jan_amount + amount.feb_amount + amount.maer_amount + amount.apr_amount + amount.mai_amount + amount.jun_amount + amount.jul_amount + amount.aug_amount + amount.sep_amount + amount.okt_amount + amount.nov_amount + amount.dez_amount
return amount
},
createCredit(creditList) {
let credit = {
type:'Guthaben',
jan_amount: creditList.jan.credit,
feb_amount: creditList.feb.credit,
maer_amount: creditList.maer.credit,
apr_amount: creditList.apr.credit,
mai_amount: creditList.mai.credit,
jun_amount: creditList.jun.credit,
jul_amount: creditList.jul.credit,
aug_amount: creditList.aug.credit,
sep_amount: creditList.sep.credit,
okt_amount: creditList.okt.credit,
nov_amount: creditList.nov.credit,
dez_amount: creditList.dez.credit
}
credit.sum = credit.jan_amount + credit.feb_amount + credit.maer_amount + credit.apr_amount + credit.mai_amount + credit.jun_amount + credit.jul_amount + credit.aug_amount + credit.sep_amount + credit.okt_amount + credit.nov_amount + credit.dez_amount
return credit
},
createSum(credit, amount) {
let sum = {
type:'Summe',
jan_amount: credit.jan_amount + amount.jan_amount,
feb_amount: credit.feb_amount + amount.feb_amount,
maer_amount: credit.maer_amount + amount.maer_amount,
apr_amount: credit.apr_amount + amount.apr_amount,
mai_amount: credit.mai_amount + amount.mai_amount,
jun_amount: credit.jun_amount + amount.jun_amount,
jul_amount: credit.jul_amount + amount.jul_amount,
aug_amount: credit.aug_amount + amount.aug_amount,
sep_amount: credit.sep_amount + amount.sep_amount,
okt_amount: credit.okt_amount + amount.okt_amount,
nov_amount: credit.nov_amount + amount.nov_amount,
dez_amount: credit.dez_amount + amount.dez_amount,
}
sum.sum = sum.jan_amount + sum.feb_amount + sum.maer_amount + sum.apr_amount + sum.mai_amount + sum.jun_amount + sum.jul_amount + sum.aug_amount + sum.sep_amount + sum.okt_amount + sum.nov_amount + sum.dez_amount
return sum
},
sortUsers: (state) => {
state.users = state.users.sort((a,b) => {
if (a.lastname > b.lastname) return 1
if (a.lastname < b.lastname) return -1
if (a.firstname > b.firstname) return 1
if (a.firstname < b.firstname) return -1
return 0
})
},
updateUsers: (state, data) => {
let index = state.users.indexOf(state.users.find(a => {return a.username === data.username}))
if (data.creditLists !== undefined) {
let list = {}
for (let creditList in data.creditLists) {
let amount = mutations.createAmount(data.creditLists[creditList])
let credit = mutations.createCredit(data.creditLists[creditList])
let sum = mutations.createSum(credit, amount)
list[creditList] = [{...credit}, {...amount}, {...sum}]
}
state.users[index].creditList = list
}
if (data.locked !== undefined) state.users[index].locked = data.locked
if (data.limit !== undefined) state.users[index].limit = data.limit
if (data.autoLock !== undefined) state.users[index].autoLock = data.autoLock
},
setMails: (state, data) => {
state.errorMails = data
},
setMail: (state, data) => {
state.errorMail = data
},
setYears: (state) => {
for (let year = new Date().getFullYear(); year >= 2000; year--) {
state.years.push({value: year, text: year})
}
},
setYear: (state, value) => {
if(value) state.year++
else state.year--
} }
}; },
setActiveUser: (state, user) => {
if (state.activeUser.username === user.username) {
state.activeUser = { username: null }
} else {
state.activeUser = user
}
state.errorMail = null
},
setUsers: (state, users) => {
// eslint-disable-next-line no-console
console.log('users', users)
for (let user in users) {
// eslint-disable-next-line no-console
console.log('user', user)
let list = {}
for (let creditList in users[user]['creditList']) {
let amount = mutations.createAmount(
users[user]['creditList'][creditList]
)
let credit = mutations.createCredit(
users[user]['creditList'][creditList]
)
let sum = mutations.createSum(credit, amount)
list[creditList] = [{ ...credit }, { ...amount }, { ...sum }]
}
let existUser = state.users.find(a => {
return a.username === user
})
// eslint-disable-next-line no-console
console.log(existUser)
if (existUser) {
existUser.username = users[user].username
existUser.firstname = users[user].firstname
existUser.lastname = users[user].lastname
existUser.limit = users[user].limit
existUser.locked = users[user].locked
existUser.autoLock = users[user].autoLock
existUser.creditList = list
} else {
state.users.push({
username: users[user].username,
firstname: users[user].firstname,
lastname: users[user].lastname,
limit: users[user].limit,
locked: users[user].locked,
autoLock: users[user].autoLock,
creditList: list,
expand: false
})
}
}
mutations.sortUsers(state)
// eslint-disable-next-line no-console
console.log(state.users)
},
createAmount(creditList) {
let amount = {
type: 'Schulden',
jan_amount: 0 - creditList.jan.depts,
feb_amount: 0 - creditList.feb.depts,
maer_amount: 0 - creditList.maer.depts,
apr_amount: 0 - creditList.apr.depts,
mai_amount: 0 - creditList.mai.depts,
jun_amount: 0 - creditList.jun.depts,
jul_amount: 0 - creditList.jul.depts,
aug_amount: 0 - creditList.aug.depts,
sep_amount: 0 - creditList.sep.depts,
okt_amount: 0 - creditList.okt.depts,
nov_amount: 0 - creditList.nov.depts,
dez_amount: 0 - creditList.dez.depts,
last: 0 - creditList['last']
}
amount.sum =
amount.jan_amount +
amount.feb_amount +
amount.maer_amount +
amount.apr_amount +
amount.mai_amount +
amount.jun_amount +
amount.jul_amount +
amount.aug_amount +
amount.sep_amount +
amount.okt_amount +
amount.nov_amount +
amount.dez_amount
return amount
},
createCredit(creditList) {
let credit = {
type: 'Guthaben',
jan_amount: creditList.jan.credit,
feb_amount: creditList.feb.credit,
maer_amount: creditList.maer.credit,
apr_amount: creditList.apr.credit,
mai_amount: creditList.mai.credit,
jun_amount: creditList.jun.credit,
jul_amount: creditList.jul.credit,
aug_amount: creditList.aug.credit,
sep_amount: creditList.sep.credit,
okt_amount: creditList.okt.credit,
nov_amount: creditList.nov.credit,
dez_amount: creditList.dez.credit
}
credit.sum =
credit.jan_amount +
credit.feb_amount +
credit.maer_amount +
credit.apr_amount +
credit.mai_amount +
credit.jun_amount +
credit.jul_amount +
credit.aug_amount +
credit.sep_amount +
credit.okt_amount +
credit.nov_amount +
credit.dez_amount
return credit
},
createSum(credit, amount) {
let sum = {
type: 'Summe',
jan_amount: credit.jan_amount + amount.jan_amount,
feb_amount: credit.feb_amount + amount.feb_amount,
maer_amount: credit.maer_amount + amount.maer_amount,
apr_amount: credit.apr_amount + amount.apr_amount,
mai_amount: credit.mai_amount + amount.mai_amount,
jun_amount: credit.jun_amount + amount.jun_amount,
jul_amount: credit.jul_amount + amount.jul_amount,
aug_amount: credit.aug_amount + amount.aug_amount,
sep_amount: credit.sep_amount + amount.sep_amount,
okt_amount: credit.okt_amount + amount.okt_amount,
nov_amount: credit.nov_amount + amount.nov_amount,
dez_amount: credit.dez_amount + amount.dez_amount
}
sum.sum =
sum.jan_amount +
sum.feb_amount +
sum.maer_amount +
sum.apr_amount +
sum.mai_amount +
sum.jun_amount +
sum.jul_amount +
sum.aug_amount +
sum.sep_amount +
sum.okt_amount +
sum.nov_amount +
sum.dez_amount
return sum
},
sortUsers: state => {
state.users = state.users.sort((a, b) => {
if (a.lastname > b.lastname) return 1
if (a.lastname < b.lastname) return -1
if (a.firstname > b.firstname) return 1
if (a.firstname < b.firstname) return -1
return 0
})
},
updateUsers: (state, data) => {
let index = state.users.indexOf(
state.users.find(a => {
return a.username === data.username
})
)
if (data.creditLists !== undefined) {
let list = {}
for (let creditList in data.creditLists) {
let amount = mutations.createAmount(data.creditLists[creditList])
let credit = mutations.createCredit(data.creditLists[creditList])
let sum = mutations.createSum(credit, amount)
list[creditList] = [{ ...credit }, { ...amount }, { ...sum }]
}
state.users[index].creditList = list
}
if (data.locked !== undefined) state.users[index].locked = data.locked
if (data.limit !== undefined) state.users[index].limit = data.limit
if (data.autoLock !== undefined) state.users[index].autoLock = data.autoLock
},
setMails: (state, data) => {
state.errorMails = data
},
setMail: (state, data) => {
state.errorMail = data
},
setYears: state => {
for (let year = new Date().getFullYear(); year >= 2000; year--) {
state.years.push({ value: year, text: year })
}
},
setYear: (state, value) => {
if (value) state.year++
else state.year--
}
}
const actions = { const actions = {
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
async getAllUsers({commit, rootState, dispatch}) { async getAllUsers({ commit, rootState, dispatch }) {
// eslint-disable-next-line no-console // eslint-disable-next-line no-console
console.log(rootState) console.log(rootState)
try { try {
const response = await axios.post(url.searchUser, {searchString: ""}, {headers: {Token: rootState.login.user.accessToken}}) const response = await axios.post(
commit('setAllUsers', response.data) url.searchUser,
} catch (err) { { searchString: '' },
// eslint-disable-next-line no-console { headers: { Token: rootState.login.user.accessToken } }
if (err.response) if (err.response.status === 401) dispatch('logout', null, {root: true}) )
} commit('setAllUsers', response.data)
}, } catch (err) {
async getUsers({commit, rootState, dispatch}) { // eslint-disable-next-line no-console
try { if (err.response)
const response = await axios.get(url.getFinanzerMain, {headers: {Token: rootState.login.user.accessToken}}) if (err.response.status === 401)
// eslint-disable-next-line no-console dispatch('logout', null, { root: true })
console.log('response', response.data)
commit('setUsers', response.data)
} catch (err) {
// eslint-disable-next-line no-console
console.log(err)
if (err.response) if (err.response.status === 401) dispatch('logout', null, {root: true})
}
},
setActiveUser({ commit }, user) {
commit('setActiveUser', user)
},
async addAmount({commit, rootState, dispatch}, data) {
try {
const response = await axios.post(url.finanzerAddAmount, {userId: data.user.username, amount: data.amount * 100, year: data.year, month: data.month}, {headers: {Token: rootState.login.user.accessToken}})
const creditLists = {...response.data}
delete creditLists.locked
commit('updateUsers', {creditLists: creditLists, locked: response.data.locked, username: data.user.username})
} catch (err) {
if (err.response) if (err.response.status === 401) dispatch('logout', null, {root: true})
}
},
async addCredit({commit, rootState, dispatch}, data) {
try {
const response = await axios.post(url.finanzerAddCredit, {userId: data.user.username, credit: data.credit * 100, year: data.year, month: data.month}, {headers: {Token: rootState.login.user.accessToken}})
const creditLists = {...response.data}
delete creditLists.locked
commit('updateUsers', {creditLists: creditLists, locked: response.data.locked, username: data.user.username})
} catch (err) {
if (err.response) if (err.response.status === 401) dispatch('logout', null, {root: true})
}
},
async doLock({commit, rootState, dispatch}, data) {
try {
const response = await axios.post(url.lockUser, {userId: data.user.username, locked: data.locked}, {headers: {Token: rootState.login.user.accessToken}})
commit('updateUsers', response.data)
} catch (e) {
if (e.response) if(e.response.status === 401) dispatch('logout', null, {root: true})
}
},
async saveConfig({commit, rootState, dispatch}, data) {
try {
const response = await axios.post(url.finanzerSetConfig, {userId: data.user.username, limit: data.limit * 100, autoLock: data.autoLock}, {headers: {Token: rootState.login.user.accessToken}})
commit('updateUsers', response.data)
} catch (e) {
if (e.response) if(e.response.status === 401) dispatch('logout', null, {root: true})
}
},
async addUser({commit, rootState, dispatch}, data) {
try {
const response = await axios.post(url.finanzerAddUser, {userId: data.username}, {headers: {Token: rootState.login.user.accessToken}})
commit('setUsers', response.data)
} catch (e) {
if (e.response) if (e.response.status === 401) dispatch('logout', null, {root: true})
}
},
async sendMails({commit, rootState, dispatch}) {
try {
const response = await axios.get(url.finanzerSendAllMail, {headers: {Token: rootState.login.user.accessToken}})
commit('setMails', response.data)
} catch (e) {
if (e.response) if (e.response.status === 401) dispatch('logout', null, {root: true})
}
},
async sendMail({commit, rootState, dispatch}, data) {
try {
const response = await axios.post(url.finanzerSendOneMail, {userId: data.username}, {headers: {Token: rootState.login.user.accessToken}})
commit('setMail', response.data)
} catch (e) {
if (e.response) if (e.response.status === 401) dispatch('logout', null, {root: true})
}
},
createYears({commit}) {
commit('setYears')
return 'hallo'
},
countYear({commit}, value) {
commit('setYear', value)
} }
}; },
async getUsers({ commit, rootState, dispatch }) {
try {
const response = await axios.get(url.getFinanzerMain, {
headers: { Token: rootState.login.user.accessToken }
})
// eslint-disable-next-line no-console
console.log('response', response.data)
commit('setUsers', response.data)
} catch (err) {
// eslint-disable-next-line no-console
console.log(err)
if (err.response)
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
},
setActiveUser({ commit }, user) {
commit('setActiveUser', user)
},
async addAmount({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.finanzerAddAmount,
{
userId: data.user.username,
amount: data.amount * 100,
year: data.year,
month: data.month
},
{ headers: { Token: rootState.login.user.accessToken } }
)
const creditLists = { ...response.data }
delete creditLists.locked
commit('updateUsers', {
creditLists: creditLists,
locked: response.data.locked,
username: data.user.username
})
} catch (err) {
if (err.response)
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
},
async addCredit({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.finanzerAddCredit,
{
userId: data.user.username,
credit: data.credit * 100,
year: data.year,
month: data.month
},
{ headers: { Token: rootState.login.user.accessToken } }
)
const creditLists = { ...response.data }
delete creditLists.locked
commit('updateUsers', {
creditLists: creditLists,
locked: response.data.locked,
username: data.user.username
})
} catch (err) {
if (err.response)
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
},
async doLock({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.lockUser,
{ userId: data.user.username, locked: data.locked },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('updateUsers', response.data)
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async saveConfig({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.finanzerSetConfig,
{
userId: data.user.username,
limit: data.limit * 100,
autoLock: data.autoLock
},
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('updateUsers', response.data)
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async addUser({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.finanzerAddUser,
{ userId: data.username },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('setUsers', response.data)
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async sendMails({ commit, rootState, dispatch }) {
try {
const response = await axios.get(url.finanzerSendAllMail, {
headers: { Token: rootState.login.user.accessToken }
})
commit('setMails', response.data)
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async sendMail({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(
url.finanzerSendOneMail,
{ userId: data.username },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('setMail', response.data)
} catch (e) {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
createYears({ commit }) {
commit('setYears')
return 'hallo'
},
countYear({ commit }, value) {
commit('setYear', value)
}
}
const getters = { const getters = {
users: state => { return state.users }, users: state => {
activeUser: state => { return state.activeUser }, return state.users
allUsers: state => { return state.allUsers }, },
user: state => { return state.user }, activeUser: state => {
errorMails: state => { return state.errorMails }, return state.activeUser
errorMail: state => { return state.errorMail }, },
years: state => { return state.years }, allUsers: state => {
selectYears: state => {return state.years}, return state.allUsers
year: state => { return state.year }, },
months: state => { return state.months}, user: state => {
return state.user
},
}; errorMails: state => {
return state.errorMails
},
errorMail: state => {
return state.errorMail
},
years: state => {
return state.years
},
selectYears: state => {
return state.years
},
year: state => {
return state.year
},
months: state => {
return state.months
}
}
export default { export default {
namespaced: true, namespaced: true,
state, state,
mutations, mutations,
actions, actions,
getters getters
} }

183
src/store/modules/login.js
View File

@ -1,98 +1,107 @@
import axios from 'axios'; import axios from 'axios'
import router from "@/router"; import router from '@/router'
import url from '@/plugins/routes' import url from '@/plugins/routes'
const state = { const state = {
user: { user: {
username: null,
accessToken: null,
group: null
},
loggingIn: false,
loginError: null
}
const mutations = {
loginStart: state => (state.loggingIn = true),
loginStop(state, errorMessage) {
state.loggingIn = false
state.loginError = errorMessage
},
updateAccessToken(state, data) {
if (typeof data === typeof '') {
data = JSON.parse(data)
}
if (data === null || data === undefined) {
state.user.username = null
state.user.accessToken = null
state.user.group = null
} else {
state.user.username = data.username
state.user.accessToken = data.accessToken
state.user.group = data.group
}
},
logout(state) {
state.user.accessToken = null
state.user.username = null
state.user.group = null
}
}
const actions = {
async doLogin({ commit }, loginData) {
commit('loginStart')
try {
const response = await axios.post(url.login, { ...loginData })
localStorage.setItem(
'user',
JSON.stringify({
username: response.data.username,
accessToken: response.data.token,
group: response.data.group
})
)
commit('loginStop', null)
commit('updateAccessToken', response.data)
if (state.user.group.includes('moneymaster')) {
router.push('/finanzer')
} else if (state.user.group.includes('bar')) {
router.push('/bar')
}
} catch (err) {
commit('loginStop', err.response.data.error)
commit('updateAccessToken', {
username: null, username: null,
accessToken: null, accessToken: null,
group: null group: null
}, })
loggingIn: false,
loginError: null
};
const mutations = {
loginStart: state => state.loggingIn = true,
loginStop (state, errorMessage){
state.loggingIn = false;
state.loginError = errorMessage;
},
updateAccessToken (state, data) {
if (typeof(data) === typeof("")) {
data = JSON.parse(data)
}
if (data === null || data === undefined) {
state.user.username = null;
state.user.accessToken = null;
state.user.group = null;
} else {
state.user.username = data.username;
state.user.accessToken = data.accessToken;
state.user.group = data.group;
}
},
logout (state) {
state.user.accessToken = null;
state.user.username = null;
state.user.group = null;
} }
}; },
fetchAccessToken({ commit }) {
const actions = { commit('updateAccessToken', localStorage.getItem('user'))
async doLogin({ commit }, loginData) { },
commit('loginStart'); logout({ commit }) {
try { localStorage.removeItem('user')
const response = await axios.post(url.login, {...loginData}) commit('logout')
localStorage.setItem('user', JSON.stringify({ username: response.data.username, accessToken: response.data.token, group: response.data.group})); router.push('/login')
commit('loginStop', null); },
commit('updateAccessToken', response.data) resetLoginError({ commit }) {
if (state.user.group.includes('moneymaster')) { commit('loginStop')
router.push('/finanzer'); }
} }
else if (state.user.group.includes('bar')) {
router.push('/bar')
}
} catch (err) {
commit('loginStop', err.response.data.error)
commit('updateAccessToken', {username: null, accessToken: null, group: null})
}
},
fetchAccessToken({ commit }) {
commit('updateAccessToken', localStorage.getItem('user'))
},
logout({ commit }) {
localStorage.removeItem('user');
commit('logout');
router.push('/login');
},
resetLoginError({ commit }) {
commit("loginStop")
}
};
const getters = { const getters = {
getGroup: state => { getGroup: state => {
return state.user.group return state.user.group
}, },
group: state => { group: state => {
return state.user.group return state.user.group
}, },
getToken: state => { getToken: state => {
return state.user.accessToken return state.user.accessToken
}, },
token: state => { token: state => {
return state.user.accessToken return state.user.accessToken
}, },
loginError: state => { loginError: state => {
return state.loginError return state.loginError
} }
}; }
export default { export default {
state, state,
mutations, mutations,
actions, actions,
getters getters
}; }

47
src/views/BarView.vue
View File

@ -1,34 +1,29 @@
<template> <template>
<div> <div>
<TitleBar/> <TitleBar />
<v-content> <v-content>
<SearchBar/> <SearchBar />
<CreditLists></CreditLists> <CreditLists></CreditLists>
</v-content> </v-content>
</div> </div>
</template> </template>
<script> <script>
import TitleBar from "@/components/TitleBar"; import TitleBar from '@/components/TitleBar'
import CreditLists from "@/components/baruser/CreditLists"; import CreditLists from '@/components/baruser/CreditLists'
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
import axios from "axios"; import axios from 'axios'
import SearchBar from "../components/baruser/SearchBar"; import SearchBar from '../components/baruser/SearchBar'
export default { export default {
name: "BarView", name: 'BarView',
components: {SearchBar, CreditLists, TitleBar}, components: { SearchBar, CreditLists, TitleBar },
created() { created() {},
}, data() {
data () { return {}
return { },
} methods: {}
}, }
methods: {
}
}
</script> </script>
<style scoped> <style scoped>
</style> </style>

162
src/views/FinanzerView.vue
View File

@ -1,82 +1,100 @@
<template> <template>
<div> <div>
<TitleBar/> <TitleBar />
<v-navigation-drawer mini-variant expand-on-hover app clipped permanent overflow> <v-navigation-drawer mini-variant expand-on-hover app clipped permanent overflow>
<v-list> <v-list>
<v-list-item class="title" link @click="setActiveUser(activeUser)"> <v-list-item class="title" link @click="setActiveUser(activeUser)">
<v-list-item-icon> <v-list-item-icon>
<v-icon>home</v-icon> <v-icon>home</v-icon>
</v-list-item-icon> </v-list-item-icon>
<v-list-item-title> <v-list-item-title>Gesamtübersicht</v-list-item-title>
Gesamtübersicht </v-list-item>
</v-list-item-title> </v-list>
<v-divider />
</v-list-item> <v-list>
</v-list> <v-list-item
<v-divider/> v-for="user in users"
<v-list> v-bind:key="users.indexOf(user)"
<v-list-item v-for="user in users" v-bind:key="users.indexOf(user)" :class="user.username === activeUser.username ? 'v-list-item--highlighted' : ''" link @click="setActiveUser(user)"> :class="user.username === activeUser.username ? 'v-list-item--highlighted' : ''"
<v-list-item-title>{{user.lastname}}, {{user.firstname}}</v-list-item-title> link
</v-list-item> @click="setActiveUser(user)"
</v-list> >
<template v-slot:append> <v-list-item-title>{{user.lastname}}, {{user.firstname}}</v-list-item-title>
<v-list> </v-list-item>
<v-list-item> </v-list>
<v-list-item-icon><v-icon>search</v-icon></v-list-item-icon> <template v-slot:append>
<v-list-item-title> <v-list>
<v-autocomplete outlined return-object v-model="user" style="margin-top: 3px" <v-list-item>
placeholder="Suche Person" :items="allUsers" item-text="fullName" <v-list-item-icon>
prepend-inner-icon="search" full-width/> <v-icon>search</v-icon>
</v-list-item-title> </v-list-item-icon>
</v-list-item> <v-list-item-title>
<v-list-item> <v-autocomplete
<v-list-item-icon><v-icon>person_add</v-icon></v-list-item-icon> outlined
<v-list-item-title> return-object
<v-btn text block @click="addUser(user)">Hinzufügen</v-btn> v-model="user"
</v-list-item-title> style="margin-top: 3px"
</v-list-item> placeholder="Suche Person"
</v-list> :items="allUsers"
</template> item-text="fullName"
</v-navigation-drawer> prepend-inner-icon="search"
<v-content v-if="!activeUser.username"> full-width
<Overview/> />
</v-content> </v-list-item-title>
<v-content v-else> </v-list-item>
<User/> <v-list-item>
</v-content> <v-list-item-icon>
</div> <v-icon>person_add</v-icon>
</v-list-item-icon>
<v-list-item-title>
<v-btn text block @click="addUser(user)">Hinzufügen</v-btn>
</v-list-item-title>
</v-list-item>
</v-list>
</template>
</v-navigation-drawer>
<v-content v-if="!activeUser.username">
<Overview />
</v-content>
<v-content v-else>
<User />
</v-content>
</div>
</template> </template>
<script> <script>
import TitleBar from "@/components/TitleBar"; import TitleBar from '@/components/TitleBar'
import Overview from "../components/finanzer/Overview"; import Overview from '../components/finanzer/Overview'
import User from "../components/finanzer/User"; import User from '../components/finanzer/User'
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex'
import { mapActions } from 'vuex'; import { mapActions } from 'vuex'
export default { export default {
name: "FinanzerView", name: 'FinanzerView',
components: {User, Overview, TitleBar}, components: { User, Overview, TitleBar },
created() { created() {
this.getAllUsers() this.getAllUsers()
this.getUsers() this.getUsers()
}, },
data () { data() {
return { return {
user: null, user: null
}
},
methods: mapActions({ getAllUsers: 'finanzerUsers/getAllUsers',
setActiveUser: 'finanzerUsers/setActiveUser',
getUsers: 'finanzerUsers/getUsers',
finanzerUsers: 'finanzerUsers/addUser'}),
computed: mapGetters({users: 'finanzerUsers/users',
activeUser: 'finanzerUsers/activeUser',
allUsers: 'finanzerUsers/allUsers'})
} }
},
methods: mapActions({
getAllUsers: 'finanzerUsers/getAllUsers',
setActiveUser: 'finanzerUsers/setActiveUser',
getUsers: 'finanzerUsers/getUsers',
finanzerUsers: 'finanzerUsers/addUser'
}),
computed: mapGetters({
users: 'finanzerUsers/users',
activeUser: 'finanzerUsers/activeUser',
allUsers: 'finanzerUsers/allUsers'
})
}
</script> </script>
<style scoped> <style scoped>
</style> </style>

4
src/views/Home.vue
View File

@ -1,13 +1,13 @@
<template> <template>
<div> <div>
<TitleBar/> <TitleBar />
</div> </div>
</template> </template>
<script> <script>
// @ is an alias to /src // @ is an alias to /src
import TitleBar from "@/components/TitleBar"; import TitleBar from '@/components/TitleBar'
export default { export default {
name: 'home', name: 'home',
components: { components: {

137
src/views/Login.vue
View File

@ -1,86 +1,75 @@
<template> <template>
<div> <div>
<TitleBar/> <TitleBar />
<v-content> <v-content>
<v-container <v-container class="fill-height" fluid>
class="fill-height" <v-row align="center" justify="center">
fluid <v-col cols="12" sm="8" md="4">
> <v-card class="elevation-12">
<v-row <v-toolbar color="blue accent-4" dark flat>
align="center" <v-toolbar-title>Login form</v-toolbar-title>
justify="center" <v-spacer />
> </v-toolbar>
<v-col <v-card-text>
cols="12" <v-form>
sm="8" <v-text-field
md="4" label="Login"
> name="login"
<v-card class="elevation-12"> prepend-icon="person"
<v-toolbar type="text"
color="blue accent-4" v-model="username"
dark ref="first"
flat @keyup.enter="doLogin({username: username, password: password})"
> @input="resetLoginError"
<v-toolbar-title>Login form</v-toolbar-title> />
<v-spacer />
</v-toolbar>
<v-card-text>
<v-form >
<v-text-field
label="Login"
name="login"
prepend-icon="person"
type="text"
v-model="username"
ref="first"
@keyup.enter="doLogin({username: username, password: password})"
@input="resetLoginError"
/>
<v-text-field <v-text-field
id="password" id="password"
label="Password" label="Password"
name="password" name="password"
prepend-icon="lock" prepend-icon="lock"
type="password" type="password"
v-model="password" v-model="password"
@keyup.enter="doLogin({username: username, password: password})" @keyup.enter="doLogin({username: username, password: password})"
@input="resetLoginError" @input="resetLoginError"
/> />
</v-form> </v-form>
</v-card-text> </v-card-text>
<v-alert v-if="loginError" dense type="error">{{ loginError }}</v-alert> <v-alert v-if="loginError" dense type="error">{{ loginError }}</v-alert>
<v-card-actions> <v-card-actions>
<v-spacer /> <v-spacer />
<v-btn @click="doLogin({username: username, password: password})" @submit.prevent="doLogin({username: username, password: password})" color="primary">Login</v-btn> <v-btn
</v-card-actions> @click="doLogin({username: username, password: password})"
</v-card> @submit.prevent="doLogin({username: username, password: password})"
</v-col> color="primary"
</v-row> >Login</v-btn>
</v-container> </v-card-actions>
</v-card>
</v-col>
</v-row>
</v-container>
</v-content> </v-content>
</div> </div>
</template> </template>
<script> <script>
import TitleBar from "@/components/TitleBar"; import TitleBar from '@/components/TitleBar'
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
import { mapActions } from 'vuex'; import { mapActions } from 'vuex'
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex'
export default { export default {
name: "Login", name: 'Login',
components: {TitleBar}, components: { TitleBar },
data() { data() {
return { return {
username: null, username: null,
password: null password: null
}
},
methods: mapActions(['doLogin', 'resetLoginError']),
computed: mapGetters(['loginError'])
} }
},
methods: mapActions(['doLogin', 'resetLoginError']),
computed: mapGetters(['loginError'])
}
</script> </script>
<style scoped> <style scoped>
</style> </style>