From 7849b2f05cfd2f81f2cd315675393d8e915ad8df Mon Sep 17 00:00:00 2001
From: MaysWind <i@mayswind.net>
Date: Sun, 14 Jul 2024 19:55:14 +0800
Subject: [PATCH] update url address when changing the settings on the
 statistics analysis page

---
 src/consts/datetime.js                        |  22 +
 src/consts/statistics.js                      |  15 +
 src/lib/common.js                             |  10 +-
 src/router/desktop.js                         |  13 +-
 src/stores/statistics.js                      | 251 +++++----
 .../cards/AccountFilterSettingsCard.vue       |   6 +-
 .../cards/CategoryFilterSettingsCard.vue      |   6 +-
 .../desktop/statistics/TransactionPage.vue    | 502 ++++++++++++------
 .../mobile/statistics/TransactionPage.vue     |   2 +-
 9 files changed, 558 insertions(+), 269 deletions(-)

diff --git a/src/consts/datetime.js b/src/consts/datetime.js
index 37903e96..a1958f90 100644
--- a/src/consts/datetime.js
+++ b/src/consts/datetime.js
@@ -304,6 +304,27 @@ const allDateRanges = {
     }
 };
 
+const allDateRangesMap = {
+    [allDateRanges.All.type]: allDateRanges.All,
+    [allDateRanges.Today.type]: allDateRanges.Today,
+    [allDateRanges.Yesterday.type]: allDateRanges.Yesterday,
+    [allDateRanges.LastSevenDays.type]: allDateRanges.LastSevenDays,
+    [allDateRanges.LastThirtyDays.type]: allDateRanges.LastThirtyDays,
+    [allDateRanges.ThisWeek.type]: allDateRanges.ThisWeek,
+    [allDateRanges.LastWeek.type]: allDateRanges.LastWeek,
+    [allDateRanges.ThisMonth.type]: allDateRanges.ThisMonth,
+    [allDateRanges.LastMonth.type]: allDateRanges.LastMonth,
+    [allDateRanges.ThisYear.type]: allDateRanges.ThisYear,
+    [allDateRanges.LastYear.type]: allDateRanges.LastYear,
+    [allDateRanges.RecentTwelveMonths.type]: allDateRanges.RecentTwelveMonths,
+    [allDateRanges.RecentTwentyFourMonths.type]: allDateRanges.RecentTwentyFourMonths,
+    [allDateRanges.RecentThirtySixMonths.type]: allDateRanges.RecentThirtySixMonths,
+    [allDateRanges.RecentTwoYears.type]: allDateRanges.RecentTwoYears,
+    [allDateRanges.RecentThreeYears.type]: allDateRanges.RecentThreeYears,
+    [allDateRanges.RecentFiveYears.type]: allDateRanges.RecentFiveYears,
+    [allDateRanges.Custom.type]: allDateRanges.Custom
+};
+
 const defaultFirstDayOfWeek = allWeekDays.Sunday.type;
 const defaultLongDateFormat = allLongDateFormat.YYYYMMDD;
 const defaultShortDateFormat = allShortDateFormat.YYYYMMDD;
@@ -327,6 +348,7 @@ export default {
     allShortTimeFormatArray: allShortTimeFormatArray,
     allDateRangeScenes: allDateRangeScenes,
     allDateRanges: allDateRanges,
+    allDateRangesMap: allDateRangesMap,
     defaultFirstDayOfWeek: defaultFirstDayOfWeek,
     defaultLongDateFormat: defaultLongDateFormat,
     defaultShortDateFormat: defaultShortDateFormat,
diff --git a/src/consts/statistics.js b/src/consts/statistics.js
index 662899ee..81be2a44 100644
--- a/src/consts/statistics.js
+++ b/src/consts/statistics.js
@@ -127,6 +127,20 @@ const allChartDataTypes = {
     }
 };
 
