133 lines
3.4 KiB
Vue
133 lines
3.4 KiB
Vue
|
<template>
|
||
|
|
<v-container v-if="user">
|
||
|
|
<v-card>
|
||
|
|
<v-list-item>
|
||
|
|
<v-list-item-title class="title"
|
||
|
|
>{{ user.firstname }} {{ user.lastname }}</v-list-item-title
|
||
|
|
>
|
||
|
|
</v-list-item>
|
||
|
|
<v-card-text>
|
||
|
|
<v-row>
|
||
|
|
<v-col cols="10">
|
||
|
|
<v-row>
|
||
|
|
<v-col>
|
||
|
|
<v-btn
|
||
|
|
class="creditBtn"
|
||
|
|
block
|
||
|
|
@click="addAmount(200)"
|
||
|
|
:color="color"
|
||
|
|
:disabled="user.locked"
|
||
|
|
>2 €</v-btn
|
||
|
|
>
|
||
|
|
</v-col>
|
||
|
|
<v-col>
|
||
|
|
<v-btn
|
||
|
|
class="creditBtn"
|
||
|
|
block
|
||
|
|
@click="addAmount(100)"
|
||
|
|
:color="color"
|
||
|
|
:disabled="user.locked"
|
||
|
|
>1 €</v-btn
|
||
|
|
>
|
||
|
|
</v-col>
|
||
|
|
<v-col>
|
||
|
|
<v-btn
|
||
|
|
class="creditBtn"
|
||
|
|
block
|
||
|
|
@click="addAmount(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(40)"
|
||
|
|
:color="color"
|
||
|
|
:disabled="user.locked"
|
||
|
|
>0,40 €</v-btn
|
||
|
|
>
|
||
|
|
</v-col>
|
||
|
|
<v-col>
|
||
|
|
<v-btn
|
||
|
|
class="creditBtn"
|
||
|
|
block
|
||
|
|
@click="addAmount(20)"
|
||
|
|
:color="color"
|
||
|
|
:disabled="user.locked"
|
||
|
|
>0,20 €</v-btn
|
||
|
|
>
|
||
|
|
</v-col>
|
||
|
|
<v-col>
|
||
|
|
<v-btn
|
||
|
|
class="creditBtn"
|
||
|
|
block
|
||
|
|
@click="addAmount(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(getAllSum())"
|
||
|
|
>{{
|
||
|
|
(getAllSum() / 100).toFixed(2)
|
||
|
|
}}
|
||
|
|
€</v-list-item-action-text
|
||
|
|
>
|
||
|
|
</v-list-item>
|
||
|
|
</v-row>
|
||
|
|
</v-col>
|
||
|
|
</v-row>
|
||
|
|
<v-alert v-if="user.locked" type="error"
|
||
|
|
>{{ user.firstname }} darf nicht mehr anschreiben.
|
||
|
|
{{ user.firstname }} sollte sich lieber mal beim Finanzer
|
||
|
|
melden.</v-alert
|
||
|
|
>
|
||
|
|
</v-card-text>
|
||
|
|
</v-card>
|
||
|
|
</v-container>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import {mapGetters, mapActions} from 'vuex'
|
||
|
|
export default {
|
||
|
|
name: 'AddAmount',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
color: 'green accent-4'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
...mapActions({
|
||
|
|
addAmount: 'user/addAmount'
|
||
|
|
}),
|
||
|
|
getColor(value) {
|
||
|
|
return value >= 0 ? 'title green--text' : 'title red--text'
|
||
|
|
},
|
||
|
|
getAllSum() {
|
||
|
|
console.log("getAllSum", this.user)
|
||
|
|
if (this.user)
|
||
|
|
return this.user.creditList[this.year][2].sum + this.user.creditList[this.year][1].last
|
||
|
|
return 0
|
||
|
|
}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapGetters({
|
||
|
|
user: 'user/user',
|
||
|
|
year: 'user/year'
|
||
|
|
}),
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped></style>
|