support transaction tag group

This commit is contained in:
MaysWind
2026-01-17 00:47:51 +08:00
parent b556efa510
commit 7d9cfc4ced
59 changed files with 3289 additions and 795 deletions
+1 -12
View File
@@ -367,7 +367,7 @@
<template #footer>
<f7-block class="margin-top-half no-padding no-margin" v-if="transaction.tagIds && transaction.tagIds.length">
<f7-chip media-text-color="var(--f7-chip-text-color)" class="transaction-edit-tag"
:text="getTagName(tagId)"
:text="allTagsMap[tagId]?.name ?? ''"
:key="tagId"
v-for="tagId in transaction.tagIds">
<template #media>
@@ -570,7 +570,6 @@ const {
allVisibleCategorizedAccounts,
allCategories,
allCategoriesMap,
allTags,
allTagsMap,
firstVisibleAccountId,
hasVisibleExpenseCategories,
@@ -828,16 +827,6 @@ function getFontClassByAmount(amount: number): string {
}
}
function getTagName(tagId: string): string {
for (const tag of allTags.value) {
if (tag.id === tagId) {
return tag.name;
}
}
return '';
}
function init(): void {
if (!pageTypeAndMode) {
showToast('Parameter Invalid');
+37 -18
View File
@@ -558,24 +558,31 @@
</template>
</f7-list-item>
<f7-list-item link="#" no-chevron popover-close
:title="transactionTag.name"
:class="{ 'list-item-selected': queryAllFilterTagIdsCount === 1 && isDefined(queryAllFilterTagIds[transactionTag.id]), 'item-in-multiple-selection': queryAllFilterTagIdsCount > 1 && isDefined(queryAllFilterTagIds[transactionTag.id]) }"
:key="transactionTag.id"
v-for="transactionTag in allTransactionTags"
v-show="!transactionTag.hidden || isDefined(queryAllFilterTagIds[transactionTag.id])"
@click="changeTagFilter(TransactionTagFilter.of(transactionTag.id).toTextualTagFilter())"
>
<template #before-title>
<f7-icon class="transaction-tag-name transaction-tag-icon" f7="number"></f7-icon>
</template>
<template #after>
<f7-icon class="list-item-checked-icon"
:f7="queryAllFilterTagIds[transactionTag.id] === true ? 'checkmark_alt' : (queryAllFilterTagIds[transactionTag.id] === false ? 'multiply' : undefined)"
v-if="isDefined(queryAllFilterTagIds[transactionTag.id])">
</f7-icon>
</template>
</f7-list-item>
<template :key="transactionTagGroup.id"
v-for="transactionTagGroup in allTransactionTagGroupsWithDefault">
<f7-list-item group-title class="transaction-tag-group" v-if="allTransactionTagsByGroup[transactionTagGroup.id] && allTransactionTagsByGroup[transactionTagGroup.id]?.length && hasVisibleTagsInTagGroup(transactionTagGroup)">
<small>{{ transactionTagGroup.name }}</small>
</f7-list-item>
<f7-list-item link="#" no-chevron popover-close
:title="transactionTag.name"
:class="{ 'list-item-selected': queryAllFilterTagIdsCount === 1 && isDefined(queryAllFilterTagIds[transactionTag.id]), 'item-in-multiple-selection': queryAllFilterTagIdsCount > 1 && isDefined(queryAllFilterTagIds[transactionTag.id]) }"
:key="transactionTag.id"
v-for="transactionTag in (allTransactionTagsByGroup[transactionTagGroup.id] ?? [])"
v-show="!transactionTag.hidden || isDefined(queryAllFilterTagIds[transactionTag.id])"
@click="changeTagFilter(TransactionTagFilter.of(transactionTag.id).toTextualTagFilter())"
>
<template #before-title>
<f7-icon class="transaction-tag-name transaction-tag-icon" f7="number"></f7-icon>
</template>
<template #after>
<f7-icon class="list-item-checked-icon"
:f7="queryAllFilterTagIds[transactionTag.id] === true ? 'checkmark_alt' : (queryAllFilterTagIds[transactionTag.id] === false ? 'multiply' : undefined)"
v-if="isDefined(queryAllFilterTagIds[transactionTag.id])">
</f7-icon>
</template>
</f7-list-item>
</template>
</f7-list>
</f7-popover>
@@ -686,6 +693,8 @@ const {
allCategories,
allPrimaryCategories,
allAvailableCategoriesCount,
allTransactionTagGroupsWithDefault,
allTransactionTagsByGroup,
allTransactionTags,
allAvailableTagsCount,
displayPageTypeName,
@@ -708,6 +717,7 @@ const {
transactionCalendarMaxDate,
currentMonthTransactionData,
hasSubCategoryInQuery,
hasVisibleTagsInTagGroup,
isSameAsDefaultTimezoneOffsetMinutes,
canAddTransaction,
getDisplayTime,
@@ -1608,6 +1618,15 @@ html[dir="rtl"] .list.transaction-info-list li.transaction-info .transaction-foo
overflow-y: auto;
}
.more-popover-menu .transaction-tag-group {
background-color: inherit;
> small {
overflow: hidden;
text-overflow: ellipsis;
}
}
.transaction-calendar-container .dp__theme_light,
.transaction-calendar-container .dp__theme_dark {
--dp-background-color: var(--f7-list-strong-bg-color);