mirror of
				https://github.com/firefly-iii/firefly-iii.git
				synced 2025-10-31 10:47:00 +00:00 
			
		
		
		
	Expand cache
This commit is contained in:
		| @@ -53,18 +53,17 @@ export default () => ({ | ||||
|             let options = window.store.get(CHART_CACHE_KEY); | ||||
|             this.drawChart(options); | ||||
|             this.loading = false; | ||||
|             return; | ||||
|         } | ||||
|         if (!cacheValid || typeof cachedData === 'undefined') { | ||||
|             const dashboard = new Dashboard(); | ||||
|             dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => { | ||||
|                 this.chartData = response.data; | ||||
|                 // cache generated options: | ||||
|                 let options = this.generateOptions(this.chartData); | ||||
|                 window.store.set(CHART_CACHE_KEY, options); | ||||
|                 this.drawChart(options); | ||||
|                 this.loading = false; | ||||
|             }); | ||||
|         } | ||||
|         const dashboard = new Dashboard(); | ||||
|         dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => { | ||||
|             this.chartData = response.data; | ||||
|             // cache generated options: | ||||
|             let options = this.generateOptions(this.chartData); | ||||
|             window.store.set(CHART_CACHE_KEY, options); | ||||
|             this.drawChart(options); | ||||
|             this.loading = false; | ||||
|         }); | ||||
|  | ||||
|     }, | ||||
|     generateOptions(data) { | ||||
| @@ -150,14 +149,11 @@ export default () => ({ | ||||
|         chart = new Chart(document.querySelector("#account-chart"), options); | ||||
|     }, | ||||
|     loadAccounts() { | ||||
|         // console.log('loadAccounts'); | ||||
|         if (true === this.loadingAccounts) { | ||||
|             // console.log('loadAccounts CANCELLED'); | ||||
|             return; | ||||
|         } | ||||
|         this.loadingAccounts = true; | ||||
|         if (this.accountList.length > 0) { | ||||
|             // console.log('NO need to load account data'); | ||||
|             this.loadingAccounts = false; | ||||
|             return; | ||||
|         } | ||||
| @@ -217,6 +213,7 @@ export default () => ({ | ||||
|                             // console.log(parent); | ||||
|                             accounts.push({ | ||||
|                                 name: parent.attributes.name, | ||||
|                                 order: parent.attributes.order, | ||||
|                                 id: parent.id, | ||||
|                                 balance_raw: parseFloat(parent.attributes.current_balance), | ||||
|                                 balance: formatMoney(parent.attributes.current_balance, parent.attributes.currency_code), | ||||
| @@ -224,8 +221,11 @@ export default () => ({ | ||||
|                                 native_balance: formatMoney(parent.attributes.native_current_balance, parent.attributes.native_code), | ||||
|                                 groups: groups, | ||||
|                             }); | ||||
|                             console.log(parent.attributes); | ||||
|                             count++; | ||||
|                             if (count === totalAccounts) { | ||||
|                                 accounts.sort((a, b) => a.order - b.order); // b - a for reverse sort | ||||
|  | ||||
|                                 this.accountList = accounts; | ||||
|                                 this.loadingAccounts = false; | ||||
|                                 window.store.set(ACCOUNTS_CACHE_KEY, accounts); | ||||
|   | ||||
| @@ -24,7 +24,7 @@ import {getVariable} from "../../store/get-variable.js"; | ||||
| import formatMoney from "../../util/format-money.js"; | ||||
|  | ||||
| let afterPromises = false; | ||||
|  | ||||
| const CACHE_KEY = 'dashboard-boxes-data'; | ||||
| export default () => ({ | ||||
|     balanceBox: {amounts: [], subtitles: []}, | ||||
|     billBox: {paid: [], unpaid: []}, | ||||
| @@ -35,6 +35,16 @@ export default () => ({ | ||||
|     boxData: null, | ||||
|     boxOptions: null, | ||||
|     getFreshData() { | ||||
|         const cacheValid = window.store.get('cacheValid'); | ||||
|         let cachedData = window.store.get(CACHE_KEY); | ||||
|  | ||||
|         if (cacheValid && typeof cachedData !== 'undefined') { | ||||
|             this.boxData = cachedData; | ||||
|             this.generateOptions(this.boxData); | ||||
|  | ||||
|             return; | ||||
|         } | ||||
|  | ||||
|         // get stuff | ||||
|         let getter = new Summary(); | ||||
|         let start = new Date(window.store.get('start')); | ||||
| @@ -42,6 +52,7 @@ export default () => ({ | ||||
|  | ||||
|         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); | ||||
|             this.generateOptions(this.boxData); | ||||
|             //this.drawChart(); | ||||
|         }); | ||||
|   | ||||
| @@ -32,7 +32,7 @@ let afterPromises = false; | ||||
|  | ||||
| let i18n; // for translating items in the chart. | ||||
|  | ||||
|  | ||||
| const CACHE_KEY = 'dashboard-budgets-chart'; | ||||
| export default () => ({ | ||||
|     loading: false, | ||||
|     autoConversion: false, | ||||
| @@ -58,10 +58,21 @@ export default () => ({ | ||||
|         chart = new Chart(document.querySelector("#budget-chart"), options); | ||||
|     }, | ||||
|     getFreshData() { | ||||
|         const cacheValid = window.store.get('cacheValid'); | ||||
|         let cachedData = window.store.get(CACHE_KEY); | ||||
|  | ||||
|         if (cacheValid && typeof cachedData !== 'undefined') { | ||||
|             chartData = cachedData; // save chart data for later. | ||||
|             this.drawChart(this.generateOptions(chartData)); | ||||
|             this.loading = false; | ||||
|             return; | ||||
|         } | ||||
|  | ||||
|         const dashboard = new Dashboard(); | ||||
|         dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => { | ||||
|             chartData = response.data; // save chart data for later. | ||||
|             this.drawChart(this.generateOptions(response.data)); | ||||
|             this.drawChart(this.generateOptions(chartData)); | ||||
|             window.store.set(CACHE_KEY, chartData); | ||||
|             this.loading = false; | ||||
|         }); | ||||
|     }, | ||||
| @@ -93,19 +104,19 @@ export default () => ({ | ||||
|                     label: i18n.t('firefly.spent'), | ||||
|                     data: [], | ||||
|                     borderWidth: 1, | ||||
|                     stack: 1 | ||||
|                     stack: 1, | ||||
|                 }, | ||||
|                 { | ||||
|                     label: i18n.t('firefly.left'), | ||||
|                     data: [], | ||||
|                     borderWidth: 1, | ||||
|                     stack: 1 | ||||
|                     stack: 1, | ||||
|                 }, | ||||
|                 { | ||||
|                     label: i18n.t('firefly.overspent'), | ||||
|                     data: [], | ||||
|                     borderWidth: 1, | ||||
|                     stack: 1 | ||||
|                     stack: 1, | ||||
|                 } | ||||
|             ] | ||||
|         }; | ||||
| @@ -158,13 +169,13 @@ export default () => ({ | ||||
|  | ||||
|             i18n = new I18n(); | ||||
|             i18n.locale = values[1]; | ||||
|             loadTranslations(i18n, values[1]); | ||||
|  | ||||
|             this.autoConversion = values[0]; | ||||
|             afterPromises = true; | ||||
|             if (false === this.loading) { | ||||
|                 this.loadChart(); | ||||
|             } | ||||
|             loadTranslations(i18n, values[1]).then(() => { | ||||
|                 this.autoConversion = values[0]; | ||||
|                 afterPromises = true; | ||||
|                 if (false === this.loading) { | ||||
|                     this.loadChart(); | ||||
|                 } | ||||
|             }); | ||||
|         }); | ||||
|         window.store.observe('end', () => { | ||||
|             if (!afterPromises) { | ||||
| @@ -172,7 +183,7 @@ export default () => ({ | ||||
|             } | ||||
|             // console.log('boxes observe end'); | ||||
|             if (false === this.loading) { | ||||
|                 this.chartData = null; | ||||
|                 chartData = null; | ||||
|                 this.loadChart(); | ||||
|             } | ||||
|         }); | ||||
|   | ||||
| @@ -28,6 +28,8 @@ let chart = null; | ||||
| let chartData = null; | ||||
| let afterPromises = false; | ||||
|  | ||||
| const CACHE_KEY = 'dashboard-categories-chart'; | ||||
|  | ||||
| export default () => ({ | ||||
|     loading: false, | ||||
|     autoConversion: false, | ||||
| @@ -140,10 +142,21 @@ export default () => ({ | ||||
|  | ||||
|     }, | ||||
|     getFreshData() { | ||||
|         const cacheValid = window.store.get('cacheValid'); | ||||
|         let cachedData = window.store.get(CACHE_KEY); | ||||
|  | ||||
|         if (cacheValid && typeof cachedData !== 'undefined') { | ||||
|             chartData = cachedData; // save chart data for later. | ||||
|             this.drawChart(this.generateOptions(chartData)); | ||||
|             this.loading = false; | ||||
|             return; | ||||
|         } | ||||
|  | ||||
|         const dashboard = new Dashboard(); | ||||
|         dashboard.dashboard(new Date(window.store.get('start')), new Date(window.store.get('end')), null).then((response) => { | ||||
|             chartData = response.data; // save chart data for later. | ||||
|             this.drawChart(this.generateOptions(response.data)); | ||||
|             window.store.set(CACHE_KEY, chartData); | ||||
|             this.loading = false; | ||||
|         }); | ||||
|     }, | ||||
|   | ||||
| @@ -25,6 +25,7 @@ import {loadTranslations} from "../../support/load-translations.js"; | ||||
| let apiData = {}; | ||||
| let afterPromises = false; | ||||
| let i18n; | ||||
| const CACHE_KEY = 'dashboard-piggies-data'; | ||||
|  | ||||
| export default () => ({ | ||||
|     loading: false, | ||||
| @@ -32,6 +33,16 @@ export default () => ({ | ||||
|     sankeyGrouping: 'account', | ||||
|     piggies: [], | ||||
|     getFreshData() { | ||||
|         const cacheValid = window.store.get('cacheValid'); | ||||
|         let cachedData = window.store.get(CACHE_KEY); | ||||
|  | ||||
|         if (cacheValid && typeof cachedData !== 'undefined') { | ||||
|             apiData = cachedData; | ||||
|             this.parsePiggies(); | ||||
|             this.loading = false; | ||||
|             return; | ||||
|         } | ||||
|  | ||||
|         let params = { | ||||
|             start: window.store.get('start').slice(0, 10), | ||||
|             end: window.store.get('end').slice(0, 10), | ||||
| @@ -49,6 +60,7 @@ export default () => ({ | ||||
|                 this.downloadPiggyBanks(params); | ||||
|                 return; | ||||
|             } | ||||
|             window.store.set(CACHE_KEY, apiData); | ||||
|             this.parsePiggies(); | ||||
|             this.loading = false; | ||||
|         }); | ||||
| @@ -114,12 +126,14 @@ export default () => ({ | ||||
|  | ||||
|             i18n = new I18n(); | ||||
|             i18n.locale = values[1]; | ||||
|             loadTranslations(i18n, values[1]); | ||||
|             loadTranslations(i18n, values[1]).then(() => { | ||||
|                 // console.log('piggies after promises'); | ||||
|                 afterPromises = true; | ||||
|                 this.autoConversion = values[0]; | ||||
|                 this.loadPiggyBanks(); | ||||
|             }); | ||||
|  | ||||
|  | ||||
|             // console.log('piggies after promises'); | ||||
|             afterPromises = true; | ||||
|             this.autoConversion = values[0]; | ||||
|             this.loadPiggyBanks(); | ||||
|         }); | ||||
|         window.store.observe('end', () => { | ||||
|             if (!afterPromises) { | ||||
|   | ||||
| @@ -27,6 +27,7 @@ import {I18n} from "i18n-js"; | ||||
|  | ||||
| Chart.register({SankeyController, Flow}); | ||||
|  | ||||
| const CACHE_KEY = 'dashboard-sankey-data'; | ||||
| let i18n; | ||||
| let currencies = []; | ||||
| let afterPromises = false; | ||||
| @@ -256,7 +257,7 @@ export default () => ({ | ||||
|         let dataSet = | ||||
|             // sankey chart has one data set. | ||||
|             { | ||||
|                 label: 'My sankey', | ||||
|                 label: 'Firefly III dashboard sankey chart', | ||||
|                 data: [], | ||||
|                 colorFrom: (c) => getColor(c.dataset.data[c.dataIndex].from), | ||||
|                 colorTo: (c) => getColor(c.dataset.data[c.dataIndex].to), | ||||
| @@ -284,6 +285,17 @@ export default () => ({ | ||||
|  | ||||
|     }, | ||||
|     getFreshData() { | ||||
|         const cacheValid = window.store.get('cacheValid'); | ||||
|         let cachedData = window.store.get(CACHE_KEY); | ||||
|  | ||||
|         if (cacheValid && typeof cachedData !== 'undefined') { | ||||
|             transactions = cachedData; | ||||
|             this.drawChart(this.generateOptions()); | ||||
|             this.loading = false; | ||||
|             return; | ||||
|         } | ||||
|  | ||||
|  | ||||
|         let params = { | ||||
|             start: window.store.get('start').slice(0, 10), | ||||
|             end: window.store.get('end').slice(0, 10), | ||||
| @@ -305,9 +317,7 @@ export default () => ({ | ||||
|                 this.downloadTransactions(params); | ||||
|                 return; | ||||
|             } | ||||
|             // continue to next step. | ||||
|             //console.log('Final page!'); | ||||
|             //console.log(transactions); | ||||
|             window.store.set(CACHE_KEY, transactions); | ||||
|             this.drawChart(this.generateOptions()); | ||||
|             this.loading = false; | ||||
|         }); | ||||
| @@ -347,13 +357,13 @@ export default () => ({ | ||||
|                 translations.expense_account = i18n.t('firefly.expense_account'); | ||||
|                 translations.revenue_account = i18n.t('firefly.revenue_account'); | ||||
|                 translations.budget = i18n.t('firefly.budget'); | ||||
|  | ||||
|                 // console.log('sankey after promises'); | ||||
|                 afterPromises = true; | ||||
|                 this.autoConversion = values[0]; | ||||
|                 this.loadChart(); | ||||
|             }); | ||||
|  | ||||
|  | ||||
|             // console.log('sankey after promises'); | ||||
|             afterPromises = true; | ||||
|             this.autoConversion = values[0]; | ||||
|             this.loadChart(); | ||||
|         }); | ||||
|         window.store.observe('end', () => { | ||||
|             if (!afterPromises) { | ||||
|   | ||||
| @@ -25,6 +25,8 @@ import {Chart} from 'chart.js'; | ||||
| import {I18n} from "i18n-js"; | ||||
| import {loadTranslations} from "../../support/load-translations.js"; | ||||
|  | ||||
| const CACHE_KEY = 'dashboard-subscriptions-data'; | ||||
|  | ||||
| let chart = null; | ||||
| let chartData = null; | ||||
| let afterPromises = false; | ||||
| @@ -54,6 +56,17 @@ export default () => ({ | ||||
|         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'), | ||||
| @@ -65,6 +78,7 @@ export default () => ({ | ||||
|             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; | ||||
|             }); | ||||
| @@ -138,12 +152,13 @@ export default () => ({ | ||||
|  | ||||
|             i18n = new I18n(); | ||||
|             i18n.locale = values[1]; | ||||
|             loadTranslations(i18n, values[1]); | ||||
|             loadTranslations(i18n, values[1]).then(() => { | ||||
|                 if (false === this.loading) { | ||||
|                     this.loadChart(); | ||||
|                 } | ||||
|             }); | ||||
|  | ||||
|  | ||||
|             if (false === this.loading) { | ||||
|                 this.loadChart(); | ||||
|             } | ||||
|         }); | ||||
|         window.store.observe('end', () => { | ||||
|             if (!afterPromises) { | ||||
|   | ||||
							
								
								
									
										103
									
								
								resources/assets/v2/support/get-colors.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										103
									
								
								resources/assets/v2/support/get-colors.js
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,103 @@ | ||||
| /* | ||||
|  * get-colors.js | ||||
|  * Copyright (c) 2023 james@firefly-iii.org | ||||
|  * | ||||
|  * This file is part of Firefly III (https://github.com/firefly-iii). | ||||
|  * | ||||
|  * This program is free software: you can redistribute it and/or modify | ||||
|  * it under the terms of the GNU Affero General Public License as | ||||
|  * published by the Free Software Foundation, either version 3 of the | ||||
|  * License, or (at your option) any later version. | ||||
|  * | ||||
|  * This program is distributed in the hope that it will be useful, | ||||
|  * but WITHOUT ANY WARRANTY; without even the implied warranty of | ||||
|  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the | ||||
|  * GNU Affero General Public License for more details. | ||||
|  * | ||||
|  * You should have received a copy of the GNU Affero General Public License | ||||
|  * along with this program.  If not, see <https://www.gnu.org/licenses/>. | ||||
|  */ | ||||
|  | ||||
| // some default colors in dark and light: | ||||
|  | ||||
|  | ||||
| import {Color} from '@kurkle/color'; | ||||
|  | ||||
| // base colors for most things | ||||
| let red = new Color('#dc3545'); // same as bootstrap danger | ||||
| let green = new Color('#198754'); // same as bootstrap success. | ||||
| let blue = new Color('#0d6efd'); // bootstrap blue. | ||||
|  | ||||
| // four other colors: | ||||
| let orange = new Color('#fd7e14'); // bootstrap orange. | ||||
|  | ||||
|  | ||||
| let index = 0; | ||||
|  | ||||
| // or cycle through X colors: | ||||
|  | ||||
| if ('light' === window.theme) { | ||||
|     red.lighten(0.3).clearer(0.3); | ||||
|     green.lighten(0.3).clearer(0.3); | ||||
|     blue.lighten(0.3).clearer(0.3); | ||||
|     orange.lighten(0.3).clearer(0.3); | ||||
| } | ||||
|  | ||||
|  | ||||
| let allColors = [red, green, blue, orange]; | ||||
|  | ||||
| function getColors(type, field) { | ||||
|     index++; | ||||
|     let colors = { | ||||
|         borderColor: red.rgbString(), | ||||
|         backgroundColor: red.rgbString(), | ||||
|     }; | ||||
|     let border; | ||||
|     switch (type) { | ||||
|         default: | ||||
|             let currentIndex = (Math.ceil(index / 2) % allColors.length) - 1; | ||||
|             border = new Color(allColors[currentIndex].rgbString()); | ||||
|             border.darken(0.4); | ||||
|             colors = { | ||||
|                 borderColor: border.rgbString(), | ||||
|                 backgroundColor: allColors[currentIndex].rgbString(), | ||||
|             }; | ||||
|             break; | ||||
|         case 'spent': | ||||
|             border = new Color(blue.rgbString()); | ||||
|             border.darken(0.4); | ||||
|             colors = { | ||||
|                 borderColor: border.rgbString(), | ||||
|                 backgroundColor: blue.rgbString(), | ||||
|             }; | ||||
|             break; | ||||
|         case 'left': | ||||
|             border = new Color(green.rgbString()); | ||||
|             border.darken(0.4); | ||||
|             colors = { | ||||
|                 borderColor: border.rgbString(), | ||||
|                 backgroundColor: green.rgbString(), | ||||
|             }; | ||||
|             break; | ||||
|         case 'overspent': | ||||
|             border = new Color(red.rgbString()); | ||||
|             border.darken(0.4); | ||||
|             colors = { | ||||
|                 borderColor: border.rgbString(), | ||||
|                 backgroundColor: red.rgbString(), | ||||
|             }; | ||||
|             break; | ||||
|     } | ||||
|  | ||||
|     if ('border' === field) { | ||||
|         return colors.borderColor; | ||||
|     } | ||||
|     if ('background' === field) { | ||||
|         return colors.backgroundColor; | ||||
|     } | ||||
|  | ||||
|     return '#FF0000'; // panic! | ||||
| } | ||||
|  | ||||
|  | ||||
| export {getColors}; | ||||
		Reference in New Issue
	
	Block a user