diff --git a/frontend/src/components/bills/Index.vue b/frontend/src/components/bills/Index.vue
index 0cf3718df5..887029d870 100644
--- a/frontend/src/components/bills/Index.vue
+++ b/frontend/src/components/bills/Index.vue
@@ -22,7 +22,8 @@
@@ -206,18 +210,29 @@ export default {
locale: 'en-US',
sortedGroups: [],
fields: [],
- fnsLocale: null
+ fnsLocale: null,
+ ready: false
}
},
+ watch: {
+ start: function () {
+ this.downloadBills(1);
+ },
+ end: function () {
+ this.downloadBills(1);
+ },
+ },
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() {
this.locale = localStorage.locale ?? 'en-US';
- console.log(this.locale);
-
this.updateFieldList();
- this.downloadBills(1);
+ this.ready = true;
},
methods: {
...mapMutations('root', ['refreshCacheKey',]),
@@ -254,25 +269,37 @@ export default {
};
},
downloadBills: function (page) {
+ console.log('downloadBills');
+ console.log(this.indexReady);
+ console.log(this.loading);
+ console.log(this.downloaded);
this.resetGroups();
- configureAxios().then(async (api) => {
- api.get('./api/v1/bills?page=' + page + '&key=' + this.cacheKey + '&start=2021-07-01&end=2021-07-31')
- .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);
+ // console.log('getAccountList()');
+ if (this.indexReady && !this.loading && !this.downloaded) {
+ this.loading = true;
+ configureAxios().then(async (api) => {
+ // get date from session.
+ let startStr = format(this.start, 'y-MM-dd');
+ let endStr = format(this.end, 'y-MM-dd');
+
+ api.get('./api/v1/bills?page=' + page + '&key=' + this.cacheKey + '&start='+startStr+'&end=' + endStr)
+ .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 () {
const sortable = Object.entries(this.groups);
@@ -282,6 +309,7 @@ export default {
return a.order - b.order;
});
this.sortedGroups = sortable;
+ this.loading = false;
//console.log(this.sortedGroups);
},
parseBills: function (data) {
diff --git a/frontend/src/pages/accounts/index.js b/frontend/src/pages/accounts/index.js
index ccdc5423cf..563e6fcca1 100644
--- a/frontend/src/pages/accounts/index.js
+++ b/frontend/src/pages/accounts/index.js
@@ -38,41 +38,41 @@ Vue.component('b-pagination', BPagination);
//Vue.use(Vuex);
const app = new Vue({
- i18n,
- store,
- el: "#accounts",
- render: (createElement) => {
- return createElement(Index, {props: props});
- },
- beforeCreate() {
+ i18n,
+ store,
+ el: "#accounts",
+ render: (createElement) => {
+ return createElement(Index, {props: props});
+ },
+ beforeCreate() {
// See reference nr. 10
- this.$store.commit('initialiseStore');
- this.$store.dispatch('updateCurrencyPreference');
+ this.$store.commit('initialiseStore');
+ this.$store.dispatch('updateCurrencyPreference');
- // init the new root store (dont care about results)
- this.$store.dispatch('root/initialiseStore');
+ // 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');
- },
- });
+ // also init the dashboard store.
+ this.$store.dispatch('dashboard/index/initialiseStore');
+ },
+ });
const calendar = new Vue({
- i18n,
- store,
- el: "#calendar",
- render: (createElement) => {
- return createElement(Calendar, {props: props});
- },
+ i18n,
+ store,
+ el: "#calendar",
+ render: (createElement) => {
+ return createElement(Calendar, {props: props});
+ },
// See reference nr. 11
- });
+ });
const opt = new Vue({
- i18n,
- store,
- el: "#indexOptions",
- render: (createElement) => {
- return createElement(IndexOptions, {props: props});
- },
+ i18n,
+ store,
+ el: "#indexOptions",
+ render: (createElement) => {
+ return createElement(IndexOptions, {props: props});
+ },
// See reference nr. 12
- });
\ No newline at end of file
+ });
\ No newline at end of file
diff --git a/frontend/src/pages/bills/index.js b/frontend/src/pages/bills/index.js
index 0a32c1b9ae..3820fb4c19 100644
--- a/frontend/src/pages/bills/index.js
+++ b/frontend/src/pages/bills/index.js
@@ -23,7 +23,7 @@ import Vue from "vue";
import Index from "../../components/bills/Index";
import store from "../../components/store";
import {BPagination, BTable} from 'bootstrap-vue';
-//import Calendar from "../../components/dashboard/Calendar";
+import Calendar from "../../components/dashboard/Calendar";
//import IndexOptions from "../../components/accounts/IndexOptions";
// i18n
@@ -38,35 +38,35 @@ Vue.component('b-pagination', BPagination);
//Vue.use(Vuex);
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,
store,
- el: "#bills",
+ el: "#calendar",
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');
+ return createElement(Calendar, {props: props});
},
+// See reference nr. 11
});
-// new Vue({
-// i18n,
-// store,
-// el: "#calendar",
-// render: (createElement) => {
-// return createElement(Calendar, {props: props});
-// },
-// // See reference nr. 11
-// });
-
// new Vue({
// i18n,
// store,