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

support showing transaction tag in transaction list page

Browse Source
This commit is contained in:
MaysWind
2024-07-10 00:34:20 +08:00
parent 4b249a0ebb
commit 84a96d80b7
19 changed files with 163 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/mobile/settings/PageSettingsPage.vue
+12
View File
@@ -26,6 +26,10 @@
<span>{{ $t('Show Monthly Total Amount') }}</span>
<f7-toggle :checked="showTotalAmountInTransactionListPage" @toggle:change="showTotalAmountInTransactionListPage = $event"></f7-toggle>
</f7-list-item>
<f7-list-item>
<span>{{ $t('Show Transaction Tag') }}</span>
<f7-toggle :checked="showTagInTransactionListPage" @toggle:change="showTagInTransactionListPage = $event"></f7-toggle>
</f7-list-item>
</f7-list>
<f7-block-title>{{ $t('Transaction Edit Page') }}</f7-block-title>
@@ -74,6 +78,14 @@ export default {
this.settingsStore.setShowTotalAmountInTransactionListPage(value);
}
},
showTagInTransactionListPage: {
get: function () {
return this.settingsStore.appSettings.showTagInTransactionListPage;
},
set: function (value) {
this.settingsStore.setShowTagInTransactionListPage(value);
}
},
isAutoGetCurrentGeoLocation: {
get: function () {
return this.settingsStore.appSettings.autoGetCurrentGeoLocation;
src/views/mobile/settings/TextSizeSettingsPage.vue
+7
View File
@@ -63,6 +63,13 @@
</div>
</div>
<div class="item-footer">
<div class="transaction-tags">
<f7-chip media-bg-color="black" class="transaction-tag" :text="$t('Tag Title')">
<template #media>
<f7-icon f7="number"></f7-icon>
</template>
</f7-chip>
</div>
<div class="transaction-footer">
<span>{{ currentShortTime }}</span>
<span>·</span>
src/views/mobile/transactions/EditPage.vue
+5
View File
@@ -876,9 +876,14 @@ export default {
}
.transaction-edit-tag {
--f7-chip-bg-color: var(--ebk-transaction-tag-chip-bg-color);
margin-right: 4px;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.transaction-edit-tag > .chip-media {
opacity: 0.6;
}
</style>
src/views/mobile/transactions/ListPage.vue
+37 -2
View File
@@ -210,6 +210,16 @@
</div>
</div>
<div class="item-footer">
<div class="transaction-tags" v-if="showTagInTransactionListPage && transaction.tagIds && transaction.tagIds.length">
<f7-chip media-bg-color="black" class="transaction-tag"
:text="allTransactionTags[tagId].name"
:key="tagId"
v-for="tagId in transaction.tagIds">
<template #media>
<f7-icon f7="number"></f7-icon>
</template>
</f7-chip>
</div>
<div class="transaction-footer">
<span>{{ getDisplayTime(transaction) }}</span>
<span v-if="transaction.utcOffset !== currentTimezoneOffsetMinutes">{{ `(${getDisplayTimezone(transaction)})` }}</span>
@@ -456,6 +466,7 @@ import { useSettingsStore } from '@/stores/setting.js';
import { useUserStore } from '@/stores/user.js';
import { useAccountsStore } from '@/stores/account.js';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
import { useTransactionTagsStore } from '@/stores/transactionTag.js';
import { useTransactionsStore } from '@/stores/transaction.js';
import numeralConstants from '@/consts/numeral.js';
@@ -501,7 +512,7 @@ export default {
};
},
computed: {
...mapStores(useSettingsStore, useUserStore, useAccountsStore, useTransactionCategoriesStore, useTransactionsStore),
...mapStores(useSettingsStore, useUserStore, useAccountsStore, useTransactionCategoriesStore, useTransactionTagsStore, useTransactionsStore),
defaultCurrency() {
return getUnifiedSelectedAccountsCurrencyOrDefaultCurrency(this.allAccounts, this.queryAllFilterAccountIds, this.userStore.currentUserDefaultCurrency);
},
@@ -625,6 +636,9 @@ export default {
return primaryCategories;
},
allTransactionTags() {
return this.transactionTagsStore.allTransactionTagsMap;
},
allDateRanges() {
return datetimeConstants.allDateRanges;
},
@@ -633,6 +647,9 @@ export default {
},
showTotalAmountInTransactionListPage() {
return this.settingsStore.appSettings.showTotalAmountInTransactionListPage;
},
showTagInTransactionListPage() {
return this.settingsStore.appSettings.showTagInTransactionListPage;
}
},
created() {
@@ -680,7 +697,8 @@ export default {
Promise.all([
self.accountsStore.loadAllAccounts({ force: false }),
self.transactionCategoriesStore.loadAllCategories({ force: false })
self.transactionCategoriesStore.loadAllCategories({ force: false }),
self.transactionTagsStore.loadAllTags({ force: false })
]).then(() => {
return self.transactionsStore.loadTransactions({
reload: true,
@@ -1102,6 +1120,23 @@ export default {
padding-bottom: 2px;
}
.list.transaction-info-list li.transaction-info .chip.transaction-tag {
--f7-chip-media-size: var(--ebk-transaction-tag-chip-media-size);
--f7-chip-media-font-size: var(--ebk-transaction-tag-chip-font-size);
--f7-chip-font-size: var(--ebk-transaction-tag-chip-font-size);
--f7-chip-height: var(--ebk-transaction-tag-chip-height);
--f7-chip-text-color: var(--f7-list-item-footer-text-color);
--f7-chip-bg-color: var(--ebk-transaction-tag-chip-bg-color);
margin-right: 4px;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.list.transaction-info-list li.transaction-info .chip.transaction-tag > .chip-media {
opacity: 0.6;
}
.list.transaction-info-list li.transaction-info .transaction-footer {
padding-top: 4px;
}