Rebuild frontend.

This commit is contained in:
James Cole
2021-09-17 09:02:59 +02:00
parent 5e5d2b2acc
commit 46f2494dfd
24 changed files with 72 additions and 319 deletions

View File

@@ -107,8 +107,8 @@ export default {
this.drawChart();
})
.catch(error => {
console.log('Has error!');
console.log(error);
console.error('Has error!');
console.error(error);
this.error = true;
});
},

View File

@@ -830,6 +830,10 @@ export default {
//console.log('getExpectedSourceTypes.');
this.sourceAllowedTypes = response.data.data.value.source[this.transactionType];
this.destinationAllowedTypes = response.data.data.value.destination[this.transactionType];
// console.log('sourceAllowedTypes');
// console.log(this.sourceAllowedTypes);
// console.log('Source allowed types for ' + this.transactionType + ' is: ');
// console.log(this.sourceAllowedTypes);

View File

@@ -28,7 +28,6 @@
<SplitPills
:transactions="transactions"
:count="transactions.length"
/>
<div class="tab-content">
@@ -132,6 +131,7 @@ export default {
this.groupId = parseInt(parts[parts.length - 1]);
this.transactions = [];
this.getTransactionGroup();
//this.getExpectedSourceTypes();
this.getAllowedOpposingTypes();
this.getCustomFields();
},
@@ -238,6 +238,9 @@ export default {
watch: {
submittedAttachments: function () {
this.finaliseSubmission();
},
transactionType: function() {
this.getExpectedSourceTypes();
}
},
@@ -299,8 +302,12 @@ export default {
this.transactionType = array.type.charAt(0).toUpperCase() + array.type.slice(1);
// See reference nr. 5
this.sourceAllowedTypes = [array.source_type];
this.destinationAllowedTypes = [array.destination_type];
// console.log('sourceAllowedTypes (parseTransaction)');
// console.log(this.sourceAllowedTypes);
this.date = array.date.substring(0, 16);
this.originalDate = array.date.substring(0, 16);
}
@@ -427,6 +434,18 @@ export default {
this.originalTransactions[index].links.push(object);
});
},
getExpectedSourceTypes: function () {
axios.get('./api/v1/configuration/firefly.expected_source_types')
.then(response => {
this.sourceAllowedTypes = response.data.data.value.source[this.transactionType];
this.destinationAllowedTypes = response.data.data.value.destination[this.transactionType];
// console.log('sourceAllowedTypes (getExpectedSourceTypes)');
// console.log(JSON.stringify(response.data.data.value.source[this.transactionType]));
// console.log(JSON.stringify(response.data.data.value.source));
// console.log(this.transactionType);
//console.log(this.transactionType);
});
},
/**
* Get API value.
*/

View File

