56 lines
1.2 KiB
Vue
56 lines
1.2 KiB
Vue
|
<template>
|
||
|
<li class="mb-1 fw-semibold">
|
||
|
<div class="d-flex align-items-center">
|
||
|
<i class="fas fa-fw fa-credit-card me-1" /> {{ header }}
|
||
|
<span :class="{'ms-auto': true, 'text-danger': sum < 0}">
|
||
|
{{ formatNumber(sum) }} €
|
||
|
</span>
|
||
|
</div>
|
||
|
<ul class="btn-toggle-nav list-unstyled fw-normal pb-1 ps-3 small">
|
||
|
<li>
|
||
|
<router-link
|
||
|
v-for="acc in accounts"
|
||
|
:key="acc.id"
|
||
|
class="d-flex align-items-center text-white text-decoration-none"
|
||
|
:to="{ name: 'account-transactions', params: { accountId: acc.id }}"
|
||
|
>
|
||
|
{{ acc.name }}
|
||
|
<span :class="{'ms-auto': true, 'text-danger': acc.balance < 0}">
|
||
|
{{ formatNumber(acc.balance) }} €
|
||
|
</span>
|
||
|
</router-link>
|
||
|
</li>
|
||
|
</ul>
|
||
|
</li>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { formatNumber } from '../helpers'
|
||
|
|
||
|
export default {
|
||
|
computed: {
|
||
|
sum() {
|
||
|
return this.accounts.reduce((sum, acc) => sum + acc.balance, 0)
|
||
|
},
|
||
|
},
|
||
|
|
||
|
methods: {
|
||
|
formatNumber,
|
||
|
},
|
||
|
|
||
|
name: 'AccountingAppAccountSidebarAccountList',
|
||
|
|
||
|
props: {
|
||
|
accounts: {
|
||
|
required: true,
|
||
|
type: Array,
|
||
|
},
|
||
|
|
||
|
header: {
|
||
|
required: true,
|
||
|
type: String,
|
||
|
},
|
||
|
},
|
||
|
}
|
||
|
</script>
|