zhengchen.tao/ezbookkeeping
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

support showing hidden tags in filtering page / dialog

Browse Source
This commit is contained in:
MaysWind
2024-07-24 00:10:29 +08:00
parent 266dafa4a9
commit 021e523d63
5 changed files with 52 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/stores/transactionTag.js
+1 -1
View File
@@ -73,7 +73,7 @@ export const useTransactionTagsStore = defineStore('transactionTags', {
return allVisibleTags;
},
allVisibleTagsCount(state) {
allAvailableTagsCount(state) {
return state.allTransactionTags.length;
}
},
src/views/desktop/common/cards/TransactionTagFilterSettingsCard.vue
+30 -6
View File
@@ -19,6 +19,13 @@
<v-list-item :prepend-icon="icons.selectInverse"
:title="$t('Invert Selection')"
@click="selectInvert"></v-list-item>
<v-divider class="my-2"/>
<v-list-item :prepend-icon="icons.show"
:title="$t('Show Hidden Transaction Tags')"
v-if="!showHidden" @click="showHidden = true"></v-list-item>
<v-list-item :prepend-icon="icons.hide"
:title="$t('Hide Hidden Transaction Tags')"
v-if="showHidden" @click="showHidden = false"></v-list-item>
</v-list>
</v-menu>
</v-btn>
@@ -40,6 +47,13 @@
<v-list-item :prepend-icon="icons.selectInverse"
:title="$t('Invert Selection')"
@click="selectInvert"></v-list-item>
<v-divider class="my-2"/>
<v-list-item :prepend-icon="icons.show"
:title="$t('Show Hidden Transaction Tags')"
v-if="!showHidden" @click="showHidden = true"></v-list-item>
<v-list-item :prepend-icon="icons.hide"
:title="$t('Hide Hidden Transaction Tags')"
v-if="showHidden" @click="showHidden = false"></v-list-item>
</v-list>
</v-menu>
</v-btn>
@@ -64,13 +78,18 @@
<v-expansion-panel-text>
<v-list rounded density="comfortable" class="pa-0">
<template :key="transactionTag.id"
v-for="transactionTag in allVisibleTags">
<v-list-item>
v-for="transactionTag in allTags">
<v-list-item v-if="showHidden || !transactionTag.hidden">
<template #prepend>
<v-checkbox :model-value="!filterTagIds[transactionTag.id]"
@update:model-value="selectTransactionTag(transactionTag, $event)">
<template #label>
<v-icon size="24" :icon="icons.tag"/>
<v-badge class="right-bottom-icon" color="secondary"
location="bottom right" offset-x="2" offset-y="2" :icon="icons.hide"
v-if="transactionTag.hidden">
<v-icon size="24" :icon="icons.tag"/>
</v-badge>
<v-icon size="24" :icon="icons.tag" v-else-if="!transactionTag.hidden"/>
<span class="ml-3">{{ transactionTag.name }}</span>
</template>
</v-checkbox>
@@ -107,6 +126,8 @@ import {
mdiSelectAll,
mdiSelect,
mdiSelectInverse,
mdiEyeOutline,
mdiEyeOffOutline,
mdiDotsVertical,
mdiPound
} from '@mdi/js';
@@ -125,10 +146,13 @@ export default {
loading: true,
expandTagCategories: [ 'default' ],
filterTagIds: {},
showHidden: false,
icons: {
selectAll: mdiSelectAll,
selectNone: mdiSelect,
selectInverse: mdiSelectInverse,
show: mdiEyeOutline,
hide: mdiEyeOffOutline,
more: mdiDotsVertical,
tag: mdiPound
}
@@ -142,11 +166,11 @@ export default {
applyText() {
return 'Apply';
},
allVisibleTags() {
return this.transactionTagsStore.allVisibleTags;
allTags() {
return this.transactionTagsStore.allTransactionTags;
},
hasAnyAvailableTag() {
return this.transactionTagsStore.allVisibleTagsCount > 0;
return this.transactionTagsStore.allAvailableTagsCount > 0;
}
},
created() {
src/views/desktop/transactions/ListPage.vue
+3 -3
View File
@@ -334,7 +334,7 @@
<v-list-item key="multiple" value="multiple" class="text-sm" density="compact"
:class="{ 'list-item-selected': query.tagIds && queryAllFilterTagIdsCount > 1 }"
:append-icon="(query.tagIds && queryAllFilterTagIdsCount > 1 ? icons.check : null)"
v-if="allVisibleTagsCount > 0">
v-if="allAvailableTagsCount > 0">
<v-list-item-title class="cursor-pointer"
@click="showFilterTagDialog = true">
<div class="d-flex align-center">
@@ -887,8 +887,8 @@ export default {
allTransactionTags() {
return this.transactionTagsStore.allTransactionTagsMap;
},
allVisibleTagsCount() {
return this.transactionTagsStore.allVisibleTagsCount;
allAvailableTagsCount() {
return this.transactionTagsStore.allAvailableTagsCount;
},
recentMonthDateRanges() {
return this.$locale.getAllRecentMonthDateRanges(this.userStore, true, true);
src/views/mobile/settings/TransactionTagFilterSettingsPage.vue
+15 -5
View File
@@ -66,10 +66,15 @@
:value="transactionTag.id"
:checked="!filterTagIds[transactionTag.id]"
:key="transactionTag.id"
v-for="transactionTag in allVisibleTags"
v-for="transactionTag in allTags"
v-show="showHidden || !transactionTag.hidden"
@change="selectTransactionTag">
<template #media>
<f7-icon f7="number"></f7-icon>
<f7-icon f7="number">
<f7-badge color="gray" class="right-bottom-icon" v-if="transactionTag.hidden">
<f7-icon f7="eye_slash_fill"></f7-icon>
</f7-badge>
</f7-icon>
</template>
</f7-list-item>
</f7-list>
@@ -83,6 +88,10 @@
<f7-actions-button @click="selectNone">{{ $t('Select None') }}</f7-actions-button>
<f7-actions-button @click="selectInvert">{{ $t('Invert Selection') }}</f7-actions-button>
</f7-actions-group>
<f7-actions-group>
<f7-actions-button v-if="!showHidden" @click="showHidden = true">{{ $t('Show Hidden Transaction Tags') }}</f7-actions-button>
<f7-actions-button v-if="showHidden" @click="showHidden = false">{{ $t('Hide Hidden Transaction Tags') }}</f7-actions-button>
</f7-actions-group>
<f7-actions-group>
<f7-actions-button bold close>{{ $t('Cancel') }}</f7-actions-button>
</f7-actions-group>
@@ -112,6 +121,7 @@ export default {
loadingError: null,
type: null,
filterTagIds: {},
showHidden: false,
collapseStates: {
'default': {
opened: true
@@ -128,11 +138,11 @@ export default {
applyText() {
return 'Apply';
},
allVisibleTags() {
return this.transactionTagsStore.allVisibleTags;
allTags() {
return this.transactionTagsStore.allTransactionTags;
},
hasAnyAvailableTag() {
return this.transactionTagsStore.allVisibleTagsCount > 0;
return this.transactionTagsStore.allAvailableTagsCount > 0;
}
},
created() {
src/views/mobile/transactions/ListPage.vue
+3 -3
View File
@@ -453,7 +453,7 @@
</template>
</f7-list-item>
<f7-list-item :class="{ 'list-item-selected': query.tagIds && queryAllFilterTagIdsCount > 1 }"
:title="$t('Multiple Tags')" @click="filterMultipleTags()" v-if="allVisibleTagsCount > 0">
:title="$t('Multiple Tags')" @click="filterMultipleTags()" v-if="allAvailableTagsCount > 0">
<template #after>
<f7-icon class="list-item-checked-icon" f7="checkmark_alt" v-if="query.tagIds && queryAllFilterTagIdsCount > 1"></f7-icon>
</template>
@@ -675,8 +675,8 @@ export default {
allTransactionTags() {
return this.transactionTagsStore.allTransactionTagsMap;
},
allVisibleTagsCount() {
return this.transactionTagsStore.allVisibleTagsCount;
allAvailableTagsCount() {
return this.transactionTagsStore.allAvailableTagsCount;
},
allDateRanges() {
return datetimeConstants.allDateRanges;