first useable site
barview and finanzerview bar : can add new person to geruecht finanzer: can see overview can see view for 1 person
This commit is contained in:
parent
9e32270f10
commit
3e081f2bb5
|
|
@ -1,6 +1,11 @@
|
|||
<template>
|
||||
<v-app>
|
||||
<router-view/>
|
||||
<v-footer
|
||||
app
|
||||
>
|
||||
<span class="px-4">© {{ new Date().getFullYear()}} Studentenclub Wu 5 e.v.</span>
|
||||
</v-footer>
|
||||
</v-app>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,10 @@
|
|||
</v-btn>
|
||||
<v-toolbar-title>WU5-Dashboard</v-toolbar-title>
|
||||
<v-spacer/>
|
||||
<v-btn icon v-if="isFinanzer">
|
||||
<v-btn icon v-if="isFinanzer" href="finanzer">
|
||||
<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>
|
||||
|
|
@ -26,8 +29,19 @@
|
|||
export default {
|
||||
name: "TitleBar",
|
||||
computed: {
|
||||
isBar() {
|
||||
try {
|
||||
return this.$store.getters.getGroup.includes('bar') ? true : false
|
||||
} catch (e) {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isFinanzer() {
|
||||
return this.$store.getters.getGroup === 'moneymaster' ? true : false
|
||||
try {
|
||||
return this.$store.getters.getGroup.includes('moneymaster') ? true : false
|
||||
} catch (e) {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isLoggedIn() {
|
||||
return this.$store.getters.getToken
|
||||
|
|
|
|||
|
|
@ -1,72 +1,68 @@
|
|||
<template>
|
||||
<v-content>
|
||||
<v-container v-for="user in users" :key="user.id">
|
||||
<v-card raised shaped>
|
||||
|
||||
<v-list-item three-line>
|
||||
<v-list-item-content>
|
||||
<div>
|
||||
<div v-for="user in users" :key="users.indexOf(user)">
|
||||
<v-container>
|
||||
<v-card>
|
||||
<v-list-item>
|
||||
<v-list-item-title class="title">{{user.firstname}} {{user.lastname}}</v-list-item-title>
|
||||
<v-row>
|
||||
<v-spacer/>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-container>
|
||||
<v-btn @click="addAmount(user.username, 200)" :color="color">2 €</v-btn>
|
||||
</v-container>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-container>
|
||||
<v-btn @click="addAmount(user.username, 100)" :color="color">1 €</v-btn>
|
||||
</v-container>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-container>
|
||||
<v-btn @click="addAmount(user.username, 50)" :color="color">0,50 €</v-btn>
|
||||
</v-container>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-container>
|
||||
<v-btn @click="addAmount(user.username, 40)" :color="color">0,40 €</v-btn>
|
||||
</v-container>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-container>
|
||||
<v-btn @click="addAmount(user.username, 20)" :color="color">0,20 €</v-btn>
|
||||
</v-container>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-container>
|
||||
<v-btn @click="addAmount(user.username, 10)" :color="color">0,10 €</v-btn>
|
||||
</v-container>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-col align-self="center">
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-container>
|
||||
<v-list-item-action-text :class="getColor(user.type)">{{(user.amount/100).toFixed(2)}} €</v-list-item-action-text>
|
||||
</v-container>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col cols="10">
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-btn class="creditBtn" block @click="addAmount(user.username, 200)"
|
||||
:color="color">2 €
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn class="creditBtn" block @click="addAmount(user.username, 100)"
|
||||
:color="color">1 €
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn class="creditBtn" block @click="addAmount(user.username, 50)"
|
||||
:color="color">
|
||||
0,50 €
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-btn class="creditBtn" block @click="addAmount(user.username, 40)"
|
||||
:color="color">
|
||||
0,40 €
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn class="creditBtn" block @click="addAmount(user.username, 20)"
|
||||
:color="color">
|
||||
0,20 €
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn class="creditBtn" block @click="addAmount(user.username, 10)"
|
||||
:color="color">
|
||||
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-card-text>
|
||||
</v-card>
|
||||
</v-container>
|
||||
</v-content>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -97,5 +93,7 @@
|
|||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.creditBtn {
|
||||
margin: 2px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,68 @@
|
|||
<template>
|
||||
<div>
|
||||
<v-toolbar>
|
||||
<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-btn text @click="addUser">Hinzufügen</v-btn>
|
||||
</v-toolbar-items>
|
||||
</v-toolbar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import httpClient from "../../plugins/restService";
|
||||
|
||||
export default {
|
||||
name: "SearchBar",
|
||||
props: {
|
||||
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
hover: false,
|
||||
focus: false,
|
||||
item_size: 32,
|
||||
searchString: '',
|
||||
test: [],
|
||||
allUsers: [],
|
||||
user: null,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.hasFocus()
|
||||
},
|
||||
methods : {
|
||||
mop () {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log("user: ", this.user)
|
||||
},
|
||||
hasFocus () {
|
||||
httpClient.searchUser(this.$store.getters.getToken, {searchString: this.searchString})
|
||||
.then(response => {
|
||||
// eslint-disable-next-line no-console
|
||||
//console.log(response.data)
|
||||
this.allUsers = response.data
|
||||
|
||||
for (let i = 0; i < this.allUsers.length; i++) {
|
||||
this.allUsers[i].fullName = this.allUsers[i].firstname + " " + this.allUsers[i].lastname
|
||||
}
|
||||
// eslint-disable-next-line no-console
|
||||
console.log("all users 2: ", this.allUsers)
|
||||
})
|
||||
},
|
||||
addUser() {
|
||||
this.$emit("add:creditList", this.user)
|
||||
this.user = null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -1,16 +1,207 @@
|
|||
<template>
|
||||
<v-data-table></v-data-table>
|
||||
<div>
|
||||
<v-toolbar tile>
|
||||
<v-toolbar-title>Gesamtübersicht</v-toolbar-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-toolbar-items>
|
||||
<v-btn text icon @click="year--"><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="year++" :disabled="isActualYear"><v-icon>keyboard_arrow_right</v-icon></v-btn>
|
||||
</v-toolbar-items>
|
||||
<v-spacer></v-spacer>
|
||||
<v-toolbar-items>
|
||||
<v-text-field v-model="filter" @input="filterUser" style="margin-top: 3px" append-icon="search" outlined></v-text-field>
|
||||
</v-toolbar-items>
|
||||
</v-toolbar>
|
||||
<div v-for="user in filteredUsers" :key="filteredUsers.indexOf(user)">
|
||||
<v-card v-if="user.creditList[year]"
|
||||
style="margin-top: 3px">
|
||||
<v-card-title>{{user.lastname}}, {{user.firstname}}</v-card-title>
|
||||
<Table v-bind:user="user" v-bind:year="year"/>
|
||||
<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-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-row>
|
||||
</v-container>
|
||||
</v-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Table from "./Table";
|
||||
export default {
|
||||
name: "Overview",
|
||||
components: {Table},
|
||||
props: {
|
||||
year: null
|
||||
users: Array,
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
|
||||
year: new Date().getFullYear(),
|
||||
filter: "",
|
||||
filteredUsers: [],
|
||||
|
||||
amount: null,
|
||||
isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.',
|
||||
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'}
|
||||
],
|
||||
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.createYears();
|
||||
this.filteredUsers = this.users
|
||||
|
||||
},
|
||||
methods: {
|
||||
getLastColor (value) {
|
||||
return value < 0 ? 'red' : 'green'
|
||||
},
|
||||
getAllSum(sum, lastYear) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(sum, lastYear)
|
||||
return lastYear + sum
|
||||
},
|
||||
createYears() {
|
||||
for (let year = 2000; year <= new Date().getFullYear(); year++) {
|
||||
this.years.push({value: year, text: year})
|
||||
}
|
||||
},
|
||||
setExpand(user) {
|
||||
user.expand ? user.expand=false : user.expand=true
|
||||
},
|
||||
isExpand(value) {
|
||||
return value ? 'rotate' : ''
|
||||
},
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
add(user) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(this.selectedYear.value, this.type.value, this.selectedMonth.value)
|
||||
if (this.type.value === 'amount') {
|
||||
this.$emit("add:amount", {user: user, amount: this.amount, year: this.selectedYear, month: this.selectedMonth})
|
||||
}
|
||||
if (this.type.value === 'credit') {
|
||||
this.$emit("add:credit", {user: user, 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()]}
|
||||
},
|
||||
filterUser() {
|
||||
if (this.filter === "") {
|
||||
this.filteredUsers = this.users
|
||||
}
|
||||
this.filteredUsers = [...this.filteredUsers.filter(user => {
|
||||
return user.firstname.toLowerCase().includes(this.filter.toLowerCase()) || user.lastname.toLowerCase().includes(this.filter.toLowerCase())
|
||||
})]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isActualYear() {
|
||||
return this.year === new Date().getFullYear()
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.rotate {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,118 @@
|
|||
<template>
|
||||
<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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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 /
|
||||
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>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Table",
|
||||
props: {
|
||||
user: Object,
|
||||
year: Number,
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
headers: [
|
||||
{
|
||||
text: 'Schulden / Guthpaben',
|
||||
align: 'left',
|
||||
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'}
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getColor (item, value) {
|
||||
if (item.type === 'Summe') {
|
||||
return value < 0 ? 'red' : 'green'
|
||||
}
|
||||
return item.type === 'Guthaben' ? 'green' : 'red'
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
<template>
|
||||
<div>
|
||||
<v-toolbar tile>
|
||||
<v-toolbar-title>{{user.lastname}}, {{user.firstname}}</v-toolbar-title>
|
||||
</v-toolbar>
|
||||
<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="user" 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(user.creditList[year][1].last)">
|
||||
{{(user.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(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-container>
|
||||
</v-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Table from "./Table";
|
||||
export default {
|
||||
name: "User",
|
||||
components: {Table},
|
||||
props: {
|
||||
user: Object,
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
years: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.createYears()
|
||||
},
|
||||
methods: {
|
||||
createYears() {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(this.user.creditList)
|
||||
for (let year in this.user.creditList) {
|
||||
// eslint-disable-next-line no-console
|
||||
this.years.unshift(parseInt(year))
|
||||
}
|
||||
},
|
||||
getLastColor (value) {
|
||||
return value < 0 ? 'red' : 'green'
|
||||
},
|
||||
getAllSum(sum, lastYear) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(sum, lastYear)
|
||||
return lastYear + sum
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -19,8 +19,22 @@ class Service {
|
|||
console.log("addAmountdata: ", data)
|
||||
return axios.post(this.url+'baradd', {...data}, {headers: {Token: token}})
|
||||
}
|
||||
addAmountFinanzer(token, data) {
|
||||
return axios.post(this.url+'finanzerAddAmount', {...data}, {headers: {Token: token}})
|
||||
}
|
||||
addCreditFinanzer(token, data) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log('data', data)
|
||||
return axios.post(this.url+'finanzerAddCredit', {...data}, {headers: {Token: token}})
|
||||
}
|
||||
searchUser(token, data) {
|
||||
return axios.post(this.url+'search', {...data}, {headers: {Token: token}})
|
||||
}
|
||||
getAllUser(token) {
|
||||
return axios.get(this.url+'barGetUsers', {headers: {Token: token}})
|
||||
}
|
||||
}
|
||||
|
||||
const httpClient = new Service("http://192.168.5.118:5000/")
|
||||
const httpClient = new Service("http://localhost:5000/")
|
||||
|
||||
export default httpClient
|
||||
|
|
|
|||
|
|
@ -41,14 +41,30 @@ const router = new VueRouter({
|
|||
|
||||
router.beforeEach((to, from, next) => {
|
||||
store.dispatch('fetchAccessToken');
|
||||
let sites = ['/finanzer', '/bar']
|
||||
if (sites.includes(to.fullPath)) {
|
||||
if (to.fullPath === '/finanzer') {
|
||||
if (!store.state.user.group.includes('moneymaster')) {
|
||||
next('/login')
|
||||
}
|
||||
}
|
||||
if (to.fullPath === '/bar') {
|
||||
if (!store.state.user.group.includes('bar')) {
|
||||
next('/login')
|
||||
}
|
||||
}
|
||||
if (!store.state.user.accessToken) {
|
||||
next('/login')
|
||||
}
|
||||
}
|
||||
if (to.fullPath === '/login') {
|
||||
if (store.state.user.accessToken) {
|
||||
if (store.state.user.group.includes('moneymaster')) {
|
||||
next('/finanzer')
|
||||
} else if (store.state.user.group.includes('bar')) {
|
||||
next('/bar')
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
next();
|
||||
|
|
|
|||
|
|
@ -56,10 +56,10 @@ export default new Vuex.Store({
|
|||
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 (this.state.user.group === 'moneymaster') {
|
||||
if (this.state.user.group.includes('moneymaster')) {
|
||||
router.push('/finanzer');
|
||||
}
|
||||
if (this.state.user.group === 'bar') {
|
||||
else if (this.state.user.group.includes('bar')) {
|
||||
router.push('/bar')
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,7 +1,10 @@
|
|||
<template>
|
||||
<div>
|
||||
<TitleBar/>
|
||||
<v-content>
|
||||
<SearchBar @add:creditList="addCreditList"/>
|
||||
<CreditLists v-bind:users="users" @add:amount="addAmount"></CreditLists>
|
||||
</v-content>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -11,9 +14,10 @@
|
|||
import httpClient from "../plugins/restService";
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
import axios from "axios";
|
||||
import SearchBar from "../components/baruser/SearchBar";
|
||||
export default {
|
||||
name: "BarView",
|
||||
components: {CreditLists, TitleBar},
|
||||
components: {SearchBar, CreditLists, TitleBar},
|
||||
created() {
|
||||
this.getUser()
|
||||
},
|
||||
|
|
@ -48,6 +52,11 @@
|
|||
this.$store.dispatch("logout")
|
||||
this.users = []
|
||||
})
|
||||
this.users = this.users.sort((a,b) => {
|
||||
if (a.username > b.username) return 1
|
||||
if (a.username < b.username) return -1
|
||||
return 0
|
||||
})
|
||||
},
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
addAmount(username, amount) {
|
||||
|
|
@ -64,6 +73,23 @@
|
|||
})
|
||||
user.amount = response.data.amount
|
||||
})
|
||||
},
|
||||
addCreditList(user) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log('addCreditlist: ', user)
|
||||
if (!this.users.find(user1 => {
|
||||
return user1.username === user.username
|
||||
})) {
|
||||
const lastId = this.users.length > 0 ? this.users[this.users.length - 1].id : 0
|
||||
this.users.push({
|
||||
id: lastId + 1,
|
||||
username: user.username,
|
||||
firstname: user.firstname,
|
||||
lastname: user.lastname,
|
||||
amount: 0,
|
||||
type: null
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,15 +1,30 @@
|
|||
<template>
|
||||
<div>
|
||||
<TitleBar/>
|
||||
<v-navigation-drawer permanent width="auto" app clipped class="elevation-2">
|
||||
<v-container>
|
||||
<h1 v-for="user in users" v-bind:key="user.id">{{user.firstname}} {{user.lastname}}</h1>
|
||||
</v-container>
|
||||
</v-navigation-drawer>
|
||||
<v-content>
|
||||
<v-container>
|
||||
<v-navigation-drawer mini-variant expand-on-hover app clipped permanent overflow>
|
||||
<v-list>
|
||||
<v-list-item class="title" link @click="test(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-container>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
<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="test(user)">
|
||||
<v-list-item-title>{{user.lastname}}, {{user.firstname}}</v-list-item-title>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-navigation-drawer>
|
||||
<v-content v-if="!activeUser.username">
|
||||
<Overview v-bind:users="users" @add:amount="addAmount" @add:credit="addCredit"/>
|
||||
</v-content>
|
||||
<v-content v-else>
|
||||
<User v-bind:user="activeUser"/>
|
||||
</v-content>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -17,19 +32,33 @@
|
|||
<script>
|
||||
import TitleBar from "@/components/TitleBar";
|
||||
import httpClient from "../plugins/restService";
|
||||
import Overview from "../components/finanzer/Overview";
|
||||
import User from "../components/finanzer/User";
|
||||
|
||||
export default {
|
||||
name: "FinanzerView",
|
||||
components: {TitleBar},
|
||||
components: {User, Overview, TitleBar},
|
||||
created() {
|
||||
this.getUser()
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
users: [],
|
||||
activeUser: {
|
||||
username: null,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
test (e) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log("event: ", e)
|
||||
if (this.activeUser.username === e.username) {
|
||||
this.activeUser = {username: null}
|
||||
} else {
|
||||
this.activeUser = {...e}
|
||||
}
|
||||
},
|
||||
getUser() {
|
||||
httpClient.getFinanzerMain(this.$store.getters.getToken)
|
||||
.then(response => {
|
||||
|
|
@ -39,11 +68,76 @@
|
|||
// eslint-disable-next-line no-console
|
||||
console.log("user: ", user)
|
||||
const lastId = this.users.length > 0 ? this.users[this.users.length - 1].id : 0
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
let list = {}
|
||||
for (let creditList in response.data[user]['creditList']) {
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
// eslint-disable-next-line no-console
|
||||
console.log('creditList: ', creditList, response.data[user]['creditList'])
|
||||
let amount = {
|
||||
type:'Schulden',
|
||||
jan_amount: 0 - response.data[user]['creditList'][creditList].jan.depts,
|
||||
feb_amount: 0 - response.data[user]['creditList'][creditList].feb.depts,
|
||||
maer_amount: 0 - response.data[user]['creditList'][creditList].maer.depts,
|
||||
apr_amount:0 - response.data[user]['creditList'][creditList].apr.depts,
|
||||
mai_amount: 0 - response.data[user]['creditList'][creditList].mai.depts,
|
||||
jun_amount: 0 - response.data[user]['creditList'][creditList].jun.depts,
|
||||
jul_amount: 0 - response.data[user]['creditList'][creditList].jul.depts,
|
||||
aug_amount: 0 - response.data[user]['creditList'][creditList].aug.depts,
|
||||
sep_amount: 0 - response.data[user]['creditList'][creditList].sep.depts,
|
||||
okt_amount: 0 - response.data[user]['creditList'][creditList].okt.depts,
|
||||
nov_amount: 0 - response.data[user]['creditList'][creditList].nov.depts,
|
||||
dez_amount: 0 - response.data[user]['creditList'][creditList].dez.depts,
|
||||
last: 0 - response.data[user]['creditList'][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
|
||||
|
||||
let credit = {
|
||||
type:'Guthaben',
|
||||
jan_amount: response.data[user]['creditList'][creditList].jan.credit,
|
||||
feb_amount: response.data[user]['creditList'][creditList].feb.credit,
|
||||
maer_amount: response.data[user]['creditList'][creditList].maer.credit,
|
||||
apr_amount:response.data[user]['creditList'][creditList].apr.credit,
|
||||
mai_amount:response.data[user]['creditList'][creditList].mai.credit,
|
||||
jun_amount:response.data[user]['creditList'][creditList].jun.credit,
|
||||
jul_amount:response.data[user]['creditList'][creditList].jul.credit,
|
||||
aug_amount:response.data[user]['creditList'][creditList].aug.credit,
|
||||
sep_amount:response.data[user]['creditList'][creditList].sep.credit,
|
||||
okt_amount:response.data[user]['creditList'][creditList].okt.credit,
|
||||
nov_amount:response.data[user]['creditList'][creditList].nov.credit,
|
||||
dez_amount:response.data[user]['creditList'][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
|
||||
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
|
||||
|
||||
list[creditList] = [{...credit}, {...amount}, {...sum}]
|
||||
// eslint-disable-next-line no-console
|
||||
console.log("creditList list:", creditList, list)
|
||||
}
|
||||
this.users.push({
|
||||
id: lastId + 1,
|
||||
username: response.data[user].username,
|
||||
firstname: response.data[user].firstname,
|
||||
lastname: response.data[user].lastname
|
||||
lastname: response.data[user].lastname,
|
||||
creditList: list,
|
||||
expand: false,
|
||||
active: false
|
||||
})
|
||||
}})
|
||||
.catch(error => {
|
||||
|
|
@ -51,10 +145,29 @@
|
|||
console.log("error: ", error.response.data.error)
|
||||
})
|
||||
|
||||
this.users = this.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("this.users: ", this.users)
|
||||
},
|
||||
addAmount(data) {
|
||||
httpClient.addAmountFinanzer(this.$store.getters.getToken, {userId: data.user.username, amount: data.amount * 100, year: data.year, month: data.month})
|
||||
},
|
||||
addCredit(data) {
|
||||
|
||||
httpClient.addCreditFinanzer(this.$store.getters.getToken, {userId: data.user.username, credit: data.credit * 100, year: data.year, month: data.month})
|
||||
},
|
||||
deactivateAllUser() {
|
||||
for (let user in this.users) {
|
||||
user.active = false
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue