gh-mirrors/firefly-iii
1
0
Fork 0
mirror of https://github.com/firefly-iii/firefly-iii.git synced 2025-12-20 02:01:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update frontend v2

Browse Source
This commit is contained in:
James Cole
2020-11-08 14:15:53 +01:00
parent 0f32761ae8
commit 006da9ebbc
36 changed files with 341 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
frontend/src/components/accounts/Index.vue
View File

@@ -19,15 +19,119 @@
-->
<template>
<div>
<router-view></router-view>
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="card">
<div class="card-header">
<h3 class="card-title">Title thing</h3>
<div class="card-tools">
<div class="input-group input-group-sm" style="width: 150px;">
<input type="text" name="table_search" class="form-control float-right" placeholder="Search">
<div class="input-group-append">
<button type="submit" class="btn btn-default">
<i class="fas fa-search"></i>
</button>
</div>
</div>
</div>
</div>
<div class="card-body p-0">
<table class="table table-sm table-striped">
<caption style="display:none;">{{ $t('list.name') }}</caption>
<thead>
<tr>
<th scope="col">&nbsp;</th>
<th scope="col">{{ $t('list.name') }}</th>
<th scope="col" v-if="'asset' === $props.accountTypes">{{ $t('list.role') }}</th>
<th scope="col">{{ $t('list.iban') }}</th>
<th scope="col" style="text-align: right;">{{ $t('list.currentBalance') }}</th>
<th scope="col">{{ $t('list.balanceDiff') }}</th>
</tr>
</thead>
<tbody>
<tr v-for="account in accounts">
<td>
<div class="btn-group btn-group-xs">
<a :href="'./accounts/edit/' + account.id" class="btn btn-xs btn-default"><i class="fa fas fa-pencil-alt"></i></a>
<a :href="'./accounts/delete/' + account.id" class="btn btn-xs btn-danger"><i class="fa far fa-trash"></i></a>
</div>
</td>
<td>{{ account.attributes.name }}
<!--
<router-link :to="{ name: 'accounts.show', params: { id: account.id }}"
:title="account.attributes.name">{{ account.attributes.name }}
</router-link>
-->
</td>
<td v-if="'asset' === $props.accountTypes">
{{ account.attributes.account_role }}
</td>
<td>
{{ account.attributes.iban }}
</td>
<td style="text-align: right;">
{{
Intl.NumberFormat('en-US', {
style: 'currency', currency:
account.attributes.currency_code
}).format(account.attributes.current_balance)
}}
</td>
<td>diff</td>
</tr>
</tbody>
</table>
</div>
<div class="card-footer">
Footer stuff.
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "Index"
export default {
name: "Index",
props: {
accountTypes: String
},
data() {
return {
accounts: []
}
},
mounted() {
console.log('mounted account list.');
axios.get('./api/v1/accounts?type=' + this.$props.accountTypes)
.then(response => {
this.loadAccounts(response.data.data);
}
);
},
methods: {
loadAccounts(data) {
for (let key in data) {
if (data.hasOwnProperty(key) && /^0$|^[1-9]\d*$/.test(key) && key <= 4294967294) {
let acct = data[key];
// some conversions here.
if ('asset' === acct.attributes.type && null !== acct.attributes.account_role) {
acct.attributes.account_role = this.$t('firefly.account_role_' + acct.attributes.account_role);
}
if ('asset' === acct.attributes.type && null === acct.attributes.account_role) {
acct.attributes.account_role = this.$t('firefly.Default asset account');
}
if (null === acct.attributes.iban) {
acct.attributes.iban = acct.attributes.account_number;
}
this.accounts.push(acct);
}
}
},
}
}
</script>
<style scoped>