From 4179cc00e2e77832db9a04d52f31f477b816fb46 Mon Sep 17 00:00:00 2001 From: MaysWind Date: Wed, 20 Jan 2021 23:01:40 +0800 Subject: [PATCH] code refactor --- src/consts/datetime.js | 54 +++++++++ src/lib/utils.js | 50 +++++++++ src/mobile-main.js | 2 + src/store/index.js | 7 +- src/views/mobile/Home.vue | 8 +- src/views/mobile/transactions/List.vue | 146 ++++++------------------- 6 files changed, 146 insertions(+), 121 deletions(-) create mode 100644 src/consts/datetime.js diff --git a/src/consts/datetime.js b/src/consts/datetime.js new file mode 100644 index 00000000..2710d600 --- /dev/null +++ b/src/consts/datetime.js @@ -0,0 +1,54 @@ +const allDateRanges = { + All: { + type: 0, + name: 'All' + }, + Today: { + type: 1, + name: 'Today' + }, + Yesterday: { + type: 2, + name: 'Yesterday' + }, + LastSevenDays: { + type: 3, + name: 'Recent 7 days' + }, + LastThirtyDays: { + type: 4, + name: 'Recent 30 days' + }, + ThisWeek: { + type: 5, + name: 'This week' + }, + LastWeek: { + type: 6, + name: 'Last week' + }, + ThisMonth: { + type: 7, + name: 'This month' + }, + LastMonth: { + type: 8, + name: 'Last month' + }, + ThisYear: { + type: 9, + name: 'This year' + }, + LastYear: { + type: 10, + name: 'Last year' + }, + Custom: { + type: 11, + name: 'Custom Date' + } +}; + +export default { + allDateRanges: allDateRanges, +}; diff --git a/src/lib/utils.js b/src/lib/utils.js index 86762659..a3549e9a 100644 --- a/src/lib/utils.js +++ b/src/lib/utils.js @@ -2,6 +2,7 @@ import CryptoJS from "crypto-js"; import moment from 'moment'; import uaParser from 'ua-parser-js'; +import dateTimeConstants from '../consts/datetime.js'; import accountConstants from '../consts/account.js'; import settings from "./settings.js"; @@ -124,6 +125,54 @@ function getThisYearLastUnixTime() { return moment.unix(getThisYearFirstUnixTime()).add(1, 'years').subtract(1, 'seconds').unix(); } +function getDateRangeByDateType(dateType) { + let maxTime = 0; + let minTime = 0; + + if (dateType === dateTimeConstants.allDateRanges.All.type) { // All + maxTime = 0; + minTime = 0; + } else if (dateType === dateTimeConstants.allDateRanges.Today.type) { // Today + maxTime = getTodayLastUnixTime(); + minTime = getTodayFirstUnixTime(); + } else if (dateType === dateTimeConstants.allDateRanges.Yesterday.type) { // Yesterday + maxTime = getUnixTimeBeforeUnixTime(getTodayLastUnixTime(), 1, 'days'); + minTime = getUnixTimeBeforeUnixTime(getTodayFirstUnixTime(), 1, 'days'); + } else if (dateType === dateTimeConstants.allDateRanges.LastSevenDays.type) { // Last 7 days + maxTime = getUnixTime(new Date()); + minTime = getUnixTimeBeforeUnixTime(maxTime, 7, 'days'); + } else if (dateType === dateTimeConstants.allDateRanges.LastThirtyDays.type) { // Last 30 days + maxTime = getUnixTime(new Date()); + minTime = getUnixTimeBeforeUnixTime(maxTime, 30, 'days'); + } else if (dateType === dateTimeConstants.allDateRanges.ThisWeek.type) { // This week + maxTime = getThisWeekLastUnixTime(); + minTime = getThisWeekFirstUnixTime(); + } else if (dateType === dateTimeConstants.allDateRanges.LastWeek.type) { // Last week + maxTime = getUnixTimeBeforeUnixTime(getThisWeekLastUnixTime(), 7, 'days'); + minTime = getUnixTimeBeforeUnixTime(getThisWeekFirstUnixTime(), 7, 'days'); + } else if (dateType === dateTimeConstants.allDateRanges.ThisMonth.type) { // This month + maxTime = getThisMonthLastUnixTime(); + minTime = getThisMonthFirstUnixTime(); + } else if (dateType === dateTimeConstants.allDateRanges.LastMonth.type) { // Last month + maxTime = getUnixTimeBeforeUnixTime(getThisMonthLastUnixTime(), 1, 'months'); + minTime = getUnixTimeBeforeUnixTime(getThisMonthFirstUnixTime(), 1, 'months'); + } else if (dateType === dateTimeConstants.allDateRanges.ThisYear.type) { // This year + maxTime = getThisYearLastUnixTime(); + minTime = getThisYearFirstUnixTime(); + } else if (dateType === dateTimeConstants.allDateRanges.LastYear.type) { // Last year + maxTime = getUnixTimeBeforeUnixTime(getThisYearLastUnixTime(), 1, 'years'); + minTime = getUnixTimeBeforeUnixTime(getThisYearFirstUnixTime(), 1, 'years'); + } else { + return null; + } + + return { + dateType: dateType, + maxTime: maxTime, + minTime: minTime + }; +} + function copyObjectTo(fromObject, toObject) { if (!isObject(fromObject)) { return toObject; @@ -460,6 +509,7 @@ export default { getThisMonthLastUnixTime, getThisYearFirstUnixTime, getThisYearLastUnixTime, + getDateRangeByDateType, copyObjectTo, copyArrayTo, appendThousandsSeparator, diff --git a/src/mobile-main.js b/src/mobile-main.js index b3b46ef5..6c8b4f80 100644 --- a/src/mobile-main.js +++ b/src/mobile-main.js @@ -17,6 +17,7 @@ import 'line-awesome/dist/line-awesome/css/line-awesome.css'; import { getAllLanguages, getLanguage, getDefaultLanguage, getI18nOptions, getLocalizedError, getLocalizedErrorParameters } from './lib/i18n.js'; import api from './consts/api.js'; +import datetime from './consts/datetime.js'; import currency from './consts/currency.js'; import colors from './consts/color.js'; import icons from './consts/icon.js'; @@ -84,6 +85,7 @@ Vue.prototype.$buildTime = version.getBuildTime(); Vue.prototype.$licenses = licenses.getLicenses(); Vue.prototype.$constants = { api: api, + datetime: datetime, currency: currency, colors: colors, icons: icons, diff --git a/src/store/index.js b/src/store/index.js index 4264cb12..83646005 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,3 +1,4 @@ +import datetimeConstants from "../consts/datetime.js"; import userState from "../lib/userstate.js"; import utils from "../lib/utils.js"; @@ -145,7 +146,7 @@ const stores = { allCategorizedAccounts: {}, accountListStateInvalid: true, transactionsFilter: { - dateType: 0, + dateType: datetimeConstants.allDateRanges.All.type, maxTime: 0, minTime: 0, type: 0, @@ -193,7 +194,7 @@ const stores = { state.allCategorizedAccounts = {}; state.accountListStateInvalid = true; - state.transactionsFilter.dateType = 0; + state.transactionsFilter.dateType = datetimeConstants.allDateRanges.All.type; state.transactionsFilter.maxTime = 0; state.transactionsFilter.minTime = 0; state.transactionsFilter.type = 0; @@ -436,7 +437,7 @@ const stores = { if (filter && utils.isNumber(filter.dateType)) { state.transactionsFilter.dateType = filter.dateType; } else { - state.transactionsFilter.dateType = 0; + state.transactionsFilter.dateType = datetimeConstants.allDateRanges.All.type; } if (filter && utils.isNumber(filter.maxTime)) { diff --git a/src/views/mobile/Home.vue b/src/views/mobile/Home.vue index 21a292da..5217f08e 100644 --- a/src/views/mobile/Home.vue +++ b/src/views/mobile/Home.vue @@ -38,7 +38,7 @@ - +
@@ -62,7 +62,7 @@ - +
@@ -89,7 +89,7 @@ - +
@@ -116,7 +116,7 @@ - +
diff --git a/src/views/mobile/transactions/List.vue b/src/views/mobile/transactions/List.vue index c0d0829d..cbd2ba98 100644 --- a/src/views/mobile/transactions/List.vue +++ b/src/views/mobile/transactions/List.vue @@ -26,7 +26,7 @@ - {{ query.dateType | dateName('Date') | t }} + {{ query.dateType | dateRangeName(allDateRanges, 'Date') | t }} {{ query.type | typeName('Type') | t }} @@ -231,42 +231,13 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+ + +
{{ query.minTime | moment($t('format.datetime.long-without-second')) }}  - 
@@ -416,13 +387,16 @@ export default { }, allCategories() { return this.$store.state.allTransactionCategoriesMap; + }, + allDateRanges() { + return this.$constants.datetime.allDateRanges; } }, created() { const self = this; const query = self.$f7route.query; - const dateParam = self.getDateParamByDateType(query.dateType ? parseInt(query.dateType) : undefined); + const dateParam = self.$utilities.getDateRangeByDateType(query.dateType ? parseInt(query.dateType) : undefined); this.$store.dispatch('initTransactionListFilter', { dateType: dateParam ? dateParam.dateType : undefined, @@ -514,7 +488,7 @@ export default { }); }, changeDateFilter(dateType) { - if (dateType === 11) { // Custom + if (dateType === this.$constants.datetime.allDateRanges.Custom.type) { // Custom this.showCustomDateRangeSheet = true; this.showDatePopover = false; return; @@ -522,7 +496,7 @@ export default { return; } - const dateParam = this.getDateParamByDateType(dateType); + const dateParam = this.$utilities.getDateRangeByDateType(dateType); if (!dateParam) { return; @@ -543,7 +517,7 @@ export default { } this.$store.dispatch('updateTransactionListFilter', { - dateType: 11, + dateType: this.$constants.datetime.allDateRanges.Custom.type, maxTime: maxTime, minTime: minTime }); @@ -653,53 +627,6 @@ export default { self.$toast(error.message || error); } }); - }, - getDateParamByDateType(dateType) { - let maxTime = 0; - let minTime = 0; - - if (dateType === 0) { // All - maxTime = 0; - minTime = 0; - } else if (dateType === 1) { // Today - maxTime = this.$utilities.getTodayLastUnixTime(); - minTime = this.$utilities.getTodayFirstUnixTime(); - } else if (dateType === 2) { // Yesterday - maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getTodayLastUnixTime(), 1, 'days'); - minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getTodayFirstUnixTime(), 1, 'days'); - } else if (dateType === 3) { // Last 7 days - maxTime = this.$utilities.getUnixTime(new Date()); - minTime = this.$utilities.getUnixTimeBeforeUnixTime(maxTime, 7, 'days'); - } else if (dateType === 4) { // Last 30 days - maxTime = this.$utilities.getUnixTime(new Date()); - minTime = this.$utilities.getUnixTimeBeforeUnixTime(maxTime, 30, 'days'); - } else if (dateType === 5) { // This week - maxTime = this.$utilities.getThisWeekLastUnixTime(); - minTime = this.$utilities.getThisWeekFirstUnixTime(); - } else if (dateType === 6) { // Last week - maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisWeekLastUnixTime(), 7, 'days'); - minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisWeekFirstUnixTime(), 7, 'days'); - } else if (dateType === 7) { // This month - maxTime = this.$utilities.getThisMonthLastUnixTime(); - minTime = this.$utilities.getThisMonthFirstUnixTime(); - } else if (dateType === 8) { // Last month - maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisMonthLastUnixTime(), 1, 'months'); - minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisMonthFirstUnixTime(), 1, 'months'); - } else if (dateType === 9) { // This year - maxTime = this.$utilities.getThisYearLastUnixTime(); - minTime = this.$utilities.getThisYearFirstUnixTime(); - } else if (dateType === 10) { // Last year - maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisYearLastUnixTime(), 1, 'years'); - minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisYearFirstUnixTime(), 1, 'years'); - } else { - return null; - } - - return { - dateType: dateType, - maxTime: maxTime, - minTime: minTime - } } }, filters: { @@ -726,33 +653,24 @@ export default { color: 'transparent' } }, - dateName(dateType, defaultName) { - switch (dateType){ - case 1: - return 'Today'; - case 2: - return 'Yesterday'; - case 3: - return 'Recent 7 days'; - case 4: - return 'Recent 30 days'; - case 5: - return 'This week'; - case 6: - return 'Last week'; - case 7: - return 'This month'; - case 8: - return 'Last month'; - case 9: - return 'This year'; - case 10: - return 'Last year'; - case 11: - return 'Custom Date'; - default: - return defaultName; + dateRangeName(dateRangeType, allDateRanges, defaultName) { + if (dateRangeType === allDateRanges.All.type) { + return defaultName; } + + for (let dateRangeField in allDateRanges) { + if (!Object.prototype.hasOwnProperty.call(allDateRanges, dateRangeField)) { + continue; + } + + const dateRange = allDateRanges[dateRangeField]; + + if (dateRange && dateRange.type === dateRangeType && dateRange.name) { + return dateRange.name; + } + } + + return defaultName; }, typeName(type, defaultName) { switch (type){