mirror/ezbookkeeping
1
0
Fork 0
mirror of https://github.com/mayswind/ezbookkeeping.git synced 2026-05-15 07:27:33 +08:00
Code Issues Packages Projects Releases Wiki Activity

add chart date type settings for trend analysis

Browse Source
This commit is contained in:
MaysWind
2024-05-27 00:50:50 +08:00
parent 5eca777891
commit f041e7cb7d
16 changed files with 446 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/consts/datetime.js
+99 -13
View File
@@ -166,54 +166,139 @@ const allShortTimeFormatArray = [
allShortTimeFormat.HHMMA
];
const allDateRangeScenes = {
Normal: 0,
TrendAnalysis: 1
};
const allDateRanges = {
All: {
type: 0,
name: 'All'
name: 'All',
availableScenes: {
[allDateRangeScenes.Normal]: true,
[allDateRangeScenes.TrendAnalysis]: true
}
},
Today: {
type: 1,
name: 'Today'
name: 'Today',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
Yesterday: {
type: 2,
name: 'Yesterday'
name: 'Yesterday',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
LastSevenDays: {
type: 3,
name: 'Recent 7 days'
name: 'Recent 7 days',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
LastThirtyDays: {
type: 4,
name: 'Recent 30 days'
name: 'Recent 30 days',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
ThisWeek: {
type: 5,
name: 'This week'
name: 'This week',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
LastWeek: {
type: 6,
name: 'Last week'
name: 'Last week',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
ThisMonth: {
type: 7,
name: 'This month'
name: 'This month',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
LastMonth: {
type: 8,
name: 'Last month'
name: 'Last month',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
ThisYear: {
type: 9,
name: 'This year'
name: 'This year',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
LastYear: {
type: 10,
name: 'Last year'
name: 'Last year',
availableScenes: {
[allDateRangeScenes.Normal]: true
}
},
RecentTwelveMonths: {
type: 101,
name: 'Recent 12 months',
availableScenes: {
[allDateRangeScenes.TrendAnalysis]: true
}
},
RecentTwentyFourMonths: {
type: 102,
name: 'Recent 24 months',
availableScenes: {
[allDateRangeScenes.TrendAnalysis]: true
}
},
RecentThirtySixMonths: {
type: 103,
name: 'Recent 36 months',
availableScenes: {
[allDateRangeScenes.TrendAnalysis]: true
}
},
RecentTwoYears: {
type: 104,
name: 'Recent 2 years',
availableScenes: {
[allDateRangeScenes.TrendAnalysis]: true
}
},
RecentThreeYears: {
type: 105,
name: 'Recent 3 years',
availableScenes: {
[allDateRangeScenes.TrendAnalysis]: true
}
},
RecentFiveYears: {
type: 106,
name: 'Recent 5 years',
availableScenes: {
[allDateRangeScenes.TrendAnalysis]: true
}
},
Custom: {
type: 11,
name: 'Custom Date'
type: 255,
name: 'Custom Date',
availableScenes: {
[allDateRangeScenes.Normal]: true,
[allDateRangeScenes.TrendAnalysis]: true
}
}
};
@@ -238,6 +323,7 @@ export default {
allLongTimeFormatArray: allLongTimeFormatArray,
allShortTimeFormat: allShortTimeFormat,
allShortTimeFormatArray: allShortTimeFormatArray,
allDateRangeScenes: allDateRangeScenes,
allDateRanges: allDateRanges,
defaultFirstDayOfWeek: defaultFirstDayOfWeek,
defaultLongDateFormat: defaultLongDateFormat,
src/consts/statistics.js
+2 -1
View File
@@ -144,7 +144,8 @@ export default {
defaultTrendChartType: defaultTrendChartType,
allChartDataTypes: allChartDataTypes,
defaultChartDataType: defaultChartDataType,
defaultDataRangeType: datetime.allDateRanges.ThisMonth.type,
defaultCategoricalChartDataRangeType: datetime.allDateRanges.ThisMonth.type,
defaultTrendChartDataRangeType: datetime.allDateRanges.RecentTwelveMonths.type,
allSortingTypes: allSortingTypes,
allSortingTypesArray: allSortingTypesArray,
defaultSortingType: defaultSortingType,
src/lib/common.js
+14
View File
@@ -26,6 +26,20 @@ export function isBoolean(val) {
return typeof(val) === 'boolean';
}
export function isYearMonth(val) {
if (typeof(val) !== 'string') {
return false;
}
const items = val.split('-');
if (items.length !== 2) {
return false;
}
return isNumber(items[0]) && isNumber(items[1]);
}
export function isEquals(obj1, obj2) {
if (obj1 === obj2) {
return true;
src/lib/datetime.js
+24 -1
View File
@@ -298,7 +298,7 @@ export function getShiftedDateRange(minTime, maxTime, scale) {
};
}
export function getShiftedDateRangeAndDateType(minTime, maxTime, scale, firstDayOfWeek) {
export function getShiftedDateRangeAndDateType(minTime, maxTime, scale, firstDayOfWeek, scene) {
const newDateRange = getShiftedDateRange(minTime, maxTime, scale);
let newDateType = dateTimeConstants.allDateRanges.Custom.type;
@@ -308,6 +308,11 @@ export function getShiftedDateRangeAndDateType(minTime, maxTime, scale, firstDay
}
const dateRangeType = dateTimeConstants.allDateRanges[dateRangeField];
if (!dateRangeType.availableScenes[scene]) {
continue;
}
const dateRange = getDateRangeByDateType(dateRangeType.type, firstDayOfWeek);
if (dateRange && dateRange.minTime === newDateRange.minTime && dateRange.maxTime === newDateRange.maxTime) {
@@ -360,6 +365,24 @@ export function getDateRangeByDateType(dateType, firstDayOfWeek) {
} else if (dateType === dateTimeConstants.allDateRanges.LastYear.type) { // Last year
maxTime = getUnixTimeBeforeUnixTime(getThisYearLastUnixTime(), 1, 'years');
minTime = getUnixTimeBeforeUnixTime(getThisYearFirstUnixTime(), 1, 'years');
} else if (dateType === dateTimeConstants.allDateRanges.RecentTwelveMonths.type) { // Recent 12 months
maxTime = getThisMonthLastUnixTime();
minTime = getUnixTimeBeforeUnixTime(getThisMonthFirstUnixTime(), 11, 'months');
} else if (dateType === dateTimeConstants.allDateRanges.RecentTwentyFourMonths.type) { // Recent 24 months
maxTime = getThisMonthLastUnixTime();
minTime = getUnixTimeBeforeUnixTime(getThisMonthFirstUnixTime(), 23, 'months');
} else if (dateType === dateTimeConstants.allDateRanges.RecentThirtySixMonths.type) { // Recent 36 months
maxTime = getThisMonthLastUnixTime();
minTime = getUnixTimeBeforeUnixTime(getThisMonthFirstUnixTime(), 35, 'months');
} else if (dateType === dateTimeConstants.allDateRanges.RecentTwoYears.type) { // Recent 2 years
maxTime = getThisYearLastUnixTime();
minTime = getUnixTimeBeforeUnixTime(getThisYearFirstUnixTime(), 1, 'years');
} else if (dateType === dateTimeConstants.allDateRanges.RecentThreeYears.type) { // Recent 3 years
maxTime = getThisYearLastUnixTime();
minTime = getUnixTimeBeforeUnixTime(getThisYearFirstUnixTime(), 2, 'years');
} else if (dateType === dateTimeConstants.allDateRanges.RecentFiveYears.type) { // Recent 5 years
maxTime = getThisYearLastUnixTime();
minTime = getUnixTimeBeforeUnixTime(getThisYearFirstUnixTime(), 4, 'years');
} else {
return null;
}
src/lib/i18n.js
+6 -2
View File
@@ -655,7 +655,7 @@ function getAllWeekDays(translateFn) {
return allWeekDays;
}
function getAllDateRanges(includeCustom, translateFn) {
function getAllDateRanges(scene, includeCustom, translateFn) {
const allDateRanges = [];
for (let dateRangeField in datetime.allDateRanges) {
@@ -665,6 +665,10 @@ function getAllDateRanges(includeCustom, translateFn) {
const dateRangeType = datetime.allDateRanges[dateRangeField];
if (!dateRangeType.availableScenes[scene]) {
continue;
}
if (includeCustom || dateRangeType.type !== datetime.allDateRanges.Custom.type) {
allDateRanges.push({
type: dateRangeType.type,
@@ -1376,7 +1380,7 @@ export function i18nFunctions(i18nGlobal) {
getTimezoneDifferenceDisplayText: (utcOffset) => getTimezoneDifferenceDisplayText(utcOffset, i18nGlobal.t),
getAllCurrencies: () => getAllCurrencies(i18nGlobal.t),
getAllWeekDays: () => getAllWeekDays(i18nGlobal.t),
getAllDateRanges: (includeCustom) => getAllDateRanges(includeCustom, i18nGlobal.t),
getAllDateRanges: (scene, includeCustom) => getAllDateRanges(scene, 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),
src/lib/settings.js
+18 -9
View File
@@ -22,13 +22,14 @@ const defaultSettings = {
showAccountBalance: true,
statistics: {
defaultChartDataType: statisticsConstants.defaultChartDataType,
defaultDataRangeType: statisticsConstants.defaultDataRangeType,
defaultTimezoneType: timezoneConstants.defaultTimezoneTypesUsedForStatistics,
defaultAccountFilter: {},
defaultTransactionCategoryFilter: {},
defaultSortingType: statisticsConstants.defaultSortingType,
defaultCategoricalChartType: statisticsConstants.defaultCategoricalChartType,
defaultCategoricalChartDataRangeType: statisticsConstants.defaultCategoricalChartDataRangeType,
defaultTrendChartType: statisticsConstants.defaultTrendChartType,
defaultTrendChartDataRangeType: statisticsConstants.defaultTrendChartDataRangeType,
},
animate: true
};
@@ -230,10 +231,6 @@ export function setStatisticsDefaultChartDataType(value) {
setSubOption('statistics', 'defaultChartDataType', value);
}
export function getStatisticsDefaultDateRange() {
return getSubOption('statistics', 'defaultDataRangeType');
}
export function getStatisticsDefaultTimezoneType() {
return getSubOption('statistics', 'defaultTimezoneType');
}
@@ -242,10 +239,6 @@ export function setStatisticsDefaultTimezoneType(value) {
setSubOption('statistics', 'defaultTimezoneType', value);
}
export function setStatisticsDefaultDateRange(value) {
setSubOption('statistics', 'defaultDataRangeType', value);
}
export function getStatisticsDefaultAccountFilter() {
return getSubOption('statistics', 'defaultAccountFilter');
}
@@ -278,6 +271,14 @@ export function setStatisticsDefaultCategoricalChartType(value) {
setSubOption('statistics', 'defaultCategoricalChartType', value);
}
export function getStatisticsDefaultCategoricalChartDataRange() {
return getSubOption('statistics', 'defaultCategoricalChartDataRangeType');
}
export function setStatisticsDefaultCategoricalChartDataRange(value) {
setSubOption('statistics', 'defaultCategoricalChartDataRangeType', value);
}
export function getStatisticsDefaultTrendChartType() {
return getSubOption('statistics', 'defaultTrendChartType');
}
@@ -286,6 +287,14 @@ export function setStatisticsDefaultTrendChartType(value) {
setSubOption('statistics', 'defaultTrendChartType', value);
}
export function getStatisticsDefaultTrendChartDataRange() {
return getSubOption('statistics', 'defaultTrendChartDataRangeType');
}
export function setStatisticsDefaultTrendChartDataRange(value) {
setSubOption('statistics', 'defaultTrendChartDataRangeType', value);
}
export function isEnableAnimate() {
return getOption('animate');
}
src/locales/en.js
+6
View File
@@ -759,6 +759,12 @@ export default {
'Last month': 'Last month',
'This year': 'This year',
'Last year': 'Last year',
'Recent 12 months': 'Recent 12 months',
'Recent 24 months': 'Recent 24 months',
'Recent 36 months': 'Recent 36 months',
'Recent 2 years': 'Recent 2 years',
'Recent 3 years': 'Recent 3 years',
'Recent 5 years': 'Recent 5 years',
'Custom Date': 'Custom Date',
'Start Time': 'Start Time',
'End Time': 'End Time',
src/locales/zh_Hans.js
+6
View File
@@ -759,6 +759,12 @@ export default {
'Last month': '上月',
'This year': '今年',
'Last year': '去年',
'Recent 12 months': '最近12个月',
'Recent 24 months': '最近24个月',
'Recent 36 months': '最近36个月',
'Recent 2 years': '最近2年',
'Recent 3 years': '最近3年',
'Recent 5 years': '最近5年',
'Custom Date': '自定义日期',
'Start Time': '开始时间',
'End Time': '结束时间',
src/stores/setting.js
+10 -5
View File
@@ -23,13 +23,14 @@ export const useSettingsStore = defineStore('settings', {
showAccountBalance: settings.isShowAccountBalance(),
statistics: {
defaultChartDataType: settings.getStatisticsDefaultChartDataType(),
defaultDataRangeType: settings.getStatisticsDefaultDateRange(),
defaultTimezoneType: settings.getStatisticsDefaultTimezoneType(),
defaultAccountFilter: settings.getStatisticsDefaultAccountFilter(),
defaultTransactionCategoryFilter: settings.getStatisticsDefaultTransactionCategoryFilter(),
defaultSortingType: settings.getStatisticsSortingType(),
defaultCategoricalChartType: settings.getStatisticsDefaultCategoricalChartType(),
defaultCategoricalChartDataRangeType: settings.getStatisticsDefaultCategoricalChartDataRange(),
defaultTrendChartType: settings.getStatisticsDefaultTrendChartType(),
defaultTrendChartDataRangeType: settings.getStatisticsDefaultTrendChartDataRange(),
},
animate: settings.isEnableAnimate()
},
@@ -99,10 +100,6 @@ export const useSettingsStore = defineStore('settings', {
settings.setStatisticsDefaultChartDataType(value);
this.appSettings.statistics.defaultChartDataType = value;
},
setStatisticsDefaultDateRange(value) {
settings.setStatisticsDefaultDateRange(value);
this.appSettings.statistics.defaultDataRangeType = value;
},
setStatisticsDefaultTimezoneType(value) {
settings.setStatisticsDefaultTimezoneType(value);
this.appSettings.statistics.defaultTimezoneType = value;
@@ -123,10 +120,18 @@ export const useSettingsStore = defineStore('settings', {
settings.setStatisticsDefaultCategoricalChartType(value);
this.appSettings.statistics.defaultCategoricalChartType = value;
},
setStatisticsDefaultCategoricalChartDateRange(value) {
settings.setStatisticsDefaultCategoricalChartDataRange(value);
this.appSettings.statistics.defaultCategoricalChartDataRangeType = value;
},
setStatisticsDefaultTrendChartType(value) {
settings.setStatisticsDefaultTrendChartType(value);
this.appSettings.statistics.defaultTrendChartType = value;
},
setStatisticsDefaultTrendChartDateRange(value) {
settings.setStatisticsDefaultTrendChartDataRange(value);
this.appSettings.statistics.defaultTrendChartDataRangeType = value;
},
setEnableAnimate(value) {
settings.setEnableAnimate(value);
this.appSettings.animate = value;
src/stores/statistics.js
+101 -54
View File
@@ -16,6 +16,7 @@ import logger from '@/lib/logger.js';
import {
isEquals,
isNumber,
isYearMonth,
isObject
} from '@/lib/common.js';
import {
@@ -25,12 +26,15 @@ import {
export const useStatisticsStore = defineStore('statistics', {
state: () => ({
transactionStatisticsFilter: {
dateType: statisticsConstants.defaultDataRangeType,
startTime: 0,
endTime: 0,
chartDataType: statisticsConstants.defaultChartDataType,
categoricalChartType: statisticsConstants.defaultCategoricalChartType,
categoricalChartDateType: statisticsConstants.defaultCategoricalChartDataRangeType,
categoricalChartStartTime: 0,
categoricalChartEndTime: 0,
trendChartType: statisticsConstants.defaultTrendChartType,
trendChartDateType: statisticsConstants.defaultTrendChartDataRangeType,
trendChartStartYearMonth: '',
trendChartEndYearMonth: '',
filterAccountIds: {},
filterCategoryIds: {}
},
@@ -408,12 +412,15 @@ export const useStatisticsStore = defineStore('statistics', {
this.transactionStatisticsStateInvalid = invalidState;
},
resetTransactionStatistics() {
this.transactionStatisticsFilter.dateType = statisticsConstants.defaultDataRangeType;
this.transactionStatisticsFilter.startTime = 0;
this.transactionStatisticsFilter.endTime = 0;
this.transactionStatisticsFilter.chartDataType = statisticsConstants.defaultChartDataType;
this.transactionStatisticsFilter.categoricalChartType = statisticsConstants.defaultCategoricalChartType;
this.transactionStatisticsFilter.categoricalChartDateType = statisticsConstants.defaultCategoricalChartDataRangeType;
this.transactionStatisticsFilter.categoricalChartStartTime = 0;
this.transactionStatisticsFilter.categoricalChartEndTime = 0;
this.transactionStatisticsFilter.trendChartType = statisticsConstants.defaultTrendChartType;
this.transactionStatisticsFilter.trendChartDateType = statisticsConstants.defaultTrendChartDataRangeType;
this.transactionStatisticsFilter.trendChartStartYearMonth = '';
this.transactionStatisticsFilter.trendChartEndYearMonth = '';
this.transactionStatisticsFilter.filterAccountIds = {};
this.transactionStatisticsFilter.filterCategoryIds = {};
this.transactionCategoryStatisticsData = {};
@@ -430,61 +437,59 @@ export const useStatisticsStore = defineStore('statistics', {
defaultChartDataType = statisticsConstants.defaultChartDataType;
}
let defaultDateRange = settingsStore.appSettings.statistics.defaultDataRangeType;
if (defaultDateRange < datetimeConstants.allDateRanges.All.type || defaultDateRange >= datetimeConstants.allDateRanges.Custom.type) {
defaultDateRange = statisticsConstants.defaultDataRangeType;
}
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 dateRange = getDateRangeByDateType(defaultDateRange, userStore.currentUserFirstDayOfWeek);
const categoricalChartDateRange = getDateRangeByDateType(defaultCategoricalChartDateRange, userStore.currentUserFirstDayOfWeek);
const trendChartDateRange = getDateRangeByDateType(defaultTrendChartDateRange, userStore.currentUserFirstDayOfWeek);
filter = {
dateType: dateRange ? dateRange.dateType : undefined,
startTime: dateRange ? dateRange.minTime : undefined,
endTime: dateRange ? dateRange.maxTime : undefined,
categoricalChartType: defaultCategoricalChartType,
trendChartType: defaultTrendChartType,
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 ? trendChartDateRange.minTime : undefined,
trendChartEndYearMonth: trendChartDateRange ? trendChartDateRange.maxTime : undefined,
filterAccountIds: settingsStore.appSettings.statistics.defaultAccountFilter || {},
filterCategoryIds: settingsStore.appSettings.statistics.defaultTransactionCategoryFilter || {},
sortingType: defaultSortType,
};
}
if (filter && isNumber(filter.dateType)) {
this.transactionStatisticsFilter.dateType = filter.dateType;
if (filter && isNumber(filter.chartDataType)) {
this.transactionStatisticsFilter.chartDataType = filter.chartDataType;
} else {
this.transactionStatisticsFilter.dateType = statisticsConstants.defaultDataRangeType;
}
if (filter && isNumber(filter.startTime)) {
this.transactionStatisticsFilter.startTime = filter.startTime;
} else {
this.transactionStatisticsFilter.startTime = 0;
}
if (filter && isNumber(filter.endTime)) {
this.transactionStatisticsFilter.endTime = filter.endTime;
} else {
this.transactionStatisticsFilter.endTime = 0;
this.transactionStatisticsFilter.chartDataType = statisticsConstants.defaultChartDataType;
}
if (filter && isNumber(filter.categoricalChartType)) {
@@ -493,16 +498,46 @@ export const useStatisticsStore = defineStore('statistics', {
this.transactionStatisticsFilter.categoricalChartType = statisticsConstants.defaultCategoricalChartType;
}
if (filter && isNumber(filter.categoricalChartDateType)) {
this.transactionStatisticsFilter.categoricalChartDateType = filter.categoricalChartDateType;
} else {
this.transactionStatisticsFilter.categoricalChartDateType = statisticsConstants.defaultCategoricalChartDataRangeType;
}
if (filter && isNumber(filter.categoricalChartStartTime)) {
this.transactionStatisticsFilter.categoricalChartStartTime = filter.categoricalChartStartTime;
} else {
this.transactionStatisticsFilter.categoricalChartStartTime = 0;
}
if (filter && isNumber(filter.categoricalChartEndTime)) {
this.transactionStatisticsFilter.categoricalChartEndTime = filter.categoricalChartEndTime;
} else {
this.transactionStatisticsFilter.categoricalChartEndTime = 0;
}
if (filter && isNumber(filter.trendChartType)) {
this.transactionStatisticsFilter.trendChartType = filter.trendChartType;
} else {
this.transactionStatisticsFilter.trendChartType = statisticsConstants.defaultTrendChartType;
}
if (filter && isNumber(filter.chartDataType)) {
this.transactionStatisticsFilter.chartDataType = filter.chartDataType;
if (filter && isNumber(filter.trendChartDateType)) {
this.transactionStatisticsFilter.trendChartDateType = filter.trendChartDateType;
} else {
this.transactionStatisticsFilter.chartDataType = statisticsConstants.defaultChartDataType;
this.transactionStatisticsFilter.trendChartDateType = statisticsConstants.defaultTrendChartDataRangeType;
}
if (filter && isYearMonth(filter.trendChartStartYearMonth)) {
this.transactionStatisticsFilter.trendChartStartYearMonth = filter.trendChartStartYearMonth;
} else {
this.transactionStatisticsFilter.trendChartStartYearMonth = '';
}
if (filter && isYearMonth(filter.trendChartEndYearMonth)) {
this.transactionStatisticsFilter.trendChartEndYearMonth = filter.trendChartEndYearMonth;
} else {
this.transactionStatisticsFilter.trendChartEndYearMonth = '';
}
if (filter && isObject(filter.filterAccountIds)) {
@@ -524,28 +559,40 @@ export const useStatisticsStore = defineStore('statistics', {
}
},
updateTransactionStatisticsFilter(filter) {
if (filter && isNumber(filter.dateType)) {
this.transactionStatisticsFilter.dateType = filter.dateType;
}
if (filter && isNumber(filter.startTime)) {
this.transactionStatisticsFilter.startTime = filter.startTime;
}
if (filter && isNumber(filter.endTime)) {
this.transactionStatisticsFilter.endTime = filter.endTime;
if (filter && isNumber(filter.chartDataType)) {
this.transactionStatisticsFilter.chartDataType = filter.chartDataType;
}
if (filter && isNumber(filter.categoricalChartType)) {
this.transactionStatisticsFilter.categoricalChartType = filter.categoricalChartType;
}
if (filter && isNumber(filter.categoricalChartDateType)) {
this.transactionStatisticsFilter.categoricalChartDateType = filter.categoricalChartDateType;
}
if (filter && isNumber(filter.categoricalChartStartTime)) {
this.transactionStatisticsFilter.categoricalChartStartTime = filter.categoricalChartStartTime;
}
if (filter && isNumber(filter.categoricalChartEndTime)) {
this.transactionStatisticsFilter.categoricalChartEndTime = filter.categoricalChartEndTime;
}
if (filter && isNumber(filter.trendChartType)) {
this.transactionStatisticsFilter.trendChartType = filter.trendChartType;
}
if (filter && isNumber(filter.chartDataType)) {
this.transactionStatisticsFilter.chartDataType = filter.chartDataType;
if (filter && isNumber(filter.trendChartDateType)) {
this.transactionStatisticsFilter.trendChartDateType = filter.trendChartDateType;
}
if (filter && isYearMonth(filter.trendChartStartYearMonth)) {
this.transactionStatisticsFilter.trendChartStartYearMonth = filter.trendChartStartYearMonth;
}
if (filter && isYearMonth(filter.trendChartEndYearMonth)) {
this.transactionStatisticsFilter.trendChartEndYearMonth = filter.trendChartEndYearMonth;
}
if (filter && isObject(filter.filterAccountIds)) {
@@ -587,11 +634,11 @@ export const useStatisticsStore = defineStore('statistics', {
if (this.transactionStatisticsFilter.chartDataType !== statisticsConstants.allChartDataTypes.AccountTotalAssets.type
&& this.transactionStatisticsFilter.chartDataType !== statisticsConstants.allChartDataTypes.AccountTotalLiabilities.type) {
querys.push('dateType=' + this.transactionStatisticsFilter.dateType);
querys.push('dateType=' + this.transactionStatisticsFilter.categoricalChartDateType);
if (this.transactionStatisticsFilter.dateType === datetimeConstants.allDateRanges.Custom.type) {
querys.push('minTime=' + this.transactionStatisticsFilter.startTime);
querys.push('maxTime=' + this.transactionStatisticsFilter.endTime);
querys.push('minTime=' + this.transactionStatisticsFilter.categoricalChartStartTime);
querys.push('maxTime=' + this.transactionStatisticsFilter.categoricalChartEndTime);
}
}
@@ -603,8 +650,8 @@ export const useStatisticsStore = defineStore('statistics', {
return new Promise((resolve, reject) => {
services.getTransactionStatistics({
startTime: self.transactionStatisticsFilter.startTime,
endTime: self.transactionStatisticsFilter.endTime,
startTime: self.transactionStatisticsFilter.categoricalChartStartTime,
endTime: self.transactionStatisticsFilter.categoricalChartEndTime,
useTransactionTimezone: settingsStore.appSettings.statistics.defaultTimezoneType
}).then(response => {
const data = response.data;
@@ -639,7 +686,7 @@ export const useStatisticsStore = defineStore('statistics', {
});
});
},
loadTrendAnalysis({ force }) {
loadTrendAnalysis() {
return Promise.resolve(true);
},
}
src/views/desktop/app/settings/tabs/AppStatisticsSettingTab.vue
+50 -27
View File
@@ -17,18 +17,6 @@
/>
</v-col>
<v-col cols="12" md="6">
<v-select
item-title="displayName"
item-value="type"
persistent-placeholder
:label="$t('Default Date Range')"
:placeholder="$t('Default Date Range')"
:items="allDateRanges"
v-model="defaultDateRange"
/>
</v-col>
<v-col cols="12" md="6">
<v-select
item-title="displayName"
@@ -74,6 +62,18 @@
v-model="defaultCategoricalChartType"
/>
</v-col>
<v-col cols="12" md="6">
<v-select
item-title="displayName"
item-value="type"
persistent-placeholder
:label="$t('Default Date Range')"
:placeholder="$t('Default Date Range')"
:items="allCategoricalChartDateRanges"
v-model="defaultCategoricalChartDateRange"
/>
</v-col>
</v-row>
</v-card-text>
</v-form>
@@ -96,6 +96,18 @@
v-model="defaultTrendChartType"
/>
</v-col>
<v-col cols="12" md="6">
<v-select
item-title="displayName"
item-value="type"
persistent-placeholder
:label="$t('Default Date Range')"
:placeholder="$t('Default Date Range')"
:items="allTrendChartDateRanges"
v-model="defaultTrendChartDateRange"
/>
</v-col>
</v-row>
</v-card-text>
</v-form>
@@ -116,7 +128,7 @@
import { mapStores } from 'pinia';
import { useSettingsStore } from '@/stores/setting.js';
import statisticsConstants from '@/consts/statistics.js';
import datetimeConstants from '@/consts/datetime.js';
import AccountFilterSettingsCard from '@/views/desktop/statistics/settings/cards/AccountFilterSettingsCard.vue';
import CategoryFilterSettingsCard from '@/views/desktop/statistics/settings/cards/CategoryFilterSettingsCard.vue';
@@ -131,20 +143,23 @@ export default {
allChartDataTypes() {
return this.$locale.getAllStatisticsChartDataTypes();
},
allTimezoneTypesUsedForStatistics() {
return this.$locale.getAllTimezoneTypesUsedForStatistics();
},
allSortingTypes() {
return this.$locale.getAllStatisticsSortingTypes();
},
allCategoricalChartTypes() {
return this.$locale.getAllCategoricalChartTypes();
},
allCategoricalChartDateRanges() {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.Normal, false);
},
allTrendChartTypes() {
return this.$locale.getAllTrendChartTypes();
},
allDateRanges() {
return this.$locale.getAllDateRanges(false);
},
allTimezoneTypesUsedForStatistics() {
return this.$locale.getAllTimezoneTypesUsedForStatistics();
allTrendChartDateRanges() {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.TrendAnalysis, false);
},
defaultChartDataType: {
get: function () {
@@ -154,14 +169,6 @@ export default {
this.settingsStore.setStatisticsDefaultChartDataType(value);
}
},
defaultDateRange: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultDataRangeType;
},
set: function (value) {
this.settingsStore.setStatisticsDefaultDateRange(value);
}
},
defaultTimezoneType: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultTimezoneType;
@@ -186,6 +193,14 @@ export default {
this.settingsStore.setStatisticsDefaultCategoricalChartType(value);
}
},
defaultCategoricalChartDateRange: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultCategoricalChartDataRangeType;
},
set: function (value) {
this.settingsStore.setStatisticsDefaultCategoricalChartDateRange(value);
}
},
defaultTrendChartType: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultTrendChartType;
@@ -193,7 +208,15 @@ export default {
set: function (value) {
this.settingsStore.setStatisticsDefaultTrendChartType(value);
}
}
},
defaultTrendChartDateRange: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultTrendChartDataRangeType;
},
set: function (value) {
this.settingsStore.setStatisticsDefaultTrendChartDateRange(value);
}
},
}
};
</script>
src/views/desktop/statistics/TransactionPage.vue
+29 -26
View File
@@ -58,8 +58,8 @@
<v-btn-group class="ml-4" color="default" density="comfortable" variant="outlined" divided
v-if="analysisType === allAnalysisTypes.CategoricalAnalysis">
<v-btn :icon="icons.left"
:disabled="loading || query.dateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type"
@click="shiftDateRange(query.startTime, query.endTime, -1)"/>
:disabled="loading || query.categoricalChartDateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type"
@click="shiftDateRange(query.categoricalChartStartTime, query.categoricalChartEndTime, -1)"/>
<v-menu location="bottom">
<template #activator="{ props }">
<v-btn :disabled="loading || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type"
@@ -67,13 +67,13 @@
</template>
<v-list>
<v-list-item :key="dateRange.type" :value="dateRange.type"
:append-icon="(query.dateType === dateRange.type ? icons.check : null)"
v-for="dateRange in allDateRanges">
:append-icon="(query.categoricalChartDateType === dateRange.type ? icons.check : null)"
v-for="dateRange in allDateRangesArray">
<v-list-item-title
class="cursor-pointer"
@click="setDateFilter(dateRange.type)">
{{ $t(dateRange.name) }}
<div class="statistics-custom-datetime-range" v-if="dateRange.type === allDateRanges.Custom.type && query.dateType === allDateRanges.Custom.type && query.startTime && query.endTime">
{{ dateRange.displayName }}
<div class="statistics-custom-datetime-range" v-if="dateRange.type === allDateRanges.Custom.type && query.categoricalChartDateType === allDateRanges.Custom.type && query.categoricalChartStartTime && query.categoricalChartEndTime">
<span>{{ queryStartTime }}</span>
<span>&nbsp;-&nbsp;</span>
<br/>
@@ -84,8 +84,8 @@
</v-list>
</v-menu>
<v-btn :icon="icons.right"
:disabled="loading || query.dateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type"
@click="shiftDateRange(query.startTime, query.endTime, 1)"/>
:disabled="loading || query.categoricalChartDateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type"
@click="shiftDateRange(query.categoricalChartStartTime, query.categoricalChartEndTime, 1)"/>
</v-btn-group>
<v-btn density="compact" color="default" variant="text" size="24"
@@ -231,8 +231,8 @@
</v-row>
<date-range-selection-dialog :title="$t('Custom Date Range')"
:min-time="query.startTime"
:max-time="query.endTime"
:min-time="query.categoricalChartStartTime"
:max-time="query.categoricalChartEndTime"
v-model:show="showCustomDateRangeDialog"
@dateRange:change="setCustomDateFilter" />
@@ -263,7 +263,7 @@ import { useStatisticsStore } from '@/stores/statistics.js';
import datetimeConstants from '@/consts/datetime.js';
import statisticsConstants from '@/consts/statistics.js';
import { isArray, limitText, formatPercent } from '@/lib/common.js'
import { limitText, formatPercent } from '@/lib/common.js'
import {
getShiftedDateRangeAndDateType,
getDateRangeByDateType
@@ -360,10 +360,10 @@ export default {
}
},
queryStartTime() {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.startTime);
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartStartTime);
},
queryEndTime() {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.endTime);
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartEndTime);
},
allAnalysisTypes() {
return statisticsConstants.allAnalysisTypes;
@@ -392,6 +392,9 @@ export default {
allDateRanges() {
return datetimeConstants.allDateRanges;
},
allDateRangesArray() {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.Normal, true);
},
showAccountBalance() {
return this.settingsStore.appSettings.showAccountBalance;
},
@@ -566,7 +569,7 @@ export default {
if (dateType === this.allDateRanges.Custom.type) { // Custom
this.showCustomDateRangeDialog = true;
return;
} else if (this.query.dateType === dateType) {
} else if (this.query.categoricalChartDateType === dateType) {
return;
}
@@ -577,9 +580,9 @@ export default {
}
this.statisticsStore.updateTransactionStatisticsFilter({
dateType: dateRange.dateType,
startTime: dateRange.minTime,
endTime: dateRange.maxTime
categoricalChartDateType: dateRange.dateType,
categoricalChartStartTime: dateRange.minTime,
categoricalChartEndTime: dateRange.maxTime
});
this.reload(null);
@@ -590,9 +593,9 @@ export default {
}
this.statisticsStore.updateTransactionStatisticsFilter({
dateType: this.allDateRanges.Custom.type,
startTime: startTime,
endTime: endTime
categoricalChartDateType: this.allDateRanges.Custom.type,
categoricalChartStartTime: startTime,
categoricalChartEndTime: endTime
});
this.showCustomDateRangeDialog = false;
@@ -600,16 +603,16 @@ export default {
this.reload(null);
},
shiftDateRange(startTime, endTime, scale) {
if (this.query.dateType === this.allDateRanges.All.type) {
if (this.query.categoricalChartDateType === this.allDateRanges.All.type) {
return;
}
const newDateRange = getShiftedDateRangeAndDateType(startTime, endTime, scale, this.firstDayOfWeek);
const newDateRange = getShiftedDateRangeAndDateType(startTime, endTime, scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
this.statisticsStore.updateTransactionStatisticsFilter({
dateType: newDateRange.dateType,
startTime: newDateRange.minTime,
endTime: newDateRange.maxTime
categoricalChartDateType: newDateRange.dateType,
categoricalChartStartTime: newDateRange.minTime,
categoricalChartEndTime: newDateRange.maxTime
});
this.reload(null);
@@ -620,7 +623,7 @@ export default {
return this.$t(this.allDateRanges.All.name);
}
return this.$locale.getDateRangeDisplayName(this.userStore, query.dateType, query.startTime, query.endTime);
return this.$locale.getDateRangeDisplayName(this.userStore, query.categoricalChartDateType, query.categoricalChartStartTime, query.categoricalChartEndTime);
},
clickPieChartItem(item) {
this.$router.push(this.getItemLinkUrl(item));
src/views/desktop/transactions/ListPage.vue
+1 -1
View File
@@ -753,7 +753,7 @@ export default {
return;
}
const newDateRange = getShiftedDateRangeAndDateType(startTime, endTime, scale, this.firstDayOfWeek);
const newDateRange = getShiftedDateRangeAndDateType(startTime, endTime, scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
this.transactionsStore.updateTransactionListFilter({
dateType: newDateRange.dateType,
src/views/mobile/statistics/SettingsPage.vue
+47 -24
View File
@@ -14,16 +14,6 @@
</select>
</f7-list-item>
<f7-list-item
:title="$t('Default Date Range')"
smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Date Range'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
<select v-model="defaultDateRange">
<option :value="dateRange.type"
:key="dateRange.type"
v-for="dateRange in allDateRanges">{{ dateRange.displayName }}</option>
</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') }">
@@ -60,6 +50,16 @@
v-for="chartType in allCategoricalChartTypes">{{ chartType.displayName }}</option>
</select>
</f7-list-item>
<f7-list-item
:title="$t('Default Date Range')"
smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Date Range'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
<select v-model="defaultCategoricalChartDateRange">
<option :value="dateRange.type"
:key="dateRange.type"
v-for="dateRange in allCategoricalChartDateRanges">{{ dateRange.displayName }}</option>
</select>
</f7-list-item>
</f7-list>
<f7-block-title>{{ $t('Trend Analysis Settings') }}</f7-block-title>
@@ -73,6 +73,16 @@
v-for="chartType in allTrendChartTypes">{{ chartType.displayName }}</option>
</select>
</f7-list-item>
<f7-list-item
:title="$t('Default Date Range')"
smart-select :smart-select-params="{ openIn: 'popup', popupPush: true, closeOnSelect: true, scrollToSelectedItem: true, searchbar: true, searchbarPlaceholder: $t('Date Range'), searchbarDisableText: $t('Cancel'), appendSearchbarNotFound: $t('No results'), popupCloseLinkText: $t('Done') }">
<select v-model="defaultTrendChartDateRange">
<option :value="dateRange.type"
:key="dateRange.type"
v-for="dateRange in allTrendChartDateRanges">{{ dateRange.displayName }}</option>
</select>
</f7-list-item>
</f7-list>
</f7-page>
</template>
@@ -81,26 +91,31 @@
import { mapStores } from 'pinia';
import { useSettingsStore } from '@/stores/setting.js';
import datetimeConstants from '@/consts/datetime.js';
export default {
computed: {
...mapStores(useSettingsStore),
allChartDataTypes() {
return this.$locale.getAllStatisticsChartDataTypes();
},
allTimezoneTypesUsedForStatistics() {
return this.$locale.getAllTimezoneTypesUsedForStatistics();
},
allSortingTypes() {
return this.$locale.getAllStatisticsSortingTypes();
},
allCategoricalChartTypes() {
return this.$locale.getAllCategoricalChartTypes();
},
allCategoricalChartDateRanges() {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.Normal, false);
},
allTrendChartTypes() {
return this.$locale.getAllTrendChartTypes();
},
allDateRanges() {
return this.$locale.getAllDateRanges(false);
},
allTimezoneTypesUsedForStatistics() {
return this.$locale.getAllTimezoneTypesUsedForStatistics();
allTrendChartDateRanges() {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.TrendAnalysis, false);
},
defaultChartDataType: {
get: function () {
@@ -110,14 +125,6 @@ export default {
this.settingsStore.setStatisticsDefaultChartDataType(value);
}
},
defaultDateRange: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultDataRangeType;
},
set: function (value) {
this.settingsStore.setStatisticsDefaultDateRange(value);
}
},
defaultTimezoneType: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultTimezoneType;
@@ -142,6 +149,14 @@ export default {
this.settingsStore.setStatisticsDefaultCategoricalChartType(value);
}
},
defaultCategoricalChartDateRange: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultCategoricalChartDataRangeType;
},
set: function (value) {
this.settingsStore.setStatisticsDefaultCategoricalChartDateRange(value);
}
},
defaultTrendChartType: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultTrendChartType;
@@ -149,7 +164,15 @@ export default {
set: function (value) {
this.settingsStore.setStatisticsDefaultTrendChartType(value);
}
}
},
defaultTrendChartDateRange: {
get: function () {
return this.settingsStore.appSettings.statistics.defaultTrendChartDataRangeType;
},
set: function (value) {
this.settingsStore.setStatisticsDefaultTrendChartDateRange(value);
}
},
}
};
</script>
src/views/mobile/statistics/TransactionPage.vue
+27 -24
View File
@@ -187,13 +187,13 @@
</f7-popover>
<f7-toolbar tabbar bottom class="toolbar-item-auto-size">
<f7-link :class="{ 'disabled': reloading || query.dateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type }" @click="shiftDateRange(query.startTime, query.endTime, -1)">
<f7-link :class="{ 'disabled': reloading || query.categoricalChartDateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type }" @click="shiftDateRange(query.categoricalChartStartTime, query.categoricalChartEndTime, -1)">
<f7-icon f7="arrow_left_square"></f7-icon>
</f7-link>
<f7-link :class="{ 'tabbar-text-with-ellipsis': true, 'disabled': reloading || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type }" popover-open=".date-popover-menu">
<span :class="{ 'tabbar-item-changed': query.maxTime > 0 || query.minTime > 0 }">{{ dateRangeName(query) }}</span>
</f7-link>
<f7-link :class="{ 'disabled': reloading || query.dateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type }" @click="shiftDateRange(query.startTime, query.endTime, 1)">
<f7-link :class="{ 'disabled': reloading || query.categoricalChartDateType === allDateRanges.All.type || query.chartDataType === allChartDataTypes.AccountTotalAssets.type || query.chartDataType === allChartDataTypes.AccountTotalLiabilities.type }" @click="shiftDateRange(query.categoricalChartStartTime, query.categoricalChartEndTime, 1)">
<f7-icon f7="arrow_right_square"></f7-icon>
</f7-link>
<f7-link class="tabbar-text-with-ellipsis" :key="chartType.type"
@@ -206,16 +206,16 @@
v-model:opened="showDatePopover"
@popover:open="scrollPopoverToSelectedItem">
<f7-list dividers>
<f7-list-item :title="$t(dateRange.name)"
:class="{ 'list-item-selected': query.dateType === dateRange.type }"
<f7-list-item :title="dateRange.displayName"
:class="{ 'list-item-selected': query.categoricalChartDateType === dateRange.type }"
:key="dateRange.type"
v-for="dateRange in allDateRanges"
v-for="dateRange in allDateRangesArray"
@click="setDateFilter(dateRange.type)">
<template #after>
<f7-icon class="list-item-checked-icon" f7="checkmark_alt" v-if="query.dateType === dateRange.type"></f7-icon>
<f7-icon class="list-item-checked-icon" f7="checkmark_alt" v-if="query.categoricalChartDateType === dateRange.type"></f7-icon>
</template>
<template #footer>
<div v-if="dateRange.type === allDateRanges.Custom.type && query.dateType === allDateRanges.Custom.type && query.startTime && query.endTime">
<div v-if="dateRange.type === allDateRanges.Custom.type && query.categoricalChartDateType === allDateRanges.Custom.type && query.categoricalChartStartTime && query.categoricalChartEndTime">
<span>{{ queryStartTime }}</span>
<span>&nbsp;-&nbsp;</span>
<br/>
@@ -227,8 +227,8 @@
</f7-popover>
<date-range-selection-sheet :title="$t('Custom Date Range')"
:min-time="query.startTime"
:max-time="query.endTime"
:min-time="query.categoricalChartStartTime"
:max-time="query.categoricalChartEndTime"
v-model:show="showCustomDateRangeSheet"
@dateRange:change="setCustomDateFilter">
</date-range-selection-sheet>
@@ -304,10 +304,10 @@ export default {
return this.$t(querySortingTypeName);
},
queryStartTime() {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.startTime);
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartStartTime);
},
queryEndTime() {
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.endTime);
return this.$locale.formatUnixTimeToLongDateTime(this.userStore, this.query.categoricalChartEndTime);
},
allChartTypes() {
return this.$locale.getAllCategoricalChartTypes();
@@ -324,6 +324,9 @@ export default {
allDateRanges() {
return datetimeConstants.allDateRanges;
},
allDateRangesArray() {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.Normal, true);
},
showAccountBalance() {
return this.settingsStore.appSettings.showAccountBalance;
},
@@ -465,7 +468,7 @@ export default {
this.showCustomDateRangeSheet = true;
this.showDatePopover = false;
return;
} else if (this.query.dateType === dateType) {
} else if (this.query.categoricalChartDateType === dateType) {
return;
}
@@ -476,9 +479,9 @@ export default {
}
this.statisticsStore.updateTransactionStatisticsFilter({
dateType: dateRange.dateType,
startTime: dateRange.minTime,
endTime: dateRange.maxTime
categoricalChartDateType: dateRange.dateType,
categoricalChartStartTime: dateRange.minTime,
categoricalChartEndTime: dateRange.maxTime
});
this.showDatePopover = false;
@@ -490,9 +493,9 @@ export default {
}
this.statisticsStore.updateTransactionStatisticsFilter({
dateType: this.allDateRanges.Custom.type,
startTime: startTime,
endTime: endTime
categoricalChartDateType: this.allDateRanges.Custom.type,
categoricalChartStartTime: startTime,
categoricalChartEndTime: endTime
});
this.showCustomDateRangeSheet = false;
@@ -500,16 +503,16 @@ export default {
this.reload(null);
},
shiftDateRange(startTime, endTime, scale) {
if (this.query.dateType === this.allDateRanges.All.type) {
if (this.query.categoricalChartDateType === this.allDateRanges.All.type) {
return;
}
const newDateRange = getShiftedDateRangeAndDateType(startTime, endTime, scale, this.firstDayOfWeek);
const newDateRange = getShiftedDateRangeAndDateType(startTime, endTime, scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
this.statisticsStore.updateTransactionStatisticsFilter({
dateType: newDateRange.dateType,
startTime: newDateRange.minTime,
endTime: newDateRange.maxTime
categoricalChartDateType: newDateRange.dateType,
categoricalChartStartTime: newDateRange.minTime,
categoricalChartEndTime: newDateRange.maxTime
});
this.reload(null);
@@ -520,7 +523,7 @@ export default {
return this.$t(this.allDateRanges.All.name);
}
return this.$locale.getDateRangeDisplayName(this.userStore, query.dateType, query.startTime, query.endTime);
return this.$locale.getDateRangeDisplayName(this.userStore, query.categoricalChartDateType, query.categoricalChartStartTime, query.categoricalChartEndTime);
},
clickPieChartItem(item) {
this.f7router.navigate(this.getItemLinkUrl(item));
src/views/mobile/transactions/ListPage.vue
+6 -3
View File
@@ -253,10 +253,10 @@
v-model:opened="showDatePopover"
@popover:open="scrollPopoverToSelectedItem">
<f7-list dividers>
<f7-list-item :title="$t(dateRange.name)"
<f7-list-item :title="dateRange.displayName"
:class="{ 'list-item-selected': query.dateType === dateRange.type }"
:key="dateRange.type"
v-for="dateRange in allDateRanges"
v-for="dateRange in allDateRangesArray"
@click="changeDateFilter(dateRange.type)">
<template #after>
<f7-icon class="list-item-checked-icon" f7="checkmark_alt" v-if="query.dateType === dateRange.type"></f7-icon>
@@ -562,6 +562,9 @@ export default {
allDateRanges() {
return datetimeConstants.allDateRanges;
},
allDateRangesArray() {
return this.$locale.getAllDateRanges(datetimeConstants.allDateRangeScenes.Normal, true);
},
showTotalAmountInTransactionListPage() {
return this.settingsStore.appSettings.showTotalAmountInTransactionListPage;
}
@@ -830,7 +833,7 @@ export default {
return;
}
const newDateRange = getShiftedDateRangeAndDateType(minTime, maxTime, scale, this.firstDayOfWeek);
const newDateRange = getShiftedDateRangeAndDateType(minTime, maxTime, scale, this.firstDayOfWeek, datetimeConstants.allDateRangeScenes.Normal);
this.transactionsStore.updateTransactionListFilter({
dateType: newDateRange.dateType,