@@ -198,11 +223,133 @@
{{ $t('Load More') }}
-
-
- {{ $t('Cancel') }}
-
-
+
+
+
+
+
+
+
+
+
+
@@ -222,9 +369,13 @@ export default {
return {
transactions: [],
query: {
+ dateType: 0,
+ maxTime: 0,
+ minTime: 0,
type: 0,
- categoryId: 0,
- accountId: 0
+ categoryId: '0',
+ accountId: '0',
+ keyword: ''
},
allAccounts: {},
allCategories: {},
@@ -233,7 +384,11 @@ export default {
loading: true,
loadingMore: false,
transactionToDelete: null,
- showMoreActionSheet: false,
+ showDatePopover: false,
+ showTypePopover: false,
+ showCategoryPopover: false,
+ showAccountPopover: false,
+ showCustomDateRangeSheet: false,
showDeleteActionSheet: false
};
},
@@ -282,7 +437,11 @@ export default {
self.loading = true;
}
- self.maxTime = 0;
+ if (self.query.maxTime > 0) {
+ self.maxTime = self.query.maxTime * 1000 + 999;
+ } else {
+ self.maxTime = 0;
+ }
const promises = [
self.$services.getAllAccounts({ visibleOnly: false }),
@@ -290,9 +449,11 @@ export default {
self.$services.getAllTransactionTags(),
self.$services.getTransactions({
maxTime: self.maxTime,
+ minTime: self.query.minTime * 1000,
type: self.query.type,
categoryId: self.query.categoryId,
- accountId: self.query.accountId
+ accountId: self.query.accountId,
+ keyword: self.query.keyword
})
];
@@ -406,7 +567,7 @@ export default {
return;
}
- if (self.loadingMore) {
+ if (self.loadingMore || self.loading) {
return;
}
@@ -414,9 +575,11 @@ export default {
self.$services.getTransactions({
maxTime: self.maxTime,
+ minTime: self.query.minTime * 1000,
type: self.query.type,
categoryId: self.query.categoryId,
- accountId: self.query.accountId
+ accountId: self.query.accountId,
+ keyword: self.query.keyword
}).then(response => {
self.loadingMore = false;
@@ -440,6 +603,123 @@ export default {
}
});
},
+ changeDateFilter(dateType) {
+ if (dateType === 11) { // Custom
+ this.showCustomDateRangeSheet = true;
+ this.showDatePopover = false;
+ return;
+ } else if (this.query.dateType === dateType) {
+ return;
+ }
+
+ if (dateType === 0) { // All
+ this.query.maxTime = 0;
+ this.query.minTime = 0;
+ } else if (dateType === 1) { // Today
+ this.query.maxTime = this.$utilities.getTodayLastUnixTime();
+ this.query.minTime = this.$utilities.getTodayFirstUnixTime();
+ } else if (dateType === 2) { // Yesterday
+ this.query.maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getTodayLastUnixTime(), 1, 'days');
+ this.query.minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getTodayFirstUnixTime(), 1, 'days');
+ } else if (dateType === 3) { // Last 7 days
+ this.query.maxTime = this.$utilities.getUnixTime(new Date());
+ this.query.minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.query.maxTime, 7, 'days');
+ } else if (dateType === 4) { // Last 30 days
+ this.query.maxTime = this.$utilities.getUnixTime(new Date());
+ this.query.minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.query.maxTime, 30, 'days');
+ } else if (dateType === 5) { // This week
+ this.query.maxTime = this.$utilities.getThisWeekLastUnixTime();
+ this.query.minTime = this.$utilities.getThisWeekFirstUnixTime();
+ } else if (dateType === 6) { // Last week
+ this.query.maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisWeekLastUnixTime(), 7, 'days');
+ this.query.minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisWeekFirstUnixTime(), 7, 'days');
+ } else if (dateType === 7) { // This month
+ this.query.maxTime = this.$utilities.getThisMonthLastUnixTime();
+ this.query.minTime = this.$utilities.getThisMonthFirstUnixTime();
+ } else if (dateType === 8) { // Last month
+ this.query.maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisMonthLastUnixTime(), 1, 'months');
+ this.query.minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisMonthFirstUnixTime(), 1, 'months');
+ } else if (dateType === 9) { // This year
+ this.query.maxTime = this.$utilities.getThisYearLastUnixTime();
+ this.query.minTime = this.$utilities.getThisYearFirstUnixTime();
+ } else if (dateType === 10) { // Last year
+ this.query.maxTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisYearLastUnixTime(), 1, 'years');
+ this.query.minTime = this.$utilities.getUnixTimeBeforeUnixTime(this.$utilities.getThisYearFirstUnixTime(), 1, 'years');
+ } else {
+ return;
+ }
+
+ this.transactions = [];
+ this.query.dateType = dateType;
+
+ this.showDatePopover = false;
+ this.reload(null);
+ },
+ changeCustomDateFilter(minTime, maxTime) {
+ if (!minTime || !maxTime) {
+ return;
+ }
+
+ this.query.maxTime = maxTime;
+ this.query.minTime = minTime;
+
+ console.log(this.$utilities.formatUnixTime(this.query.maxTime, 'YYYY-MM-DD HH:mm:ss'));
+ console.log(this.$utilities.formatUnixTime(this.query.minTime, 'YYYY-MM-DD HH:mm:ss'));
+
+ this.transactions = [];
+ this.query.dateType = 11;
+
+ this.showCustomDateRangeSheet = false;
+
+ this.reload(null);
+ },
+ changeTypeFilter(type) {
+ if (this.query.type === type) {
+ return;
+ }
+
+ if (type && this.query.categoryId) {
+ const category = this.allCategories[this.query.categoryId];
+
+ if (category && category.type !== type - 1) {
+ this.query.categoryId = 0;
+ }
+ }
+
+ this.transactions = [];
+ this.query.type = type;
+ this.showTypePopover = false;
+ this.reload(null);
+ },
+ changeCategoryFilter(categoryId) {
+ if (this.query.categoryId === categoryId) {
+ return;
+ }
+
+ this.transactions = [];
+ this.query.categoryId = categoryId;
+ this.showCategoryPopover = false;
+ this.reload(null);
+ },
+ changeAccountFilter(accountId) {
+ if (this.query.accountId === accountId) {
+ return;
+ }
+
+ this.transactions = [];
+ this.query.accountId = accountId;
+ this.showAccountPopover = false;
+ this.reload(null);
+ },
+ changeKeywordFilter(keyword) {
+ if (this.query.keyword === keyword) {
+ return;
+ }
+
+ this.transactions = [];
+ this.query.keyword = keyword;
+ this.reload(null);
+ },
edit(transaction) {
this.$f7router.navigate('/transaction/edit?id=' + transaction.id);
},
@@ -516,7 +796,7 @@ export default {
for (let i = 0; i < result.items.length; i++) {
const transaction = result.items[i];
- const transactionTime = this.$utilities.parseDateFromUnixtime(transaction.time);
+ const transactionTime = this.$utilities.parseDateFromUnixTime(transaction.time);
transaction.day = this.$utilities.getDay(transactionTime);
transaction.dayOfWeek = this.$t(`datetime.${this.$utilities.getDayOfWeek(transactionTime)}.short`);
transaction.sourceAccount = this.allAccounts[transaction.sourceAccountId];
@@ -751,4 +1031,13 @@ export default {
transform-origin: 50% 100%;
transform: scaleY(calc(1 / var(--f7-device-pixel-ratio)));
}
+
+.tabbar-item-changed {
+ color: var(--f7-theme-color);
+}
+
+.date-popover-menu .popover-inner, .category-popover-menu .popover-inner, .account-popover-menu .popover-inner {
+ max-height: 400px;
+ overflow-Y: auto;
+}