kenmirrors/firefly-iii
1
0
Fork 0
mirror of https://github.com/firefly-iii/firefly-iii.git synced 2025-10-21 11:48:53 +00:00
Code Issues Projects Releases Wiki Activity

Basic new dashboard.

Browse Source
This commit is contained in:
James Cole
2020-07-05 18:29:58 +02:00
parent 4d4d91bf84
commit a56cefda7d
68 changed files with 1013 additions and 212 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
frontend/src/components/dashboard/MainPiggyList.vue
View File

@@ -21,19 +21,78 @@
<template>
<div class="card">
<div class="card-header">
<h3 class="card-title">I am a card</h3>
<h3 class="card-title">{{ $t('firefly.piggy_banks') }}</h3>
</div>
<div class="card-body">
<p>
I am card body
</p>
<div class="card-body table-responsive p-0">
<table class="table table-striped">
<thead>
<tr>
<th style="width:35%;">{{ $t('list.piggy_bank') }}</th>
<th style="width:40%;">{{ $t('list.percentage') }}</th>
<th style="width:25%;text-align: right;">{{ $t('list.amount') }}</th>
</tr>
</thead>
<tbody>
<tr v-for="piggy in this.piggy_banks">
<td>{{ piggy.attributes.name }}
<br /><small class="text-muted">{{ piggy.attributes.object_group_title }}</small>
</td>
<td>
<div class="progress-group">
<div class="progress progress-sm">
<div class="progress-bar primary" v-if="piggy.attributes.pct < 100" :style="{'width': piggy.attributes.pct + '%'}"></div>
<div class="progress-bar bg-success" v-if="100 === piggy.attributes.pct" :style="{'width': piggy.attributes.pct + '%'}"></div>
</div>
</div>
</td>
<td style="text-align: right;">
<span class="text-success">
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: piggy.attributes.currency_code}).format(piggy.attributes.current_amount) }}
</span>
of
<span class="text-success">{{ Intl.NumberFormat('en-US', {style: 'currency', currency: piggy.attributes.currency_code}).format(piggy.attributes.target_amount) }}</span>
</td>
</tr>
</tbody>
</table>
</div>
<div class="card-footer">
<a href="./piggy-banks" class="btn btn-default button-sm"><i class="far fa-money-bill-alt"></i> {{ $t('firefly.go_to_piggies') }}</a>
</div>
</div>
</template>
<script>
export default {
name: "MainPiggyList"
name: "MainPiggyList",
mounted() {
axios.get('./api/v1/piggy_banks')
.then(response => {
this.loadPiggyBanks(response.data.data);
}
);
},
methods: {
loadPiggyBanks(data) {
for (let key in data) {
if (data.hasOwnProperty(key) && /^0$|^[1-9]\d*$/.test(key) && key <= 4294967294) {
let piggy = data[key];
if(0.0 !== parseFloat(piggy.attributes.left_to_save)) {
piggy.attributes.pct = (parseFloat(piggy.attributes.current_amount) / parseFloat(piggy.attributes.target_amount)) * 100;
this.piggy_banks.push(piggy);
}
}
}
this.piggy_banks.sort(function(a, b) {
return b.attributes.pct - a.attributes.pct;
});
}
},
data() {
return {
piggy_banks: []
}
}
}
</script>