Dynamic cache key for all data.

This commit is contained in:
James Cole 2023-10-01 07:17:56 +02:00
parent aa629523a0
commit 272c73054e
No known key found for this signature in database
GPG Key ID: B49A324B7EAD6D80
9 changed files with 75 additions and 202 deletions

File diff suppressed because one or more lines are too long

View File

@ -30,10 +30,10 @@
"integrity": "sha384-B73JAwYNSgI4rwb14zwxigHgAkg1Ms+j6+9sJoDpiL11+VW5RjQCLfIh0RVoi0h6"
},
"resources/assets/v2/pages/dashboard/dashboard.js": {
"file": "assets/dashboard-307bb616.js",
"file": "assets/dashboard-30735080.js",
"isEntry": true,
"src": "resources/assets/v2/pages/dashboard/dashboard.js",
"integrity": "sha384-12LQTVUhQ8NDyfArIhB/HjBxu9v2Mo7PO76JNWBlHQStvJtW80r4RRNvE7jifPQS"
"integrity": "sha384-dOS/aqo8HSBC1WH7zzmysvvdJdCMYW/RYDXYcq6d33huiXJe2VHhIreFTW/4Lh0R"
},
"resources/assets/v2/sass/app.scss": {
"file": "assets/app-28a195fd.css",

View File

@ -26,6 +26,7 @@ import Get from "../../api/v2/model/account/get.js";
import {Chart} from 'chart.js';
import {getDefaultChartSettings} from "../../support/default-chart-settings.js";
import {getColors} from "../../support/get-colors.js";
import {getCacheKey} from "../../support/get-cache-key.js";
// this is very ugly, but I have no better ideas at the moment to save the currency info
// for each series.
@ -36,6 +37,7 @@ let afterPromises = false;
const CHART_CACHE_KEY = 'dashboard-accounts-chart';
const ACCOUNTS_CACHE_KEY = 'dashboard-accounts-data';
export default () => ({
loading: false,
loadingAccounts: false,
@ -47,8 +49,12 @@ export default () => ({
setVariable('autoConversion', this.autoConversion);
},
getFreshData() {
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const chartCacheKey = getCacheKey(CHART_CACHE_KEY, start, end)
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CHART_CACHE_KEY);
let cachedData = window.store.get(chartCacheKey);
if (cacheValid && typeof cachedData !== 'undefined') {
this.drawChart(this.generateOptions(cachedData));
@ -56,10 +62,10 @@ export default () => ({
return;
}
const dashboard = new Dashboard();
dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => {
dashboard.dashboard(start, end, null).then((response) => {
this.chartData = response.data;
// cache generated options:
window.store.set(CHART_CACHE_KEY, response.data);
window.store.set(chartCacheKey, response.data);
this.drawChart(this.generateOptions(this.chartData));
this.loading = false;
});
@ -160,8 +166,12 @@ export default () => ({
this.loadingAccounts = false;
return;
}
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const accountCacheKey = getCacheKey(ACCOUNTS_CACHE_KEY, start, end);
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(ACCOUNTS_CACHE_KEY);
let cachedData = window.store.get(accountCacheKey);
if (cacheValid && typeof cachedData !== 'undefined') {
this.accountList = cachedData;
@ -238,7 +248,7 @@ export default () => ({
this.accountList = accounts;
this.loadingAccounts = false;
window.store.set(ACCOUNTS_CACHE_KEY, accounts);
window.store.set(accountCacheKey, accounts);
}
});
});

View File

@ -22,6 +22,7 @@ import Summary from "../../api/v2/summary/index.js";
import {format} from "date-fns";
import {getVariable} from "../../store/get-variable.js";
import formatMoney from "../../util/format-money.js";
import {getCacheKey} from "../../support/get-cache-key.js";
let afterPromises = false;
const CACHE_KEY = 'dashboard-boxes-data';
@ -35,8 +36,12 @@ export default () => ({
boxData: null,
boxOptions: null,
getFreshData() {
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const boxesCacheKey = getCacheKey(CACHE_KEY, start, end);
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
let cachedData = window.store.get(boxesCacheKey);
if (cacheValid && typeof cachedData !== 'undefined') {
this.boxData = cachedData;
@ -47,12 +52,9 @@ export default () => ({
// get stuff
let getter = new Summary();
let start = new Date(window.store.get('start'));
let end = new Date(window.store.get('end'));
getter.get(format(start, 'yyyy-MM-dd'), format(end, 'yyyy-MM-dd'), null).then((response) => {
this.boxData = response.data;
window.store.set(CACHE_KEY, response.data);
window.store.set(boxesCacheKey, response.data);
this.generateOptions(this.boxData);
//this.drawChart();
});

View File

@ -25,6 +25,7 @@ import {Chart} from 'chart.js';
import {I18n} from "i18n-js";
import {loadTranslations} from "../../support/load-translations.js";
import {getColors} from "../../support/get-colors.js";
import {getCacheKey} from "../../support/get-cache-key.js";
let currencies = [];
let chart = null;
@ -59,8 +60,11 @@ export default () => ({
chart = new Chart(document.querySelector("#budget-chart"), options);
},
getFreshData() {
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const cacheKey = getCacheKey(CACHE_KEY, start, end);
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
let cachedData = window.store.get(cacheKey);
if (cacheValid && typeof cachedData !== 'undefined') {
chartData = cachedData; // save chart data for later.
@ -70,10 +74,10 @@ export default () => ({
}
const dashboard = new Dashboard();
dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => {
dashboard.dashboard(start, end, null).then((response) => {
chartData = response.data; // save chart data for later.
this.drawChart(this.generateOptions(chartData));
window.store.set(CACHE_KEY, chartData);
window.store.set(cacheKey, chartData);
this.loading = false;
});
},

View File

@ -23,6 +23,7 @@ import {getDefaultChartSettings} from "../../support/default-chart-settings.js";
import {Chart} from "chart.js";
import formatMoney from "../../util/format-money.js";
import {getColors} from "../../support/get-colors.js";
import {getCacheKey} from "../../support/get-cache-key.js";
let currencies = [];
let chart = null;
@ -146,8 +147,12 @@ export default () => ({
},
getFreshData() {
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const cacheKey = getCacheKey(CACHE_KEY, start, end);
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
let cachedData = window.store.get(cacheKey);
if (cacheValid && typeof cachedData !== 'undefined') {
chartData = cachedData; // save chart data for later.
@ -157,10 +162,10 @@ export default () => ({
}
const dashboard = new Dashboard();
dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => {
dashboard.dashboard(start, end, null).then((response) => {
chartData = response.data; // save chart data for later.
this.drawChart(this.generateOptions(response.data));
window.store.set(CACHE_KEY, chartData);
window.store.set(cacheKey, chartData);
this.loading = false;
});
},

View File

@ -21,6 +21,8 @@ import {getVariable} from "../../store/get-variable.js";
import Get from "../../api/v2/model/piggy-bank/get.js";
import {I18n} from "i18n-js";
import {loadTranslations} from "../../support/load-translations.js";
import {getCacheKey} from "../../support/get-cache-key.js";
import {format} from "date-fns";
let apiData = {};
let afterPromises = false;
@ -33,8 +35,12 @@ export default () => ({
sankeyGrouping: 'account',
piggies: [],
getFreshData() {
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const cacheKey = getCacheKey(CACHE_KEY, start, end);
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
let cachedData = window.store.get(cacheKey);
if (cacheValid && typeof cachedData !== 'undefined') {
apiData = cachedData;
@ -44,14 +50,16 @@ export default () => ({
}
let params = {
start: window.store.get('start').slice(0, 10),
end: window.store.get('end').slice(0, 10),
start: format(start, 'y-MM-dd'),
end: format(end, 'y-MM-dd'),
page: 1
};
this.downloadPiggyBanks(params);
},
downloadPiggyBanks(params) {
// console.log('Downloading page ' + params.page + '...');
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const cacheKey = getCacheKey(CACHE_KEY, start, end);
const getter = new Get();
getter.get(params).then((response) => {
apiData = [...apiData, ...response.data.data];
@ -60,7 +68,7 @@ export default () => ({
this.downloadPiggyBanks(params);
return;
}
window.store.set(CACHE_KEY, apiData);
window.store.set(cacheKey, apiData);
this.parsePiggies();
this.loading = false;
});

View File

@ -24,6 +24,7 @@ import {Chart} from 'chart.js';
import {Flow, SankeyController} from 'chartjs-chart-sankey';
import {loadTranslations} from "../../support/load-translations.js";
import {I18n} from "i18n-js";
import {getCacheKey} from "../../support/get-cache-key.js";
Chart.register({SankeyController, Flow});
@ -286,8 +287,12 @@ export default () => ({
},
getFreshData() {
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const cacheKey = getCacheKey(CACHE_KEY, start, end);
const cacheValid = window.store.get('cacheValid');
let cachedData = window.store.get(CACHE_KEY);
let cachedData = window.store.get(cacheKey);
if (cacheValid && typeof cachedData !== 'undefined') {
transactions = cachedData;
@ -298,14 +303,18 @@ export default () => ({
let params = {
start: window.store.get('start').slice(0, 10),
end: window.store.get('end').slice(0, 10),
start: format(start, 'y-MM-dd'),
end: format(end, 'y-MM-dd'),
type: 'withdrawal,deposit',
page: 1
};
this.downloadTransactions(params);
},
downloadTransactions(params) {
const start = new Date(window.store.get('start'));
const end = new Date(window.store.get('end'));
const cacheKey = getCacheKey(CACHE_KEY, start, end);
//console.log('Downloading page ' + params.page + '...');
const getter = new Get();
getter.get(params).then((response) => {
@ -318,7 +327,7 @@ export default () => ({
this.downloadTransactions(params);
return;
}
window.store.set(CACHE_KEY, transactions);
window.store.set(cacheKey, transactions);
this.drawChart(this.generateOptions());
this.loading = false;
});

View File

@ -35,26 +35,6 @@ let apiData = [];
const SUBSCRIPTION_CACHE_KEY = 'subscriptions-data-dashboard';
let subscriptionData = {};
/**
*
*/
// function downloadSubscriptions(params) {
// console.log('Downloading page ' + params.page + '...');
// const getter = new Get();
//
// getter.get(params).then((response) => {
// let data = response.data;
// let totalPages = parseInt(data.meta.pagination.total_pages);
// apiData = [...apiData, ...data.data];
// if (totalPages > params.page) {
// params.page++;
// downloadSubscriptions(params);
// }
// console.log('Done! ' + apiData.length + ' items downloaded.');
// });
// }
function downloadSubscriptions(params) {
const getter = new Get();
return getter.get(params)
@ -199,43 +179,6 @@ function downloadSubscriptions(params) {
}
//
// function refreshSubscriptions() {
// console.log('refreshSubscriptions');
//
// const cacheValid = window.store.get('cacheValid');
// let cachedData = window.store.get(CACHE_KEY);
//
// // if (cacheValid && typeof cachedData !== 'undefined') {
// // // this.drawChart(this.generateOptions(cachedData));
// // // this.loading = false;
// // // return;
// // }
//
// let params = {
// start: format(new Date(window.store.get('start')), 'y-MM-dd'),
// end: format(new Date(window.store.get('end')), 'y-MM-dd'),
// page: 1,
// };
// downloadSubscriptions(params).then(() => {
// console.log('Done with download!');
// console.log(subscriptionData);
// });
//
//
// //
// // getter.paid(params).then((response) => {
// // let paidData = response.data;
// // getter.unpaid(params).then((response) => {
// // let unpaidData = response.data;
// // let chartData = {paid: paidData, unpaid: unpaidData};
// // window.store.set(CACHE_KEY, chartData);
// // this.drawChart(this.generateOptions(chartData));
// // this.loading = false;
// // });
// // });
// }
export default () => ({
loading: false,
@ -299,8 +242,8 @@ export default () => ({
label: i18n.t('firefly.subscriptions_in_group', {title: groupTitle}),
data: [paidAmount, unpaidAmount],
backgroundColor: [
'rgb(255, 99, 132)',
'rgb(54, 162, 235)',
'rgb(255, 99, 132)',
],
hoverOffset: 4
}]
@ -323,114 +266,6 @@ export default () => ({
new Chart(document.querySelector(id), config);
},
// loadChart() {
// if (true === this.loading) {
// return;
// }
// this.loading = true;
//
// if (null !== chartData) {
// //this.drawChart(this.generateOptions(chartData));
// //this.loading = false;
//
// }
// //this.getFreshData();
// },
// drawChart(options) {
// if (null !== chart) {
// // chart.data.datasets = options.data.datasets;
// // chart.update();
//
// }
// // chart = new Chart(document.querySelector("#subscriptions-chart"), options);
// },
// getFreshData() {
// const cacheValid = window.store.get('cacheValid');
// let cachedData = window.store.get(CACHE_KEY);
//
// if (cacheValid && typeof cachedData !== 'undefined') {
// this.drawChart(this.generateOptions(cachedData));
// this.loading = false;
// return;
// }
//
//
// const getter = new Get();
// let params = {
// start: format(new Date(window.store.get('start')), 'y-MM-dd'),
// end: format(new Date(window.store.get('end')), 'y-MM-dd')
// };
//
// getter.paid(params).then((response) => {
// let paidData = response.data;
// getter.unpaid(params).then((response) => {
// let unpaidData = response.data;
// let chartData = {paid: paidData, unpaid: unpaidData};
// window.store.set(CACHE_KEY, chartData);
// this.drawChart(this.generateOptions(chartData));
// this.loading = false;
// });
// });
// },
// generateOptions(data) {
// let options = getDefaultChartSettings('pie');
// // console.log(data);
// options.data.labels = [i18n.t('firefly.paid'), i18n.t('firefly.unpaid')];
// options.data.datasets = [];
// let collection = {};
// for (let i in data.paid) {
// if (data.paid.hasOwnProperty(i)) {
// let current = data.paid[i];
// let currencyCode = this.autoConversion ? current.native_code : current.currency_code;
// let amount = this.autoConversion ? current.native_sum : current.sum;
// if (!collection.hasOwnProperty(currencyCode)) {
// collection[currencyCode] = {
// paid: 0,
// unpaid: 0,
// };
// }
// // in case of paid, add to "paid":
// collection[currencyCode].paid += (parseFloat(amount) * -1);
// }
// }
// // unpaid
// for (let i in data.unpaid) {
// if (data.unpaid.hasOwnProperty(i)) {
// let current = data.unpaid[i];
// let currencyCode = this.autoConversion ? current.native_code : current.currency_code;
// let amount = this.autoConversion ? current.native_sum : current.sum;
// if (!collection.hasOwnProperty(currencyCode)) {
// collection[currencyCode] = {
// paid: 0,
// unpaid: 0,
// };
// }
// // console.log(current);
// // in case of paid, add to "paid":
// collection[currencyCode].unpaid += parseFloat(amount);
// }
// }
// for (let currencyCode in collection) {
// if (collection.hasOwnProperty(currencyCode)) {
// let current = collection[currencyCode];
// options.data.datasets.push(
// {
// label: currencyCode,
// data: [current.paid, current.unpaid],
// backgroundColor: [
// 'rgb(54, 162, 235)', // green (paid)
// 'rgb(255, 99, 132)', // red (unpaid_
// ],
// //hoverOffset: 4
// }
// )
// }
// }
//
// return options;
// },
init() {
console.log('subscriptions init');
Promise.all([getVariable('autoConversion', false), getVariable('language', 'en-US')]).then((values) => {