@@ -76,8 +76,6 @@ export default {
data() {
return {
rawTransactions: [],
transactions: [],
transactionRows: [],
type: 'all',
downloaded: false,
loading: false,
@@ -130,6 +128,7 @@ export default {
let parts = pathName.split('/');
this.type = parts[parts.length - 1];
this.perPage = this.listPageSize ?? 51;
if (5 === parts.length) {
this.urlStart = new Date(parts[3]);
this.urlEnd = new Date(parts[4]);
@@ -149,18 +148,14 @@ export default {
this.getTransactionList();
},
jumpToPage: function(event) {
console.log('noticed a change!');
// console.log('noticed a change!');
this.currentPage = event.page;
this.downloadTransactionList(event.page);
},
getTransactionList: function () {
// console.log('getTransactionList()');
if (this.indexReady && !this.loading && !this.downloaded) {
// console.log('Index ready, not loading and not already downloaded. Reset.');
this.loading = true;
this.perPage = this.listPageSize ?? 51;
this.transactions = [];
this.transactionRows = [];
this.rawTransactions = [];
this.downloadTransactionList(this.currentPage);
this.calculateDateRanges();
@@ -171,119 +166,38 @@ export default {
let currentDate = this.start;
while (currentDate > yearAgo) {
// start + end of month:
let st = startOfMonth(currentDate);
let en = endOfMonth(currentDate);
this.ranges.push({start: st, end: en});
currentDate = sub(currentDate, {months: 1});
//console.log(currentDate);
}
},
formatDate: function (date, frm) {
return format(date, frm);
},
downloadTransactionList: function (page) {
// console.log('downloadTransactionList(' + page + ')');
configureAxios().then(async (api) => {
let startStr = format(this.start, 'y-MM-dd');
let endStr = format(this.end, 'y-MM-dd');
// console.log(this.urlEnd);
// console.log(this.urlStart);
if (null !== this.urlEnd && null !== this.urlStart) {
startStr = format(this.urlStart, 'y-MM-dd');
endStr = format(this.urlEnd, 'y-MM-dd');
}
let url = './api/v1/transactions?type=' + this.type + '&page=' + page + "&start=" + startStr + "&end=" + endStr + '&cache=' + this.cacheKey;
api.get(url)
.then(response => {
//let currentPage = parseInt(response.data.meta.pagination.current_page);
//let totalPages = parseInt(response.data.meta.pagination.total_pages);
this.total = parseInt(response.data.meta.pagination.total);
//console.log('total is ' + this.total);
this.rawTransactions = response.data.data;
// if (currentPage < totalPage) {
// let nextPage = currentPage + 1;
// this.downloadTransactionList(nextPage);
// }
// if (currentPage >= totalPage) {
// console.log('Looks like all downloaded.');
//this.downloaded = true;
//this.createTransactionRows();
// }
this.loading = false;
}
);
});
},
// createTransactionRows: function () {
// this.transactionRows = [];
// for (let i in this.transactions) {
// let transaction = this.transactions[i];
// let transactionRow = this.getTransactionRow(transaction, 0);
// this.transactionRows.push(transactionRow);
//
// if (transaction.attributes.transactions.length > 1) {
// transactionRow.description = transaction.attributes.group_title;
// transactionRow.split = true;
// transactionRow.collapsed = transaction.collapsed === true || transaction.collapsed === undefined;
// transactionRow.amount = transaction.attributes.transactions
// .map(transaction => Number(transaction.amount))
// .reduce((sum, n) => sum + n);
// transactionRow.source_name = '';
// transactionRow.source_id = '';
// transactionRow.destination_name = '';
// transactionRow.destination_id = '';
//
// if (!transactionRow.collapsed) {
// for (let i = 0; i < transaction.attributes.transactions.length; i++) {
// let splitTransactionRow = this.getTransactionRow(transaction, i);
// splitTransactionRow.key = splitTransactionRow.id + "." + i
// splitTransactionRow.split = true;
// splitTransactionRow.split_index = i + 1;
// splitTransactionRow.split_parent = transactionRow;
// this.transactionRows.push(splitTransactionRow);
// }
// }
// }
// }
//
// this.loading = false;
// },
// getTransactionRow(transaction, index) {
// let transactionRow = {};
// let currentTransaction = transaction.attributes.transactions[index];
//
// transactionRow.key = transaction.id;
// transactionRow.id = transaction.id;
// transactionRow.type = currentTransaction.type;
// transactionRow.description = currentTransaction.description;
// transactionRow.amount = currentTransaction.amount;
// transactionRow.currency_code = currentTransaction.currency_code;
// transactionRow.date = new Date(currentTransaction.date);
// transactionRow.date_formatted = format(transactionRow.date, this.$t('config.month_and_day_fns'));
// transactionRow.source_name = currentTransaction.source_name;
// transactionRow.source_id = currentTransaction.source_id;
// transactionRow.destination_name = currentTransaction.destination_name;
// transactionRow.destination_id = currentTransaction.destination_id;
// transactionRow.category_id = currentTransaction.category_id;
// transactionRow.category_name = currentTransaction.category_name;
// transactionRow.split = false;
// transactionRow.split_index = 0;
// transactionRow.split_parent = null;
//
// return transactionRow;
// },
// toggleCollapse: function (row) {
// let transaction = this.transactions.filter(transaction => transaction.id === row.id)[0];
// if (transaction.collapsed === undefined) {
// transaction.collapsed = false;
// } else {
// transaction.collapsed = !transaction.collapsed;
// }
// this.createTransactionRows();
// },
},
}

View File

@@ -22,12 +22,6 @@
<div>
<div class="row">
<div class="col-lg-8 col-md-6 col-sm-12 col-xs-12">
currentPage: {{ currentPage }}<br>
page: {{ page }}<br>
Total: {{ total }}<br>
Per page: {{ perPage }}<br>
Loading: {{ loading }}<br>
<BPagination v-if="!loading"
v-model="currentPage"
:total-rows="total"
@@ -195,122 +189,6 @@
</template>
<script>
/*
this.transactions = [];
this.transactionRows = [];
this.downloadTransactionList(1);
downloadTransactionList: function (page) {
// console.log('downloadTransactionList(' + page + ')');
configureAxios().then(async (api) => {
let startStr = format(this.start, 'y-MM-dd');
let endStr = format(this.end, 'y-MM-dd');
// console.log(this.urlEnd);
// console.log(this.urlStart);
if (null !== this.urlEnd && null !== this.urlStart) {
startStr = format(this.urlStart, 'y-MM-dd');
endStr = format(this.urlEnd, 'y-MM-dd');
}
api.get('./api/v1/transactions?type=' + this.type + '&page=' + page + "&start=" + startStr + "&end=" + endStr + '&cache=' + this.cacheKey)
.then(response => {
//let currentPage = parseInt(response.data.meta.pagination.current_page);
//let totalPages = parseInt(response.data.meta.pagination.total_pages);
this.total = parseInt(response.data.meta.pagination.total);
//console.log('total is ' + this.total);
this.transactions.push(...response.data.data);
// if (currentPage < totalPage) {
// let nextPage = currentPage + 1;
// this.downloadTransactionList(nextPage);
// }
// if (currentPage >= totalPage) {
// console.log('Looks like all downloaded.');
this.downloaded = true;
this.createTransactionRows();
// }
}
);
});
},
createTransactionRows: function () {
this.transactionRows = [];
for (let i in this.transactions) {
let transaction = this.transactions[i];
let transactionRow = this.getTransactionRow(transaction, 0);
this.transactionRows.push(transactionRow);
if (transaction.attributes.transactions.length > 1) {
transactionRow.description = transaction.attributes.group_title;
transactionRow.split = true;
transactionRow.collapsed = transaction.collapsed === true || transaction.collapsed === undefined;
transactionRow.amount = transaction.attributes.transactions
.map(transaction => Number(transaction.amount))
.reduce((sum, n) => sum + n);
transactionRow.source_name = '';
transactionRow.source_id = '';
transactionRow.destination_name = '';
transactionRow.destination_id = '';
if (!transactionRow.collapsed) {
for (let i = 0; i < transaction.attributes.transactions.length; i++) {
let splitTransactionRow = this.getTransactionRow(transaction, i);
splitTransactionRow.key = splitTransactionRow.id + "." + i
splitTransactionRow.split = true;
splitTransactionRow.split_index = i + 1;
splitTransactionRow.split_parent = transactionRow;
this.transactionRows.push(splitTransactionRow);
}
}
}
}
this.loading = false;
},
getTransactionRow(transaction, index) {
let transactionRow = {};
let currentTransaction = transaction.attributes.transactions[index];
transactionRow.key = transaction.id;
transactionRow.id = transaction.id;
transactionRow.type = currentTransaction.type;
transactionRow.description = currentTransaction.description;
transactionRow.amount = currentTransaction.amount;
transactionRow.currency_code = currentTransaction.currency_code;
transactionRow.date = new Date(currentTransaction.date);
transactionRow.date_formatted = format(transactionRow.date, this.$t('config.month_and_day_fns'));
transactionRow.source_name = currentTransaction.source_name;
transactionRow.source_id = currentTransaction.source_id;
transactionRow.destination_name = currentTransaction.destination_name;
transactionRow.destination_id = currentTransaction.destination_id;
transactionRow.category_id = currentTransaction.category_id;
transactionRow.category_name = currentTransaction.category_name;
transactionRow.split = false;
transactionRow.split_index = 0;
transactionRow.split_parent = null;
return transactionRow;
},
toggleCollapse: function (row) {
let transaction = this.transactions.filter(transaction => transaction.id === row.id)[0];
if (transaction.collapsed === undefined) {
transaction.collapsed = false;
} else {
transaction.collapsed = !transaction.collapsed;
}
this.createTransactionRows();
},
*/
import {mapGetters, mapMutations} from "vuex";
import {BPagination, BTable} from 'bootstrap-vue';
import format from "date-fns/format";
@@ -338,80 +216,44 @@ export default {
},
watch: {
currentPage: function (value) {
console.log('Watch currentPage go to ' + value);
// console.log('Watch currentPage go to ' + value);
this.$emit('jump-page', {page: value});
},
// page: function (value) {
// console.log('Watch page go to ' + value);
// this.currentPage = value;
// },
entries: function (value) {
this.parseTransactions();
},
},
methods: {
...mapMutations('root', ['refreshCacheKey',]),
// toggleCollapse: function (row) {
// let transaction = this.entries.filter(transaction => transaction.id === row.id)[0];
// if (transaction.collapsed === undefined) {
// transaction.collapsed = false;
// } else {
// transaction.collapsed = !transaction.collapsed;
// }
// this.parseTransactions();
// },
parseTransactions: function () {
console.log('parseTransactions. Count is ' + this.entries.length + ' and page is ' + this.page);
// console.log('Start of parseTransactions. Count of entries is ' + this.entries.length + ' and page is ' + this.page);
// console.log('Reported total is ' + this.total);
if (0 === this.entries.length) {
// console.log('Will not render now');
return;
}
console.log('Now have ' + this.transactions.length + ' transactions');
// console.log('Now have ' + this.transactions.length + ' transactions');
for (let i = 0; i < this.total; i++) {
this.transactions.push({dummy: true});
// console.log('Push dummy to index ' + i);
// console.log('Now have ' + this.transactions.length + ' transactions');
}
console.log('Generated ' + this.total + ' dummies');
console.log('Now have ' + this.transactions.length + ' transactions');
// console.log('Generated ' + this.total + ' dummies');
// console.log('Now have ' + this.transactions.length + ' transactions');
let index = (this.page - 1) * this.perPage;
// console.log('Start index is ' + index);
for (let i in this.entries) {
let transaction = this.entries[i];
// build split
this.transactions[index] = this.parseTransaction(transaction);
//this.transactions[index] = this.getTransactionRow(transaction, 0);
// this code will not be used for the time being.
// if (transaction.attributes.transactions.length > 1) {
// transactionRow.description = transaction.attributes.group_title;
// transactionRow.split = true;
// transactionRow.collapsed = transaction.collapsed === true || transaction.collapsed === undefined;
// transactionRow.amount = transaction.attributes.transactions
// .map(transaction => Number(transaction.amount))
// .reduce((sum, n) => sum + n);
// transactionRow.source_name = '';
// transactionRow.source_id = '';
// transactionRow.destination_name = '';
// transactionRow.destination_id = '';
//
// if (!transactionRow.collapsed) {
// for (let i = 0; i < transaction.attributes.transactions.length; i++) {
// let splitTransactionRow = this.getTransactionRow(transaction, i);
// splitTransactionRow.key = splitTransactionRow.id + "." + i
// splitTransactionRow.split = true;
// splitTransactionRow.split_index = i + 1;
// splitTransactionRow.split_parent = transactionRow;
//
// // need to verify this.
// index++;
// this.transactions[index] = splitTransactionRow;
// }
// }
// }
// console.log('Push transaction to index ' + index);
// console.log('Now have ' + this.transactions.length + ' transactions');
index++;
}
console.log('Added ' + this.entries.length + ' entries');
console.log('Now have ' + this.transactions.length + ' transactions');
// console.log('Added ' + this.entries.length + ' entries');
// console.log('Now have ' + this.transactions.length + ' transactions');
// console.log(this.transactions);
this.loading = false;
@@ -423,7 +265,7 @@ export default {
updateFieldList: function () {
this.fields = [
{key: 'type', label: ' ', sortable: false},
{key: 'description', label: this.$t('list.description') + 'X', sortable: true},
{key: 'description', label: this.$t('list.description'), sortable: true},
{key: 'amount', label: this.$t('list.amount'), sortable: true},
{key: 'date', label: this.$t('list.date'), sortable: true},
{key: 'source_account', label: this.$t('list.source_account'), sortable: true},
@@ -464,7 +306,7 @@ export default {
if (typeof transaction.collapsed !== 'undefined') {
row.collapsed = transaction.collapsed;
}
console.log('is collapsed? ' + row.collapsed);
//console.log('is collapsed? ' + row.collapsed);
// then loop each split
for (let i in transaction.attributes.transactions) {
@@ -491,32 +333,6 @@ export default {
let transaction = this.transactions.filter(transaction => transaction.id === id)[0];
transaction.collapsed = !transaction.collapsed;
},
// getTransactionRow(transaction, index) {
// let transactionRow = {};
// let currentTransaction = transaction.attributes.transactions[index];
//
// transactionRow.key = transaction.id;
// transactionRow.id = transaction.id;
// transactionRow.type = currentTransaction.type;
// transactionRow.description = currentTransaction.description;
// transactionRow.amount = currentTransaction.amount;
// transactionRow.currency_code = currentTransaction.currency_code;
// transactionRow.date = new Date(currentTransaction.date);
// transactionRow.date_formatted = format(transactionRow.date, this.$t('config.month_and_day_fns'));
// transactionRow.source_name = currentTransaction.source_name;
// transactionRow.source_id = currentTransaction.source_id;
// transactionRow.destination_name = currentTransaction.destination_name;
// transactionRow.destination_id = currentTransaction.destination_id;
// transactionRow.category_id = currentTransaction.category_id;
// transactionRow.category_name = currentTransaction.category_name;
// transactionRow.split = false;
// transactionRow.split_index = 0;
// transactionRow.split_parent = null;
//
// return transactionRow;
// },
tableSortCompare: function (aRow, bRow, key, sortDesc, formatter, compareOptions, compareLocale) {
let a = aRow[key]
let b = bRow[key]

View File

@@ -1922,9 +1922,9 @@ caniuse-api@^3.0.0:
lodash.uniq "^4.5.0"
caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001252, caniuse-lite@^1.0.30001254:
version "1.0.30001257"
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001257.tgz#150aaf649a48bee531104cfeda57f92ce587f6e5"
integrity sha512-JN49KplOgHSXpIsVSF+LUyhD8PUp6xPpAXeRrrcBh4KBeP7W864jHn6RvzJgDlrReyeVjMFJL3PLpPvKIxlIHA==
version "1.0.30001258"
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001258.tgz#b604eed80cc54a578e4bf5a02ae3ed49f869d252"
integrity sha512-RBByOG6xWXUp0CR2/WU2amXz3stjKpSl5J1xU49F1n2OxD//uBZO4wCKUiG+QMGf7CHGfDDcqoKriomoGVxTeA==
chalk@^2.0.0, chalk@^2.4.2:
version "2.4.2"
@@ -2698,9 +2698,9 @@ date-fns-tz@^1.1.4:
integrity sha512-nyy+URfFI3KUY7udEJozcoftju+KduaqkVfwyTIE0traBiVye09QnyWKLZK7drRr5h9B7sPJITmQnS3U6YOdQg==
date-fns@^2.21.1, date-fns@^2.22.1:
version "2.23.0"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.23.0.tgz#4e886c941659af0cf7b30fafdd1eaa37e88788a9"
integrity sha512-5ycpauovVyAk0kXNZz6ZoB9AYMZB4DObse7P3BPWmyEjXNORTI8EJ6X0uaSAq4sCHzM1uajzrkr6HnsLQpxGXA==
version "2.24.0"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.24.0.tgz#7d86dc0d93c87b76b63d213b4413337cfd1c105d"
integrity sha512-6ujwvwgPID6zbI0o7UbURi2vlLDR9uP26+tW6Lg+Ji3w7dd0i3DOcjcClLjLPranT60SSEFBwdSyYwn/ZkPIuw==
daterangepicker@^3.1.0:
version "3.1.0"