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

support filtering accounts and transaction categories for overview in home page (#209)

Browse Source
This commit is contained in:
MaysWind
2025-09-07 13:57:07 +08:00
parent 3ae72623ad
commit ce9378c43f
33 changed files with 459 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/base/settings/AccountFilterSettingPageBase.ts
+12 -2
View File
@@ -4,6 +4,7 @@ import { useSettingsStore } from '@/stores/setting.ts';
import { useAccountsStore } from '@/stores/account.ts';
import { useTransactionsStore } from '@/stores/transaction.ts';
import { useStatisticsStore } from '@/stores/statistics.ts';
import { useOverviewStore } from '@/stores/overview.ts';
import type { Account, AccountCategoriesWithVisibleCount } from '@/models/account.ts';
@@ -13,11 +14,14 @@ import {
isAccountOrSubAccountsAllChecked
} from '@/lib/account.ts';
export function useAccountFilterSettingPageBase(type?: string) {
export type AccountFilterType = 'statisticsDefault' | 'statisticsCurrent' | 'homePageOverview' | 'transactionListCurrent' | 'accountListTotalAmount';
export function useAccountFilterSettingPageBase(type?: AccountFilterType) {
const settingsStore = useSettingsStore();
const accountsStore = useAccountsStore();
const transactionsStore = useTransactionsStore();
const statisticsStore = useStatisticsStore();
const overviewStore = useOverviewStore();
const loading = ref<boolean>(true);
const showHidden = ref<boolean>(false);
@@ -40,7 +44,7 @@ export function useAccountFilterSettingPageBase(type?: string) {
});
const allowHiddenAccount = computed<boolean>(() => {
return type === 'statisticsDefault' || type === 'statisticsCurrent' || type === 'transactionListCurrent';
return type === 'statisticsDefault' || type === 'statisticsCurrent' || type === 'homePageOverview' || type === 'transactionListCurrent';
});
const allCategorizedAccounts = computed<AccountCategoriesWithVisibleCount[]>(() => getCategorizedAccountsWithVisibleCount(accountsStore.allCategorizedAccountsMap));
@@ -85,6 +89,9 @@ export function useAccountFilterSettingPageBase(type?: string) {
} else if (type === 'statisticsCurrent') {
filterAccountIds.value = Object.assign(allAccountIds, statisticsStore.transactionStatisticsFilter.filterAccountIds);
return true;
} else if (type === 'homePageOverview') {
filterAccountIds.value = Object.assign(allAccountIds, settingsStore.appSettings.overviewAccountFilterInHomePage);
return true;
} else if (type === 'transactionListCurrent') {
for (const accountId in transactionsStore.allFilterAccountIds) {
if (!Object.prototype.hasOwnProperty.call(transactionsStore.allFilterAccountIds, accountId)) {
@@ -146,6 +153,9 @@ export function useAccountFilterSettingPageBase(type?: string) {
changed = statisticsStore.updateTransactionStatisticsFilter({
filterAccountIds: filteredAccountIds
});
} else if (type === 'homePageOverview') {
settingsStore.setOverviewAccountFilterInHomePage(filteredAccountIds);
overviewStore.updateTransactionOverviewInvalidState(true);
} else if (type === 'transactionListCurrent') {
changed = transactionsStore.updateTransactionListFilter({
accountIds: isAllSelected ? '' : finalAccountIds
src/views/base/settings/AppCloudSyncPageBase.ts
+3 -1
View File
@@ -28,7 +28,9 @@ export const ALL_APPLICATION_CLOUD_SETTINGS: CategorizedApplicationCloudSettingI
categoryName: 'Overview Page',
items: [
{ settingKey: 'showAmountInHomePage', settingName: 'Show Amount', mobile: true, desktop: true },
{ settingKey: 'timezoneUsedForStatisticsInHomePage', settingName: 'Timezone Used for Statistics', mobile: true, desktop: true }
{ settingKey: 'timezoneUsedForStatisticsInHomePage', settingName: 'Timezone Used for Statistics', mobile: true, desktop: true },
{ settingKey: 'overviewAccountFilterInHomePage', settingName: 'Accounts Included in Overview Statistics', mobile: true, desktop: true },
{ settingKey: 'overviewTransactionCategoryFilterInHomePage', settingName: 'Transaction Categories Included in Overview Statistics', mobile: true, desktop: true }
]
},
{
src/views/base/settings/AppSettingsPageBase.ts
+85 -9
View File
@@ -5,11 +5,16 @@ import { useI18n } from '@/locales/helpers.ts';
import { useSettingsStore } from '@/stores/setting.ts';
import { useAccountsStore } from '@/stores/account.ts';
import { useTransactionsStore } from '@/stores/transaction.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import { useOverviewStore } from '@/stores/overview.ts';
import { useStatisticsStore } from '@/stores/statistics.ts';
import type { NameValue, TypeAndDisplayName } from '@/core/base.ts';
import type { LocalizedTimezoneInfo } from '@/core/timezone.ts';
import { CategoryType } from '@/core/category.ts';
import type { Account } from '@/models/account.ts';
import { isObjectEmpty } from '@/lib/common.ts';
export function useAppSettingPageBase() {
const { tt, getAllTimezones, getAllTimezoneTypesUsedForStatistics, getAllCurrencySortingTypes, setTimeZone } = useI18n();
@@ -17,10 +22,12 @@ export function useAppSettingPageBase() {
const settingsStore = useSettingsStore();
const accountsStore = useAccountsStore();
const transactionsStore = useTransactionsStore();
const transactionCategoriesStore = useTransactionCategoriesStore();
const overviewStore = useOverviewStore();
const statisticsStore = useStatisticsStore();
const loadingAccounts = ref<boolean>(false);
const loadingTransactionCategories = ref<boolean>(false);
const allThemes = computed<NameValue[]>(() => {
return [
@@ -42,7 +49,9 @@ export function useAppSettingPageBase() {
];
});
const hasAnyAccount = computed<boolean>(() => accountsStore.allPlainAccounts.length > 0);
const hasAnyVisibleAccount = computed<boolean>(() => accountsStore.allVisibleAccountsCount > 0);
const hasAnyTransactionCategory = computed<boolean>(() => !isObjectEmpty(transactionCategoriesStore.allTransactionCategoriesMap));
const timeZone = computed<string>({
get: () => settingsStore.appSettings.timeZone,
@@ -114,12 +123,26 @@ export function useAppSettingPageBase() {
set: (value: number) => settingsStore.setCurrencySortByInExchangeRatesPage(value)
});
const accountsIncludedInHomePageOverviewDisplayContent = computed<string>(() => {
const excludeAccountIds = settingsStore.appSettings.overviewAccountFilterInHomePage;
return getIncludedAccountsDisplayContent(excludeAccountIds, accountsStore.allPlainAccounts);
});
const accountsIncludedInTotalDisplayContent = computed<string>(() => {
if (loadingAccounts.value || !accountsStore.allVisiblePlainAccounts || !accountsStore.allVisiblePlainAccounts.length) {
const excludeAccountIds = settingsStore.appSettings.totalAmountExcludeAccountIds;
return getIncludedAccountsDisplayContent(excludeAccountIds, accountsStore.allVisiblePlainAccounts);
});
const transactionCategoriesIncludedInHomePageOverviewDisplayContent = computed<string>(() => {
const excludeAccountIds = settingsStore.appSettings.overviewTransactionCategoryFilterInHomePage;
return getIncludedTransactionCategoriesDisplayContent(excludeAccountIds);
});
function getIncludedAccountsDisplayContent(excludeAccountIds: Record<string, boolean>, allAccounts: Account[]): string {
if (loadingAccounts.value || !allAccounts || !allAccounts.length) {
return '';
}
const excludeAccountIds = settingsStore.appSettings.totalAmountExcludeAccountIds;
let hasExcludeAccount = false;
for (const accountId in excludeAccountIds) {
@@ -137,27 +160,76 @@ export function useAppSettingPageBase() {
return tt('All');
}
let allVisibleAccountExcluded = true;
let allAccountExcluded = true;
for (let i = 0; i < accountsStore.allVisiblePlainAccounts.length; i++) {
const account = accountsStore.allVisiblePlainAccounts[i];
for (let i = 0; i < allAccounts.length; i++) {
const account = allAccounts[i];
if (!excludeAccountIds[account.id]) {
allVisibleAccountExcluded = false;
allAccountExcluded = false;
break;
}
}
if (allVisibleAccountExcluded) {
if (allAccountExcluded) {
return tt('None');
}
return tt('Partial');
});
}
function getIncludedTransactionCategoriesDisplayContent(excludeTransactionCategoryIds: Record<string, boolean>): string {
if (loadingTransactionCategories.value || !transactionCategoriesStore.allTransactionCategoriesMap) {
return '';
}
let hasExcludeTransactionCategory = false;
for (const transactionCategoryId in excludeTransactionCategoryIds) {
if (!Object.prototype.hasOwnProperty.call(excludeTransactionCategoryIds, transactionCategoryId)) {
continue;
}
if (excludeTransactionCategoryIds[transactionCategoryId] && transactionCategoriesStore.allTransactionCategoriesMap[transactionCategoryId]) {
hasExcludeTransactionCategory = true;
break;
}
}
if (!hasExcludeTransactionCategory) {
return tt('All');
}
let allTransactionCategoryExcluded = true;
for (const transactionCategoryId in transactionCategoriesStore.allTransactionCategoriesMap) {
if (!Object.prototype.hasOwnProperty.call(transactionCategoriesStore.allTransactionCategoriesMap, transactionCategoryId)) {
continue;
}
const transactionCategory = transactionCategoriesStore.allTransactionCategoriesMap[transactionCategoryId];
if (transactionCategory.type !== CategoryType.Income && transactionCategory.type !== CategoryType.Expense) {
continue;
}
if (!excludeTransactionCategoryIds[transactionCategory.id]) {
allTransactionCategoryExcluded = false;
break;
}
}
if (allTransactionCategoryExcluded) {
return tt('None');
}
return tt('Partial');
}
return {
// states
loadingAccounts,
loadingTransactionCategories,
// computed states
allThemes,
allTimezones,
@@ -165,7 +237,9 @@ export function useAppSettingPageBase() {
allCurrencySortingTypes,
allAutoSaveTransactionDraftTypes,
timeZone,
hasAnyAccount,
hasAnyVisibleAccount,
hasAnyTransactionCategory,
isAutoUpdateExchangeRatesData,
showAccountBalance,
showAmountInHomePage,
@@ -176,6 +250,8 @@ export function useAppSettingPageBase() {
autoSaveTransactionDraft,
isAutoGetCurrentGeoLocation,
currencySortByInExchangeRatesPage,
accountsIncludedInTotalDisplayContent
accountsIncludedInHomePageOverviewDisplayContent,
accountsIncludedInTotalDisplayContent,
transactionCategoriesIncludedInHomePageOverviewDisplayContent
};
}
src/views/base/settings/CategoryFilterSettingPageBase.ts
+11 -1
View File
@@ -6,6 +6,7 @@ import { useSettingsStore } from '@/stores/setting.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import { useTransactionsStore } from '@/stores/transaction.ts';
import { useStatisticsStore } from '@/stores/statistics.ts';
import { useOverviewStore } from '@/stores/overview.ts';
import { CategoryType } from '@/core/category.ts';
import type { TransactionCategory, TransactionCategoriesWithVisibleCount } from '@/models/transaction_category.ts';
@@ -21,13 +22,16 @@ import {
isCategoryOrSubCategoriesAllChecked
} from '@/lib/category.ts';
export function useCategoryFilterSettingPageBase(type?: string, allowCategoryTypesStr?: string) {
export type CategoryFilterType = 'statisticsDefault' | 'statisticsCurrent' | 'homePageOverview' | 'transactionListCurrent';
export function useCategoryFilterSettingPageBase(type?: CategoryFilterType, allowCategoryTypesStr?: string) {
const { tt } = useI18n();
const settingsStore = useSettingsStore();
const transactionCategoriesStore = useTransactionCategoriesStore();
const transactionsStore = useTransactionsStore();
const statisticsStore = useStatisticsStore();
const overviewStore = useOverviewStore();
const allowCategoryTypes: Record<string, boolean> | undefined = allowCategoryTypesStr ? arrayItemToObjectField(allowCategoryTypesStr.split(','), true) : undefined;
@@ -100,6 +104,9 @@ export function useCategoryFilterSettingPageBase(type?: string, allowCategoryTyp
} else if (type === 'statisticsCurrent') {
filterCategoryIds.value = Object.assign(allCategoryIds, statisticsStore.transactionStatisticsFilter.filterCategoryIds);
return true;
} else if (type === 'homePageOverview') {
filterCategoryIds.value = Object.assign(allCategoryIds, settingsStore.appSettings.overviewTransactionCategoryFilterInHomePage);
return true;
} else if (type === 'transactionListCurrent') {
for (const categoryId in transactionsStore.allFilterCategoryIds) {
if (!Object.prototype.hasOwnProperty.call(transactionsStore.allFilterCategoryIds, categoryId)) {
@@ -157,6 +164,9 @@ export function useCategoryFilterSettingPageBase(type?: string, allowCategoryTyp
changed = statisticsStore.updateTransactionStatisticsFilter({
filterCategoryIds: filteredCategoryIds
});
} else if (type === 'homePageOverview') {
settingsStore.setOverviewTransactionCategoryFilterInHomePage(filteredCategoryIds);
overviewStore.updateTransactionOverviewInvalidState(true);
} else if (type === 'transactionListCurrent') {
changed = transactionsStore.updateTransactionListFilter({
categoryIds: isAllSelected ? '' : finalCategoryIds
src/views/desktop/HomePage.vue
+14 -6
View File
@@ -34,7 +34,7 @@
<span v-if="!loadingOverview || (transactionOverview && transactionOverview.thisMonth && transactionOverview.thisMonth.valid)">{{ transactionOverview && transactionOverview.thisMonth ? getDisplayIncomeAmount(transactionOverview.thisMonth) : '-' }}</span>
<v-skeleton-loader class="d-inline-block skeleton-no-margin mt-2" width="120px" type="text" :loading="true" v-else-if="loadingOverview && (!transactionOverview || !transactionOverview.thisMonth || !transactionOverview.thisMonth.valid)"></v-skeleton-loader>
</div>
<v-btn size="small" to="/transaction/list?dateType=7">{{ tt('View Details') }}</v-btn>
<v-btn size="small" :to="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.ThisMonth.type })}`">{{ tt('View Details') }}</v-btn>
<v-img class="overview-card-background img-with-direction"
src="img/desktop/card-background.png"/>
<v-img class="overview-card-background-image img-with-direction"
@@ -119,7 +119,7 @@
:datetime="displayDateRange?.today?.displayTime || ''"
>
<template #menus>
<v-list-item :prepend-icon="mdiListBoxOutline" :to="'/transaction/list?dateType=' + DateRange.Today.type">
<v-list-item :prepend-icon="mdiListBoxOutline" :to="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.Today.type })}`">
<v-list-item-title>{{ tt('View Details') }}</v-list-item-title>
</v-list-item>
</template>
@@ -135,7 +135,7 @@
:datetime="displayDateRange?.thisWeek?.startTime + '-' + displayDateRange?.thisWeek?.endTime"
>
<template #menus>
<v-list-item :prepend-icon="mdiListBoxOutline" :to="'/transaction/list?dateType=' + DateRange.ThisWeek.type">
<v-list-item :prepend-icon="mdiListBoxOutline" :to="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.ThisWeek.type })}`">
<v-list-item-title>{{ tt('View Details') }}</v-list-item-title>
</v-list-item>
</template>
@@ -151,7 +151,7 @@
:datetime="displayDateRange?.thisMonth?.startTime + '-' + displayDateRange?.thisMonth?.endTime"
>
<template #menus>
<v-list-item :prepend-icon="mdiListBoxOutline" :to="'/transaction/list?dateType=' + DateRange.ThisMonth.type">
<v-list-item :prepend-icon="mdiListBoxOutline" :to="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.ThisMonth.type })}`">
<v-list-item-title>{{ tt('View Details') }}</v-list-item-title>
</v-list-item>
</template>
@@ -167,7 +167,7 @@
:datetime="displayDateRange?.thisYear?.displayTime || ''"
>
<template #menus>
<v-list-item :prepend-icon="mdiListBoxOutline" :to="'/transaction/list?dateType=' + DateRange.ThisYear.type">
<v-list-item :prepend-icon="mdiListBoxOutline" :to="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.ThisYear.type })}`">
<v-list-item-title>{{ tt('View Details') }}</v-list-item-title>
</v-list-item>
</template>
@@ -199,6 +199,7 @@ import { useI18n } from '@/locales/helpers.ts';
import { useHomePageBase } from '@/views/base/HomePageBase.ts';
import { useAccountsStore } from '@/stores/account.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import { useOverviewStore } from '@/stores/overview.ts';
import { type NumeralSystem } from '@/core/numeral.ts';
@@ -242,6 +243,7 @@ const {
} = useHomePageBase();
const accountsStore = useAccountsStore();
const transactionCategoriesStore = useTransactionCategoriesStore();
const overviewStore = useOverviewStore();
const snackbar = useTemplateRef<SnackBarType>('snackbar');
@@ -258,7 +260,12 @@ function clickMonthlyIncomeOrExpense(e: MonthlyIncomeAndExpenseCardClickEvent):
const maxTime = getUnixTimeBeforeUnixTime(getUnixTimeAfterUnixTime(minTime, 1, 'months'), 1, 'seconds');
const type = e.transactionType;
router.push(`/transaction/list?type=${type}&dateType=${DateRange.Custom.type}&maxTime=${maxTime}&minTime=${minTime}`);
router.push(`/transaction/list?${overviewStore.getTransactionListPageParams({
type: type,
dateType: DateRange.Custom.type,
minTime: minTime,
maxTime: maxTime
})}`);
}
const monthlyIncomeAndExpenseData = computed<TransactionMonthlyIncomeAndExpenseData[]>(() => {
@@ -298,6 +305,7 @@ function reload(force: boolean): void {
const promises = [
accountsStore.loadAllAccounts({ force: false }),
transactionCategoriesStore.loadAllCategories({ force: false }),
overviewStore.loadTransactionOverview({ force: force, loadLast11Months: true })
];
src/views/desktop/app/settings/tabs/AppBasicSettingTab.vue
+67 -1
View File
@@ -110,6 +110,38 @@
v-model="timezoneUsedForStatisticsInHomePage"
/>
</v-col>
<v-col cols="12" md="6">
<v-text-field
class="always-cursor-pointer"
item-title="displayName"
item-value="type"
persistent-placeholder
:loading="loadingAccounts"
:readonly="true"
:disabled="!hasAnyAccount"
:label="tt('Accounts Included in Overview Statistics')"
:placeholder="tt('Accounts Included in Overview Statistics')"
:model-value="accountsIncludedInHomePageOverviewDisplayContent"
@click="showAccountsIncludedInHomePageOverviewDialog = true"
/>
</v-col>
<v-col cols="12" md="6">
<v-text-field
class="always-cursor-pointer"
item-title="displayName"
item-value="type"
persistent-placeholder
:loading="loadingTransactionCategories"
:readonly="true"
:disabled="!hasAnyTransactionCategory"
:label="tt('Transaction Categories Included in Overview Statistics')"
:placeholder="tt('Transaction Categories Included in Overview Statistics')"
:model-value="transactionCategoriesIncludedInHomePageOverviewDisplayContent"
@click="showTransactionCategoriesIncludedInHomePageOverviewDialog = true"
/>
</v-col>
</v-row>
</v-card-text>
</v-form>
@@ -241,6 +273,16 @@
</v-col>
</v-row>
<v-dialog width="800" v-model="showAccountsIncludedInHomePageOverviewDialog">
<account-filter-settings-card type="homePageOverview" :dialog-mode="true"
@settings:change="showAccountsIncludedInHomePageOverviewDialog = false" />
</v-dialog>
<v-dialog width="800" v-model="showTransactionCategoriesIncludedInHomePageOverviewDialog">
<category-filter-settings-card type="homePageOverview" :dialog-mode="true" :category-types="`${CategoryType.Income},${CategoryType.Expense}`"
@settings:change="showTransactionCategoriesIncludedInHomePageOverviewDialog = false" />
</v-dialog>
<v-dialog width="800" v-model="showAccountsIncludedInTotalDialog">
<account-filter-settings-card type="accountListTotalAmount" :dialog-mode="true"
@settings:change="showAccountsIncludedInTotalDialog = false" />
@@ -252,6 +294,7 @@
<script setup lang="ts">
import SnackBar from '@/components/desktop/SnackBar.vue';
import AccountFilterSettingsCard from '@/views/desktop/common/cards/AccountFilterSettingsCard.vue';
import CategoryFilterSettingsCard from '@/views/desktop/common/cards/CategoryFilterSettingsCard.vue';
import { ref, computed, useTemplateRef } from 'vue';
import { useTheme } from 'vuetify';
@@ -261,9 +304,12 @@ import { useAppSettingPageBase } from '@/views/base/settings/AppSettingsPageBase
import { useSettingsStore } from '@/stores/setting.ts';
import { useAccountsStore } from '@/stores/account.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import type { LocalizedSwitchOption } from '@/core/base.ts';
import { ThemeType } from '@/core/theme.ts';
import { CategoryType } from '@/core/category.ts';
import { getSystemTheme } from '@/lib/ui/common.ts';
type SnackBarType = InstanceType<typeof SnackBar>;
@@ -273,12 +319,15 @@ const theme = useTheme();
const { tt, getAllEnableDisableOptions } = useI18n();
const {
loadingAccounts,
loadingTransactionCategories,
allThemes,
allTimezones,
allTimezoneTypesUsedForStatistics,
allCurrencySortingTypes,
allAutoSaveTransactionDraftTypes,
hasAnyAccount,
hasAnyVisibleAccount,
hasAnyTransactionCategory,
timeZone,
isAutoUpdateExchangeRatesData,
showAccountBalance,
@@ -290,14 +339,19 @@ const {
autoSaveTransactionDraft,
isAutoGetCurrentGeoLocation,
currencySortByInExchangeRatesPage,
accountsIncludedInTotalDisplayContent
accountsIncludedInHomePageOverviewDisplayContent,
accountsIncludedInTotalDisplayContent,
transactionCategoriesIncludedInHomePageOverviewDisplayContent
} = useAppSettingPageBase();
const settingsStore = useSettingsStore();
const accountsStore = useAccountsStore();
const transactionCategoriesStore = useTransactionCategoriesStore();
const snackbar = useTemplateRef<SnackBarType>('snackbar');
const showAccountsIncludedInHomePageOverviewDialog = ref<boolean>(false);
const showTransactionCategoriesIncludedInHomePageOverviewDialog = ref<boolean>(false);
const showAccountsIncludedInTotalDialog = ref<boolean>(false);
const enableDisableOptions = computed<LocalizedSwitchOption[]>(() => getAllEnableDisableOptions());
@@ -336,6 +390,18 @@ function init(): void {
snackbar.value?.showError(error);
}
});
transactionCategoriesStore.loadAllCategories({
force: false
}).then(() => {
loadingTransactionCategories.value = false;
}).catch(error => {
loadingTransactionCategories.value = false;
if (!error.processed) {
snackbar.value?.showError(error);
}
});
}
init();
src/views/desktop/common/cards/AccountFilterSettingsCard.vue
+5 -2
View File
@@ -151,7 +151,10 @@ import SnackBar from '@/components/desktop/SnackBar.vue';
import { ref, useTemplateRef } from 'vue';
import { useI18n } from '@/locales/helpers.ts';
import { useAccountFilterSettingPageBase } from '@/views/base/settings/AccountFilterSettingPageBase.ts';
import {
type AccountFilterType,
useAccountFilterSettingPageBase
} from '@/views/base/settings/AccountFilterSettingPageBase.ts';
import { useAccountsStore } from '@/stores/account.ts';
@@ -179,7 +182,7 @@ import {
type SnackBarType = InstanceType<typeof SnackBar>;
const props = defineProps<{
type: string;
type: AccountFilterType;
dialogMode?: boolean;
autoSave?: boolean;
}>();
src/views/desktop/common/cards/CategoryFilterSettingsCard.vue
+5 -2
View File
@@ -148,7 +148,10 @@ import SnackBar from '@/components/desktop/SnackBar.vue';
import { ref, useTemplateRef } from 'vue';
import { useI18n } from '@/locales/helpers.ts';
import { useCategoryFilterSettingPageBase } from '@/views/base/settings/CategoryFilterSettingPageBase.ts';
import {
type CategoryFilterType,
useCategoryFilterSettingPageBase
} from '@/views/base/settings/CategoryFilterSettingPageBase.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
@@ -176,7 +179,7 @@ import {
type SnackBarType = InstanceType<typeof SnackBar>;
const props = defineProps<{
type: string;
type: CategoryFilterType;
dialogMode?: boolean;
autoSave?: boolean;
categoryTypes?: string;
src/views/mobile/HomePage.vue
+16 -12
View File
@@ -36,7 +36,7 @@
</f7-card>
<f7-list strong inset dividers class="margin-top overview-transaction-list" :class="{ 'skeleton-text': loading }">
<f7-list-item :link="'/transaction/list?dateType=' + DateRange.Today.type" chevron-center>
<f7-list-item :link="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.Today.type })}`" chevron-center>
<template #media>
<f7-icon f7="calendar_today"></f7-icon>
</template>
@@ -66,7 +66,7 @@
</template>
</f7-list-item>
<f7-list-item :link="'/transaction/list?dateType=' + DateRange.ThisWeek.type" chevron-center>
<f7-list-item :link="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.ThisWeek.type })}`" chevron-center>
<template #media>
<f7-icon f7="calendar"></f7-icon>
</template>
@@ -99,7 +99,7 @@
</template>
</f7-list-item>
<f7-list-item :link="'/transaction/list?dateType=' + DateRange.ThisMonth.type" chevron-center>
<f7-list-item :link="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.ThisMonth.type })}`" chevron-center>
<template #media>
<f7-icon f7="calendar"></f7-icon>
</template>
@@ -132,7 +132,7 @@
</template>
</f7-list-item>
<f7-list-item :link="'/transaction/list?dateType=' + DateRange.ThisYear.type" chevron-center>
<f7-list-item :link="`/transaction/list?${overviewStore.getTransactionListPageParams({ dateType: DateRange.ThisYear.type })}`" chevron-center>
<template #media>
<f7-icon f7="square_stack_3d_up"></f7-icon>
</template>
@@ -207,6 +207,8 @@ import { useI18n } from '@/locales/helpers.ts';
import { useI18nUIComponents } from '@/lib/ui/mobile.ts';
import { useHomePageBase } from '@/views/base/HomePageBase.ts';
import { useAccountsStore } from '@/stores/account.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import { useTransactionTemplatesStore } from '@/stores/transactionTemplate.ts';
import { useOverviewStore } from '@/stores/overview.ts';
@@ -227,6 +229,8 @@ const {
getDisplayExpenseAmount
} = useHomePageBase();
const accountsStore = useAccountsStore();
const transactionCategoriesStore = useTransactionCategoriesStore();
const transactionTemplatesStore = useTransactionTemplatesStore();
const overviewStore = useOverviewStore();
@@ -248,9 +252,14 @@ function init(): void {
if (isUserLogined() && isUserUnlocked()) {
loading.value = true;
overviewStore.loadTransactionOverview({
force: false
}).then(() => {
const promises = [
accountsStore.loadAllAccounts({ force: false }),
transactionCategoriesStore.loadAllCategories({ force: false }),
transactionTemplatesStore.loadAllTemplates({ templateType: TemplateType.Normal.type, force: false }),
overviewStore.loadTransactionOverview({ force: false })
];
Promise.all(promises).then(() => {
loading.value = false;
}).catch(error => {
loading.value = false;
@@ -259,11 +268,6 @@ function init(): void {
showToast(error.message || error);
}
});
transactionTemplatesStore.loadAllTemplates({
templateType: TemplateType.Normal.type,
force: false
});
}
}
src/views/mobile/settings/AccountFilterSettingsPage.vue
+5 -2
View File
@@ -133,7 +133,10 @@ import type { Router } from 'framework7/types';
import { useI18n } from '@/locales/helpers.ts';
import { useI18nUIComponents } from '@/lib/ui/mobile.ts';
import { useAccountFilterSettingPageBase } from '@/views/base/settings/AccountFilterSettingPageBase.ts';
import {
type AccountFilterType,
useAccountFilterSettingPageBase
} from '@/views/base/settings/AccountFilterSettingPageBase.ts';
import { useAccountsStore } from '@/stores/account.ts';
@@ -174,7 +177,7 @@ const {
isAccountChecked,
loadFilterAccountIds,
saveFilterAccountIds
} = useAccountFilterSettingPageBase(query['type']);
} = useAccountFilterSettingPageBase(query['type'] as AccountFilterType);
const accountsStore = useAccountsStore();
src/views/mobile/settings/CategoryFilterSettingsPage.vue
+5 -2
View File
@@ -140,7 +140,10 @@ import type { Router } from 'framework7/types';
import { useI18n } from '@/locales/helpers.ts';
import { useI18nUIComponents } from '@/lib/ui/mobile.ts';
import { useCategoryFilterSettingPageBase } from '@/views/base/settings/CategoryFilterSettingPageBase.ts';
import {
type CategoryFilterType,
useCategoryFilterSettingPageBase
} from '@/views/base/settings/CategoryFilterSettingPageBase.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
@@ -183,7 +186,7 @@ const {
getCategoryTypeName,
loadFilterCategoryIds,
saveFilterCategoryIds
} = useCategoryFilterSettingPageBase(query['type'], query['allowCategoryTypes']);
} = useCategoryFilterSettingPageBase(query['type'] as CategoryFilterType, query['allowCategoryTypes']);
const transactionCategoriesStore = useTransactionCategoriesStore();
src/views/mobile/settings/PageSettingsPage.vue
+40 -1
View File
@@ -27,6 +27,24 @@
v-model="timezoneUsedForStatisticsInHomePage">
</list-item-selection-popup>
</f7-list-item>
<f7-list-item :disabled="!hasAnyAccount"
:title="tt('Accounts Included in Overview Statistics')"
link="/settings/filter/account?type=homePageOverview">
<template #after>
<f7-preloader v-if="loadingAccounts" />
<span v-else-if="!loadingAccounts">{{ accountsIncludedInHomePageOverviewDisplayContent }}</span>
</template>
</f7-list-item>
<f7-list-item :disabled="!hasAnyTransactionCategory"
:title="tt('Transaction Categories Included in Overview Statistics')"
:link="`/settings/filter/category?type=homePageOverview&allowCategoryTypes=${CategoryType.Income},${CategoryType.Expense}`">
<template #after>
<f7-preloader v-if="loadingTransactionCategories" />
<span v-else-if="!loadingTransactionCategories">{{ transactionCategoriesIncludedInHomePageOverviewDisplayContent }}</span>
</template>
</f7-list-item>
</f7-list>
<f7-block-title>{{ tt('Transaction List Page') }}</f7-block-title>
@@ -118,6 +136,9 @@ import { useAppSettingPageBase } from '@/views/base/settings/AppSettingsPageBase
import { useSettingsStore } from '@/stores/setting.ts';
import { useAccountsStore } from '@/stores/account.ts';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import { CategoryType } from '@/core/category.ts';
import { findNameByValue, findDisplayNameByType } from '@/lib/common.ts';
@@ -125,7 +146,10 @@ const { tt } = useI18n();
const { showToast } = useI18nUIComponents();
const {
loadingAccounts,
loadingTransactionCategories,
hasAnyAccount,
hasAnyVisibleAccount,
hasAnyTransactionCategory,
allTimezoneTypesUsedForStatistics,
allCurrencySortingTypes,
allAutoSaveTransactionDraftTypes,
@@ -136,11 +160,14 @@ const {
autoSaveTransactionDraft,
isAutoGetCurrentGeoLocation,
currencySortByInExchangeRatesPage,
accountsIncludedInTotalDisplayContent
accountsIncludedInHomePageOverviewDisplayContent,
accountsIncludedInTotalDisplayContent,
transactionCategoriesIncludedInHomePageOverviewDisplayContent
} = useAppSettingPageBase();
const settingsStore = useSettingsStore();
const accountsStore = useAccountsStore();
const transactionCategoriesStore = useTransactionCategoriesStore();
const showTimezoneUsedForStatisticsInHomePagePopup = ref<boolean>(false);
const showAutoSaveTransactionDraftPopup = ref<boolean>(false);
@@ -165,6 +192,18 @@ function init(): void {
showToast(error.message || error);
}
});
transactionCategoriesStore.loadAllCategories({
force: false
}).then(() => {
loadingTransactionCategories.value = false;
}).catch(error => {
loadingTransactionCategories.value = false;
if (!error.processed) {
showToast(error.message || error);
}
});
}
init();