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

28
src/components/TitleBar.vue
View File

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

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

@ -11,54 +11,77 @@
<v-col cols="10">
<v-row>
<v-col>
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 200})"
:color="color" :disabled="user.locked">2 €
</v-btn>
<v-btn
class="creditBtn"
block
@click="addAmount({username: user.username, amount: 200})"
:color="color"
:disabled="user.locked"
>2 €</v-btn>
</v-col>
<v-col>
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 100})"
:color="color" :disabled="user.locked">1 €
</v-btn>
<v-btn
class="creditBtn"
block
@click="addAmount({username: user.username, amount: 100})"
:color="color"
:disabled="user.locked"
>1 €</v-btn>
</v-col>
<v-col>
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 50})"
:color="color" :disabled="user.locked">
0,50 €
</v-btn>
<v-btn
class="creditBtn"
block
@click="addAmount({username: user.username, amount: 50})"
:color="color"
:disabled="user.locked"
>0,50 €</v-btn>
</v-col>
</v-row>
<v-row>
<v-col>
<v-btn class="creditBtn" block @click="addAmount({username:user.username, amount: 40})"
:color="color" :disabled="user.locked">
0,40 €
</v-btn>
<v-btn
class="creditBtn"
block
@click="addAmount({username:user.username, amount: 40})"
:color="color"
:disabled="user.locked"
>0,40 €</v-btn>
</v-col>
<v-col>
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 20})"
:color="color" :disabled="user.locked">
0,20 €
</v-btn>
<v-btn
class="creditBtn"
block
@click="addAmount({username: user.username, amount: 20})"
:color="color"
:disabled="user.locked"
>0,20 €</v-btn>
</v-col>
<v-col>
<v-btn class="creditBtn" block @click="addAmount({username: user.username, amount: 10})"
:color="color" :disabled="user.locked">
0,10 €
</v-btn>
<v-btn
class="creditBtn"
block
@click="addAmount({username: user.username, amount: 10})"
: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-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-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>
@ -67,16 +90,14 @@
</template>
<script>
import { mapGetters, mapActions } from 'vuex';
import { mapGetters, mapActions } from 'vuex'
export default {
name: "CreditLists",
props: {
},
data () {
export default {
name: 'CreditLists',
props: {},
data() {
return {
color: 'green accent-4',
color: 'green accent-4'
}
},
created() {
@ -92,16 +113,15 @@
getColor(type) {
return type === 'credit' ? 'title green--text' : 'title red--text'
}
},
computed: {
...mapGetters({users: 'barUsers/users'})
}
...mapGetters({ users: 'barUsers/users' })
}
}
</script>
<style scoped>
.creditBtn {
.creditBtn {
margin: 2px;
}
}
</style>

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

@ -1,11 +1,19 @@
<template>
<div>
<v-toolbar>
<v-spacer/>
<v-spacer />
<v-toolbar-items>
<v-autocomplete outlined return-object v-model="user" style="margin-top: 3px"
placeholder="Suche Person" :items="allUsers" item-text="fullName"
prepend-inner-icon="search" full-width/>
<v-autocomplete
outlined
return-object
v-model="user"
style="margin-top: 3px"
placeholder="Suche Person"
: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>
@ -13,23 +21,20 @@
</template>
<script>
import { mapGetters, mapActions } from 'vuex';
import { mapGetters, mapActions } from 'vuex'
export default {
name: "SearchBar",
props: {
},
data () {
export default {
name: 'SearchBar',
props: {},
data() {
return {
user: null,
user: null
}
},
created() {
this.getAllUsers()
},
methods : {
methods: {
...mapActions({
getAllUsers: 'barUsers/getAllUsers',
addCreditList: 'barUsers/addCreditList'
@ -40,11 +45,10 @@
}
},
computed: {
...mapGetters({ allUsers: 'barUsers/allUsers'}),
}
...mapGetters({ allUsers: 'barUsers/allUsers' })
}
}
</script>
<style scoped>
</style>

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

@ -2,13 +2,19 @@
<div>
<v-toolbar tile>
<v-toolbar-title>Gesamtübersicht</v-toolbar-title>
<v-spacer/>
<v-spacer />
<v-toolbar-items>
<v-btn text icon @click="countYear(false)"><v-icon>keyboard_arrow_left</v-icon></v-btn>
<v-list-item><v-list-item-title class="title">{{year}}</v-list-item-title></v-list-item>
<v-btn text icon @click="countYear(true)" :disabled="isActualYear"><v-icon>keyboard_arrow_right</v-icon></v-btn>
<v-btn text icon @click="countYear(false)">
<v-icon>keyboard_arrow_left</v-icon>
</v-btn>
<v-list-item>
<v-list-item-title class="title">{{year}}</v-list-item-title>
</v-list-item>
<v-btn text icon @click="countYear(true)" :disabled="isActualYear">
<v-icon>keyboard_arrow_right</v-icon>
</v-btn>
</v-toolbar-items>
<v-spacer/>
<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>
@ -17,28 +23,32 @@
<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-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>
<div v-show="errorExpand">
<v-alert v-for="error in errorMails" :key="errorMails.indexOf(error)"
<v-alert
v-for="error in errorMails"
:key="errorMails.indexOf(error)"
dense
:type="computeError(error.error)"
>{{errorMessage(error)}}
</v-alert>
>{{errorMessage(error)}}</v-alert>
</div>
</v-expand-transition>
</v-card>
</v-expand-transition>
<div v-for="user in users" :key="users.indexOf(user)">
<v-card v-if="user.creditList[year] && isFiltered(user)"
style="margin-top: 3px">
<v-card v-if="user.creditList[year] && isFiltered(user)" style="margin-top: 3px">
<v-card-title>{{user.lastname}}, {{user.firstname}}</v-card-title>
<Table v-bind:user="user" v-bind:year="year"/>
<Table v-bind:user="user" v-bind:year="year" />
<v-container fluid>
<v-row align="start" align-content="start">
<v-col>
@ -47,9 +57,10 @@
<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-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>
@ -57,8 +68,11 @@
<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))">
<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>
@ -68,16 +82,19 @@
<v-col align-self="center">
<v-row>
<v-col>
<v-label>Status: </v-label>
<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-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-spacer />
<v-btn text icon style="margin-right: 5px" @click="setExpand(user)">
<v-icon :class="isExpand(user.expand)" dense>$expand</v-icon>
</v-btn>
@ -87,25 +104,39 @@
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-text-field :rules="[isNumber]" label="Betrag"
v-model="amount"></v-text-field>
<v-text-field :rules="[isNumber]" label="Betrag" v-model="amount"></v-text-field>
</v-col>
<v-col>
<v-select return-object v-model="type" label="Typ"
<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>
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-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-select
return-object
v-model="selectedMonth"
label="Monat"
:items="months"
item-text="text"
item-value="value"
></v-select>
</v-col>
</v-row>
</v-form>
@ -122,50 +153,66 @@
</template>
<script>
import Table from "./Table";
import { mapGetters, mapActions } from 'vuex'
export default {
name: "Overview",
components: {Table},
props: {
},
data () {
import Table from './Table'
import { mapGetters, mapActions } from 'vuex'
export default {
name: 'Overview',
components: { Table },
props: {},
data() {
return {
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()]}
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',
...mapActions({
createYears: 'finanzerUsers/createYears',
addAmount: 'finanzerUsers/addAmount',
addCredit: 'finanzerUsers/addCredit',
countYear: 'finanzerUsers/countYear',
sendMails: 'finanzerUsers/sendMails'}),
sendMails: 'finanzerUsers/sendMails'
}),
async getData(promise) {
return await promise
},
getLastColor (value) {
getLastColor(value) {
return value < 0 ? 'red' : 'green'
},
getAllSum(sum, lastYear) {
return lastYear + sum
},
getLockedColor (value) {
getLockedColor(value) {
return value ? 'red' : 'green'
},
computeError(error) {
@ -173,11 +220,25 @@
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.'
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
user.expand ? (user.expand = false) : (user.expand = true)
},
isExpand(value) {
return value ? 'rotate' : ''
@ -185,43 +246,78 @@
// 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})
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.addCredit({
user: user,
credit: this.amount,
year: this.selectedYear.value,
month: this.selectedMonth.value
})
}
this.createDefault(this.amount, this.type, this.selectedYear, this.selectedMonth)
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())
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()]}
},
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',
...mapGetters({
users: 'finanzerUsers/users',
errorMails: 'finanzerUsers/errorMails',
year: 'finanzerUsers/year',
years: 'finanzerUsers/years',
months: 'finanzerUsers/months'})
}
months: 'finanzerUsers/months'
})
}
}
</script>
<style scoped>
.rotate {
.rotate {
transform: rotate(180deg);
}
}
</style>

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