+const allChartDataTypesMap = {
+    [allChartDataTypes.ExpenseByAccount.type]: allChartDataTypes.ExpenseByAccount,
+    [allChartDataTypes.ExpenseByPrimaryCategory.type]: allChartDataTypes.ExpenseByPrimaryCategory,
+    [allChartDataTypes.ExpenseBySecondaryCategory.type]: allChartDataTypes.ExpenseBySecondaryCategory,
+    [allChartDataTypes.IncomeByAccount.type]: allChartDataTypes.IncomeByAccount,
+    [allChartDataTypes.IncomeByPrimaryCategory.type]: allChartDataTypes.IncomeByPrimaryCategory,
+    [allChartDataTypes.IncomeBySecondaryCategory.type]: allChartDataTypes.IncomeBySecondaryCategory,
+    [allChartDataTypes.AccountTotalAssets.type]: allChartDataTypes.AccountTotalAssets,
+    [allChartDataTypes.AccountTotalLiabilities.type]: allChartDataTypes.AccountTotalLiabilities,
+    [allChartDataTypes.TotalExpense.type]: allChartDataTypes.TotalExpense,
+    [allChartDataTypes.TotalIncome.type]: allChartDataTypes.TotalIncome,
+    [allChartDataTypes.TotalBalance.type]: allChartDataTypes.TotalBalance
+};
+
 const defaultChartDataType = allChartDataTypes.ExpenseByPrimaryCategory.type;
 
 const allSortingTypes = {
@@ -164,6 +178,7 @@ export default {
     allTrendChartTypesArray: allTrendChartTypesArray,
     defaultTrendChartType: defaultTrendChartType,
     allChartDataTypes: allChartDataTypes,
+    allChartDataTypesMap: allChartDataTypesMap,
     defaultChartDataType: defaultChartDataType,
     defaultCategoricalChartDataRangeType: datetime.allDateRanges.ThisMonth.type,
     defaultTrendChartDataRangeType: datetime.allDateRanges.ThisYear.type,
diff --git a/src/lib/common.js b/src/lib/common.js
index 4025408a..94dd3396 100644
--- a/src/lib/common.js
+++ b/src/lib/common.js
@@ -2,6 +2,10 @@ export function isFunction(val) {
     return typeof(val) === 'function';
 }
 
+export function isDefined(val) {
+    return typeof val !== 'undefined';
+}
+
 export function isObject(val) {
     return val != null && typeof(val) === 'object' && !isArray(val);
 }
@@ -22,6 +26,10 @@ export function isNumber(val) {
     return typeof(val) === 'number';
 }
 
+export function isInteger(val) {
+    return Number.isInteger(val);
+}
+
 export function isBoolean(val) {
     return typeof(val) === 'boolean';
 }
@@ -375,7 +383,7 @@ export function arrayContainsFieldValue(array, fieldName, value) {
     return false;
 }
 
-export function objectToArray(object) {
+export function objectFieldToArrayItem(object) {
     const ret = [];
 
     for (let field in object) {
diff --git a/src/router/desktop.js b/src/router/desktop.js
index 2127496e..d0a2091b 100644
--- a/src/router/desktop.js
+++ b/src/router/desktop.js
@@ -107,7 +107,18 @@ const router = createRouter({
                 {
                     path: '/statistics/transaction',
                     component: StatisticsTransactionPage,
-                    beforeEnter: checkLogin
+                    beforeEnter: checkLogin,
+                    props: route => ({
+                        initAnalysisType: route.query.analysisType,
+                        initChartDataType: route.query.chartDataType,
+                        initChartType: route.query.chartType,
+                        initChartDateType: route.query.chartDateType,
+                        initStartTime: route.query.startTime,
+                        initEndTime: route.query.endTime,
+                        initFilterAccountIds: route.query.filterAccountIds,
+                        initFilterCategoryIds: route.query.filterCategoryIds,
+                        initSortingType: route.query.sortingType
+                    })
                 },
                 {
                     path: '/account/list',
diff --git a/src/stores/statistics.js b/src/stores/statistics.js
index 0ab845cd..9859a1c6 100644
--- a/src/stores/statistics.js
+++ b/src/stores/statistics.js
@@ -17,8 +17,10 @@ import {
     isEquals,
     isNumber,
     isObject,
+    isInteger,
     isYearMonth,
-    isObjectEmpty
+    isObjectEmpty,
+    objectFieldToArrayItem
 } from '@/lib/common.js';
 import {
     getYearAndMonthFromUnixTime,
@@ -561,186 +563,239 @@ export const useStatisticsStore = defineStore('statistics', {
             this.transactionCategoryTrendsData = {};
             this.transactionStatisticsStateInvalid = true;
         },
-        initTransactionStatisticsFilter(filter) {
-            if (!filter) {
-                const settingsStore = useSettingsStore();
-                const userStore = useUserStore();
+        initTransactionStatisticsFilter(analysisType, filter) {
+            const settingsStore = useSettingsStore();
+            const userStore = useUserStore();
 
-                let defaultChartDataType = settingsStore.appSettings.statistics.defaultChartDataType;
-
-                if (defaultChartDataType < statisticsConstants.allChartDataTypes.ExpenseByAccount.type || defaultChartDataType > statisticsConstants.allChartDataTypes.AccountTotalLiabilities.type) {
-                    defaultChartDataType = statisticsConstants.defaultChartDataType;
-                }
-
-                let defaultCategoricalChartType = settingsStore.appSettings.statistics.defaultCategoricalChartType;
-
-                if (defaultCategoricalChartType !== statisticsConstants.allCategoricalChartTypes.Pie && defaultCategoricalChartType !== statisticsConstants.allCategoricalChartTypes.Bar) {
-                    defaultCategoricalChartType = statisticsConstants.defaultCategoricalChartType;
-                }
-
-                let defaultCategoricalChartDateRange = settingsStore.appSettings.statistics.defaultCategoricalChartDataRangeType;
-
-                if (defaultCategoricalChartDateRange < datetimeConstants.allDateRanges.All.type || defaultCategoricalChartDateRange >= datetimeConstants.allDateRanges.Custom.type) {
-                    defaultCategoricalChartDateRange = statisticsConstants.defaultCategoricalChartDataRangeType;
-                }
-
-                let defaultTrendChartType = settingsStore.appSettings.statistics.defaultTrendChartType;
-
-                if (defaultTrendChartType !== statisticsConstants.allTrendChartTypes.Area && defaultTrendChartType !== statisticsConstants.allTrendChartTypes.Column) {
-                    defaultTrendChartType = statisticsConstants.defaultTrendChartType;
-                }
-
-                let defaultTrendChartDateRange = settingsStore.appSettings.statistics.defaultTrendChartDataRangeType;
-
-                if (defaultTrendChartDateRange < datetimeConstants.allDateRanges.All.type || defaultTrendChartDateRange >= datetimeConstants.allDateRanges.Custom.type) {
-                    defaultTrendChartDateRange = statisticsConstants.defaultTrendChartDataRangeType;
-                }
-
-                let defaultSortType = settingsStore.appSettings.statistics.defaultSortingType;
-
-                if (defaultSortType < statisticsConstants.allSortingTypes.Amount.type || defaultSortType > statisticsConstants.allSortingTypes.Name.type) {
-                    defaultSortType = statisticsConstants.defaultSortingType;
-                }
-
-                const categoricalChartDateRange = getDateRangeByDateType(defaultCategoricalChartDateRange, userStore.currentUserFirstDayOfWeek);
-                const trendChartDateRange = getDateRangeByDateType(defaultTrendChartDateRange, userStore.currentUserFirstDayOfWeek);
-
-                filter = {
-                    chartDataType: defaultChartDataType,
-                    categoricalChartType: defaultCategoricalChartType,
-                    categoricalChartDateType: categoricalChartDateRange ? categoricalChartDateRange.dateType : undefined,
-                    categoricalChartStartTime: categoricalChartDateRange ? categoricalChartDateRange.minTime : undefined,
-                    categoricalChartEndTime: categoricalChartDateRange ? categoricalChartDateRange.maxTime : undefined,
-                    trendChartType: defaultTrendChartType,
-                    trendChartDateType: trendChartDateRange ? trendChartDateRange.dateType : undefined,
-                    trendChartStartYearMonth: trendChartDateRange ? getYearAndMonthFromUnixTime(trendChartDateRange.minTime) : undefined,
-                    trendChartEndYearMonth: trendChartDateRange ? getYearAndMonthFromUnixTime(trendChartDateRange.maxTime) : undefined,
-                    filterAccountIds: settingsStore.appSettings.statistics.defaultAccountFilter || {},
-                    filterCategoryIds: settingsStore.appSettings.statistics.defaultTransactionCategoryFilter || {},
-                    sortingType: defaultSortType,
-                };
-            }
-
-            if (filter && isNumber(filter.chartDataType)) {
+            if (filter && isInteger(filter.chartDataType)) {
                 this.transactionStatisticsFilter.chartDataType = filter.chartDataType;
             } else {
-                this.transactionStatisticsFilter.chartDataType = statisticsConstants.defaultChartDataType;
+                this.transactionStatisticsFilter.chartDataType = settingsStore.appSettings.statistics.defaultChartDataType;
             }
 
-            if (filter && isNumber(filter.categoricalChartType)) {
+            if (analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis || analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                if (!statisticsConstants.allChartDataTypesMap[this.transactionStatisticsFilter.chartDataType] ||
+                    !statisticsConstants.allChartDataTypesMap[this.transactionStatisticsFilter.chartDataType].availableAnalysisTypes[analysisType]) {
+                    this.transactionStatisticsFilter.chartDataType = statisticsConstants.defaultChartDataType;
+                }
+            }
+
+            if (filter && isInteger(filter.categoricalChartType)) {
                 this.transactionStatisticsFilter.categoricalChartType = filter.categoricalChartType;
             } else {
+                this.transactionStatisticsFilter.categoricalChartType = settingsStore.appSettings.statistics.defaultCategoricalChartType;
+            }
+
+            if (this.transactionStatisticsFilter.categoricalChartType !== statisticsConstants.allCategoricalChartTypes.Pie && this.transactionStatisticsFilter.categoricalChartType !== statisticsConstants.allCategoricalChartTypes.Bar) {
                 this.transactionStatisticsFilter.categoricalChartType = statisticsConstants.defaultCategoricalChartType;
             }
 
-            if (filter && isNumber(filter.categoricalChartDateType)) {
+            if (filter && isInteger(filter.categoricalChartDateType)) {
                 this.transactionStatisticsFilter.categoricalChartDateType = filter.categoricalChartDateType;
             } else {
+                this.transactionStatisticsFilter.categoricalChartDateType = settingsStore.appSettings.statistics.defaultCategoricalChartDataRangeType;
+            }
+
+            let categoricalChartDateTypeValid = true;
+
+            if (!datetimeConstants.allDateRangesMap[this.transactionStatisticsFilter.categoricalChartDateType] ||
+                !datetimeConstants.allDateRangesMap[this.transactionStatisticsFilter.categoricalChartDateType].availableScenes[datetimeConstants.allDateRangeScenes.Normal]) {
                 this.transactionStatisticsFilter.categoricalChartDateType = statisticsConstants.defaultCategoricalChartDataRangeType;
+                categoricalChartDateTypeValid = false;
             }
 
-            if (filter && isNumber(filter.categoricalChartStartTime)) {
-                this.transactionStatisticsFilter.categoricalChartStartTime = filter.categoricalChartStartTime;
+            if (categoricalChartDateTypeValid && this.transactionStatisticsFilter.categoricalChartDateType === datetimeConstants.allDateRanges.Custom.type) {
+                if (filter && isInteger(filter.categoricalChartStartTime)) {
+                    this.transactionStatisticsFilter.categoricalChartStartTime = filter.categoricalChartStartTime;
+                } else {
+                    this.transactionStatisticsFilter.categoricalChartStartTime = 0;
+                }
+
+                if (filter && isInteger(filter.categoricalChartEndTime)) {
+                    this.transactionStatisticsFilter.categoricalChartEndTime = filter.categoricalChartEndTime;
+                } else {
+                    this.transactionStatisticsFilter.categoricalChartEndTime = 0;
+                }
             } else {
-                this.transactionStatisticsFilter.categoricalChartStartTime = 0;
+                const categoricalChartDateRange = getDateRangeByDateType(this.transactionStatisticsFilter.categoricalChartDateType, userStore.currentUserFirstDayOfWeek);
+                this.transactionStatisticsFilter.categoricalChartDateType = categoricalChartDateRange.dateType;
+                this.transactionStatisticsFilter.categoricalChartStartTime = categoricalChartDateRange.minTime;
+                this.transactionStatisticsFilter.categoricalChartEndTime = categoricalChartDateRange.maxTime;
             }
 
-            if (filter && isNumber(filter.categoricalChartEndTime)) {
-                this.transactionStatisticsFilter.categoricalChartEndTime = filter.categoricalChartEndTime;
-            } else {
-                this.transactionStatisticsFilter.categoricalChartEndTime = 0;
-            }
-
-            if (filter && isNumber(filter.trendChartType)) {
+            if (filter && isInteger(filter.trendChartType)) {
                 this.transactionStatisticsFilter.trendChartType = filter.trendChartType;
             } else {
+                this.transactionStatisticsFilter.trendChartType = settingsStore.appSettings.statistics.defaultTrendChartType;
+            }
+
+            if (this.transactionStatisticsFilter.trendChartType !== statisticsConstants.allTrendChartTypes.Area && this.transactionStatisticsFilter.trendChartType !== statisticsConstants.allTrendChartTypes.Column) {
                 this.transactionStatisticsFilter.trendChartType = statisticsConstants.defaultTrendChartType;
             }
 
-            if (filter && isNumber(filter.trendChartDateType)) {
+            if (filter && isInteger(filter.trendChartDateType)) {
                 this.transactionStatisticsFilter.trendChartDateType = filter.trendChartDateType;
             } else {
+                this.transactionStatisticsFilter.trendChartDateType = settingsStore.appSettings.statistics.defaultTrendChartDataRangeType;
+            }
+
+            let trendChartDateTypeValid = true;
+
+            if (!datetimeConstants.allDateRangesMap[this.transactionStatisticsFilter.trendChartDateType] ||
+                !datetimeConstants.allDateRangesMap[this.transactionStatisticsFilter.trendChartDateType].availableScenes[datetimeConstants.allDateRangeScenes.TrendAnalysis]) {
                 this.transactionStatisticsFilter.trendChartDateType = statisticsConstants.defaultTrendChartDataRangeType;
+                trendChartDateTypeValid = false;
             }
 
-            if (filter && isYearMonth(filter.trendChartStartYearMonth)) {
-                this.transactionStatisticsFilter.trendChartStartYearMonth = filter.trendChartStartYearMonth;
-            } else {
-                this.transactionStatisticsFilter.trendChartStartYearMonth = '';
-            }
+            if (trendChartDateTypeValid && this.transactionStatisticsFilter.trendChartDateType === datetimeConstants.allDateRanges.Custom.type) {
+                if (filter && isYearMonth(filter.trendChartStartYearMonth)) {
+                    this.transactionStatisticsFilter.trendChartStartYearMonth = filter.trendChartStartYearMonth;
+                } else {
+                    this.transactionStatisticsFilter.trendChartStartYearMonth = '';
+                }
 
-            if (filter && isYearMonth(filter.trendChartEndYearMonth)) {
-                this.transactionStatisticsFilter.trendChartEndYearMonth = filter.trendChartEndYearMonth;
+                if (filter && isYearMonth(filter.trendChartEndYearMonth)) {
+                    this.transactionStatisticsFilter.trendChartEndYearMonth = filter.trendChartEndYearMonth;
+                } else {
+                    this.transactionStatisticsFilter.trendChartEndYearMonth = '';
+                }
             } else {
-                this.transactionStatisticsFilter.trendChartEndYearMonth = '';
+                const trendChartDateRange = getDateRangeByDateType(this.transactionStatisticsFilter.trendChartDateType, userStore.currentUserFirstDayOfWeek);
+                this.transactionStatisticsFilter.trendChartDateType = trendChartDateRange.dateType;
+                this.transactionStatisticsFilter.trendChartStartYearMonth = getYearAndMonthFromUnixTime(trendChartDateRange.minTime);
+                this.transactionStatisticsFilter.trendChartEndYearMonth = getYearAndMonthFromUnixTime(trendChartDateRange.maxTime);
             }
 
             if (filter && isObject(filter.filterAccountIds)) {
                 this.transactionStatisticsFilter.filterAccountIds = filter.filterAccountIds;
             } else {
-                this.transactionStatisticsFilter.filterAccountIds = {};
+                this.transactionStatisticsFilter.filterAccountIds = settingsStore.appSettings.statistics.defaultAccountFilter || {};
             }
 
             if (filter && isObject(filter.filterCategoryIds)) {
                 this.transactionStatisticsFilter.filterCategoryIds = filter.filterCategoryIds;
             } else {
-                this.transactionStatisticsFilter.filterCategoryIds = {};
+                this.transactionStatisticsFilter.filterCategoryIds = settingsStore.appSettings.statistics.defaultTransactionCategoryFilter || {};
             }
 
-            if (filter && isNumber(filter.sortingType)) {
+            if (filter && isInteger(filter.sortingType)) {
                 this.transactionStatisticsFilter.sortingType = filter.sortingType;
             } else {
+                this.transactionStatisticsFilter.sortingType = settingsStore.appSettings.statistics.defaultSortingType;
+            }
+
+            if (this.transactionStatisticsFilter.sortingType < statisticsConstants.allSortingTypes.Amount.type || this.transactionStatisticsFilter.sortingType > statisticsConstants.allSortingTypes.Name.type) {
                 this.transactionStatisticsFilter.sortingType = statisticsConstants.defaultSortingType;
             }
         },
         updateTransactionStatisticsFilter(filter) {
-            if (filter && isNumber(filter.chartDataType)) {
+            let changed = false;
+
+            if (filter && isInteger(filter.chartDataType) && this.transactionStatisticsFilter.chartDataType !== filter.chartDataType) {
                 this.transactionStatisticsFilter.chartDataType = filter.chartDataType;
+                changed = true;
             }
 
-            if (filter && isNumber(filter.categoricalChartType)) {
+            if (filter && isInteger(filter.categoricalChartType) && this.transactionStatisticsFilter.categoricalChartType !== filter.categoricalChartType) {
                 this.transactionStatisticsFilter.categoricalChartType = filter.categoricalChartType;
+                changed = true;
             }
 
-            if (filter && isNumber(filter.categoricalChartDateType)) {
+            if (filter && isInteger(filter.categoricalChartDateType) && this.transactionStatisticsFilter.categoricalChartDateType !== filter.categoricalChartDateType) {
                 this.transactionStatisticsFilter.categoricalChartDateType = filter.categoricalChartDateType;
+                changed = true;
             }
 
-            if (filter && isNumber(filter.categoricalChartStartTime)) {
+            if (filter && isInteger(filter.categoricalChartStartTime) && this.transactionStatisticsFilter.categoricalChartStartTime !== filter.categoricalChartStartTime) {
                 this.transactionStatisticsFilter.categoricalChartStartTime = filter.categoricalChartStartTime;
+                changed = true;
             }
 
-            if (filter && isNumber(filter.categoricalChartEndTime)) {
+            if (filter && isInteger(filter.categoricalChartEndTime) && this.transactionStatisticsFilter.categoricalChartEndTime !== filter.categoricalChartEndTime) {
                 this.transactionStatisticsFilter.categoricalChartEndTime = filter.categoricalChartEndTime;
+                changed = true;
             }
 
-            if (filter && isNumber(filter.trendChartType)) {
+            if (filter && isInteger(filter.trendChartType) && this.transactionStatisticsFilter.trendChartType !== filter.trendChartType) {
                 this.transactionStatisticsFilter.trendChartType = filter.trendChartType;
+                changed = true;
             }
 
-            if (filter && isNumber(filter.trendChartDateType)) {
+            if (filter && isInteger(filter.trendChartDateType) && this.transactionStatisticsFilter.trendChartDateType !== filter.trendChartDateType) {
                 this.transactionStatisticsFilter.trendChartDateType = filter.trendChartDateType;
+                changed = true;
             }
 
-            if (filter && (isYearMonth(filter.trendChartStartYearMonth) || filter.trendChartStartYearMonth === '')) {
+            if (filter && (isYearMonth(filter.trendChartStartYearMonth) || filter.trendChartStartYearMonth === '') && this.transactionStatisticsFilter.trendChartStartYearMonth !== filter.trendChartStartYearMonth) {
                 this.transactionStatisticsFilter.trendChartStartYearMonth = filter.trendChartStartYearMonth;
+                changed = true;
             }
 
-            if (filter && (isYearMonth(filter.trendChartEndYearMonth) || filter.trendChartEndYearMonth === '')) {
+            if (filter && (isYearMonth(filter.trendChartEndYearMonth) || filter.trendChartEndYearMonth === '') && this.transactionStatisticsFilter.trendChartEndYearMonth !== filter.trendChartEndYearMonth) {
                 this.transactionStatisticsFilter.trendChartEndYearMonth = filter.trendChartEndYearMonth;
+                changed = true;
             }
 
-            if (filter && isObject(filter.filterAccountIds)) {
+            if (filter && isObject(filter.filterAccountIds) && !isEquals(this.transactionStatisticsFilter.filterAccountIds, filter.filterAccountIds)) {
                 this.transactionStatisticsFilter.filterAccountIds = filter.filterAccountIds;
+                changed = true;
             }
 
-            if (filter && isObject(filter.filterCategoryIds)) {
+            if (filter && isObject(filter.filterCategoryIds) && !isEquals(this.transactionStatisticsFilter.filterCategoryIds, filter.filterCategoryIds)) {
                 this.transactionStatisticsFilter.filterCategoryIds = filter.filterCategoryIds;
+                changed = true;
             }
 
-            if (filter && isNumber(filter.sortingType)) {
+            if (filter && isInteger(filter.sortingType) && this.transactionStatisticsFilter.sortingType !== filter.sortingType) {
                 this.transactionStatisticsFilter.sortingType = filter.sortingType;
+                changed = true;
             }
+
+            return changed;
+        },
+        getTransactionStatisticsPageParams(analysisType) {
+            const querys = [];
+
+            querys.push('analysisType=' + analysisType);
+            querys.push('chartDataType=' + this.transactionStatisticsFilter.chartDataType);
+
+            if (analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                querys.push('chartType=' + this.transactionStatisticsFilter.categoricalChartType);
+                querys.push('chartDateType=' + this.transactionStatisticsFilter.categoricalChartDateType);
+
+                if (this.transactionStatisticsFilter.categoricalChartDateType === datetimeConstants.allDateRanges.Custom.type) {
+                    querys.push('startTime=' + this.transactionStatisticsFilter.categoricalChartStartTime);
+                    querys.push('endTime=' + this.transactionStatisticsFilter.categoricalChartEndTime);
+                }
+            } else if (analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                querys.push('chartType=' + this.transactionStatisticsFilter.trendChartType);
+                querys.push('chartDateType=' + this.transactionStatisticsFilter.trendChartDateType);
+
+                if (this.transactionStatisticsFilter.trendChartDateType === datetimeConstants.allDateRanges.Custom.type) {
+                    querys.push('startTime=' + this.transactionStatisticsFilter.trendChartStartYearMonth);
+                    querys.push('endTime=' + this.transactionStatisticsFilter.trendChartEndYearMonth);
+                }
+            }
+
+            if (this.transactionStatisticsFilter.filterAccountIds) {
+                const ids = objectFieldToArrayItem(this.transactionStatisticsFilter.filterAccountIds);
+
+                if (ids && ids.length) {
+                    querys.push('filterAccountIds=' + ids.join(','));
+                }
+            }
+
+            if (this.transactionStatisticsFilter.filterCategoryIds) {
+                const ids = objectFieldToArrayItem(this.transactionStatisticsFilter.filterCategoryIds);
+
+                if (ids && ids.length) {
+                    querys.push('filterCategoryIds=' + ids.join(','));
+                }
+            }
+
+            querys.push('sortingType=' + this.transactionStatisticsFilter.sortingType);
+
+            return querys.join('&');
         },
         getTransactionListPageParams(analysisType, item, dateRange) {
             const accountsStore = useAccountsStore();
diff --git a/src/views/desktop/common/cards/AccountFilterSettingsCard.vue b/src/views/desktop/common/cards/AccountFilterSettingsCard.vue
index 6e76cc06..4db83e5f 100644
--- a/src/views/desktop/common/cards/AccountFilterSettingsCard.vue
+++ b/src/views/desktop/common/cards/AccountFilterSettingsCard.vue
@@ -278,9 +278,13 @@ export default {
             if (this.type === 'statisticsDefault') {
                 self.settingsStore.setStatisticsDefaultAccountFilter(filteredAccountIds);
             } else if (this.type === 'statisticsCurrent') {
-                self.statisticsStore.updateTransactionStatisticsFilter({
+                changed = self.statisticsStore.updateTransactionStatisticsFilter({
                     filterAccountIds: filteredAccountIds
                 });
+
+                if (changed) {
+                    self.statisticsStore.updateTransactionStatisticsInvalidState(true);
+                }
             } else if (this.type === 'transactionListCurrent') {
                 changed = self.transactionsStore.updateTransactionListFilter({
                     accountIds: isAllSelected ? '' : finalAccountIds
diff --git a/src/views/desktop/common/cards/CategoryFilterSettingsCard.vue b/src/views/desktop/common/cards/CategoryFilterSettingsCard.vue
index 481a6f58..9eb879bb 100644
--- a/src/views/desktop/common/cards/CategoryFilterSettingsCard.vue
+++ b/src/views/desktop/common/cards/CategoryFilterSettingsCard.vue
@@ -294,9 +294,13 @@ export default {
             if (this.type === 'statisticsDefault') {
                 self.settingsStore.setStatisticsDefaultTransactionCategoryFilter(filteredCategoryIds);
             } else if (this.type === 'statisticsCurrent') {
-                self.statisticsStore.updateTransactionStatisticsFilter({
+                changed = self.statisticsStore.updateTransactionStatisticsFilter({
                     filterCategoryIds: filteredCategoryIds
                 });
+
+                if (changed) {
+                    self.statisticsStore.updateTransactionStatisticsInvalidState(true);
+                }
             } else if (this.type === 'transactionListCurrent') {
                 changed = self.transactionsStore.updateTransactionListFilter({
                     categoryIds: isAllSelected ? '' : finalCategoryIds
diff --git a/src/views/desktop/statistics/TransactionPage.vue b/src/views/desktop/statistics/TransactionPage.vue
index 155a019f..22be9820 100644
--- a/src/views/desktop/statistics/TransactionPage.vue
+++ b/src/views/desktop/statistics/TransactionPage.vue
@@ -8,7 +8,7 @@
                             <btn-vertical-group :disabled="loading" :buttons="[
                                 { name: $t('Categorical Analysis'), value: allAnalysisTypes.CategoricalAnalysis },
                                 { name: $t('Trend Analysis'), value: allAnalysisTypes.TrendAnalysis }
-                            ]" v-model="analysisType" />
+                            ]" v-model="queryAnalysisType" />
                         </div>
                         <v-divider />
                         <div class="mx-6 mt-4">
@@ -36,9 +36,9 @@
                             />
                         </div>
                         <v-tabs show-arrows class="my-4" direction="vertical"
-                                :disabled="loading" v-model="query.chartDataType">
+                                :disabled="loading" v-model="queryChartDataType">
                             <v-tab class="tab-text-truncate" :key="dataType.type" :value="dataType.type"
-                                   v-for="dataType in allChartDataTypes" v-show="dataType.availableAnalysisTypes[analysisType]">
+                                   v-for="dataType in allChartDataTypes" v-show="dataType.availableAnalysisTypes[queryAnalysisType]">
                                 <span class="text-truncate">{{ $t(dataType.name) }}</span>
                                 <v-tooltip activator="parent" location="right">{{ $t(dataType.name) }}</v-tooltip>
                             </v-tab>
@@ -57,12 +57,12 @@
                                             <span>{{ $t('Statistics & Analysis') }}</span>
                                             <v-btn-group class="ml-4" color="default" density="comfortable" variant="outlined" divided>
                                                 <v-btn :icon="icons.left"
-                                                       :disabled="loading || !canShiftDateRange(query)"
-                                                       @click="shiftDateRange(query, -1)"/>
+                                                       :disabled="loading || !canShiftDateRange()"
+                                                       @click="shiftDateRange(-1)"/>
                                                 <v-menu location="bottom">
                                                     <template #activator="{ props }">
-                                                        <v-btn :disabled="loading || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type"
-                                                               v-bind="props">{{ dateRangeName(query) }}</v-btn>
+                                                        <v-btn :disabled="loading || queryChartDataType === allChartDataTypes.AccountTotalAssets.type || queryChartDataType === allChartDataTypes.AccountTotalLiabilities.type"
+                                                               v-bind="props">{{ dateRangeName() }}</v-btn>
                                                     </template>
                                                     <v-list :selected="[queryDateType]">
                                                         <v-list-item :key="dateRange.type" :value="dateRange.type"
@@ -72,7 +72,7 @@
                                                                 class="cursor-pointer"
                                                                 @click="setDateFilter(dateRange.type)">
                                                                 {{ dateRange.displayName }}
-                                                                <div class="statistics-custom-datetime-range" v-if="dateRange.type === allDateRanges.Custom.type && showCustomDateRange(query)">
+                                                                <div class="statistics-custom-datetime-range" v-if="dateRange.type === allDateRanges.Custom.type && showCustomDateRange()">
                                                                     <span>{{ queryStartTime }}</span>
                                                                     <span>&nbsp;-&nbsp;</span>
                                                                     <br/>
@@ -83,8 +83,8 @@
                                                     </v-list>
                                                 </v-menu>
                                                 <v-btn :icon="icons.right"
-                                                       :disabled="loading || !canShiftDateRange(query)"
-                                                       @click="shiftDateRange(query, 1)"/>
+                                                       :disabled="loading || !canShiftDateRange()"
+                                                       @click="shiftDateRange(1)"/>
                                             </v-btn-group>
 
                                             <v-btn density="compact" color="default" variant="text" size="24"
@@ -118,7 +118,7 @@
                                     </template>
 
                                     <v-card-text class="statistics-overview-title pt-0" :class="{ 'disabled': loading }"
-                                                 v-if="analysisType === allAnalysisTypes.CategoricalAnalysis && (initing || (categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length))">
+                                                 v-if="queryAnalysisType === allAnalysisTypes.CategoricalAnalysis && (initing || (categoricalAnalysisData && categoricalAnalysisData.items && categoricalAnalysisData.items.length))">
                                         <span class="statistics-subtitle">{{ totalAmountName }}</span>
                                         <span class="statistics-overview-amount ml-3"
                                               :class="statisticsTextColor"
@@ -131,12 +131,12 @@
                                     </v-card-text>
 
                                     <v-card-text class="statistics-overview-title pt-0"
-                                                 v-else-if="!initing && ((analysisType === allAnalysisTypes.CategoricalAnalysis && (!categoricalAnalysisData || !categoricalAnalysisData.items || !categoricalAnalysisData.items.length))
-                                                  || (analysisType === allAnalysisTypes.TrendAnalysis && (!trendsAnalysisData || !trendsAnalysisData.items || !trendsAnalysisData.items.length)))">
+                                                 v-else-if="!initing && ((queryAnalysisType === allAnalysisTypes.CategoricalAnalysis && (!categoricalAnalysisData || !categoricalAnalysisData.items || !categoricalAnalysisData.items.length))
+                                                  || (queryAnalysisType === allAnalysisTypes.TrendAnalysis && (!trendsAnalysisData || !trendsAnalysisData.items || !trendsAnalysisData.items.length)))">
                                         <span class="statistics-subtitle statistics-overview-empty-tip">{{ $t('No transaction data') }}</span>
                                     </v-card-text>
 
-                                    <v-card-text :class="{ 'readonly': loading }" v-if="analysisType === allAnalysisTypes.CategoricalAnalysis && query.categoricalChartType === allCategoricalChartTypes.Pie">
+                                    <v-card-text :class="{ 'readonly': loading }" v-if="queryAnalysisType === allAnalysisTypes.CategoricalAnalysis && query.categoricalChartType === allCategoricalChartTypes.Pie">
                                         <pie-chart
                                             :items="[
                                                 {id: '1', name: '---', value: 60, color: '7c7c7f'},
@@ -166,7 +166,7 @@
                                         />
                                     </v-card-text>
 
-                                    <v-card-text :class="{ 'readonly': loading }" v-if="analysisType === allAnalysisTypes.CategoricalAnalysis && query.categoricalChartType === allCategoricalChartTypes.Bar">
+                                    <v-card-text :class="{ 'readonly': loading }" v-if="queryAnalysisType === allAnalysisTypes.CategoricalAnalysis && query.categoricalChartType === allCategoricalChartTypes.Bar">
                                         <v-list rounded lines="two" v-if="initing">
                                             <template :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]">
                                                 <v-list-item class="pl-0">
@@ -193,13 +193,13 @@
                                                       v-for="(item, idx) in categoricalAnalysisData.items">
                                                 <v-list-item class="pl-0" v-if="!item.hidden">
                                                     <template #prepend>
-                                                        <router-link class="statistics-list-item" :to="getItemLinkUrl(item)">
+                                                        <router-link class="statistics-list-item" :to="getTransactionItemLinkUrl(item)">
                                                             <ItemIcon :icon-type="queryChartDataCategory" size="34px"
                                                                       :icon-id="item.icon"
                                                                       :color="item.color"></ItemIcon>
                                                         </router-link>
                                                     </template>
-                                                    <router-link class="statistics-list-item" :to="getItemLinkUrl(item)">
+                                                    <router-link class="statistics-list-item" :to="getTransactionItemLinkUrl(item)">
                                                         <div class="d-flex flex-column ml-2">
                                                             <div class="d-flex">
                                                                 <span>{{ item.name }}</span>
@@ -221,7 +221,7 @@
                                         </v-list>
                                     </v-card-text>
 
-                                    <v-card-text :class="{ 'readonly': loading }" v-if="analysisType === allAnalysisTypes.TrendAnalysis">
+                                    <v-card-text :class="{ 'readonly': loading }" v-if="queryAnalysisType === allAnalysisTypes.TrendAnalysis">
                                         <trends-chart
                                             :type="queryChartType"
                                             :start-year-month="query.trendChartStartYearMonth"
@@ -277,12 +277,12 @@
 
     <v-dialog width="800" v-model="showFilterAccountDialog">
         <account-filter-settings-card type="statisticsCurrent" :dialog-mode="true"
-            @settings:change="showFilterAccountDialog = false" />
+            @settings:change="setAccountFilter" />
     </v-dialog>
 
     <v-dialog width="800" v-model="showFilterCategoryDialog">
         <category-filter-settings-card type="statisticsCurrent" :dialog-mode="true"
-            @settings:change="showFilterCategoryDialog = false" />
+            @settings:change="setCategoryFilter" />
     </v-dialog>
 
     <snack-bar ref="snackbar" />
@@ -300,7 +300,11 @@ import { useStatisticsStore } from '@/stores/statistics.js';
 
 import datetimeConstants from '@/consts/datetime.js';
 import statisticsConstants from '@/consts/statistics.js';
-import { limitText } from '@/lib/common.js'
+import {
+    isDefined,
+    limitText,
+    arrayItemToObjectField
+} from '@/lib/common.js'
 import { formatPercent } from '@/lib/numeral.js';
 import {
     getYearAndMonthFromUnixTime,
@@ -334,6 +338,17 @@ export default {
         AccountFilterSettingsCard,
         CategoryFilterSettingsCard
     },
+    props: [
+        'initAnalysisType',
+        'initChartDataType',
+        'initChartType',
+        'initChartDateType',
+        'initStartTime',
+        'initEndTime',
+        'initFilterAccountIds',
+        'initFilterCategoryIds',
+        'initSortingType'
+    ],
     data() {
         const { mdAndUp } = useDisplay();
 
@@ -374,6 +389,14 @@ export default {
         firstDayOfWeek() {
             return this.userStore.currentUserFirstDayOfWeek;
         },
+        queryAnalysisType: {
+            get: function () {
+                return this.analysisType;
+            },
+            set: function(value) {
+                this.setAnalysisType(value);
+            }
+        },
         query() {
             return this.statisticsStore.transactionStatisticsFilter;
         },
@@ -382,9 +405,9 @@ export default {
         },
         queryChartType: {
             get: function () {
-                if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                     return this.query.categoricalChartType;
-                } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                     return this.query.trendChartType;
                 } else {
                     return null;
@@ -394,6 +417,14 @@ export default {
                 this.setChartType(value);
             }
         },
+        queryChartDataType: {
+            get: function () {
+                return this.query.chartDataType;
+            },
+            set: function(value) {
+                this.setChartDataType(value);
+            }
+        },
         querySortingType: {
             get: function () {
                 return this.query.sortingType;
@@ -403,27 +434,27 @@ export default {
             }
         },
         queryDateType() {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                 return this.query.categoricalChartDateType;
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                 return this.query.trendChartDateType;
             } else {
                 return null;
             }
         },
         queryStartTime() {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                 return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartStartTime);
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                 return this.$locale.formatUnixTimeToLongYearMonth(this.userStore, getYearMonthFirstUnixTime(this.query.trendChartStartYearMonth));
             } else {
                 return [];
             }
         },
         queryEndTime() {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                 return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartEndTime);
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                 return this.$locale.formatUnixTimeToLongYearMonth(this.userStore, getYearMonthLastUnixTime(this.query.trendChartEndYearMonth));
             } else {
                 return [];
@@ -433,9 +464,9 @@ export default {
             return statisticsConstants.allAnalysisTypes;
         },
         allChartTypes() {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                 return this.$locale.getAllCategoricalChartTypes();
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                 return this.$locale.getAllTrendChartTypes();
             } else {
                 return [];
@@ -457,9 +488,9 @@ export default {
             return datetimeConstants.allDateRanges;
         },
         allDateRangesArray() {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                 return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.Normal, true);
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                 return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.TrendAnalysis, true);
             } else {
                 return [];
@@ -469,17 +500,17 @@ export default {
             return this.settingsStore.appSettings.showAccountBalance;
         },
         totalAmountName() {
-            if (this.query.chartDataType === this.allChartDataTypes.IncomeByAccount.type
-                || this.query.chartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type
-                || this.query.chartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) {
+            if (this.queryChartDataType === this.allChartDataTypes.IncomeByAccount.type
+                || this.queryChartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type
+                || this.queryChartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) {
                 return this.$t('Total Income');
-            } else if (this.query.chartDataType === this.allChartDataTypes.ExpenseByAccount.type
-                || this.query.chartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type
-                || this.query.chartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) {
+            } else if (this.queryChartDataType === this.allChartDataTypes.ExpenseByAccount.type
+                || this.queryChartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type
+                || this.queryChartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) {
                 return this.$t('Total Expense');
-            } else if (this.query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type) {
+            } else if (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type) {
                 return this.$t('Total Assets');
-            } else if (this.query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
+            } else if (this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
                 return this.$t('Total Liabilities');
             }
 
@@ -492,23 +523,23 @@ export default {
             return this.statisticsStore.trendsAnalysisData;
         },
         translateNameInTrendsChart() {
-            return this.query.chartDataType === this.allChartDataTypes.TotalExpense.type ||
-                this.query.chartDataType === this.allChartDataTypes.TotalIncome.type ||
-                this.query.chartDataType === this.allChartDataTypes.TotalBalance.type;
+            return this.queryChartDataType === this.allChartDataTypes.TotalExpense.type ||
+                this.queryChartDataType === this.allChartDataTypes.TotalIncome.type ||
+                this.queryChartDataType === this.allChartDataTypes.TotalBalance.type;
         },
         showTotalAmountInTrendsChart() {
-            return this.query.chartDataType !== this.allChartDataTypes.TotalExpense.type &&
-                this.query.chartDataType !== this.allChartDataTypes.TotalIncome.type &&
-                this.query.chartDataType !== this.allChartDataTypes.TotalBalance.type;
+            return this.queryChartDataType !== this.allChartDataTypes.TotalExpense.type &&
+                this.queryChartDataType !== this.allChartDataTypes.TotalIncome.type &&
+                this.queryChartDataType !== this.allChartDataTypes.TotalBalance.type;
         },
         statisticsTextColor() {
-            if (this.query.chartDataType === this.allChartDataTypes.ExpenseByAccount.type ||
-                this.query.chartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type ||
-                this.query.chartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) {
+            if (this.queryChartDataType === this.allChartDataTypes.ExpenseByAccount.type ||
+                this.queryChartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type ||
+                this.queryChartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) {
                 return 'text-expense';
-            } else if (this.query.chartDataType === this.allChartDataTypes.IncomeByAccount.type ||
-                this.query.chartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type ||
-                this.query.chartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) {
+            } else if (this.queryChartDataType === this.allChartDataTypes.IncomeByAccount.type ||
+                this.queryChartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type ||
+                this.queryChartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) {
                 return 'text-income';
             } else {
                 return 'text-default';
@@ -516,7 +547,7 @@ export default {
         },
         showAmountInChart() {
             if (!this.showAccountBalance
-                && (this.query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type || this.query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type)) {
+                && (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type || this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type)) {
                 return false;
             }
 
@@ -524,28 +555,6 @@ export default {
         }
     },
     watch: {
-        'analysisType': function (newValue) {
-            const self = this;
-
-            if (!isChartDataTypeAvailableForAnalysisType(self.query.chartDataType, newValue)) {
-                self.query.chartDataType = statisticsConstants.defaultChartDataType;
-            }
-
-            self.initing = true;
-
-            const promise = self.reload(null);
-
-            if (promise) {
-                promise.then(() => {
-                    self.initing = false;
-                });
-            }
-        },
-        'query.chartDataType': function (newValue) {
-            this.statisticsStore.updateTransactionStatisticsFilter({
-                chartDataType: newValue
-            });
-        },
         'display.mdAndUp.value': function (newValue) {
             this.alwaysShowNav = newValue;
 
@@ -555,33 +564,16 @@ export default {
         }
     },
     created() {
-        const self = this;
-
-        self.statisticsStore.initTransactionStatisticsFilter();
-
-        Promise.all([
-            self.accountsStore.loadAllAccounts({ force: false }),
-            self.transactionCategoriesStore.loadAllCategories({ force: false })
-        ]).then(() => {
-            if (self.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
-                return self.statisticsStore.loadCategoricalAnalysis({
-                    force: false
-                });
-            } else if (self.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
-                return self.statisticsStore.loadTrendAnalysis({
-                    force: false
-                });
-            }
-        }).then(() => {
-            self.loading = false;
-            self.initing = false;
-        }).catch(error => {
-            self.loading = false;
-            self.initing = false;
-
-            if (!error.processed) {
-                self.$refs.snackbar.showError(error);
-            }
+        this.init({
+            analysisType: this.initAnalysisType,
+            chartDataType: this.initChartDataType,
+            chartType: this.initChartType,
+            chartDateType: this.initChartDateType,
+            startTime: this.initStartTime,
+            endTime: this.initEndTime,
+            filterAccountIds: this.initFilterAccountIds,
+            filterCategoryIds: this.initFilterCategoryIds,
+            sortingType: this.initSortingType,
         });
     },
     setup() {
@@ -593,33 +585,139 @@ export default {
             globalTheme: theme
         };
     },
+    beforeRouteUpdate(to) {
+        if (to.query) {
+            this.init({
+                analysisType: to.query.analysisType,
+                chartDataType: to.query.chartDataType,
+                chartType: to.query.chartType,
+                chartDateType: to.query.chartDateType,
+                startTime: to.query.startTime,
+                endTime: to.query.endTime,
+                filterAccountIds: to.query.filterAccountIds,
+                filterCategoryIds: to.query.filterCategoryIds,
+                sortingType: to.query.sortingType
+            });
+        } else {
+            this.init({});
+        }
+    },
     methods: {
+        init(query) {
+            const self = this;
+            let needReload = !isDefined(query.analysisType);
+
+            let filter = {
+                chartDataType: query.chartDataType ? parseInt(query.chartDataType) : undefined,
+                filterAccountIds: query.filterAccountIds ? arrayItemToObjectField(query.filterAccountIds.split(','), true) : {},
+                filterCategoryIds: query.filterCategoryIds ? arrayItemToObjectField(query.filterCategoryIds.split(','), true) : {},
+                sortingType: query.sortingType ? parseInt(query.sortingType) : undefined
+            };
+
+            if (query.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis.toString()) {
+                filter.categoricalChartType = query.chartType ? parseInt(query.chartType) : undefined;
+                filter.categoricalChartDateType = query.chartDateType ? parseInt(query.chartDateType) : undefined;
+                filter.categoricalChartStartTime = query.startTime ? parseInt(query.startTime) : undefined;
+                filter.categoricalChartEndTime = query.endTime ? parseInt(query.endTime) : undefined;
+
+                if (filter.categoricalChartDateType !== self.query.categoricalChartDateType) {
+                    needReload = true;
+                } else if (filter.categoricalChartDateType === datetimeConstants.allDateRanges.Custom.type) {
+                    if (filter.categoricalChartStartTime !== self.query.categoricalChartStartTime
+                        || filter.categoricalChartEndTime !== self.query.categoricalChartEndTime) {
+                        needReload = true;
+                    }
+                }
+
+                if (query.analysisType !== self.queryAnalysisType.toString()) {
+                    self.analysisType = statisticsConstants.allAnalysisTypes.CategoricalAnalysis;
+                    needReload = true;
+                }
+            } else if (query.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis.toString()) {
+                filter.trendChartType = query.chartType ? parseInt(query.chartType) : undefined;
+                filter.trendChartDateType = query.chartDateType ? parseInt(query.chartDateType) : undefined;
+                filter.trendChartStartYearMonth = query.startTime;
+                filter.trendChartEndYearMonth = query.endTime;
+
+                if (filter.trendChartDateType !== self.query.trendChartDateType) {
+                    needReload = true;
+                } else if (filter.trendChartDateType === datetimeConstants.allDateRanges.Custom.type) {
+                    if (filter.trendChartStartYearMonth !== self.query.trendChartStartYearMonth
+                        || filter.trendChartEndYearMonth !== self.query.trendChartEndYearMonth) {
+                        needReload = true;
+                    }
+                }
+
+                if (query.analysisType !== self.queryAnalysisType.toString()) {
+                    self.analysisType = statisticsConstants.allAnalysisTypes.TrendAnalysis;
+                    needReload = true;
+                }
+            }
+
+            if (!isDefined(query.analysisType)) {
+                self.analysisType = statisticsConstants.allAnalysisTypes.CategoricalAnalysis;
+                filter = null;
+            }
+
+            self.statisticsStore.initTransactionStatisticsFilter(self.queryAnalysisType, filter);
+
+            if (!needReload && !self.statisticsStore.transactionStatisticsStateInvalid) {
+                self.loading = false;
+                self.initing = false;
+                return;
+            }
+
+            Promise.all([
+                self.accountsStore.loadAllAccounts({force: false}),
+                self.transactionCategoriesStore.loadAllCategories({force: false})
+            ]).then(() => {
+                if (self.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                    return self.statisticsStore.loadCategoricalAnalysis({
+                        force: false
+                    });
+                } else if (self.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                    return self.statisticsStore.loadTrendAnalysis({
+                        force: false
+                    });
+                }
+            }).then(() => {
+                self.loading = false;
+                self.initing = false;
+            }).catch(error => {
+                self.loading = false;
+                self.initing = false;
+
+                if (!error.processed) {
+                    self.$refs.snackbar.showError(error);
+                }
+            });
+        },
         reload(force) {
             const self = this;
             let dispatchPromise = null;
 
             self.loading = true;
 
-            if (self.query.chartDataType === self.allChartDataTypes.ExpenseByAccount.type ||
-                self.query.chartDataType === self.allChartDataTypes.ExpenseByPrimaryCategory.type ||
-                self.query.chartDataType === self.allChartDataTypes.ExpenseBySecondaryCategory.type ||
-                self.query.chartDataType === self.allChartDataTypes.IncomeByAccount.type ||
-                self.query.chartDataType === self.allChartDataTypes.IncomeByPrimaryCategory.type ||
-                self.query.chartDataType === self.allChartDataTypes.IncomeBySecondaryCategory.type ||
-                self.query.chartDataType === self.allChartDataTypes.TotalExpense.type ||
-                self.query.chartDataType === self.allChartDataTypes.TotalIncome.type ||
-                self.query.chartDataType === self.allChartDataTypes.TotalBalance.type) {
-                if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            if (self.queryChartDataType === self.allChartDataTypes.ExpenseByAccount.type ||
+                self.queryChartDataType === self.allChartDataTypes.ExpenseByPrimaryCategory.type ||
+                self.queryChartDataType === self.allChartDataTypes.ExpenseBySecondaryCategory.type ||
+                self.queryChartDataType === self.allChartDataTypes.IncomeByAccount.type ||
+                self.queryChartDataType === self.allChartDataTypes.IncomeByPrimaryCategory.type ||
+                self.queryChartDataType === self.allChartDataTypes.IncomeBySecondaryCategory.type ||
+                self.queryChartDataType === self.allChartDataTypes.TotalExpense.type ||
+                self.queryChartDataType === self.allChartDataTypes.TotalIncome.type ||
+                self.queryChartDataType === self.allChartDataTypes.TotalBalance.type) {
+                if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                     dispatchPromise = self.statisticsStore.loadCategoricalAnalysis({
                         force: force
                     });
-                } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                     dispatchPromise = self.statisticsStore.loadTrendAnalysis({
                         force: force
                     });
                 }
-            } else if (self.query.chartDataType === self.allChartDataTypes.AccountTotalAssets.type ||
-                self.query.chartDataType === self.allChartDataTypes.AccountTotalLiabilities.type) {
+            } else if (self.queryChartDataType === self.allChartDataTypes.AccountTotalAssets.type ||
+                self.queryChartDataType === self.allChartDataTypes.AccountTotalLiabilities.type) {
                 dispatchPromise = self.accountsStore.loadAllAccounts({
                     force: force
                 });
@@ -643,37 +741,70 @@ export default {
 
             return dispatchPromise;
         },
-        setChartType(chartType) {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+        setAnalysisType(analysisType) {
+            if (this.analysisType === analysisType) {
+                return;
+            }
+
+            if (!isChartDataTypeAvailableForAnalysisType(this.queryChartDataType, analysisType)) {
                 this.statisticsStore.updateTransactionStatisticsFilter({
+                    chartDataType: statisticsConstants.defaultChartDataType
+                });
+            }
+
+            this.analysisType = analysisType;
+            this.loading = true;
+            this.statisticsStore.updateTransactionStatisticsInvalidState(true);
+            this.$router.push(this.getFilterLinkUrl());
+        },
+        setChartType(chartType) {
+            let changed = false;
+
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     categoricalChartType: chartType
                 });
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
-                this.statisticsStore.updateTransactionStatisticsFilter({
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     trendChartType: chartType
                 });
             }
+
+            if (changed) {
+                this.$router.push(this.getFilterLinkUrl());
+            }
+        },
+        setChartDataType(chartDataType) {
+            const changed = this.statisticsStore.updateTransactionStatisticsFilter({
+                chartDataType: chartDataType
+            });
+
+            if (changed) {
+                this.$router.push(this.getFilterLinkUrl());
+            }
         },
         setSortingType(sortingType) {
             if (sortingType < this.allSortingTypes.Amount.type || sortingType > this.allSortingTypes.Name.type) {
                 return;
             }
 
-            this.statisticsStore.updateTransactionStatisticsFilter({
+            const changed = this.statisticsStore.updateTransactionStatisticsFilter({
                 sortingType: sortingType
             });
 
-            this.reload(null);
+            if (changed) {
+                this.$router.push(this.getFilterLinkUrl());
+            }
         },
         setDateFilter(dateType) {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                 if (dateType === this.allDateRanges.Custom.type) { // Custom
                     this.showCustomDateRangeDialog = true;
                     return;
                 } else if (this.query.categoricalChartDateType === dateType) {
                     return;
                 }
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                 if (dateType === this.allDateRanges.Custom.type) { // Custom
                     this.showCustomMonthRangeDialog = true;
                     return;
@@ -688,41 +819,49 @@ export default {
                 return;
             }
 
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
-                this.statisticsStore.updateTransactionStatisticsFilter({
+            let changed = false;
+
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     categoricalChartDateType: dateRange.dateType,
                     categoricalChartStartTime: dateRange.minTime,
                     categoricalChartEndTime: dateRange.maxTime
                 });
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
-                this.statisticsStore.updateTransactionStatisticsFilter({
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     trendChartDateType: dateRange.dateType,
                     trendChartStartYearMonth: getYearAndMonthFromUnixTime(dateRange.minTime),
                     trendChartEndYearMonth: getYearAndMonthFromUnixTime(dateRange.maxTime)
                 });
             }
 
-            this.reload(null);
+            if (changed) {
+                this.loading = true;
+                this.statisticsStore.updateTransactionStatisticsInvalidState(true);
+                this.$router.push(this.getFilterLinkUrl());
+            }
         },
         setCustomDateFilter(startTime, endTime) {
             if (!startTime || !endTime) {
                 return;
             }
 
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+            let changed = false;
+
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
                 const chartDateType = getDateTypeByDateRange(startTime, endTime, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
 
-                this.statisticsStore.updateTransactionStatisticsFilter({
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     categoricalChartDateType: chartDateType,
                     categoricalChartStartTime: startTime,
                     categoricalChartEndTime: endTime
                 });
 
                 this.showCustomDateRangeDialog = false;
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
                 const chartDateType = getDateTypeByDateRange(getYearMonthFirstUnixTime(startTime), getYearMonthLastUnixTime(endTime), this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.TrendAnalysis);
 
-                this.statisticsStore.updateTransactionStatisticsFilter({
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     trendChartDateType: chartDateType,
                     trendChartStartYearMonth: startTime,
                     trendChartEndYearMonth: endTime
@@ -731,78 +870,106 @@ export default {
                 this.showCustomMonthRangeDialog = false;
             }
 
-            this.reload(null);
+            if (changed) {
+                this.loading = true;
+                this.statisticsStore.updateTransactionStatisticsInvalidState(true);
+                this.$router.push(this.getFilterLinkUrl());
+            }
         },
-        showCustomDateRange(query) {
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
-                return query.categoricalChartDateType === this.allDateRanges.Custom.type && query.categoricalChartStartTime && query.categoricalChartEndTime;
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
-                return query.trendChartDateType === this.allDateRanges.Custom.type && query.trendChartStartYearMonth && query.trendChartEndYearMonth;
+        showCustomDateRange() {
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                return this.query.categoricalChartDateType === this.allDateRanges.Custom.type && this.query.categoricalChartStartTime && this.query.categoricalChartEndTime;
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                return this.query.trendChartDateType === this.allDateRanges.Custom.type && this.query.trendChartStartYearMonth && this.query.trendChartEndYearMonth;
             } else {
                 return false;
             }
         },
-        canShiftDateRange(query) {
-            if (query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type || query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
+        canShiftDateRange() {
+            if (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type || this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
                 return false;
             }
 
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
-                return query.categoricalChartDateType !== this.allDateRanges.All.type;
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
-                return query.trendChartDateType !== this.allDateRanges.All.type;
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                return this.query.categoricalChartDateType !== this.allDateRanges.All.type;
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                return this.query.trendChartDateType !== this.allDateRanges.All.type;
             } else {
                 return false;
             }
         },
-        shiftDateRange(query, scale) {
+        shiftDateRange(scale) {
             if (this.query.categoricalChartDateType === this.allDateRanges.All.type) {
                 return;
             }
 
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
-                const newDateRange = getShiftedDateRangeAndDateType(query.categoricalChartStartTime, query.categoricalChartEndTime, scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
+            let changed = false;
 
-                this.statisticsStore.updateTransactionStatisticsFilter({
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                const newDateRange = getShiftedDateRangeAndDateType(this.query.categoricalChartStartTime, this.query.categoricalChartEndTime, scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
+
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     categoricalChartDateType: newDateRange.dateType,
                     categoricalChartStartTime: newDateRange.minTime,
                     categoricalChartEndTime: newDateRange.maxTime
                 });
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
-                const newDateRange = getShiftedDateRangeAndDateType(getYearMonthFirstUnixTime(query.trendChartStartYearMonth), getYearMonthLastUnixTime(query.trendChartEndYearMonth), scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.TrendAnalysis);
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                const newDateRange = getShiftedDateRangeAndDateType(getYearMonthFirstUnixTime(this.query.trendChartStartYearMonth), getYearMonthLastUnixTime(this.query.trendChartEndYearMonth), scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.TrendAnalysis);
 
-                this.statisticsStore.updateTransactionStatisticsFilter({
+                changed = this.statisticsStore.updateTransactionStatisticsFilter({
                     trendChartDateType: newDateRange.dateType,
                     trendChartStartYearMonth: getYearAndMonthFromUnixTime(newDateRange.minTime),
                     trendChartEndYearMonth: getYearAndMonthFromUnixTime(newDateRange.maxTime)
                 });
             }
 
-            this.reload(null);
+            if (changed) {
+                this.loading = true;
+                this.statisticsStore.updateTransactionStatisticsInvalidState(true);
+                this.$router.push(this.getFilterLinkUrl());
+            }
         },
-        dateRangeName(query) {
-            if (query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type ||
-                query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
+        dateRangeName() {
+            if (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type ||
+                this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
                 return this.$t(this.allDateRanges.All.name);
             }
 
-            if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
-                return this.$locale.getDateRangeDisplayName(this.userStore, query.categoricalChartDateType, query.categoricalChartStartTime, query.categoricalChartEndTime);
-            } else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
-                return this.$locale.getDateRangeDisplayName(this.userStore, query.trendChartDateType, getYearMonthFirstUnixTime(query.trendChartStartYearMonth), getYearMonthLastUnixTime(query.trendChartEndYearMonth));
+            if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
+                return this.$locale.getDateRangeDisplayName(this.userStore, this.query.categoricalChartDateType, this.query.categoricalChartStartTime, this.query.categoricalChartEndTime);
+            } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
+                return this.$locale.getDateRangeDisplayName(this.userStore, this.query.trendChartDateType, getYearMonthFirstUnixTime(this.query.trendChartStartYearMonth), getYearMonthLastUnixTime(this.query.trendChartEndYearMonth));
             } else {
                 return '';
             }
         },
+        setAccountFilter(changed) {
+            this.showFilterAccountDialog = false;
+
+            if (changed) {
+                this.loading = true;
+                this.statisticsStore.updateTransactionStatisticsInvalidState(true);
+                this.$router.push(this.getFilterLinkUrl());
+            }
+        },
+        setCategoryFilter(changed) {
+            this.showFilterCategoryDialog = false;
+
+            if (changed) {
+                this.loading = true;
+                this.statisticsStore.updateTransactionStatisticsInvalidState(true);
+                this.$router.push(this.getFilterLinkUrl());
+            }
+        },
         clickPieChartItem(item) {
-            this.$router.push(this.getItemLinkUrl(item));
+            this.$router.push(this.getTransactionItemLinkUrl(item));
         },
         clickTrendChartItem(item) {
             const minUnixTime = getYearMonthFirstUnixTime(item.yearMonth);
             const maxUnixTime = getYearMonthLastUnixTime(item.yearMonth);
             const dateRangeType = getDateTypeByDateRange(minUnixTime, maxUnixTime, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
 
-            this.$router.push(this.getItemLinkUrl(item.item, {
+            this.$router.push(this.getTransactionItemLinkUrl(item.item, {
                 minTime: minUnixTime,
                 maxTime: maxUnixTime,
                 type: dateRangeType,
@@ -812,8 +979,8 @@ export default {
             amount = this.getDisplayCurrency(amount, currency);
 
             if (!this.showAccountBalance
-                && (this.query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type
-                    || this.query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type)
+                && (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type
+                    || this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type)
             ) {
                 return '***';
             }
@@ -830,8 +997,11 @@ export default {
         getDisplayPercent(value, precision, lowPrecisionValue) {
             return formatPercent(value, precision, lowPrecisionValue);
         },
-        getItemLinkUrl(item, dateRange) {
-            return `/transaction/list?${this.statisticsStore.getTransactionListPageParams(this.analysisType, item, dateRange)}`;
+        getFilterLinkUrl() {
+            return `/statistics/transaction?${this.statisticsStore.getTransactionStatisticsPageParams(this.queryAnalysisType)}`;
+        },
+        getTransactionItemLinkUrl(item, dateRange) {
+            return `/transaction/list?${this.statisticsStore.getTransactionListPageParams(this.queryAnalysisType, item, dateRange)}`;
         }
     }
 }
diff --git a/src/views/mobile/statistics/TransactionPage.vue b/src/views/mobile/statistics/TransactionPage.vue
index 7fc09266..95f2f3e4 100644
--- a/src/views/mobile/statistics/TransactionPage.vue
+++ b/src/views/mobile/statistics/TransactionPage.vue
@@ -365,7 +365,7 @@ export default {
     created() {
         const self = this;
 
-        self.statisticsStore.initTransactionStatisticsFilter();
+        self.statisticsStore.initTransactionStatisticsFilter(statisticsConstants.allAnalysisTypes.CategoricalAnalysis);
 
         Promise.all([
             self.accountsStore.loadAllAccounts({ force: false }),