kenmirrors/firefly-iii
1
0
Fork 0
mirror of https://github.com/firefly-iii/firefly-iii.git synced 2025-10-09 22:26:04 +00:00
Code Issues Projects Releases Wiki Activity

Partial impl for #5142

Browse Source
This commit is contained in:
James Cole
2021-10-02 14:57:20 +02:00
parent eaeb1f99c6
commit 1a1ff2dc44
3 changed files with 112 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
frontend/src/components/bills/Index.vue
View File

@@ -22,7 +22,8 @@
<div> <div>
<div class="row"> <div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<a href="./subscriptions/create" class="btn btn-sm mb-2 float-right btn-success"><span class="fas fa-plus"></span> {{ $t('firefly.create_new_bill') <a href="./subscriptions/create" class="btn btn-sm mb-2 float-right btn-success"><span class="fas fa-plus"></span> {{
$t('firefly.create_new_bill')
}}</a> }}</a>
<button @click="newCacheKey" class="btn btn-sm mb-2 mr-2 float-right btn-info"><span class="fas fa-sync"></span></button> <button @click="newCacheKey" class="btn btn-sm mb-2 mr-2 float-right btn-info"><span class="fas fa-sync"></span></button>
</div> </div>
@@ -49,7 +50,7 @@
<small v-if="true === data.item.active && 0 === data.item.skip">{{ $t('firefly.bill_repeats_' + data.item.repeat_freq) }}</small> <small v-if="true === data.item.active && 0 === data.item.skip">{{ $t('firefly.bill_repeats_' + data.item.repeat_freq) }}</small>
<small v-if="true === data.item.active && 1 === data.item.skip">{{ $t('firefly.bill_repeats_' + data.item.repeat_freq + '_other') }}</small> <small v-if="true === data.item.active && 1 === data.item.skip">{{ $t('firefly.bill_repeats_' + data.item.repeat_freq + '_other') }}</small>
<small v-if="true === data.item.active && data.item.skip > 1">{{ <small v-if="true === data.item.active && data.item.skip > 1">{{
$t('firefly.bill_repeats_' + data.item.repeat_freq + '_skip', {skip: data.item.skip + 1}) $t('firefly.bill_repeats_' + data.item.repeat_freq + '_skip', {skip: data.item.skip + 1})
}}</small> }}</small>
<small v-if="false === data.item.active">{{ $t('firefly.inactive') }}</small> <small v-if="false === data.item.active">{{ $t('firefly.inactive') }}</small>
<!-- (rules, recurring) --> <!-- (rules, recurring) -->
@@ -114,11 +115,13 @@
<span v-if="null !== data.item.extension_date"><br/> <span v-if="null !== data.item.extension_date"><br/>
<small> <small>
{{ {{
$t('firefly.extension_date_is', {date: new Intl.DateTimeFormat(locale, { $t('firefly.extension_date_is', {
date: new Intl.DateTimeFormat(locale, {
year: 'numeric', year: 'numeric',
month: 'long', month: 'long',
day: 'numeric' day: 'numeric'
}).format(new Date(data.item.extension_date.substring(0, 10)))}) }).format(new Date(data.item.extension_date.substring(0, 10)))
})
}} }}
</small> </small>
</span> </span>
@@ -126,8 +129,8 @@
</template> </template>
<template #cell(amount)="data"> <template #cell(amount)="data">
~ <span class="text-info">{{ ~ <span class="text-info">{{
Intl.NumberFormat(locale, {style: 'currency', currency: data.item.currency_code}).format((data.item.amount_min + data.item.amount_max) / 2) Intl.NumberFormat(locale, {style: 'currency', currency: data.item.currency_code}).format((data.item.amount_min + data.item.amount_max) / 2)
}} }}
</span> </span>
</template> </template>
<template #cell(payment_info)="data"> <template #cell(payment_info)="data">
@@ -166,10 +169,10 @@
</button> </button>
<div class="dropdown-menu" :aria-labelledby="'dropdownMenuButton' + data.item.id"> <div class="dropdown-menu" :aria-labelledby="'dropdownMenuButton' + data.item.id">
<a class="dropdown-item" :href="'./subscriptions/edit/' + data.item.id"><span class="fa fas fa-pencil-alt"></span> {{ <a class="dropdown-item" :href="'./subscriptions/edit/' + data.item.id"><span class="fa fas fa-pencil-alt"></span> {{
$t('firefly.edit') $t('firefly.edit')
}}</a> }}</a>
<a class="dropdown-item" :href="'./subscriptions/delete/' + data.item.id"><span class="fa far fa-trash"></span> {{ <a class="dropdown-item" :href="'./subscriptions/delete/' + data.item.id"><span class="fa far fa-trash"></span> {{
$t('firefly.delete') $t('firefly.delete')
}}</a> }}</a>
</div> </div>
</div> </div>
@@ -182,7 +185,8 @@
</div> </div>
<div class="row"> <div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<a href="./subscriptions/create" class="btn btn-sm mt-2 float-right btn-success"><span class="fas fa-plus"></span> {{ $t('firefly.create_new_bill') <a href="./subscriptions/create" class="btn btn-sm mt-2 float-right btn-success"><span class="fas fa-plus"></span> {{
$t('firefly.create_new_bill')
}}</a> }}</a>
<button @click="newCacheKey" class="btn btn-sm mt-2 mr-2 float-right btn-info"><span class="fas fa-sync"></span></button> <button @click="newCacheKey" class="btn btn-sm mt-2 mr-2 float-right btn-info"><span class="fas fa-sync"></span></button>
</div> </div>
@@ -206,18 +210,29 @@ export default {
locale: 'en-US', locale: 'en-US',
sortedGroups: [], sortedGroups: [],
fields: [], fields: [],
fnsLocale: null fnsLocale: null,
ready: false
} }
}, },
watch: {
start: function () {
this.downloadBills(1);
},
end: function () {
this.downloadBills(1);
},
},
computed: { computed: {
...mapGetters('root', ['cacheKey']), ...mapGetters('root', ['listPageSize', 'cacheKey']),
...mapGetters('dashboard/index', ['start', 'end',]),
'indexReady': function () {
return null !== this.start && null !== this.end && null !== this.listPageSize && this.ready;
},
}, },
created() { created() {
this.locale = localStorage.locale ?? 'en-US'; this.locale = localStorage.locale ?? 'en-US';
console.log(this.locale);
this.updateFieldList(); this.updateFieldList();
this.downloadBills(1); this.ready = true;
}, },
methods: { methods: {
...mapMutations('root', ['refreshCacheKey',]), ...mapMutations('root', ['refreshCacheKey',]),
@@ -254,25 +269,37 @@ export default {
}; };
}, },
downloadBills: function (page) { downloadBills: function (page) {
console.log('downloadBills');
console.log(this.indexReady);
console.log(this.loading);
console.log(this.downloaded);
this.resetGroups(); this.resetGroups();
configureAxios().then(async (api) => { // console.log('getAccountList()');
api.get('./api/v1/bills?page=' + page + '&key=' + this.cacheKey + '&start=2021-07-01&end=2021-07-31') if (this.indexReady && !this.loading && !this.downloaded) {
.then(response => { this.loading = true;
// pages configureAxios().then(async (api) => {
let currentPage = parseInt(response.data.meta.pagination.current_page); // get date from session.
let totalPage = parseInt(response.data.meta.pagination.total_pages); let startStr = format(this.start, 'y-MM-dd');
this.parseBills(response.data.data); let endStr = format(this.end, 'y-MM-dd');
if (currentPage < totalPage) {
let nextPage = currentPage + 1; api.get('./api/v1/bills?page=' + page + '&key=' + this.cacheKey + '&start='+startStr+'&end=' + endStr)
this.downloadBills(nextPage); .then(response => {
// pages
let currentPage = parseInt(response.data.meta.pagination.current_page);
let totalPage = parseInt(response.data.meta.pagination.total_pages);
this.parseBills(response.data.data);
if (currentPage < totalPage) {
let nextPage = currentPage + 1;
this.downloadBills(nextPage);
}
if (currentPage >= totalPage) {
this.downloaded = true;
}
this.sortGroups();
} }
if (currentPage >= totalPage) { );
this.downloaded = true; });
} }
this.sortGroups();
}
);
});
}, },
sortGroups: function () { sortGroups: function () {
const sortable = Object.entries(this.groups); const sortable = Object.entries(this.groups);
@@ -282,6 +309,7 @@ export default {
return a.order - b.order; return a.order - b.order;
}); });
this.sortedGroups = sortable; this.sortedGroups = sortable;
this.loading = false;
//console.log(this.sortedGroups); //console.log(this.sortedGroups);
}, },
parseBills: function (data) { parseBills: function (data) {

58
frontend/src/pages/accounts/index.js vendored
View File

@@ -38,41 +38,41 @@ Vue.component('b-pagination', BPagination);
//Vue.use(Vuex); //Vue.use(Vuex);
const app = new Vue({ const app = new Vue({
i18n, i18n,
store, store,
el: "#accounts", el: "#accounts",
render: (createElement) => { render: (createElement) => {
return createElement(Index, {props: props}); return createElement(Index, {props: props});
}, },
beforeCreate() { beforeCreate() {
// See reference nr. 10 // See reference nr. 10
this.$store.commit('initialiseStore'); this.$store.commit('initialiseStore');
this.$store.dispatch('updateCurrencyPreference'); this.$store.dispatch('updateCurrencyPreference');
// init the new root store (dont care about results) // init the new root store (dont care about results)
this.$store.dispatch('root/initialiseStore'); this.$store.dispatch('root/initialiseStore');
// also init the dashboard store. // also init the dashboard store.
this.$store.dispatch('dashboard/index/initialiseStore'); this.$store.dispatch('dashboard/index/initialiseStore');
}, },
}); });
const calendar = new Vue({ const calendar = new Vue({
i18n, i18n,
store, store,
el: "#calendar", el: "#calendar",
render: (createElement) => { render: (createElement) => {
return createElement(Calendar, {props: props}); return createElement(Calendar, {props: props});
}, },
// See reference nr. 11 // See reference nr. 11
}); });
const opt = new Vue({ const opt = new Vue({
i18n, i18n,
store, store,
el: "#indexOptions", el: "#indexOptions",
render: (createElement) => { render: (createElement) => {
return createElement(IndexOptions, {props: props}); return createElement(IndexOptions, {props: props});
}, },
// See reference nr. 12 // See reference nr. 12
}); });

48
frontend/src/pages/bills/index.js vendored
View File

@@ -23,7 +23,7 @@ import Vue from "vue";
import Index from "../../components/bills/Index"; import Index from "../../components/bills/Index";
import store from "../../components/store"; import store from "../../components/store";
import {BPagination, BTable} from 'bootstrap-vue'; import {BPagination, BTable} from 'bootstrap-vue';
//import Calendar from "../../components/dashboard/Calendar"; import Calendar from "../../components/dashboard/Calendar";
//import IndexOptions from "../../components/accounts/IndexOptions"; //import IndexOptions from "../../components/accounts/IndexOptions";
// i18n // i18n
@@ -38,35 +38,35 @@ Vue.component('b-pagination', BPagination);
//Vue.use(Vuex); //Vue.use(Vuex);
const app = new Vue({ const app = new Vue({
i18n,
store,
el: "#bills",
render: (createElement) => {
return createElement(Index, {props: props});
},
beforeCreate() {
// See reference nr. 10
this.$store.commit('initialiseStore');
this.$store.dispatch('updateCurrencyPreference');
// init the new root store (dont care about results)
this.$store.dispatch('root/initialiseStore');
// also init the dashboard store.
this.$store.dispatch('dashboard/index/initialiseStore');
},
});
new Vue({
i18n, i18n,
store, store,
el: "#bills", el: "#calendar",
render: (createElement) => { render: (createElement) => {
return createElement(Index, {props: props}); return createElement(Calendar, {props: props});
},
beforeCreate() {
// See reference nr. 10
this.$store.commit('initialiseStore');
this.$store.dispatch('updateCurrencyPreference');
// init the new root store (dont care about results)
this.$store.dispatch('root/initialiseStore');
// also init the dashboard store.
//this.$store.dispatch('dashboard/index/initialiseStore');
}, },
// See reference nr. 11
}); });
// new Vue({
// i18n,
// store,
// el: "#calendar",
// render: (createElement) => {
// return createElement(Calendar, {props: props});
// },
// // See reference nr. 11
// });
// new Vue({ // new Vue({
// i18n, // i18n,
// store, // store,