@ -1,66 +1,74 @@
<template>
<v-data-table
dense
:headers="headers"
:items="user.creditList[year]"
:hide-default-footer="true">
<v-data-table dense :headers="headers" :items="user.creditList[year]" :hide-default-footer="true">
<template v-slot:item.jan_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.jan_amount)">{{(item.jan_amount /
<v-chip outlined :text-color="getColor(item, item.jan_amount)">
{{(item.jan_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.feb_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.feb_amount)">{{(item.feb_amount /
<v-chip outlined :text-color="getColor(item, item.feb_amount)">
{{(item.feb_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.maer_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.maer_amount)">{{(item.maer_amount /
<v-chip outlined :text-color="getColor(item, item.maer_amount)">
{{(item.maer_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.apr_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.apr_amount)">{{(item.apr_amount /
<v-chip outlined :text-color="getColor(item, item.apr_amount)">
{{(item.apr_amount /
100).toFixed(2)}}
</v-chip>
</template>
<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)">
{{(item.mai_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.jun_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.jun_amount)">{{(item.jun_amount /
<v-chip outlined :text-color="getColor(item, item.jun_amount)">
{{(item.jun_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.jul_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.jul_amount)">{{(item.jul_amount /
<v-chip outlined :text-color="getColor(item, item.jul_amount)">
{{(item.jul_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.aug_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.aug_amount)">{{(item.aug_amount /
<v-chip outlined :text-color="getColor(item, item.aug_amount)">
{{(item.aug_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.sep_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.sep_amount)">{{(item.sep_amount /
<v-chip outlined :text-color="getColor(item, item.sep_amount)">
{{(item.sep_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.okt_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.okt_amount)">{{(item.okt_amount /
<v-chip outlined :text-color="getColor(item, item.okt_amount)">
{{(item.okt_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.nov_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.nov_amount)">{{(item.nov_amount /
<v-chip outlined :text-color="getColor(item, item.nov_amount)">
{{(item.nov_amount /
100).toFixed(2)}}
</v-chip>
</template>
<template v-slot:item.dez_amount="{ item }">
<v-chip outlined :text-color="getColor(item, item.dez_amount)">{{(item.dez_amount /
<v-chip outlined :text-color="getColor(item, item.dez_amount)">
{{(item.dez_amount /
100).toFixed(2)}}
</v-chip>
</template>
@ -71,13 +79,13 @@
</template>
<script>
export default {
name: "Table",
export default {
name: 'Table',
props: {
user: Object,
year: Number,
year: Number
},
data () {
data() {
return {
headers: [
{
@ -86,33 +94,32 @@
sortable: false,
value: 'type'
},
{text: 'Januar in EUR', value: 'jan_amount'},
{text: 'Februar in EUR', value: 'feb_amount'},
{text: 'März in EUR', value: 'maer_amount'},
{text: 'April in EUR', value: 'apr_amount'},
{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'}
],
{ text: 'Januar in EUR', value: 'jan_amount' },
{ text: 'Februar in EUR', value: 'feb_amount' },
{ text: 'März in EUR', value: 'maer_amount' },
{ text: 'April in EUR', value: 'apr_amount' },
{ 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) {
getColor(item, value) {
if (item.type === 'Summe') {
return value < 0 ? 'red' : 'green'
}
return item.type === 'Guthaben' ? 'green' : 'red'
},
}
}
}
</script>
<style scoped>
</style>

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

@ -2,16 +2,14 @@
<div>
<v-toolbar tile>
<v-toolbar-title>{{activeUser.lastname}}, {{activeUser.firstname}}</v-toolbar-title>
<v-spacer/>
<v-spacer />
<v-toolbar-items>
<v-btn @click="sendMail({username: activeUser.username})" text>Email senden</v-btn>
</v-toolbar-items>
</v-toolbar>
<v-expand-transition>
<v-card style="margin-top: 3px" v-show="errorMail">
<v-alert dense :type="computeError(errorMail)">
{{errorMessage(errorMail)}}
</v-alert>
<v-alert dense :type="computeError(errorMail)">{{errorMessage(errorMail)}}</v-alert>
</v-card>
</v-expand-transition>
<v-card style="margin-top: 3px;">
@ -20,27 +18,45 @@
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-label>Status: </v-label>
<v-label>Status:</v-label>
</v-col>
<v-col>
<v-chip outlined :text-color="getLockedColor(activeUser.locked)">{{activeUser.locked ? 'Gesperrt': 'nicht Gesperrt'}}</v-chip>
<v-chip
outlined
:text-color="getLockedColor(activeUser.locked)"
>{{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-btn
@click="doLock({user: activeUser, locked: !activeUser.locked})"
>{{activeUser.locked ? 'Entperren' : 'Sperren'}}</v-btn>
</v-col>
</v-row>
<v-divider style="margin-bottom: 15px;"/>
<v-divider style="margin-bottom: 15px;" />
<v-row>
<v-col>
<v-text-field :rules="[isNumber]" label="Betrag des Sperrlimits in € (EURO)" v-model="limit"></v-text-field>
<v-text-field
:rules="[isNumber]"
label="Betrag des Sperrlimits in € (EURO)"
v-model="limit"
></v-text-field>
</v-col>
<v-col>
<v-select return-object v-model="autoLock" label="Automatische Sperre" :items="[{value: true, text: 'Aktiviert'}, {value: false, text: 'Deaktiviert'}]"
item-text="text" item-value="value"/>
<v-select
return-object
v-model="autoLock"
label="Automatische Sperre"
:items="[{value: true, text: 'Aktiviert'}, {value: false, text: 'Deaktiviert'}]"
item-text="text"
item-value="value"
/>
</v-col>
</v-row>
<v-row>
<v-btn block @click="saveConfig({user: activeUser, limit: limit, autoLock: autoLock.value})">Speichern</v-btn>
<v-btn
block
@click="saveConfig({user: activeUser, limit: limit, autoLock: autoLock.value})"
>Speichern</v-btn>
</v-row>
</v-form>
</v-card-text>
@ -51,25 +67,39 @@
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-text-field :rules="[isNumber]" label="Betrag"
v-model="amount"></v-text-field>
<v-text-field :rules="[isNumber]" label="Betrag" v-model="amount"></v-text-field>
</v-col>
<v-col>
<v-select return-object v-model="type" label="Typ"
<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>
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="selectYears" item-text="text"
item-value="value"></v-select>
<v-select
return-object
v-model="selectedYear"
label="Jahr"
:items="selectYears"
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-select
return-object
v-model="selectedMonth"
label="Monat"
:items="months"
item-text="text"
item-value="value"
></v-select>
</v-col>
</v-row>
</v-form>
@ -79,7 +109,7 @@
<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"/>
<Table v-bind:user="activeUser" v-bind:year="year" />
<v-container fluid>
<v-col>
<v-row>
@ -87,16 +117,20 @@
<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-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))">
<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>
@ -110,28 +144,47 @@
</template>
<script>
import Table from "./Table";
import {mapGetters, mapActions} from 'vuex';
export default {
name: "User",
components: {Table},
data () {
import Table from './Table'
import { mapGetters, mapActions } from 'vuex'
export default {
name: 'User',
components: { Table },
data() {
return {
isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.',
limit: null,
autoLock: null,
amount: null,
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()]}
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() {
this.limit = (this.activeUser.limit / 100).toFixed(2)
this.autoLock = {value: this.activeUser.autoLock, text: this.activeUser.autoLock? "Aktiviert" : "Deaktiviert"}
this.autoLock = {
value: this.activeUser.autoLock,
text: this.activeUser.autoLock ? 'Aktiviert' : 'Deaktiviert'
}
},
methods: {
...mapActions({
@ -139,26 +192,36 @@
addCredit: 'finanzerUsers/addCredit',
sendMail: 'finanzerUsers/sendMail',
doLock: 'finanzerUsers/doLock',
saveConfig: 'finanzerUsers/saveConfig'}),
getLastColor (value) {
saveConfig: 'finanzerUsers/saveConfig'
}),
getLastColor(value) {
return value < 0 ? 'red' : 'green'
},
getAllSum(sum, lastYear) {
return lastYear + sum
},
getLockedColor (value) {
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})
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.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
@ -166,11 +229,28 @@
// 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()]}
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) {
@ -180,8 +260,22 @@
},
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.'
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.'
)
}
}
},
@ -193,20 +287,24 @@
}
return years
},
...mapGetters({activeUser: 'finanzerUsers/activeUser',
...mapGetters({
activeUser: 'finanzerUsers/activeUser',
errorMail: 'finanzerUsers/errorMail',
months: 'finanzerUsers/months',
selectYears: 'finanzerUsers/selectYears'})
selectYears: 'finanzerUsers/selectYears'
})
},
watch: {
activeUser(newVal) {
this.limit = (newVal.limit / 100).toFixed(2)
this.autoLock = {value: newVal.autoLock, text: newVal.autoLock? "Aktiviert" : "Deaktiviert"}
this.autoLock = {
value: newVal.autoLock,
text: newVal.autoLock ? 'Aktiviert' : 'Deaktiviert'
}
}
}
}
</script>
<style scoped>
</style>

6
src/plugins/routes.js
View File

@ -1,4 +1,4 @@
const main = 'http://192.168.5.118:5000/';
const main = 'http://192.168.5.118:5000/'
const url = {
login: main + 'login',
@ -15,6 +15,6 @@ const url = {
finanzerAddUser: main + 'finanzerAddUser',
finanzerSendAllMail: main + 'finanzerSendAllMail',
finanzerSendOneMail: main + 'finanzerSendOneMail'
};
}
export default url;
export default url

10
src/plugins/vuetify.js
View File

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

33
src/router/index.js
View File

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

8
src/store/index.js
View File

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

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

@ -1,17 +1,18 @@
import axios from 'axios';
import url from '@/plugins/routes';
import axios from 'axios'
import url from '@/plugins/routes'
const state = {
users: [],
allUsers: []
};
}
const mutations = {
setAllUsers: (state, users) => {
state.allUsers = []
state.allUsers = users
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) => {
@ -20,7 +21,9 @@ const mutations = {
for (let user in users) {
// eslint-disable-next-line no-console
console.log(user)
let existuser = state.users.find(a => {return user === a.username})
let existuser = state.users.find(a => {
return user === a.username
})
if (existuser) {
existuser.sername = users[user].username
@ -44,67 +47,87 @@ const mutations = {
console.log(state.users)
mutations.sortUsers(state)
},
sortUsers: (state) => {
state.users = state.users.sort((a,b) => {
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 = {
// eslint-disable-next-line no-unused-vars
async getUsers({commit, rootState, dispatch}) {
async getUsers({ commit, rootState, dispatch }) {
try {
const response = await axios.get(url.bar, {headers: {Token: rootState.login.user.accessToken}})
const response = await axios.get(url.bar, {
headers: { Token: rootState.login.user.accessToken }
})
// eslint-disable-next-line no-console
console.log(response.data)
commit('setUsers', response.data)
} catch (e) {
if (e.response) if (e.response.status === 401) dispatch('logout', null, {root: true})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async addAmount({commit, rootState, dispatch}, data) {
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})
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})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async addCreditList({commit, rootState, dispatch}, data) {
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})
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})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async getAllUsers({commit, rootState, dispatch}) {
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}})
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})
if (e.response)
if (e.response.data === 401) dispatch('logout', null, { root: true })
}
}
};
}
const getters = {
users: (state) => { return state.users },
allUsers: (state) => { return state.allUsers }
};
users: state => {
return state.users
},
allUsers: state => {
return state.allUsers
}
}
export default {
namespaced: true,

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

@ -1,11 +1,11 @@
import axios from 'axios';
import axios from 'axios'
// eslint-disable-next-line no-unused-vars
import url from '@/plugins/routes'
const state = {
users: [],
activeUser: {
username: null,
username: null
},
allUsers: [],
user: null,
@ -14,32 +14,33 @@ const state = {
year: new Date().getFullYear(),
years: [],
months: [
{value: 1, text: 'Januar'},
{value: 2, text: 'Februar'},
{value: 3, text: 'März'},
{value: 4, text:'April'},
{value: 5, text: 'Mai'},
{value: 6, text: 'Juni'},
{value: 7, text: 'Juli'},
{value: 8, text: 'August'},
{value: 9, text: 'September'},
{value: 10, text: 'Oktober'},
{value: 11, text: 'November'},
{value: 12, text: 'Dezember'}
],
};
{ value: 1, text: 'Januar' },
{ value: 2, text: 'Februar' },
{ value: 3, text: 'März' },
{ value: 4, text: 'April' },
{ value: 5, text: 'Mai' },
{ value: 6, text: 'Juni' },
{ value: 7, text: 'Juli' },
{ value: 8, text: 'August' },
{ value: 9, text: 'September' },
{ value: 10, text: 'Oktober' },
{ value: 11, text: 'November' },
{ value: 12, text: 'Dezember' }
]
}
const mutations = {
setAllUsers: (state, users) => {
state.allUsers = []
state.allUsers = users
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}
state.activeUser = { username: null }
} else {
state.activeUser = user
}
@ -53,13 +54,19 @@ const mutations = {
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 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}]
list[creditList] = [{ ...credit }, { ...amount }, { ...sum }]
}
let existUser = state.users.find(a => {return a.username === user})
let existUser = state.users.find(a => {
return a.username === user
})
// eslint-disable-next-line no-console
console.log(existUser)
@ -91,11 +98,11 @@ const mutations = {
},
createAmount(creditList) {
let amount = {
type:'Schulden',
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,
apr_amount: 0 - creditList.apr.depts,
mai_amount: 0 - creditList.mai.depts,
jun_amount: 0 - creditList.jun.depts,
jul_amount: 0 - creditList.jul.depts,
@ -107,12 +114,24 @@ const mutations = {
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
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',
type: 'Guthaben',
jan_amount: creditList.jan.credit,
feb_amount: creditList.feb.credit,
maer_amount: creditList.maer.credit,
@ -126,12 +145,24 @@ const mutations = {
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
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',
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,
@ -143,13 +174,25 @@ const mutations = {
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,
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
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) => {
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
@ -158,14 +201,18 @@ const mutations = {
})
},
updateUsers: (state, data) => {
let index = state.users.indexOf(state.users.find(a => {return a.username === data.username}))
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}]
list[creditList] = [{ ...credit }, { ...amount }, { ...sum }]
}
state.users[index].creditList = list
}
@ -179,128 +226,213 @@ const mutations = {
setMail: (state, data) => {
state.errorMail = data
},
setYears: (state) => {
setYears: state => {
for (let year = new Date().getFullYear(); year >= 2000; year--) {
state.years.push({value: year, text: year})
state.years.push({ value: year, text: year })
}
},
setYear: (state, value) => {
if(value) state.year++
if (value) state.year++
else state.year--
}
};
}
const actions = {
// eslint-disable-next-line no-unused-vars
async getAllUsers({commit, rootState, dispatch}) {
async getAllUsers({ commit, rootState, dispatch }) {
// eslint-disable-next-line no-console
console.log(rootState)
try {
const response = await axios.post(url.searchUser, {searchString: ""}, {headers: {Token: rootState.login.user.accessToken}})
const response = await axios.post(
url.searchUser,
{ searchString: '' },
{ headers: { Token: rootState.login.user.accessToken } }
)
commit('setAllUsers', response.data)
} catch (err) {
// eslint-disable-next-line no-console
if (err.response) if (err.response.status === 401) dispatch('logout', null, {root: true})
if (err.response)
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
},
async getUsers({commit, rootState, dispatch}) {
async getUsers({ commit, rootState, dispatch }) {
try {
const response = await axios.get(url.getFinanzerMain, {headers: {Token: rootState.login.user.accessToken}})
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})
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) {
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}
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})
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})
if (err.response)
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
},
async addCredit({commit, rootState, dispatch}, data) {
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}
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})
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})
if (err.response)
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
},
async doLock({commit, rootState, dispatch}, data) {
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}})
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})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async saveConfig({commit, rootState, dispatch}, data) {
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}})
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})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async addUser({commit, rootState, dispatch}, data) {
async addUser({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(url.finanzerAddUser, {userId: data.username}, {headers: {Token: rootState.login.user.accessToken}})
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})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async sendMails({commit, rootState, dispatch}) {
async sendMails({ commit, rootState, dispatch }) {
try {
const response = await axios.get(url.finanzerSendAllMail, {headers: {Token: rootState.login.user.accessToken}})
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})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
async sendMail({commit, rootState, dispatch}, data) {
async sendMail({ commit, rootState, dispatch }, data) {
try {
const response = await axios.post(url.finanzerSendOneMail, {userId: data.username}, {headers: {Token: rootState.login.user.accessToken}})
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})
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
},
createYears({commit}) {
createYears({ commit }) {
commit('setYears')
return 'hallo'
},
countYear({commit}, value) {
countYear({ commit }, value) {
commit('setYear', value)
}
};
}
const getters = {
users: state => { return state.users },
activeUser: state => { return state.activeUser },
allUsers: state => { return state.allUsers },
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},
};
users: state => {
return state.users
},
activeUser: state => {
return state.activeUser
},
allUsers: state => {
return state.allUsers
},
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 {
namespaced: true,

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

@ -1,5 +1,5 @@
import axios from 'axios';
import router from "@/router";
import axios from 'axios'
import router from '@/router'
import url from '@/plugins/routes'
const state = {
@ -10,67 +10,76 @@ const state = {
},
loggingIn: false,
loginError: null
};
}
const mutations = {
loginStart: state => state.loggingIn = true,
loginStop (state, errorMessage){
state.loggingIn = false;
state.loginError = errorMessage;
loginStart: state => (state.loggingIn = true),
loginStop(state, errorMessage) {
state.loggingIn = false
state.loginError = errorMessage
},
updateAccessToken (state, data) {
if (typeof(data) === typeof("")) {
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;
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;
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;
logout(state) {
state.user.accessToken = null
state.user.username = null
state.user.group = null
}
};
}
const actions = {
async doLogin({ commit }, loginData) {
commit('loginStart');
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);
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('/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})
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');
localStorage.removeItem('user')
commit('logout')
router.push('/login')
},
resetLoginError({ commit }) {
commit("loginStop")
commit('loginStop')
}
};
}
const getters = {
getGroup: state => {
@ -88,11 +97,11 @@ const getters = {
loginError: state => {
return state.loginError
}
};
}
export default {
state,
mutations,
actions,
getters
};
}

35
src/views/BarView.vue
View File

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

80
src/views/FinanzerView.vue
View File

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

4
src/views/Home.vue
View File

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

49
src/views/Login.vue
View File

@ -1,31 +1,17 @@
<template>
<div>
<TitleBar/>
<TitleBar />
<v-content>
<v-container
class="fill-height"
fluid
>
<v-row
align="center"
justify="center"
>
<v-col
cols="12"
sm="8"
md="4"
>
<v-container class="fill-height" fluid>
<v-row align="center" justify="center">
<v-col cols="12" sm="8" md="4">
<v-card class="elevation-12">
<v-toolbar
color="blue accent-4"
dark
flat
>
<v-toolbar color="blue accent-4" dark flat>
<v-toolbar-title>Login form</v-toolbar-title>
<v-spacer />
</v-toolbar>
<v-card-text>
<v-form >
<v-form>
<v-text-field
label="Login"
name="login"
@ -52,7 +38,11 @@
<v-alert v-if="loginError" dense type="error">{{ loginError }}</v-alert>
<v-card-actions>
<v-spacer />
<v-btn @click="doLogin({username: username, password: password})" @submit.prevent="doLogin({username: username, password: password})" color="primary">Login</v-btn>
<v-btn
@click="doLogin({username: username, password: password})"
@submit.prevent="doLogin({username: username, password: password})"
color="primary"
>Login</v-btn>
</v-card-actions>
</v-card>
</v-col>
@ -63,13 +53,13 @@
</template>
<script>
import TitleBar from "@/components/TitleBar";
// eslint-disable-next-line no-unused-vars
import { mapActions } from 'vuex';
import { mapGetters } from 'vuex';
export default {
name: "Login",
components: {TitleBar},
import TitleBar from '@/components/TitleBar'
// eslint-disable-next-line no-unused-vars
import { mapActions } from 'vuex'
import { mapGetters } from 'vuex'
export default {
name: 'Login',
components: { TitleBar },
data() {
return {
username: null,
@ -78,9 +68,8 @@
},
methods: mapActions(['doLogin', 'resetLoginError']),
computed: mapGetters(['loginError'])
}
}
</script>
<style scoped>
</style>