diff --git a/src/components/mobile/PieChart.vue b/src/components/mobile/PieChart.vue index 9e779850..f546199f 100644 --- a/src/components/mobile/PieChart.vue +++ b/src/components/mobile/PieChart.vue @@ -260,7 +260,7 @@ export default { } .pie-chart { - margin: 24px 24px 0 24px; + margin: 0 24px 0 24px; } .pie-chart-toolbox-container { diff --git a/src/consts/statistics.js b/src/consts/statistics.js index 83fc1298..a4144b20 100644 --- a/src/consts/statistics.js +++ b/src/consts/statistics.js @@ -45,12 +45,21 @@ const allChartDataTypes = { const defaultChartDataType = allChartDataTypes.ExpenseByPrimaryCategory.type; const allSortingTypes = { - ByAmount: 0, - ByDisplayOrder: 1, - ByName: 2 + Amount: { + type: 0, + name: 'Amount' + }, + DisplayOrder: { + type: 1, + name: 'Display Order' + }, + Name: { + type: 2, + name: 'Name' + } }; -const defaultSortingType = allSortingTypes.ByAmount; +const defaultSortingType = allSortingTypes.Amount.type; export default { allChartTypes: allChartTypes, diff --git a/src/lib/settings.js b/src/lib/settings.js index fcba5dab..1ee19d55 100644 --- a/src/lib/settings.js +++ b/src/lib/settings.js @@ -24,7 +24,7 @@ const defaultSettings = { defaultDataRangeType: statisticsConstants.defaultDataRangeType, defaultAccountFilter: {}, defaultTransactionCategoryFilter: {}, - sortingType: statisticsConstants.defaultSortingType + defaultSortingType: statisticsConstants.defaultSortingType }, animate: true, autoDarkMode: true @@ -160,8 +160,8 @@ export default { setStatisticsDefaultAccountFilter: value => setSubOption('statistics', 'defaultAccountFilter', value), getStatisticsDefaultTransactionCategoryFilter: () => getSubOption('statistics', 'defaultTransactionCategoryFilter'), setStatisticsDefaultTransactionCategoryFilter: value => setSubOption('statistics', 'defaultTransactionCategoryFilter', value), - getStatisticsSortingType: () => getSubOption('statistics', 'sortingType'), - setStatisticsSortingType: value => setSubOption('statistics', 'sortingType', value), + getStatisticsSortingType: () => getSubOption('statistics', 'defaultSortingType'), + setStatisticsSortingType: value => setSubOption('statistics', 'defaultSortingType', value), isEnableAnimate: () => getOption('animate'), setEnableAnimate: value => setOption('animate', value), isEnableAutoDarkMode: () => getOption('autoDarkMode'), diff --git a/src/locales/en.js b/src/locales/en.js index 19c4949c..3031f6c6 100644 --- a/src/locales/en.js +++ b/src/locales/en.js @@ -687,6 +687,7 @@ export default { 'Custom': 'Custom', 'Pie Chart': 'Pie Chart', 'Bar Chart': 'Bar Chart', + 'Sort By': 'Sort By', 'User': 'User', 'Application': 'Application', 'Details': 'Details', @@ -862,10 +863,10 @@ export default { 'Default Date Range': 'Default Date Range', 'Default Account Filter': 'Default Account Filter', 'Default Transaction Category Filter': 'Default Transaction Category Filter', - 'Sort By': 'Sort By', - 'By Amount': 'By Amount', - 'By Display Order': 'By Display Order', - 'By Name': 'By Name', + 'Default Sort By': 'Default Sort By', + 'Amount': 'Amount', + 'Display Order': 'Display Order', + 'Name': 'Name', 'Filter Accounts': 'Filter Accounts', 'Filter Transaction Categories': 'Filter Transaction Categories', 'User Profile': 'User Profile', diff --git a/src/locales/zh_Hans.js b/src/locales/zh_Hans.js index be498d74..e5d7fa51 100644 --- a/src/locales/zh_Hans.js +++ b/src/locales/zh_Hans.js @@ -687,6 +687,7 @@ export default { 'Custom': '自定义', 'Pie Chart': '饼图', 'Bar Chart': '条形图', + 'Sort By': '排序方式', 'User': '用户', 'Application': '应用', 'Details': '详情', @@ -862,10 +863,10 @@ export default { 'Default Date Range': '默认时间范围', 'Default Account Filter': '默认账号过滤', 'Default Transaction Category Filter': '默认交易分类过滤', - 'Sort By': '排序方式', - 'By Amount': '金额', - 'By Display Order': '显示顺序', - 'By Name': '名称', + 'Default Sort By': '默认排序方式', + 'Amount': '金额', + 'Display Order': '显示顺序', + 'Name': '名称', 'Filter Accounts': '过滤账户', 'Filter Transaction Categories': '过滤交易类型', 'User Profile': '用户信息', diff --git a/src/store/index.js b/src/store/index.js index bb01a126..787a6085 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -890,6 +890,12 @@ const stores = { } else { state.transactionStatisticsFilter.filterCategoryIds = {}; } + + if (filter && utils.isNumber(filter.sortingType)) { + state.transactionStatisticsFilter.sortingType = filter.sortingType; + } else { + state.transactionStatisticsFilter.sortingType = statisticsConstants.defaultSortingType; + } }, [UPDATE_TRANSACTION_STATISTICS_FILTER] (state, filter) { if (filter && utils.isNumber(filter.dateType)) { @@ -919,6 +925,10 @@ const stores = { if (filter && utils.isObject(filter.filterCategoryIds)) { state.transactionStatisticsFilter.filterCategoryIds = filter.filterCategoryIds; } + + if (filter && utils.isNumber(filter.sortingType)) { + state.transactionStatisticsFilter.sortingType = filter.sortingType; + } }, [UPDATE_TRANSACTION_STATISTICS_INVALID_STATE] (state, invalidState) { state.transactionStatisticsStateInvalid = invalidState; diff --git a/src/views/mobile/statistics/Settings.vue b/src/views/mobile/statistics/Settings.vue index 33847022..20b5cc7b 100644 --- a/src/views/mobile/statistics/Settings.vue +++ b/src/views/mobile/statistics/Settings.vue @@ -20,7 +20,7 @@ @@ -30,7 +30,7 @@ @@ -39,12 +39,12 @@ - + @@ -59,6 +59,9 @@ export default { allChartDataTypes() { return this.$constants.statistics.allChartDataTypes; }, + allSortingTypes() { + return this.$constants.statistics.allSortingTypes; + }, allDateRanges() { const allDateRanges = []; @@ -100,7 +103,7 @@ export default { this.$settings.setStatisticsDefaultDateRange(value); } }, - sortBy: { + defaultSortingType: { get: function () { return this.$settings.getStatisticsSortingType(); }, diff --git a/src/views/mobile/statistics/Transaction.vue b/src/views/mobile/statistics/Transaction.vue index 35ace98b..224bc509 100644 --- a/src/views/mobile/statistics/Transaction.vue +++ b/src/views/mobile/statistics/Transaction.vue @@ -25,7 +25,13 @@ - + + + {{ $t('Sort By') }} + {{ query.sortingType | optionName(allSortingTypes, 'type', 'name', 'System Default') | localized }} + + + - + + + {{ $t('Sort By') }} + {{ query.sortingType | optionName(allSortingTypes, 'type', 'name', 'System Default') | localized }} + + +
@@ -186,6 +198,20 @@ + + + + + + + + @@ -211,7 +237,7 @@
self.allSortingTypes.Name.type) { + defaultSortType = self.$constants.statistics.defaultSortingType; + } + const dateRange = self.$utilities.getDateRangeByDateType(defaultDateRange, self.firstDayOfWeek); self.$store.dispatch('initTransactionStatisticsFilter', { @@ -398,6 +433,7 @@ export default { chartDataType: defaultChartDataType, filterAccountIds: self.$settings.getStatisticsDefaultAccountFilter() || {}, filterCategoryIds: self.$settings.getStatisticsDefaultTransactionCategoryFilter() || {}, + sortingType: defaultSortType, }); Promise.all([ @@ -420,10 +456,6 @@ export default { }, methods: { onPageAfterIn() { - if (this.sortBy !== this.$settings.getStatisticsSortingType()) { - this.sortBy = this.$settings.getStatisticsSortingType(); - } - if (this.$store.state.transactionStatisticsStateInvalid && !this.loading) { this.reload(null); } @@ -432,22 +464,39 @@ export default { }, reload(done) { const self = this; + let dispatchPromise = null; - self.$store.dispatch('loadTransactionStatistics', { - defaultCurrency: self.defaultCurrency - }).then(() => { - if (done) { - done(); - } - }).catch(error => { - if (done) { - done(); - } + 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) { + dispatchPromise = self.$store.dispatch('loadTransactionStatistics', { + defaultCurrency: self.defaultCurrency + }); + } else if (self.query.chartDataType === self.allChartDataTypes.AccountTotalAssets.type || + self.query.chartDataType === self.allChartDataTypes.AccountTotalLiabilities.type) { + dispatchPromise = self.$store.dispatch('loadAllAccounts', { + force: true + }); + } - if (!error.processed) { - self.$toast(error.message || error); - } - }); + if (dispatchPromise) { + dispatchPromise.then(() => { + if (done) { + done(); + } + }).catch(error => { + if (done) { + done(); + } + + if (!error.processed) { + self.$toast(error.message || error); + } + }); + } }, setChartType(chartType) { this.$store.dispatch('updateTransactionStatisticsFilter', { @@ -460,6 +509,19 @@ export default { }); this.showChartDataTypePopover = false; }, + setSortingType(sortingType) { + if (sortingType < this.allSortingTypes.Amount.type || sortingType > this.allSortingTypes.Name.type) { + this.showSortingTypePopover = false; + return; + } + + this.$store.dispatch('updateTransactionStatisticsFilter', { + sortingType: sortingType + }); + + this.showSortingTypePopover = false; + this.reload(null); + }, setDateFilter(dateType) { if (dateType === this.allDateRanges.Custom.type) { // Custom this.showCustomDateRangeSheet = true; @@ -663,6 +725,10 @@ export default {