flaschengeist-frontend/src/views/FinanzerView.vue

<template>
        <div>
            <TitleBar/>
            <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-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>

<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: {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}
                }
            },
            createAmount(creditList) {
                let amount = {
                    type:'Schulden',
                    jan_amount: 0 - creditList.jan.depts,
                    feb_amount: 0 - creditList.feb.depts,
                    maer_amount: 0 - creditList.maer.depts,
                    apr_amount:0 - creditList.apr.depts,
                    mai_amount: 0 - creditList.mai.depts,
                    jun_amount: 0 - creditList.jun.depts,
                    jul_amount: 0 - creditList.jul.depts,
                    aug_amount: 0 - creditList.aug.depts,
                    sep_amount: 0 - creditList.sep.depts,
                    okt_amount: 0 - creditList.okt.depts,
                    nov_amount: 0 - creditList.nov.depts,
                    dez_amount: 0 - creditList.dez.depts,
                    last: 0 - creditList['last']
                }

                amount.sum = amount.jan_amount + amount.feb_amount + amount.maer_amount + amount.apr_amount + amount.mai_amount + amount.jun_amount + amount.jul_amount + amount.aug_amount + amount.sep_amount + amount.okt_amount + amount.nov_amount + amount.dez_amount
                return amount
            },
            createCredit(creditList) {
                let credit = {
                    type:'Guthaben',
                    jan_amount: creditList.jan.credit,
                    feb_amount: creditList.feb.credit,
                    maer_amount: creditList.maer.credit,
                    apr_amount: creditList.apr.credit,
                    mai_amount: creditList.mai.credit,
                    jun_amount: creditList.jun.credit,
                    jul_amount: creditList.jul.credit,
                    aug_amount: creditList.aug.credit,
                    sep_amount: creditList.sep.credit,
                    okt_amount: creditList.okt.credit,
                    nov_amount: creditList.nov.credit,
                    dez_amount: creditList.dez.credit
                }
                credit.sum = credit.jan_amount + credit.feb_amount + credit.maer_amount + credit.apr_amount + credit.mai_amount + credit.jun_amount + credit.jul_amount + credit.aug_amount + credit.sep_amount + credit.okt_amount + credit.nov_amount + credit.dez_amount
                return credit
            },
            createSum(credit, amount) {
                let sum = {
                    type:'Summe',
                    jan_amount: credit.jan_amount + amount.jan_amount,
                    feb_amount: credit.feb_amount + amount.feb_amount,
                    maer_amount: credit.maer_amount + amount.maer_amount,
                    apr_amount: credit.apr_amount + amount.apr_amount,
                    mai_amount: credit.mai_amount + amount.mai_amount,
                    jun_amount: credit.jun_amount + amount.jun_amount,
                    jul_amount: credit.jul_amount + amount.jul_amount,
                    aug_amount: credit.aug_amount + amount.aug_amount,
                    sep_amount: credit.sep_amount + amount.sep_amount,
                    okt_amount: credit.okt_amount + amount.okt_amount,
                    nov_amount: credit.nov_amount + amount.nov_amount,
                    dez_amount: credit.dez_amount + amount.dez_amount,
                }
                sum.sum = sum.jan_amount + sum.feb_amount + sum.maer_amount + sum.apr_amount + sum.mai_amount + sum.jun_amount + sum.jul_amount + sum.aug_amount + sum.sep_amount + sum.okt_amount + sum.nov_amount + sum.dez_amount
                return sum
            },
            getUser() {
                httpClient.getFinanzerMain(this.$store.getters.getToken)
                .then(response => {
                    // eslint-disable-next-line no-console
                    console.log("ich bin hier. response: ", response.data)
                    for (let user in response.data) {
                        // 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 = this.createAmount(response.data[user]['creditList'][creditList])
                            let credit = this.createCredit(response.data[user]['creditList'][creditList])
                            let sum = this.createSum(credit, 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,
                            creditList: list,
                            expand: false,
                            active: false
                        })
                    }})
                    .catch(error => {
                        if (error.response) {
                            if (error.response.status == 401) {
                                this.$store.dispatch('logout')
                            }
                        }
                        this.users = []
                    })

                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})
                .then(response => {
                    // eslint-disable-next-line no-console
                    console.log(response.data)

                    let user = this.users.find(user => {return user.username === data.user.username})
                    let index = this.users.indexOf(user)
                    let list = {}
                    for (let creditList in response.data) {
                        // eslint-disable-next-line no-unused-vars
                        // eslint-disable-next-line no-console
                        console.log('creditList: ', creditList, response.data[creditList])

                        let amount = this.createAmount(response.data[creditList])
                        let credit = this.createCredit(response.data[creditList])
                        let sum = this.createSum(credit, amount)
                        list[creditList] = [{...credit}, {...amount}, {...sum}]
                        // eslint-disable-next-line no-console
                        console.log("creditList list:", creditList, list)
                    }
                    this.users[index].creditList = list
                })
                .catch(error => {
                    if (error.response) {
                        if (error.response.status == 401) {
                            this.$store.dispatch('logout')
                        }
                    }
                    this.users = []
                })
            },
            addCredit(data) {

                httpClient.addCreditFinanzer(this.$store.getters.getToken, {userId: data.user.username, credit: data.credit * 100, year: data.year, month: data.month})
                .then(response => {
                    // eslint-disable-next-line no-console
                    console.log(response.data)

                    let user = this.users.find(user => {return user.username === data.user.username})
                    let index = this.users.indexOf(user)
                    let list = {}
                    for (let creditList in response.data) {
                        // eslint-disable-next-line no-unused-vars
                        // eslint-disable-next-line no-console
                        console.log('creditList: ', creditList, response.data[creditList])

                        let amount = this.createAmount(response.data[creditList])
                        let credit = this.createCredit(response.data[creditList])
                        let sum = this.createSum(credit, amount)
                        list[creditList] = [{...credit}, {...amount}, {...sum}]
                        // eslint-disable-next-line no-console
                        console.log("creditList list:", creditList, list)
                    }
                    this.users[index].creditList = list
                })
                .catch(error => {
                    if (error.response) {
                        if (error.response.status == 401) {
                            this.$store.dispatch('logout')
                        }
                    }
                    this.users = []
                })
            },
            deactivateAllUser() {
                for (let user in this.users) {
                    user.active = false
                }
            }

        }
    }
</script>

<style scoped>

</style>