mirror/ezbookkeeping
1
0
Fork 0
mirror of https://github.com/mayswind/ezbookkeeping.git synced 2026-05-19 01:04:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

update url address when changing the settings on the statistics analysis page

Browse Source
This commit is contained in:
MaysWind
2024-07-14 19:55:14 +08:00
parent 2cbcc40ca9
commit 7849b2f05c
9 changed files with 558 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/consts/datetime.js
+22
View File
@@ -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 defaultFirstDayOfWeek = allWeekDays.Sunday.type;
const defaultLongDateFormat = allLongDateFormat.YYYYMMDD; const defaultLongDateFormat = allLongDateFormat.YYYYMMDD;
const defaultShortDateFormat = allShortDateFormat.YYYYMMDD; const defaultShortDateFormat = allShortDateFormat.YYYYMMDD;
@@ -327,6 +348,7 @@ export default {
allShortTimeFormatArray: allShortTimeFormatArray, allShortTimeFormatArray: allShortTimeFormatArray,
allDateRangeScenes: allDateRangeScenes, allDateRangeScenes: allDateRangeScenes,
allDateRanges: allDateRanges, allDateRanges: allDateRanges,
allDateRangesMap: allDateRangesMap,
defaultFirstDayOfWeek: defaultFirstDayOfWeek, defaultFirstDayOfWeek: defaultFirstDayOfWeek,
defaultLongDateFormat: defaultLongDateFormat, defaultLongDateFormat: defaultLongDateFormat,
defaultShortDateFormat: defaultShortDateFormat, defaultShortDateFormat: defaultShortDateFormat,
src/consts/statistics.js
+15
View File
@@ -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 defaultChartDataType = allChartDataTypes.ExpenseByPrimaryCategory.type;
const allSortingTypes = { const allSortingTypes = {
@@ -164,6 +178,7 @@ export default {
allTrendChartTypesArray: allTrendChartTypesArray, allTrendChartTypesArray: allTrendChartTypesArray,
defaultTrendChartType: defaultTrendChartType, defaultTrendChartType: defaultTrendChartType,
allChartDataTypes: allChartDataTypes, allChartDataTypes: allChartDataTypes,
allChartDataTypesMap: allChartDataTypesMap,
defaultChartDataType: defaultChartDataType, defaultChartDataType: defaultChartDataType,
defaultCategoricalChartDataRangeType: datetime.allDateRanges.ThisMonth.type, defaultCategoricalChartDataRangeType: datetime.allDateRanges.ThisMonth.type,
defaultTrendChartDataRangeType: datetime.allDateRanges.ThisYear.type, defaultTrendChartDataRangeType: datetime.allDateRanges.ThisYear.type,
src/lib/common.js
+9 -1
View File
@@ -2,6 +2,10 @@ export function isFunction(val) {
return typeof(val) === 'function'; return typeof(val) === 'function';
} }
export function isDefined(val) {
return typeof val !== 'undefined';
}
export function isObject(val) { export function isObject(val) {
return val != null && typeof(val) === 'object' && !isArray(val); return val != null && typeof(val) === 'object' && !isArray(val);
} }
@@ -22,6 +26,10 @@ export function isNumber(val) {
return typeof(val) === 'number'; return typeof(val) === 'number';
} }
export function isInteger(val) {
return Number.isInteger(val);
}
export function isBoolean(val) { export function isBoolean(val) {
return typeof(val) === 'boolean'; return typeof(val) === 'boolean';
} }
@@ -375,7 +383,7 @@ export function arrayContainsFieldValue(array, fieldName, value) {
return false; return false;
} }
export function objectToArray(object) { export function objectFieldToArrayItem(object) {
const ret = []; const ret = [];
for (let field in object) { for (let field in object) {
src/router/desktop.js
+12 -1
View File
@@ -107,7 +107,18 @@ const router = createRouter({
{ {
path: '/statistics/transaction', path: '/statistics/transaction',
component: StatisticsTransactionPage, 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', path: '/account/list',
src/stores/statistics.js
+153 -98
View File
@@ -17,8 +17,10 @@ import {
isEquals, isEquals,
isNumber, isNumber,
isObject, isObject,
isInteger,
isYearMonth, isYearMonth,
isObjectEmpty isObjectEmpty,
objectFieldToArrayItem
} from '@/lib/common.js'; } from '@/lib/common.js';
import { import {
getYearAndMonthFromUnixTime, getYearAndMonthFromUnixTime,
@@ -561,186 +563,239 @@ export const useStatisticsStore = defineStore('statistics', {
this.transactionCategoryTrendsData = {}; this.transactionCategoryTrendsData = {};
this.transactionStatisticsStateInvalid = true; this.transactionStatisticsStateInvalid = true;
}, },
initTransactionStatisticsFilter(filter) { initTransactionStatisticsFilter(analysisType, filter) {
if (!filter) { const settingsStore = useSettingsStore();
const settingsStore = useSettingsStore(); const userStore = useUserStore();
const userStore = useUserStore();
let defaultChartDataType = settingsStore.appSettings.statistics.defaultChartDataType; if (filter && isInteger(filter.chartDataType)) {
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)) {
this.transactionStatisticsFilter.chartDataType = filter.chartDataType; this.transactionStatisticsFilter.chartDataType = filter.chartDataType;
} else { } 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; this.transactionStatisticsFilter.categoricalChartType = filter.categoricalChartType;
} else { } 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; this.transactionStatisticsFilter.categoricalChartType = statisticsConstants.defaultCategoricalChartType;
} }
if (filter && isNumber(filter.categoricalChartDateType)) { if (filter && isInteger(filter.categoricalChartDateType)) {
this.transactionStatisticsFilter.categoricalChartDateType = filter.categoricalChartDateType; this.transactionStatisticsFilter.categoricalChartDateType = filter.categoricalChartDateType;
} else { } 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; this.transactionStatisticsFilter.categoricalChartDateType = statisticsConstants.defaultCategoricalChartDataRangeType;
categoricalChartDateTypeValid = false;
} }
if (filter && isNumber(filter.categoricalChartStartTime)) { if (categoricalChartDateTypeValid && this.transactionStatisticsFilter.categoricalChartDateType === datetimeConstants.allDateRanges.Custom.type) {
this.transactionStatisticsFilter.categoricalChartStartTime = filter.categoricalChartStartTime; 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 { } 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)) { if (filter && isInteger(filter.trendChartType)) {
this.transactionStatisticsFilter.categoricalChartEndTime = filter.categoricalChartEndTime;
} else {
this.transactionStatisticsFilter.categoricalChartEndTime = 0;
}
if (filter && isNumber(filter.trendChartType)) {
this.transactionStatisticsFilter.trendChartType = filter.trendChartType; this.transactionStatisticsFilter.trendChartType = filter.trendChartType;
} else { } 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; this.transactionStatisticsFilter.trendChartType = statisticsConstants.defaultTrendChartType;
} }
if (filter && isNumber(filter.trendChartDateType)) { if (filter && isInteger(filter.trendChartDateType)) {
this.transactionStatisticsFilter.trendChartDateType = filter.trendChartDateType; this.transactionStatisticsFilter.trendChartDateType = filter.trendChartDateType;
} else { } 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; this.transactionStatisticsFilter.trendChartDateType = statisticsConstants.defaultTrendChartDataRangeType;
trendChartDateTypeValid = false;
} }
if (filter && isYearMonth(filter.trendChartStartYearMonth)) { if (trendChartDateTypeValid && this.transactionStatisticsFilter.trendChartDateType === datetimeConstants.allDateRanges.Custom.type) {
this.transactionStatisticsFilter.trendChartStartYearMonth = filter.trendChartStartYearMonth; if (filter && isYearMonth(filter.trendChartStartYearMonth)) {
} else { this.transactionStatisticsFilter.trendChartStartYearMonth = filter.trendChartStartYearMonth;
this.transactionStatisticsFilter.trendChartStartYearMonth = ''; } else {
} this.transactionStatisticsFilter.trendChartStartYearMonth = '';
}
if (filter && isYearMonth(filter.trendChartEndYearMonth)) { if (filter && isYearMonth(filter.trendChartEndYearMonth)) {
this.transactionStatisticsFilter.trendChartEndYearMonth = filter.trendChartEndYearMonth; this.transactionStatisticsFilter.trendChartEndYearMonth = filter.trendChartEndYearMonth;
} else {
this.transactionStatisticsFilter.trendChartEndYearMonth = '';
}
} else { } 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)) { if (filter && isObject(filter.filterAccountIds)) {
this.transactionStatisticsFilter.filterAccountIds = filter.filterAccountIds; this.transactionStatisticsFilter.filterAccountIds = filter.filterAccountIds;
} else { } else {
this.transactionStatisticsFilter.filterAccountIds = {}; this.transactionStatisticsFilter.filterAccountIds = settingsStore.appSettings.statistics.defaultAccountFilter || {};
} }
if (filter && isObject(filter.filterCategoryIds)) { if (filter && isObject(filter.filterCategoryIds)) {
this.transactionStatisticsFilter.filterCategoryIds = filter.filterCategoryIds; this.transactionStatisticsFilter.filterCategoryIds = filter.filterCategoryIds;
} else { } 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; this.transactionStatisticsFilter.sortingType = filter.sortingType;
} else { } 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; this.transactionStatisticsFilter.sortingType = statisticsConstants.defaultSortingType;
} }
}, },
updateTransactionStatisticsFilter(filter) { 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; 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; 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; 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; 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; 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; 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; 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; 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; 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; 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; 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; 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) { getTransactionListPageParams(analysisType, item, dateRange) {
const accountsStore = useAccountsStore(); const accountsStore = useAccountsStore();
src/views/desktop/common/cards/AccountFilterSettingsCard.vue
+5 -1
View File
@@ -278,9 +278,13 @@ export default {
if (this.type === 'statisticsDefault') { if (this.type === 'statisticsDefault') {
self.settingsStore.setStatisticsDefaultAccountFilter(filteredAccountIds); self.settingsStore.setStatisticsDefaultAccountFilter(filteredAccountIds);
} else if (this.type === 'statisticsCurrent') { } else if (this.type === 'statisticsCurrent') {
self.statisticsStore.updateTransactionStatisticsFilter({ changed = self.statisticsStore.updateTransactionStatisticsFilter({
filterAccountIds: filteredAccountIds filterAccountIds: filteredAccountIds
}); });
if (changed) {
self.statisticsStore.updateTransactionStatisticsInvalidState(true);
}
} else if (this.type === 'transactionListCurrent') { } else if (this.type === 'transactionListCurrent') {
changed = self.transactionsStore.updateTransactionListFilter({ changed = self.transactionsStore.updateTransactionListFilter({
accountIds: isAllSelected ? '' : finalAccountIds accountIds: isAllSelected ? '' : finalAccountIds
src/views/desktop/common/cards/CategoryFilterSettingsCard.vue
+5 -1
View File
@@ -294,9 +294,13 @@ export default {
if (this.type === 'statisticsDefault') { if (this.type === 'statisticsDefault') {
self.settingsStore.setStatisticsDefaultTransactionCategoryFilter(filteredCategoryIds); self.settingsStore.setStatisticsDefaultTransactionCategoryFilter(filteredCategoryIds);
} else if (this.type === 'statisticsCurrent') { } else if (this.type === 'statisticsCurrent') {
self.statisticsStore.updateTransactionStatisticsFilter({ changed = self.statisticsStore.updateTransactionStatisticsFilter({
filterCategoryIds: filteredCategoryIds filterCategoryIds: filteredCategoryIds
}); });
if (changed) {
self.statisticsStore.updateTransactionStatisticsInvalidState(true);
}
} else if (this.type === 'transactionListCurrent') { } else if (this.type === 'transactionListCurrent') {
changed = self.transactionsStore.updateTransactionListFilter({ changed = self.transactionsStore.updateTransactionListFilter({
categoryIds: isAllSelected ? '' : finalCategoryIds categoryIds: isAllSelected ? '' : finalCategoryIds
src/views/desktop/statistics/TransactionPage.vue
+336 -166
View File
@@ -8,7 +8,7 @@
<btn-vertical-group :disabled="loading" :buttons="[ <btn-vertical-group :disabled="loading" :buttons="[
{ name: $t('Categorical Analysis'), value: allAnalysisTypes.CategoricalAnalysis }, { name: $t('Categorical Analysis'), value: allAnalysisTypes.CategoricalAnalysis },
{ name: $t('Trend Analysis'), value: allAnalysisTypes.TrendAnalysis } { name: $t('Trend Analysis'), value: allAnalysisTypes.TrendAnalysis }
]" v-model="analysisType" /> ]" v-model="queryAnalysisType" />
</div> </div>
<v-divider /> <v-divider />
<div class="mx-6 mt-4"> <div class="mx-6 mt-4">
@@ -36,9 +36,9 @@
/> />
</div> </div>
<v-tabs show-arrows class="my-4" direction="vertical" <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-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> <span class="text-truncate">{{ $t(dataType.name) }}</span>
<v-tooltip activator="parent" location="right">{{ $t(dataType.name) }}</v-tooltip> <v-tooltip activator="parent" location="right">{{ $t(dataType.name) }}</v-tooltip>
</v-tab> </v-tab>
@@ -57,12 +57,12 @@
<span>{{ $t('Statistics & Analysis') }}</span> <span>{{ $t('Statistics & Analysis') }}</span>
<v-btn-group class="ml-4" color="default" density="comfortable" variant="outlined" divided> <v-btn-group class="ml-4" color="default" density="comfortable" variant="outlined" divided>
<v-btn :icon="icons.left" <v-btn :icon="icons.left"
:disabled="loading || !canShiftDateRange(query)" :disabled="loading || !canShiftDateRange()"
@click="shiftDateRange(query, -1)"/> @click="shiftDateRange(-1)"/>
<v-menu location="bottom"> <v-menu location="bottom">
<template #activator="{ props }"> <template #activator="{ props }">
<v-btn :disabled="loading || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type" <v-btn :disabled="loading || queryChartDataType === allChartDataTypes.AccountTotalAssets.type || queryChartDataType === allChartDataTypes.AccountTotalLiabilities.type"
v-bind="props">{{ dateRangeName(query) }}</v-btn> v-bind="props">{{ dateRangeName() }}</v-btn>
</template> </template>
<v-list :selected="[queryDateType]"> <v-list :selected="[queryDateType]">
<v-list-item :key="dateRange.type" :value="dateRange.type" <v-list-item :key="dateRange.type" :value="dateRange.type"
@@ -72,7 +72,7 @@
class="cursor-pointer" class="cursor-pointer"
@click="setDateFilter(dateRange.type)"> @click="setDateFilter(dateRange.type)">
{{ dateRange.displayName }} {{ 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>{{ queryStartTime }}</span>
<span>&nbsp;-&nbsp;</span> <span>&nbsp;-&nbsp;</span>
<br/> <br/>
@@ -83,8 +83,8 @@
</v-list> </v-list>
</v-menu> </v-menu>
<v-btn :icon="icons.right" <v-btn :icon="icons.right"
:disabled="loading || !canShiftDateRange(query)" :disabled="loading || !canShiftDateRange()"
@click="shiftDateRange(query, 1)"/> @click="shiftDateRange(1)"/>
</v-btn-group> </v-btn-group>
<v-btn density="compact" color="default" variant="text" size="24" <v-btn density="compact" color="default" variant="text" size="24"
@@ -118,7 +118,7 @@
</template> </template>
<v-card-text class="statistics-overview-title pt-0" :class="{ 'disabled': loading }" <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-subtitle">{{ totalAmountName }}</span>
<span class="statistics-overview-amount ml-3" <span class="statistics-overview-amount ml-3"
:class="statisticsTextColor" :class="statisticsTextColor"
@@ -131,12 +131,12 @@
</v-card-text> </v-card-text>
<v-card-text class="statistics-overview-title pt-0" <v-card-text class="statistics-overview-title pt-0"
v-else-if="!initing && ((analysisType === allAnalysisTypes.CategoricalAnalysis && (!categoricalAnalysisData || !categoricalAnalysisData.items || !categoricalAnalysisData.items.length)) v-else-if="!initing && ((queryAnalysisType === allAnalysisTypes.CategoricalAnalysis && (!categoricalAnalysisData || !categoricalAnalysisData.items || !categoricalAnalysisData.items.length))
|| (analysisType === allAnalysisTypes.TrendAnalysis && (!trendsAnalysisData || !trendsAnalysisData.items || !trendsAnalysisData.items.length)))"> || (queryAnalysisType === allAnalysisTypes.TrendAnalysis && (!trendsAnalysisData || !trendsAnalysisData.items || !trendsAnalysisData.items.length)))">
<span class="statistics-subtitle statistics-overview-empty-tip">{{ $t('No transaction data') }}</span> <span class="statistics-subtitle statistics-overview-empty-tip">{{ $t('No transaction data') }}</span>
</v-card-text> </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 <pie-chart
:items="[ :items="[
{id: '1', name: '---', value: 60, color: '7c7c7f'}, {id: '1', name: '---', value: 60, color: '7c7c7f'},
@@ -166,7 +166,7 @@
/> />
</v-card-text> </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"> <v-list rounded lines="two" v-if="initing">
<template :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]"> <template :key="itemIdx" v-for="itemIdx in [ 1, 2, 3 ]">
<v-list-item class="pl-0"> <v-list-item class="pl-0">
@@ -193,13 +193,13 @@
v-for="(item, idx) in categoricalAnalysisData.items"> v-for="(item, idx) in categoricalAnalysisData.items">
<v-list-item class="pl-0" v-if="!item.hidden"> <v-list-item class="pl-0" v-if="!item.hidden">
<template #prepend> <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" <ItemIcon :icon-type="queryChartDataCategory" size="34px"
:icon-id="item.icon" :icon-id="item.icon"
:color="item.color"></ItemIcon> :color="item.color"></ItemIcon>
</router-link> </router-link>
</template> </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 flex-column ml-2">
<div class="d-flex"> <div class="d-flex">
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
@@ -221,7 +221,7 @@
</v-list> </v-list>
</v-card-text> </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 <trends-chart
:type="queryChartType" :type="queryChartType"
:start-year-month="query.trendChartStartYearMonth" :start-year-month="query.trendChartStartYearMonth"
@@ -277,12 +277,12 @@
<v-dialog width="800" v-model="showFilterAccountDialog"> <v-dialog width="800" v-model="showFilterAccountDialog">
<account-filter-settings-card type="statisticsCurrent" :dialog-mode="true" <account-filter-settings-card type="statisticsCurrent" :dialog-mode="true"
@settings:change="showFilterAccountDialog = false" /> @settings:change="setAccountFilter" />
</v-dialog> </v-dialog>
<v-dialog width="800" v-model="showFilterCategoryDialog"> <v-dialog width="800" v-model="showFilterCategoryDialog">
<category-filter-settings-card type="statisticsCurrent" :dialog-mode="true" <category-filter-settings-card type="statisticsCurrent" :dialog-mode="true"
@settings:change="showFilterCategoryDialog = false" /> @settings:change="setCategoryFilter" />
</v-dialog> </v-dialog>
<snack-bar ref="snackbar" /> <snack-bar ref="snackbar" />
@@ -300,7 +300,11 @@ import { useStatisticsStore } from '@/stores/statistics.js';
import datetimeConstants from '@/consts/datetime.js'; import datetimeConstants from '@/consts/datetime.js';
import statisticsConstants from '@/consts/statistics.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 { formatPercent } from '@/lib/numeral.js';
import { import {
getYearAndMonthFromUnixTime, getYearAndMonthFromUnixTime,
@@ -334,6 +338,17 @@ export default {
AccountFilterSettingsCard, AccountFilterSettingsCard,
CategoryFilterSettingsCard CategoryFilterSettingsCard
}, },
props: [
'initAnalysisType',
'initChartDataType',
'initChartType',
'initChartDateType',
'initStartTime',
'initEndTime',
'initFilterAccountIds',
'initFilterCategoryIds',
'initSortingType'
],
data() { data() {
const { mdAndUp } = useDisplay(); const { mdAndUp } = useDisplay();
@@ -374,6 +389,14 @@ export default {
firstDayOfWeek() { firstDayOfWeek() {
return this.userStore.currentUserFirstDayOfWeek; return this.userStore.currentUserFirstDayOfWeek;
}, },
queryAnalysisType: {
get: function () {
return this.analysisType;
},
set: function(value) {
this.setAnalysisType(value);
}
},
query() { query() {
return this.statisticsStore.transactionStatisticsFilter; return this.statisticsStore.transactionStatisticsFilter;
}, },
@@ -382,9 +405,9 @@ export default {
}, },
queryChartType: { queryChartType: {
get: function () { get: function () {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return this.query.categoricalChartType; return this.query.categoricalChartType;
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
return this.query.trendChartType; return this.query.trendChartType;
} else { } else {
return null; return null;
@@ -394,6 +417,14 @@ export default {
this.setChartType(value); this.setChartType(value);
} }
}, },
queryChartDataType: {
get: function () {
return this.query.chartDataType;
},
set: function(value) {
this.setChartDataType(value);
}
},
querySortingType: { querySortingType: {
get: function () { get: function () {
return this.query.sortingType; return this.query.sortingType;
@@ -403,27 +434,27 @@ export default {
} }
}, },
queryDateType() { queryDateType() {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return this.query.categoricalChartDateType; return this.query.categoricalChartDateType;
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
return this.query.trendChartDateType; return this.query.trendChartDateType;
} else { } else {
return null; return null;
} }
}, },
queryStartTime() { queryStartTime() {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartStartTime); 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)); return this.$locale.formatUnixTimeToLongYearMonth(this.userStore, getYearMonthFirstUnixTime(this.query.trendChartStartYearMonth));
} else { } else {
return []; return [];
} }
}, },
queryEndTime() { queryEndTime() {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartEndTime); 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)); return this.$locale.formatUnixTimeToLongYearMonth(this.userStore, getYearMonthLastUnixTime(this.query.trendChartEndYearMonth));
} else { } else {
return []; return [];
@@ -433,9 +464,9 @@ export default {
return statisticsConstants.allAnalysisTypes; return statisticsConstants.allAnalysisTypes;
}, },
allChartTypes() { allChartTypes() {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return this.$locale.getAllCategoricalChartTypes(); return this.$locale.getAllCategoricalChartTypes();
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
return this.$locale.getAllTrendChartTypes(); return this.$locale.getAllTrendChartTypes();
} else { } else {
return []; return [];
@@ -457,9 +488,9 @@ export default {
return datetimeConstants.allDateRanges; return datetimeConstants.allDateRanges;
}, },
allDateRangesArray() { allDateRangesArray() {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.Normal, true); 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); return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.TrendAnalysis, true);
} else { } else {
return []; return [];
@@ -469,17 +500,17 @@ export default {
return this.settingsStore.appSettings.showAccountBalance; return this.settingsStore.appSettings.showAccountBalance;
}, },
totalAmountName() { totalAmountName() {
if (this.query.chartDataType === this.allChartDataTypes.IncomeByAccount.type if (this.queryChartDataType === this.allChartDataTypes.IncomeByAccount.type
|| this.query.chartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type || this.queryChartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type
|| this.query.chartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) { || this.queryChartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) {
return this.$t('Total Income'); return this.$t('Total Income');
} else if (this.query.chartDataType === this.allChartDataTypes.ExpenseByAccount.type } else if (this.queryChartDataType === this.allChartDataTypes.ExpenseByAccount.type
|| this.query.chartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type || this.queryChartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type
|| this.query.chartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) { || this.queryChartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) {
return this.$t('Total Expense'); 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'); 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'); return this.$t('Total Liabilities');
} }
@@ -492,23 +523,23 @@ export default {
return this.statisticsStore.trendsAnalysisData; return this.statisticsStore.trendsAnalysisData;
}, },
translateNameInTrendsChart() { translateNameInTrendsChart() {
return this.query.chartDataType === this.allChartDataTypes.TotalExpense.type || return this.queryChartDataType === this.allChartDataTypes.TotalExpense.type ||
this.query.chartDataType === this.allChartDataTypes.TotalIncome.type || this.queryChartDataType === this.allChartDataTypes.TotalIncome.type ||
this.query.chartDataType === this.allChartDataTypes.TotalBalance.type; this.queryChartDataType === this.allChartDataTypes.TotalBalance.type;
}, },
showTotalAmountInTrendsChart() { showTotalAmountInTrendsChart() {
return this.query.chartDataType !== this.allChartDataTypes.TotalExpense.type && return this.queryChartDataType !== this.allChartDataTypes.TotalExpense.type &&
this.query.chartDataType !== this.allChartDataTypes.TotalIncome.type && this.queryChartDataType !== this.allChartDataTypes.TotalIncome.type &&
this.query.chartDataType !== this.allChartDataTypes.TotalBalance.type; this.queryChartDataType !== this.allChartDataTypes.TotalBalance.type;
}, },
statisticsTextColor() { statisticsTextColor() {
if (this.query.chartDataType === this.allChartDataTypes.ExpenseByAccount.type || if (this.queryChartDataType === this.allChartDataTypes.ExpenseByAccount.type ||
this.query.chartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type || this.queryChartDataType === this.allChartDataTypes.ExpenseByPrimaryCategory.type ||
this.query.chartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) { this.queryChartDataType === this.allChartDataTypes.ExpenseBySecondaryCategory.type) {
return 'text-expense'; return 'text-expense';
} else if (this.query.chartDataType === this.allChartDataTypes.IncomeByAccount.type || } else if (this.queryChartDataType === this.allChartDataTypes.IncomeByAccount.type ||
this.query.chartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type || this.queryChartDataType === this.allChartDataTypes.IncomeByPrimaryCategory.type ||
this.query.chartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) { this.queryChartDataType === this.allChartDataTypes.IncomeBySecondaryCategory.type) {
return 'text-income'; return 'text-income';
} else { } else {
return 'text-default'; return 'text-default';
@@ -516,7 +547,7 @@ export default {
}, },
showAmountInChart() { showAmountInChart() {
if (!this.showAccountBalance 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; return false;
} }
@@ -524,28 +555,6 @@ export default {
} }
}, },
watch: { 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) { 'display.mdAndUp.value': function (newValue) {
this.alwaysShowNav = newValue; this.alwaysShowNav = newValue;
@@ -555,33 +564,16 @@ export default {
} }
}, },
created() { created() {
const self = this; this.init({
analysisType: this.initAnalysisType,
self.statisticsStore.initTransactionStatisticsFilter(); chartDataType: this.initChartDataType,
chartType: this.initChartType,
Promise.all([ chartDateType: this.initChartDateType,
self.accountsStore.loadAllAccounts({ force: false }), startTime: this.initStartTime,
self.transactionCategoriesStore.loadAllCategories({ force: false }) endTime: this.initEndTime,
]).then(() => { filterAccountIds: this.initFilterAccountIds,
if (self.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { filterCategoryIds: this.initFilterCategoryIds,
return self.statisticsStore.loadCategoricalAnalysis({ sortingType: this.initSortingType,
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);
}
}); });
}, },
setup() { setup() {
@@ -593,33 +585,139 @@ export default {
globalTheme: theme 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: { 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) { reload(force) {
const self = this; const self = this;
let dispatchPromise = null; let dispatchPromise = null;
self.loading = true; self.loading = true;
if (self.query.chartDataType === self.allChartDataTypes.ExpenseByAccount.type || if (self.queryChartDataType === self.allChartDataTypes.ExpenseByAccount.type ||
self.query.chartDataType === self.allChartDataTypes.ExpenseByPrimaryCategory.type || self.queryChartDataType === self.allChartDataTypes.ExpenseByPrimaryCategory.type ||
self.query.chartDataType === self.allChartDataTypes.ExpenseBySecondaryCategory.type || self.queryChartDataType === self.allChartDataTypes.ExpenseBySecondaryCategory.type ||
self.query.chartDataType === self.allChartDataTypes.IncomeByAccount.type || self.queryChartDataType === self.allChartDataTypes.IncomeByAccount.type ||
self.query.chartDataType === self.allChartDataTypes.IncomeByPrimaryCategory.type || self.queryChartDataType === self.allChartDataTypes.IncomeByPrimaryCategory.type ||
self.query.chartDataType === self.allChartDataTypes.IncomeBySecondaryCategory.type || self.queryChartDataType === self.allChartDataTypes.IncomeBySecondaryCategory.type ||
self.query.chartDataType === self.allChartDataTypes.TotalExpense.type || self.queryChartDataType === self.allChartDataTypes.TotalExpense.type ||
self.query.chartDataType === self.allChartDataTypes.TotalIncome.type || self.queryChartDataType === self.allChartDataTypes.TotalIncome.type ||
self.query.chartDataType === self.allChartDataTypes.TotalBalance.type) { self.queryChartDataType === self.allChartDataTypes.TotalBalance.type) {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
dispatchPromise = self.statisticsStore.loadCategoricalAnalysis({ dispatchPromise = self.statisticsStore.loadCategoricalAnalysis({
force: force force: force
}); });
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
dispatchPromise = self.statisticsStore.loadTrendAnalysis({ dispatchPromise = self.statisticsStore.loadTrendAnalysis({
force: force force: force
}); });
} }
} else if (self.query.chartDataType === self.allChartDataTypes.AccountTotalAssets.type || } else if (self.queryChartDataType === self.allChartDataTypes.AccountTotalAssets.type ||
self.query.chartDataType === self.allChartDataTypes.AccountTotalLiabilities.type) { self.queryChartDataType === self.allChartDataTypes.AccountTotalLiabilities.type) {
dispatchPromise = self.accountsStore.loadAllAccounts({ dispatchPromise = self.accountsStore.loadAllAccounts({
force: force force: force
}); });
@@ -643,37 +741,70 @@ export default {
return dispatchPromise; return dispatchPromise;
}, },
setChartType(chartType) { setAnalysisType(analysisType) {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.analysisType === analysisType) {
return;
}
if (!isChartDataTypeAvailableForAnalysisType(this.queryChartDataType, analysisType)) {
this.statisticsStore.updateTransactionStatisticsFilter({ 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 categoricalChartType: chartType
}); });
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
this.statisticsStore.updateTransactionStatisticsFilter({ changed = this.statisticsStore.updateTransactionStatisticsFilter({
trendChartType: chartType 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) { setSortingType(sortingType) {
if (sortingType < this.allSortingTypes.Amount.type || sortingType > this.allSortingTypes.Name.type) { if (sortingType < this.allSortingTypes.Amount.type || sortingType > this.allSortingTypes.Name.type) {
return; return;
} }
this.statisticsStore.updateTransactionStatisticsFilter({ const changed = this.statisticsStore.updateTransactionStatisticsFilter({
sortingType: sortingType sortingType: sortingType
}); });
this.reload(null); if (changed) {
this.$router.push(this.getFilterLinkUrl());
}
}, },
setDateFilter(dateType) { setDateFilter(dateType) {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
if (dateType === this.allDateRanges.Custom.type) { // Custom if (dateType === this.allDateRanges.Custom.type) { // Custom
this.showCustomDateRangeDialog = true; this.showCustomDateRangeDialog = true;
return; return;
} else if (this.query.categoricalChartDateType === dateType) { } else if (this.query.categoricalChartDateType === dateType) {
return; return;
} }
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
if (dateType === this.allDateRanges.Custom.type) { // Custom if (dateType === this.allDateRanges.Custom.type) { // Custom
this.showCustomMonthRangeDialog = true; this.showCustomMonthRangeDialog = true;
return; return;
@@ -688,41 +819,49 @@ export default {
return; return;
} }
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { let changed = false;
this.statisticsStore.updateTransactionStatisticsFilter({
if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
changed = this.statisticsStore.updateTransactionStatisticsFilter({
categoricalChartDateType: dateRange.dateType, categoricalChartDateType: dateRange.dateType,
categoricalChartStartTime: dateRange.minTime, categoricalChartStartTime: dateRange.minTime,
categoricalChartEndTime: dateRange.maxTime categoricalChartEndTime: dateRange.maxTime
}); });
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
this.statisticsStore.updateTransactionStatisticsFilter({ changed = this.statisticsStore.updateTransactionStatisticsFilter({
trendChartDateType: dateRange.dateType, trendChartDateType: dateRange.dateType,
trendChartStartYearMonth: getYearAndMonthFromUnixTime(dateRange.minTime), trendChartStartYearMonth: getYearAndMonthFromUnixTime(dateRange.minTime),
trendChartEndYearMonth: getYearAndMonthFromUnixTime(dateRange.maxTime) trendChartEndYearMonth: getYearAndMonthFromUnixTime(dateRange.maxTime)
}); });
} }
this.reload(null); if (changed) {
this.loading = true;
this.statisticsStore.updateTransactionStatisticsInvalidState(true);
this.$router.push(this.getFilterLinkUrl());
}
}, },
setCustomDateFilter(startTime, endTime) { setCustomDateFilter(startTime, endTime) {
if (!startTime || !endTime) { if (!startTime || !endTime) {
return; 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); const chartDateType = getDateTypeByDateRange(startTime, endTime, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
this.statisticsStore.updateTransactionStatisticsFilter({ changed = this.statisticsStore.updateTransactionStatisticsFilter({
categoricalChartDateType: chartDateType, categoricalChartDateType: chartDateType,
categoricalChartStartTime: startTime, categoricalChartStartTime: startTime,
categoricalChartEndTime: endTime categoricalChartEndTime: endTime
}); });
this.showCustomDateRangeDialog = false; 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); const chartDateType = getDateTypeByDateRange(getYearMonthFirstUnixTime(startTime), getYearMonthLastUnixTime(endTime), this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.TrendAnalysis);
this.statisticsStore.updateTransactionStatisticsFilter({ changed = this.statisticsStore.updateTransactionStatisticsFilter({
trendChartDateType: chartDateType, trendChartDateType: chartDateType,
trendChartStartYearMonth: startTime, trendChartStartYearMonth: startTime,
trendChartEndYearMonth: endTime trendChartEndYearMonth: endTime
@@ -731,78 +870,106 @@ export default {
this.showCustomMonthRangeDialog = false; this.showCustomMonthRangeDialog = false;
} }
this.reload(null); if (changed) {
this.loading = true;
this.statisticsStore.updateTransactionStatisticsInvalidState(true);
this.$router.push(this.getFilterLinkUrl());
}
}, },
showCustomDateRange(query) { showCustomDateRange() {
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return query.categoricalChartDateType === this.allDateRanges.Custom.type && query.categoricalChartStartTime && query.categoricalChartEndTime; return this.query.categoricalChartDateType === this.allDateRanges.Custom.type && this.query.categoricalChartStartTime && this.query.categoricalChartEndTime;
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
return query.trendChartDateType === this.allDateRanges.Custom.type && query.trendChartStartYearMonth && query.trendChartEndYearMonth; return this.query.trendChartDateType === this.allDateRanges.Custom.type && this.query.trendChartStartYearMonth && this.query.trendChartEndYearMonth;
} else { } else {
return false; return false;
} }
}, },
canShiftDateRange(query) { canShiftDateRange() {
if (query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type || query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) { if (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type || this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
return false; return false;
} }
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return query.categoricalChartDateType !== this.allDateRanges.All.type; return this.query.categoricalChartDateType !== this.allDateRanges.All.type;
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
return query.trendChartDateType !== this.allDateRanges.All.type; return this.query.trendChartDateType !== this.allDateRanges.All.type;
} else { } else {
return false; return false;
} }
}, },
shiftDateRange(query, scale) { shiftDateRange(scale) {
if (this.query.categoricalChartDateType === this.allDateRanges.All.type) { if (this.query.categoricalChartDateType === this.allDateRanges.All.type) {
return; return;
} }
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { let changed = false;
const newDateRange = getShiftedDateRangeAndDateType(query.categoricalChartStartTime, query.categoricalChartEndTime, scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
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, categoricalChartDateType: newDateRange.dateType,
categoricalChartStartTime: newDateRange.minTime, categoricalChartStartTime: newDateRange.minTime,
categoricalChartEndTime: newDateRange.maxTime categoricalChartEndTime: newDateRange.maxTime
}); });
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
const newDateRange = getShiftedDateRangeAndDateType(getYearMonthFirstUnixTime(query.trendChartStartYearMonth), getYearMonthLastUnixTime(query.trendChartEndYearMonth), scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.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, trendChartDateType: newDateRange.dateType,
trendChartStartYearMonth: getYearAndMonthFromUnixTime(newDateRange.minTime), trendChartStartYearMonth: getYearAndMonthFromUnixTime(newDateRange.minTime),
trendChartEndYearMonth: getYearAndMonthFromUnixTime(newDateRange.maxTime) trendChartEndYearMonth: getYearAndMonthFromUnixTime(newDateRange.maxTime)
}); });
} }
this.reload(null); if (changed) {
this.loading = true;
this.statisticsStore.updateTransactionStatisticsInvalidState(true);
this.$router.push(this.getFilterLinkUrl());
}
}, },
dateRangeName(query) { dateRangeName() {
if (query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type || if (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type ||
query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) { this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) {
return this.$t(this.allDateRanges.All.name); return this.$t(this.allDateRanges.All.name);
} }
if (this.analysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) { if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.CategoricalAnalysis) {
return this.$locale.getDateRangeDisplayName(this.userStore, query.categoricalChartDateType, query.categoricalChartStartTime, query.categoricalChartEndTime); return this.$locale.getDateRangeDisplayName(this.userStore, this.query.categoricalChartDateType, this.query.categoricalChartStartTime, this.query.categoricalChartEndTime);
} else if (this.analysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) { } else if (this.queryAnalysisType === statisticsConstants.allAnalysisTypes.TrendAnalysis) {
return this.$locale.getDateRangeDisplayName(this.userStore, query.trendChartDateType, getYearMonthFirstUnixTime(query.trendChartStartYearMonth), getYearMonthLastUnixTime(query.trendChartEndYearMonth)); return this.$locale.getDateRangeDisplayName(this.userStore, this.query.trendChartDateType, getYearMonthFirstUnixTime(this.query.trendChartStartYearMonth), getYearMonthLastUnixTime(this.query.trendChartEndYearMonth));
} else { } else {
return ''; 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) { clickPieChartItem(item) {
this.$router.push(this.getItemLinkUrl(item)); this.$router.push(this.getTransactionItemLinkUrl(item));
}, },
clickTrendChartItem(item) { clickTrendChartItem(item) {
const minUnixTime = getYearMonthFirstUnixTime(item.yearMonth); const minUnixTime = getYearMonthFirstUnixTime(item.yearMonth);
const maxUnixTime = getYearMonthLastUnixTime(item.yearMonth); const maxUnixTime = getYearMonthLastUnixTime(item.yearMonth);
const dateRangeType = getDateTypeByDateRange(minUnixTime, maxUnixTime, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal); 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, minTime: minUnixTime,
maxTime: maxUnixTime, maxTime: maxUnixTime,
type: dateRangeType, type: dateRangeType,
@@ -812,8 +979,8 @@ export default {
amount = this.getDisplayCurrency(amount, currency); amount = this.getDisplayCurrency(amount, currency);
if (!this.showAccountBalance if (!this.showAccountBalance
&& (this.query.chartDataType === this.allChartDataTypes.AccountTotalAssets.type && (this.queryChartDataType === this.allChartDataTypes.AccountTotalAssets.type
|| this.query.chartDataType === this.allChartDataTypes.AccountTotalLiabilities.type) || this.queryChartDataType === this.allChartDataTypes.AccountTotalLiabilities.type)
) { ) {
return '***'; return '***';
} }
@@ -830,8 +997,11 @@ export default {
getDisplayPercent(value, precision, lowPrecisionValue) { getDisplayPercent(value, precision, lowPrecisionValue) {
return formatPercent(value, precision, lowPrecisionValue); return formatPercent(value, precision, lowPrecisionValue);
}, },
getItemLinkUrl(item, dateRange) { getFilterLinkUrl() {
return `/transaction/list?${this.statisticsStore.getTransactionListPageParams(this.analysisType, item, dateRange)}`; return `/statistics/transaction?${this.statisticsStore.getTransactionStatisticsPageParams(this.queryAnalysisType)}`;
},
getTransactionItemLinkUrl(item, dateRange) {
return `/transaction/list?${this.statisticsStore.getTransactionListPageParams(this.queryAnalysisType, item, dateRange)}`;
} }
} }
} }
src/views/mobile/statistics/TransactionPage.vue
+1 -1
View File
@@ -365,7 +365,7 @@ export default {
created() { created() {
const self = this; const self = this;
self.statisticsStore.initTransactionStatisticsFilter(); self.statisticsStore.initTransactionStatisticsFilter(statisticsConstants.allAnalysisTypes.CategoricalAnalysis);
Promise.all([ Promise.all([
self.accountsStore.loadAllAccounts({ force: false }), self.accountsStore.loadAllAccounts({ force: false }),