35 lines
860 B
Vue
35 lines
860 B
Vue
|
<template>
|
||
|
|
<q-card style="text-align: center;">
|
||
|
|
<q-card-section>
|
||
|
|
<div class="text-h6">Gerücht: {{ balance.toFixed(2) }} €</div>
|
||
|
|
</q-card-section>
|
||
|
|
</q-card>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts">
|
||
|
|
import { computed, defineComponent, onBeforeMount } from '@vue/composition-api';
|
||
|
|
import { BalanceInterface } from 'src/plugins/balance/store/balance';
|
||
|
|
import { Store } from 'vuex';
|
||
|
|
|
||
|
|
export default defineComponent({
|
||
|
|
name: 'BalanceWidget',
|
||
|
|
setup(_, { root }) {
|
||
|
|
onBeforeMount(() => {
|
||
|
|
store.dispatch('balance/getBalance').catch(err => {
|
||
|
|
console.warn(err);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
const store: Store<{ balance: BalanceInterface }> = <
|
||
|
|
Store<{ balance: BalanceInterface }>
|
||
|
|
>root.$store;
|
||
|
|
|
||
|
|
const balance = computed<number>(() => {
|
||
|
|
return store.state.balance.balance;
|
||
|
|
});
|
||
|
|
|
||
|
|
return { balance };
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|