mirror/ezbookkeeping
1
0
Fork 0
mirror of https://github.com/mayswind/ezbookkeeping.git synced 2026-05-22 02:34:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

show add button in default group

Browse Source
This commit is contained in:
MaysWind
2026-01-17 16:05:04 +08:00
parent 0803a5930f
commit 598ae9fa06
3 changed files with 59 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/base/TransactionTagSelectionBase.ts
+17 -1
View File
@@ -12,6 +12,8 @@ import { TransactionTag } from '@/models/transaction_tag.ts';
export type TransactionTagWithGroupHeader = TransactionTag | {
type: 'subheader';
title: string;
} | {
type: 'addbutton';
}
export interface CommonTransactionTagSelectionProps {
@@ -19,7 +21,7 @@ export interface CommonTransactionTagSelectionProps {
allowAddNewTag?: boolean;
}
export function useTransactionTagSelectionBase(props: CommonTransactionTagSelectionProps, useClonedModelValue?: boolean) {
export function useTransactionTagSelectionBase(props: CommonTransactionTagSelectionProps, supportAddButtonInList: boolean, useClonedModelValue?: boolean) {
const { tt } = useI18n();
const transactionTagsStore = useTransactionTagsStore();
@@ -93,6 +95,7 @@ export function useTransactionTagSelectionBase(props: CommonTransactionTagSelect
function getTagsWithGroupHeader(tagFilterFn: (tag: TransactionTag) => boolean): TransactionTagWithGroupHeader[] {
const result: TransactionTagWithGroupHeader[] = [];
const tagsInDefaultGroup = transactionTagsStore.allTransactionTagsByGroupMap[DEFAULT_TAG_GROUP_ID];
let addButtonAdded = false;
if (tagsInDefaultGroup && tagsInDefaultGroup.length > 0) {
const visibleTags = tagsInDefaultGroup.filter(tag => tagFilterFn(tag));
@@ -104,6 +107,13 @@ export function useTransactionTagSelectionBase(props: CommonTransactionTagSelect
});
result.push(...visibleTags);
if (supportAddButtonInList && props.allowAddNewTag && !addButtonAdded) {
result.push({
type: 'addbutton'
});
addButtonAdded = true;
}
}
}
@@ -126,6 +136,12 @@ export function useTransactionTagSelectionBase(props: CommonTransactionTagSelect
}
}
if (supportAddButtonInList && props.allowAddNewTag && !addButtonAdded) {
result.push({
type: 'addbutton'
});
}
return result;
}
src/components/desktop/TransactionTagAutoComplete.vue
+1 -1
View File
@@ -100,7 +100,7 @@ const { tt } = useI18n();
const {
tagSearchContent,
allTagsWithGroupHeader
} = useTransactionTagSelectionBase(props);
} = useTransactionTagSelectionBase(props, false);
const transactionTagsStore = useTransactionTagsStore();
src/components/mobile/TransactionTagSelectionSheet.vue
+30 -27
View File
@@ -27,36 +27,14 @@
<f7-list-item :title="tt('No available tag')"></f7-list-item>
</f7-list>
<f7-list dividers class="no-margin-top no-margin-bottom tag-selection-list" v-else-if="(filteredTagsWithGroupHeader && filteredTagsWithGroupHeader.length > 0) || newTag">
<template :key="(tag instanceof TransactionTag) ? tag.id : `${tag.type}-${index}-${tag.title}`"
<template :key="(tag instanceof TransactionTag) ? tag.id : (tag.type === 'subheader' ? `${tag.type}-${index}-${tag.title}` : `${tag.type}-${index}`)"
v-for="(tag, index) in filteredTagsWithGroupHeader">
<f7-list-item group-title v-if="!(tag instanceof TransactionTag)">
<f7-list-item group-title v-if="!(tag instanceof TransactionTag) && tag.type === 'subheader'">
<div class="tag-selection-list-item">
{{ tag.title }}
</div>
</f7-list-item>
<f7-list-item checkbox
:class="{ 'list-item-selected': selectedTagIds[tag.id], 'disabled': tag.hidden && !selectedTagIds[tag.id] }"
:value="tag.id"
:checked="selectedTagIds[tag.id]"
:key="tag.id"
v-else-if="tag instanceof TransactionTag"
@change="changeTagSelection">
<template #media>
<f7-icon class="transaction-tag-icon" f7="number">
<f7-badge color="gray" class="right-bottom-icon" v-if="tag.hidden">
<f7-icon f7="eye_slash_fill"></f7-icon>
</f7-badge>
</f7-icon>
</template>
<template #title>
<div class="display-flex">
<div class="tag-selection-list-item list-item-valign-middle padding-inline-start-half">
{{ tag.name }}
</div>
</div>
</template>
</f7-list-item>
</template>
<template v-if="!(tag instanceof TransactionTag) && tag.type === 'addbutton'">
<f7-list-item link="#" no-chevron
:title="tt('Add new tag')"
v-if="allowAddNewTag && !newTag"
@@ -91,6 +69,30 @@
</f7-button>
</template>
</f7-list-item>
</template>
<f7-list-item checkbox
:class="{ 'list-item-selected': selectedTagIds[tag.id], 'disabled': tag.hidden && !selectedTagIds[tag.id] }"
:value="tag.id"
:checked="selectedTagIds[tag.id]"
:key="tag.id"
v-else-if="tag instanceof TransactionTag"
@change="changeTagSelection">
<template #media>
<f7-icon class="transaction-tag-icon" f7="number">
<f7-badge color="gray" class="right-bottom-icon" v-if="tag.hidden">
<f7-icon f7="eye_slash_fill"></f7-icon>
</f7-badge>
</f7-icon>
</template>
<template #title>
<div class="display-flex">
<div class="tag-selection-list-item list-item-valign-middle padding-inline-start-half">
{{ tag.name }}
</div>
</div>
</template>
</f7-list-item>
</template>
</f7-list>
</f7-page-content>
</f7-sheet>
@@ -104,9 +106,10 @@ import { useI18n } from '@/locales/helpers.ts';
import { useI18nUIComponents, showLoading, hideLoading } from '@/lib/ui/mobile.ts';
import { type CommonTransactionTagSelectionProps, useTransactionTagSelectionBase } from '@/components/base/TransactionTagSelectionBase.ts';
import { TransactionTag } from '@/models/transaction_tag.ts';
import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
import { TransactionTag } from '@/models/transaction_tag.ts';
import { scrollToSelectedItem } from '@/lib/ui/common.ts';
import { type Framework7Dom, scrollSheetToTop } from '@/lib/ui/mobile.ts';
@@ -130,7 +133,7 @@ const {
tagSearchContent,
selectedTagIds,
filteredTagsWithGroupHeader
} = useTransactionTagSelectionBase(props, true);
} = useTransactionTagSelectionBase(props, true, true);
const transactionTagsStore = useTransactionTagsStore();