support setting timezone type for the time range of statistical data

src/consts/timezone.js

@@ -592,7 +592,16 @@ const allAvailableTimezones = [
     }
 ];
 
+const allTimezoneTypesUsedForStatistics = {
+    ApplicationTimezone: 0,
+    TransactionTimezone: 1
+};
+
+const defaultTimezoneTypesUsedForStatistics = allTimezoneTypesUsedForStatistics.ApplicationTimezone;
+
 export default {
     all: allAvailableTimezones,
-    utcTimezoneName: 'Etc/GMT'
+    utcTimezoneName: 'Etc/GMT',
+    allTimezoneTypesUsedForStatistics: allTimezoneTypesUsedForStatistics,
+    defaultTimezoneTypesUsedForStatistics: defaultTimezoneTypesUsedForStatistics
 };

src/lib/i18n.js

@@ -762,6 +762,21 @@ function getDateRangeDisplayName(userStore, dateType, startTime, endTime, transl
     return `${displayStartTime} ~ ${displayEndTime}`;
 }
 
+function getAllTimezoneTypesUsedForStatistics(currentTimezone, translateFn) {
+    const currentTimezoneOffset = getTimezoneOffset(currentTimezone);
+
+    return [
+        {
+            displayName: translateFn('Application Timezone') + ` (UTC${currentTimezoneOffset})`,
+            type: timezone.allTimezoneTypesUsedForStatistics.ApplicationTimezone
+        },
+        {
+            displayName: translateFn('Transaction Timezone'),
+            type: timezone.allTimezoneTypesUsedForStatistics.TransactionTimezone
+        }
+    ];
+}
+
 function getAllAccountCategories(translateFn) {
     const allAccountCategories = [];
 
@@ -1333,6 +1348,7 @@ export function i18nFunctions(i18nGlobal) {
         getAllDateRanges: (includeCustom) => getAllDateRanges(includeCustom, i18nGlobal.t),
         getAllRecentMonthDateRanges: (userStore, includeAll, includeCustom) => getAllRecentMonthDateRanges(userStore, includeAll, includeCustom, i18nGlobal.t),
         getDateRangeDisplayName: (userStore, dateType, startTime, endTime) => getDateRangeDisplayName(userStore, dateType, startTime, endTime, i18nGlobal.t),
+        getAllTimezoneTypesUsedForStatistics: (currentTimezone) => getAllTimezoneTypesUsedForStatistics(currentTimezone, i18nGlobal.t),
         getAllAccountCategories: () => getAllAccountCategories(i18nGlobal.t),
         getAllAccountTypes: () => getAllAccountTypes(i18nGlobal.t),
         getAllStatisticsChartDataTypes: () => getAllStatisticsChartDataTypes(i18nGlobal.t),

src/lib/services.js

@@ -283,7 +283,7 @@ export default {
         keyword = encodeURIComponent(keyword);
         return axios.get(`v1/transactions/list/by_month.json?year=${year}&month=${month}&type=${type}&category_id=${categoryId}&account_id=${accountId}&keyword=${keyword}&trim_account=true&trim_category=true&trim_tag=true`);
     },
-    getTransactionStatistics: ({ startTime, endTime }) => {
+    getTransactionStatistics: ({ startTime, endTime, useTransactionTimezone }) => {
         const queryParams = [];
 
         if (startTime) {
@@ -294,9 +294,9 @@ export default {
             queryParams.push(`end_time=${endTime}`);
         }
 
-        return axios.get('v1/transactions/statistics.json' + (queryParams.length ? '?' + queryParams.join('&') : ''));
+        return axios.get(`v1/transactions/statistics.json?use_transaction_timezone=${useTransactionTimezone}` + (queryParams.length ? '&' + queryParams.join('&') : ''));
     },
-    getTransactionAmounts: ({ today, thisWeek, thisMonth, thisYear, lastMonth, monthBeforeLastMonth, monthBeforeLast2Months, monthBeforeLast3Months, monthBeforeLast4Months, monthBeforeLast5Months, monthBeforeLast6Months, monthBeforeLast7Months, monthBeforeLast8Months, monthBeforeLast9Months, monthBeforeLast10Months }) => {
+    getTransactionAmounts: ({ useTransactionTimezone, today, thisWeek, thisMonth, thisYear, lastMonth, monthBeforeLastMonth, monthBeforeLast2Months, monthBeforeLast3Months, monthBeforeLast4Months, monthBeforeLast5Months, monthBeforeLast6Months, monthBeforeLast7Months, monthBeforeLast8Months, monthBeforeLast9Months, monthBeforeLast10Months }) => {
         const queryParams = [];
 
         if (today) {
@@ -359,7 +359,7 @@ export default {
             queryParams.push(`monthBeforeLast10Months_${monthBeforeLast10Months.startTime}_${monthBeforeLast10Months.endTime}`);
         }
 
-        return axios.get('v1/transactions/amounts.json' + (queryParams.length ? '?query=' + queryParams.join('|') : ''));
+        return axios.get(`v1/transactions/amounts.json?use_transaction_timezone=${useTransactionTimezone}` + (queryParams.length ? '&query=' + queryParams.join('|') : ''));
     },
     getTransaction: ({ id }) => {
         return axios.get(`v1/transactions/get.json?id=${id}&trim_account=true&trim_category=true&trim_tag=true`);

src/lib/settings.js

@@ -1,4 +1,5 @@
 import currencyConstants from '@/consts/currency.js';
+import timezoneConstants from '@/consts/timezone.js';
 import statisticsConstants from '@/consts/statistics.js';
 
 const settingsLocalStorageKey = 'ebk_app_settings';
@@ -15,6 +16,7 @@ const defaultSettings = {
     thousandsSeparator: true,
     currencyDisplayMode: currencyConstants.defaultCurrencyDisplayMode,
     showAmountInHomePage: true,
+    timezoneUsedForStatisticsInHomePage: timezoneConstants.defaultTimezoneTypesUsedForStatistics,
     itemsCountInTransactionListPage: 15,
     showTotalAmountInTransactionListPage: true,
     showAccountBalance: true,
@@ -22,6 +24,7 @@ const defaultSettings = {
         defaultChartType: statisticsConstants.defaultChartType,
         defaultChartDataType: statisticsConstants.defaultChartDataType,
         defaultDataRangeType: statisticsConstants.defaultDataRangeType,
+        defaultTimezoneType: timezoneConstants.defaultTimezoneTypesUsedForStatistics,
         defaultAccountFilter: {},
         defaultTransactionCategoryFilter: {},
         defaultSortingType: statisticsConstants.defaultSortingType
@@ -186,6 +189,14 @@ export function setShowAmountInHomePage(value) {
     setOption('showAmountInHomePage', value);
 }
 
+export function getTimezoneUsedForStatisticsInHomePage() {
+    return getOption('timezoneUsedForStatisticsInHomePage');
+}
+
+export function setTimezoneUsedForStatisticsInHomePage(value) {
+    setOption('timezoneUsedForStatisticsInHomePage', value);
+}
+
 export function getItemsCountInTransactionListPage() {
     return getOption('itemsCountInTransactionListPage');
 }
@@ -230,6 +241,14 @@ export function getStatisticsDefaultDateRange() {
     return getSubOption('statistics', 'defaultDataRangeType');
 }
 
+export function getStatisticsDefaultTimezoneType() {
+    return getSubOption('statistics', 'defaultTimezoneType');
+}
+
+export function setStatisticsDefaultTimezoneType(value) {
+    setSubOption('statistics', 'defaultTimezoneType', value);
+}
+
 export function setStatisticsDefaultDateRange(value) {
     setSubOption('statistics', 'defaultDataRangeType', value);
 }

src/locales/en.js

@@ -1019,6 +1019,7 @@ export default {
     'Default Transaction Category Filter': 'Default Transaction Category Filter',
     'Sort Order': 'Sort Order',
     'Default Sort Order': 'Default Sort Order',
+    'Timezone Used for Date Range': 'Timezone Used for Date Range',
     'Amount': 'Amount',
     'Display Order': 'Display Order',
     'Name': 'Name',
@@ -1047,6 +1048,9 @@ export default {
     'Hide Account Balance': 'Hide Account Balance',
     'Page Settings': 'Page Settings',
     'Overview Page': 'Overview Page',
+    'Timezone Used for Statistics': 'Timezone Used for Statistics',
+    'Timezone Type': 'Timezone Type',
+    'Application Timezone': 'Application Timezone',
     'Transaction List Page': 'Transaction List Page',
     'Transactions Per Page': 'Transactions Per Page',
     'Show Monthly Total Amount': 'Show Monthly Total Amount',

src/locales/zh_Hans.js

@@ -1019,6 +1019,7 @@ export default {
     'Default Transaction Category Filter': '默认交易分类过滤',
     'Sort Order': '排序方式',
     'Default Sort Order': '默认排序方式',
+    'Timezone Used for Date Range': '时间范围使用的时区',
     'Amount': '金额',
     'Display Order': '显示顺序',
     'Name': '名称',
@@ -1047,6 +1048,9 @@ export default {
     'Hide Account Balance': '隐藏账户余额',
     'Page Settings': '页面设置',
     'Overview Page': '总览页面',
+    'Timezone Used for Statistics': '统计时使用的时区',
+    'Timezone Type': '时区类型',
+    'Application Timezone': '应用时区',
     'Transaction List Page': '交易列表页面',
     'Transactions Per Page': '每页交易数',
     'Show Monthly Total Amount': '显示月度总金额',

src/stores/overview.js

@@ -1,5 +1,6 @@
 import { defineStore } from 'pinia';
 
+import { useSettingsStore } from '@/stores/setting.js';
 import { useUserStore } from './user.js';
 import { useExchangeRatesStore } from './exchangeRates.js';
 
@@ -219,6 +220,8 @@ export const useOverviewStore = defineStore('overview', {
             this.transactionOverviewStateInvalid = true;
         },
         loadTransactionOverview({ force, loadLast11Months }) {
+            const settingsStore = useSettingsStore();
+
             const self = this;
             let dateChanged = false;
             let rangeChanged = false;
@@ -239,6 +242,7 @@ export const useOverviewStore = defineStore('overview', {
             }
 
             const requestParams = {
+                useTransactionTimezone: settingsStore.appSettings.timezoneUsedForStatisticsInHomePage,
                 today: self.transactionDataRange.today,
                 thisWeek: self.transactionDataRange.thisWeek,
                 thisMonth: self.transactionDataRange.thisMonth,

src/stores/setting.js

@@ -17,6 +17,7 @@ export const useSettingsStore = defineStore('settings', {
             thousandsSeparator: settings.isEnableThousandsSeparator(),
             currencyDisplayMode: settings.getCurrencyDisplayMode(),
             showAmountInHomePage: settings.isShowAmountInHomePage(),
+            timezoneUsedForStatisticsInHomePage: settings.getTimezoneUsedForStatisticsInHomePage(),
             itemsCountInTransactionListPage: settings.getItemsCountInTransactionListPage(),
             showTotalAmountInTransactionListPage: settings.isShowTotalAmountInTransactionListPage(),
             showAccountBalance: settings.isShowAccountBalance(),
@@ -24,6 +25,7 @@ export const useSettingsStore = defineStore('settings', {
                 defaultChartType: settings.getStatisticsDefaultChartType(),
                 defaultChartDataType: settings.getStatisticsDefaultChartDataType(),
                 defaultDataRangeType: settings.getStatisticsDefaultDateRange(),
+                defaultTimezoneType: settings.getStatisticsDefaultTimezoneType(),
                 defaultAccountFilter: settings.getStatisticsDefaultAccountFilter(),
                 defaultTransactionCategoryFilter: settings.getStatisticsDefaultTransactionCategoryFilter(),
                 defaultSortingType: settings.getStatisticsSortingType()
@@ -76,6 +78,10 @@ export const useSettingsStore = defineStore('settings', {
             settings.setShowAmountInHomePage(value);
             this.appSettings.showAmountInHomePage = value;
         },
+        setTimezoneUsedForStatisticsInHomePage(value) {
+            settings.setTimezoneUsedForStatisticsInHomePage(value);
+            this.appSettings.timezoneUsedForStatisticsInHomePage = value;
+        },
         setItemsCountInTransactionListPage(value) {
             settings.setItemsCountInTransactionListPage(value);
             this.appSettings.itemsCountInTransactionListPage = value;
@@ -100,6 +106,10 @@ export const useSettingsStore = defineStore('settings', {
             settings.setStatisticsDefaultDateRange(value);
             this.appSettings.statistics.defaultDataRangeType = value;
         },
+        setStatisticsDefaultTimezoneType(value) {
+            settings.setStatisticsDefaultTimezoneType(value);
+            this.appSettings.statistics.defaultTimezoneType = value;
+        },
         setStatisticsDefaultAccountFilter(value) {
             settings.setStatisticsDefaultAccountFilter(value);
             this.appSettings.statistics.defaultAccountFilter = value;

src/stores/statistics.js

@@ -580,11 +580,13 @@ export const useStatisticsStore = defineStore('statistics', {
         },
         loadTransactionStatistics({ force }) {
             const self = this;
+            const settingsStore = useSettingsStore();
 
             return new Promise((resolve, reject) => {
                 services.getTransactionStatistics({
                     startTime: self.transactionStatisticsFilter.startTime,
-                    endTime: self.transactionStatisticsFilter.endTime
+                    endTime: self.transactionStatisticsFilter.endTime,
+                    useTransactionTimezone: settingsStore.appSettings.statistics.defaultTimezoneType
                 }).then(response => {
                     const data = response.data;
 

src/views/desktop/app/settings/tabs/AppBasicSettingTab.vue

@@ -109,6 +109,18 @@
                                     v-model="showAmountInHomePage"
                                 />
                             </v-col>
+
+                            <v-col cols="12" md="6">
+                                <v-select
+                                    item-title="displayName"
+                                    item-value="type"
+                                    persistent-placeholder
+                                    :label="$t('Timezone Used for Statistics')"
+                                    :placeholder="$t('Timezone Used for Statistics')"
+                                    :items="allTimezoneTypesUsedForStatistics"
+                                    v-model="timezoneUsedForStatisticsInHomePage"
+                                />
+                            </v-col>
                         </v-row>
                     </v-card-text>
                 </v-form>
@@ -197,6 +209,9 @@ export default {
         allCurrencyDisplayModes() {
             return currencyConstants.allCurrencyDisplayModes;
         },
+        allTimezoneTypesUsedForStatistics() {
+            return this.$locale.getAllTimezoneTypesUsedForStatistics(this.timeZone);
+        },
         theme: {
             get: function () {
                 return this.settingsStore.appSettings.theme;
@@ -265,6 +280,15 @@ export default {
                 this.settingsStore.setShowAmountInHomePage(value);
             }
         },
+        timezoneUsedForStatisticsInHomePage: {
+            get: function () {
+                return this.settingsStore.appSettings.timezoneUsedForStatisticsInHomePage;
+            },
+            set: function (value) {
+                this.settingsStore.setTimezoneUsedForStatisticsInHomePage(value);
+                this.overviewStore.updateTransactionOverviewInvalidState(true);
+            }
+        },
         showTotalAmountInTransactionListPage: {
             get: function () {
                 return this.settingsStore.appSettings.showTotalAmountInTransactionListPage;

src/views/desktop/app/settings/tabs/AppStatisticsSettingTab.vue

@@ -44,6 +44,18 @@
                                 />
                             </v-col>
 
+                            <v-col cols="12" md="6">
+                                <v-select
+                                    item-title="displayName"
+                                    item-value="type"
+                                    persistent-placeholder
+                                    :label="$t('Timezone Used for Date Range')"
+                                    :placeholder="$t('Timezone Used for Date Range')"
+                                    :items="allTimezoneTypesUsedForStatistics"
+                                    v-model="defaultTimezoneType"
+                                />
+                            </v-col>
+
                             <v-col cols="12" md="6">
                                 <v-select
                                     item-title="displayName"
@@ -99,6 +111,9 @@ export default {
         allDateRanges() {
             return this.$locale.getAllDateRanges(false);
         },
+        allTimezoneTypesUsedForStatistics() {
+            return this.$locale.getAllTimezoneTypesUsedForStatistics();
+        },
         defaultChartType: {
             get: function () {
                 return this.settingsStore.appSettings.statistics.defaultChartType;
@@ -123,6 +138,14 @@ export default {
                 this.settingsStore.setStatisticsDefaultDateRange(value);
             }
         },
+        defaultTimezoneType: {
+            get: function () {
+                return this.settingsStore.appSettings.statistics.defaultTimezoneType;
+            },
+            set: function (value) {
+                this.settingsStore.setStatisticsDefaultTimezoneType(value);
+            }
+        },
         defaultSortingType: {
             get: function () {
                 return this.settingsStore.appSettings.statistics.defaultSortingType;

src/views/mobile/settings/PageSettingsPage.vue

@@ -8,6 +8,16 @@
                 <span>{{ $t('Show Amount') }}</span>
                 <f7-toggle :checked="showAmountInHomePage" @toggle:change="showAmountInHomePage = $event"></f7-toggle>
             </f7-list-item>
+
+            <f7-list-item
+                :title="$t('Timezone Used for Statistics')"
+                smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Timezone Type'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
+                <select v-model="timezoneUsedForStatisticsInHomePage">
+                    <option :value="timezoneType.type"
+                            :key="timezoneType.type"
+                            v-for="timezoneType in allTimezoneTypesUsedForStatistics">{{ timezoneType.displayName }}</option>
+                </select>
+            </f7-list-item>
         </f7-list>
 
         <f7-block-title>{{ $t('Transaction List Page') }}</f7-block-title>
@@ -31,10 +41,14 @@
 <script>
 import { mapStores } from 'pinia';
 import { useSettingsStore } from '@/stores/setting.js';
+import { useOverviewStore } from '@/stores/overview.js';
 
 export default {
     computed: {
-        ...mapStores(useSettingsStore),
+        ...mapStores(useSettingsStore, useOverviewStore),
+        allTimezoneTypesUsedForStatistics() {
+            return this.$locale.getAllTimezoneTypesUsedForStatistics();
+        },
         showAmountInHomePage: {
             get: function () {
                 return this.settingsStore.appSettings.showAmountInHomePage;
@@ -43,6 +57,15 @@ export default {
                 this.settingsStore.setShowAmountInHomePage(value);
             }
         },
+        timezoneUsedForStatisticsInHomePage: {
+            get: function () {
+                return this.settingsStore.appSettings.timezoneUsedForStatisticsInHomePage;
+            },
+            set: function (value) {
+                this.settingsStore.setTimezoneUsedForStatisticsInHomePage(value);
+                this.overviewStore.updateTransactionOverviewInvalidState(true);
+            }
+        },
         showTotalAmountInTransactionListPage: {
             get: function () {
                 return this.settingsStore.appSettings.showTotalAmountInTransactionListPage;

src/views/mobile/statistics/SettingsPage.vue

@@ -32,6 +32,16 @@
                 </select>
             </f7-list-item>
 
+            <f7-list-item
+                :title="$t('Timezone Used for Date Range')"
+                smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Timezone Type'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
+                <select v-model="defaultTimezoneType">
+                    <option :value="timezoneType.type"
+                            :key="timezoneType.type"
+                            v-for="timezoneType in allTimezoneTypesUsedForStatistics">{{ timezoneType.displayName }}</option>
+                </select>
+            </f7-list-item>
+
             <f7-list-item :title="$t('Default Account Filter')" link="/statistic/filter/account?modifyDefault=1"></f7-list-item>
 
             <f7-list-item :title="$t('Default Transaction Category Filter')" link="/statistic/filter/category?modifyDefault=1"></f7-list-item>
@@ -70,6 +80,9 @@ export default {
         allDateRanges() {
             return this.$locale.getAllDateRanges(false);
         },
+        allTimezoneTypesUsedForStatistics() {
+            return this.$locale.getAllTimezoneTypesUsedForStatistics();
+        },
         defaultChartType: {
             get: function () {
                 return this.settingsStore.appSettings.statistics.defaultChartType;
@@ -94,6 +107,14 @@ export default {
                 this.settingsStore.setStatisticsDefaultDateRange(value);
             }
         },
+        defaultTimezoneType: {
+            get: function () {
+                return this.settingsStore.appSettings.statistics.defaultTimezoneType;
+            },
+            set: function (value) {
+                this.settingsStore.setStatisticsDefaultTimezoneType(value);
+            }
+        },
         defaultSortingType: {
             get: function () {
                 return this.settingsStore.appSettings.statistics.defaultSortingType;