85 lines
2.3 KiB
Vue
85 lines
2.3 KiB
Vue
|
<template>
|
||
|
|
<div class="modal-card box box-modal">
|
||
|
|
<header class="box-modal-header is-spaced">
|
||
|
|
<div class="box-modal-title">{{ $parent.$t('account.modals.decryptInfo.title') }}</div>
|
||
|
|
<button type="button" class="delete" @click="$emit('close')" />
|
||
|
|
</header>
|
||
|
|
<div class="note">{{ $parent.$t('account.modals.decryptInfo.description') }}</div>
|
||
|
|
<div class="account-decrypt-info">
|
||
|
|
<div class="item">
|
||
|
|
{{ $parent.$t('account.modals.decryptInfo.spent') }}
|
||
|
|
<span class="has-text-weight-bold mr-3">{{ spent }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="item">
|
||
|
|
{{ $parent.$t('account.modals.decryptInfo.unSpent') }}
|
||
|
|
<span class="has-text-weight-bold mr-3">{{ unSpent }}</span>
|
||
|
|
</div>
|
||
|
|
<template v-for="(instances, currency) in getStatistic">
|
||
|
|
<div v-for="(amount, instance) in instances" :key="`${amount}_${currency}_${instance}`" class="item">
|
||
|
|
{{ instance }} {{ getSymbol(currency) }}:
|
||
|
|
<span class="has-text-weight-bold mr-3">{{ amount }}</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</div>
|
||
|
|
<div class="buttons buttons__halfwidth mt-3">
|
||
|
|
<b-button type="is-primary" outlined @click="onClose">
|
||
|
|
{{ $parent.$t('account.modals.decryptInfo.close') }}
|
||
|
|
</b-button>
|
||
|
|
<b-button type="is-primary" @click="handleRedirect">
|
||
|
|
{{ $parent.$t('account.modals.decryptInfo.redirect') }}
|
||
|
|
</b-button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { statisticComputed } from '../injectors'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
all: {
|
||
|
|
type: Number,
|
||
|
|
required: true
|
||
|
|
},
|
||
|
|
spent: {
|
||
|
|
type: Number,
|
||
|
|
required: true
|
||
|
|
},
|
||
|
|
unSpent: {
|
||
|
|
type: Number,
|
||
|
|
required: true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {}
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...statisticComputed,
|
||
|
|
getStatistic() {
|
||
|
|
const balance = this.statistic.reduce((acc, { currency, amount }) => {
|
||
|
|
if (acc[currency] && acc[currency][amount]) {
|
||
|
|
acc[currency][amount] += 1
|
||
|
|
} else {
|
||
|
|
acc[currency] = {
|
||
|
|
...acc[currency],
|
||
|
|
[amount]: 1
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return acc
|
||
|
|
}, {})
|
||
|
|
|
||
|
|
return balance
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
onClose() {
|
||
|
|
this.$emit('close')
|
||
|
|
},
|
||
|
|
handleRedirect() {
|
||
|
|
this.$router.push('/')
|
||
|
|
this.$emit('close')
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|