diff --git a/src/consts/statistics.js b/src/consts/statistics.js index 36a9ab40..f22e5523 100644 --- a/src/consts/statistics.js +++ b/src/consts/statistics.js @@ -1,3 +1,5 @@ +import datetime from './datetime.js'; + const allChartTypes = { Pie: 0, Bar: 1 @@ -21,4 +23,5 @@ export default { defaultChartType: defaultChartType, allChartDataTypes: allChartDataTypes, defaultChartDataType: defaultChartDataType, + defaultDataRangeType: datetime.allDateRanges.ThisMonth.type, }; diff --git a/src/lib/settings.js b/src/lib/settings.js index 786b7304..583644de 100644 --- a/src/lib/settings.js +++ b/src/lib/settings.js @@ -1,5 +1,7 @@ import Cookies from 'js-cookie'; +import statisticsConstants from '../consts/statistics.js'; + const settingsLocalStorageKey = 'lab_app_settings'; const serverSettingsCookieKey = 'lab_server_settings'; @@ -13,6 +15,11 @@ const defaultSettings = { currencyDisplayMode: 'symbol', // or 'none' or 'code' or 'name' showAmountInHomePage: true, showAccountBalance: true, + statistics: { + defaultChartType: statisticsConstants.defaultChartType, + defaultChartDataType: statisticsConstants.defaultChartDataType, + defaultDataRangeType: statisticsConstants.defaultDataRangeType + }, animate: true, autoDarkMode: true }; @@ -44,6 +51,11 @@ function getOption(key) { return getFinalSettings()[key]; } +function getSubOption(key, subKey) { + const options = getFinalSettings()[key] || {}; + return options[subKey]; +} + function setOption(key, value) { if (!Object.prototype.hasOwnProperty.call(defaultSettings, key)) { return; @@ -55,6 +67,28 @@ function setOption(key, value) { return setSettings(settings); } +function setSubOption(key, subKey, value) { + if (!Object.prototype.hasOwnProperty.call(defaultSettings, key)) { + return; + } + + if (!Object.prototype.hasOwnProperty.call(defaultSettings[key], subKey)) { + return; + } + + const settings = getFinalSettings(); + let options = settings[key]; + + if (!options) { + options = {}; + } + + options[subKey] = value; + settings[key] = options; + + return setSettings(settings); +} + function getServerSetting(key) { const settings = Cookies.get(serverSettingsCookieKey) || ''; const settingsArr = settings.split('_'); @@ -93,6 +127,12 @@ export default { setShowAmountInHomePage: value => setOption('showAmountInHomePage', value), isShowAccountBalance: () => getOption('showAccountBalance'), setShowAccountBalance: value => setOption('showAccountBalance', value), + getStatisticsDefaultChartType: () => getSubOption('statistics', 'defaultChartType'), + setStatisticsDefaultChartType: value => setSubOption('statistics', 'defaultChartType', value), + getStatisticsDefaultChartDataType: () => getSubOption('statistics', 'defaultChartDataType'), + setStatisticsDefaultChartDataType: value => setSubOption('statistics', 'defaultChartDataType', value), + getStatisticsDefaultDateRange: () => getSubOption('statistics', 'defaultDataRangeType'), + setStatisticsDefaultDateRange: value => setSubOption('statistics', 'defaultDataRangeType', 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 aae4c886..c0a333a2 100644 --- a/src/locales/en.js +++ b/src/locales/en.js @@ -657,6 +657,10 @@ export default { 'Income By Account': 'Income By Account', 'Income By Primary Category': 'Income By Primary Category', 'Income By Secondary Category': 'Income By Secondary Category', + 'Statistics Settings': 'Statistics Settings', + 'Default Chart Type': 'Default Chart Type', + 'Default Chart Data Type': 'Default Chart Data Type', + 'Default Date Range': 'Default Date Range', 'User Profile': 'User Profile', 'Language': 'Language', 'Auto Update Exchange Rates Data': 'Auto Update Exchange Rates Data', diff --git a/src/locales/zh_Hans.js b/src/locales/zh_Hans.js index 315904a8..cb1f11cb 100644 --- a/src/locales/zh_Hans.js +++ b/src/locales/zh_Hans.js @@ -657,6 +657,10 @@ export default { 'Income By Account': '账号收入', 'Income By Primary Category': '一级分类收入', 'Income By Secondary Category': '二级分类收入', + 'Statistics Settings': '统计设置', + 'Default Chart Type': '默认图表类型', + 'Default Chart Data Type': '默认图表数据类型', + 'Default Date Range': '默认时间范围', 'User Profile': '用户信息', 'Language': '语言', 'Auto Update Exchange Rates Data': '自动更新汇率数据', diff --git a/src/router/mobile.js b/src/router/mobile.js index 50c372c1..a9f287fa 100644 --- a/src/router/mobile.js +++ b/src/router/mobile.js @@ -12,6 +12,7 @@ import AccountListPage from '../views/mobile/accounts/List.vue'; import AccountEditPage from '../views/mobile/accounts/Edit.vue'; import StatisticsTransactionPage from '../views/mobile/statistics/Transaction.vue'; +import StatisticsSettingsPage from '../views/mobile/statistics/Settings.vue'; import SettingsPage from '../views/mobile/Settings.vue'; import ApplicationLockPage from '../views/mobile/ApplicationLock.vue'; @@ -175,6 +176,11 @@ const routes = [ component: StatisticsTransactionPage, beforeEnter: checkLogin }, + { + path: '/statistic/settings', + component: StatisticsSettingsPage, + beforeEnter: checkLogin + }, { path: '/settings', component: SettingsPage, diff --git a/src/store/index.js b/src/store/index.js index f816e25b..30edada7 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -179,7 +179,7 @@ const stores = { transactionOverview: {}, transactionOverviewStateInvalid: true, transactionStatisticsFilter: { - dateType: datetimeConstants.allDateRanges.ThisMonth.type, + dateType: statisticsConstants.defaultDataRangeType, startTime: 0, endTime: 0, chartType: statisticsConstants.defaultChartType, @@ -239,7 +239,7 @@ const stores = { state.transactionOverview = {}; state.transactionOverviewStateInvalid = true; - state.transactionStatisticsFilter.dateType = datetimeConstants.allDateRanges.ThisMonth.type; + state.transactionStatisticsFilter.dateType = statisticsConstants.defaultDataRangeType; state.transactionStatisticsFilter.startTime = 0; state.transactionStatisticsFilter.endTime = 0; state.transactionStatisticsFilter.chartType = statisticsConstants.defaultChartType; @@ -801,7 +801,7 @@ const stores = { if (filter && utils.isNumber(filter.dateType)) { state.transactionStatisticsFilter.dateType = filter.dateType; } else { - state.transactionStatisticsFilter.dateType = datetimeConstants.allDateRanges.ThisMonth.type; + state.transactionStatisticsFilter.dateType = statisticsConstants.defaultDataRangeType; } if (filter && utils.isNumber(filter.startTime)) { diff --git a/src/views/mobile/Settings.vue b/src/views/mobile/Settings.vue index 549aceac..5c6a6138 100644 --- a/src/views/mobile/Settings.vue +++ b/src/views/mobile/Settings.vue @@ -68,6 +68,8 @@ + + {{ $t('Enable Animate') }} diff --git a/src/views/mobile/statistics/Settings.vue b/src/views/mobile/statistics/Settings.vue new file mode 100644 index 00000000..7741a7b8 --- /dev/null +++ b/src/views/mobile/statistics/Settings.vue @@ -0,0 +1,116 @@ + + + diff --git a/src/views/mobile/statistics/Transaction.vue b/src/views/mobile/statistics/Transaction.vue index 6c63f80a..0e9fe82e 100644 --- a/src/views/mobile/statistics/Transaction.vue +++ b/src/views/mobile/statistics/Transaction.vue @@ -1,5 +1,5 @@ @@ -223,7 +235,8 @@ export default { loading: true, showChartDataTypePopover: false, showDatePopover: false, - showCustomDateRangeSheet: false + showCustomDateRangeSheet: false, + showMoreActionSheet: false }; }, computed: { @@ -405,12 +418,32 @@ export default { const self = this; const router = self.$f7router; - const dateRange = self.$utilities.getDateRangeByDateType(self.query.dateType, self.firstDayOfWeek); + let defaultChartType = self.$settings.getStatisticsDefaultChartType(); + + if (defaultChartType !== self.$constants.statistics.allChartTypes.Pie && defaultChartType !== self.$constants.statistics.allChartTypes.Bar) { + defaultChartType = self.$constants.statistics.defaultChartType; + } + + let defaultChartDataType = self.$settings.getStatisticsDefaultChartDataType(); + + if (defaultChartDataType < self.$constants.statistics.allChartDataTypes.ExpenseByAccount || defaultChartDataType > self.$constants.statistics.allChartDataTypes.IncomeBySecondaryCategory) { + defaultChartDataType = self.$constants.statistics.defaultChartDataType; + } + + let defaultDateRange = self.$settings.getStatisticsDefaultDateRange(); + + if (defaultDateRange < self.$constants.datetime.allDateRanges.All.type || defaultDateRange >= self.$constants.datetime.allDateRanges.Custom.type) { + defaultDateRange = self.$constants.statistics.defaultDataRangeType; + } + + const dateRange = self.$utilities.getDateRangeByDateType(defaultDateRange, self.firstDayOfWeek); self.$store.dispatch('initTransactionStatisticsFilter', { dateType: dateRange ? dateRange.dateType : undefined, startTime: dateRange ? dateRange.minTime : undefined, endTime: dateRange ? dateRange.maxTime : undefined, + chartType: defaultChartType, + chartDataType: defaultChartDataType, }); Promise.all([ @@ -432,6 +465,11 @@ export default { }); }, methods: { + onPageAfterIn() { + if (this.$store.state.transactionStatisticsStateInvalid && !this.loading) { + this.reload(null); + } + }, reload(done) { const self = this; @@ -576,6 +614,9 @@ export default { } return `${displayStartTime} ~ ${displayEndTime}`; + }, + settings() { + this.$f7router.navigate('/statistic/settings'); } }, filters: {