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

show total balance of parent account in mobile version (#149)

Browse Source
This commit is contained in:
MaysWind
2025-06-07 14:11:55 +08:00
parent 881a9c122a
commit 70eea8ff33
5 changed files with 59 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/stores/account.ts
+1 -1
View File
@@ -633,7 +633,7 @@ export const useAccountsStore = defineStore('accounts', () => {
}
}
function getAccountSubAccountBalance(showAccountBalance: boolean, showHidden: boolean, account: Account, subAccountId: string): AccountDisplayBalance | null {
function getAccountSubAccountBalance(showAccountBalance: boolean, showHidden: boolean, account: Account, subAccountId?: string): AccountDisplayBalance | null {
if (account.type !== AccountType.MultiSubAccounts.type) {
return null;
}
src/styles/mobile/global.css
+18 -2
View File
@@ -579,7 +579,8 @@ i.icon.la, i.icon.las, i.icon.lab {
background-color: var(--f7-list-link-pressed-bg-color);
}
.nested-list-item.has-child-list-item .item-link .item-inner .nested-list-item-child .item-link .item-inner {
.nested-list-item.has-child-list-item .item-link .item-inner .nested-list-item-child .item-link .item-inner,
.nested-list-item.has-child-list-item .item-link .item-inner .nested-list-item-inner {
padding-right: calc(var(--f7-list-chevron-icon-area) + var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-right));
}
@@ -587,8 +588,13 @@ i.icon.la, i.icon.las, i.icon.lab {
color: var(--f7-list-chevron-icon-color);
}
.nested-list-item .nested-list-item-inner {
align-items: center;
}
.nested-list-item .nested-list-item-title {
align-self: center;
width: 100%;
flex-shrink: 1;
margin-right: var(--f7-list-item-media-margin);
overflow: hidden;
text-overflow: ellipsis;
@@ -598,6 +604,16 @@ i.icon.la, i.icon.las, i.icon.lab {
margin-left: var(--f7-list-item-media-margin);
}
.nested-list-item .nested-list-item-after {
white-space: nowrap;
flex-shrink: 0;
display: flex;
font-size: var(--f7-list-item-after-font-size);
color: var(--f7-list-item-after-text-color);
margin-left: auto;
padding-left: var(--f7-list-item-after-padding);
}
.nested-list-item.has-child-list-item > .swipeout-content > .item-content > .item-inner:after,
.nested-list-item.has-child-list-item > .swipeout-content > .item-link > .item-content > .item-inner:after {
background-color: transparent;
src/views/base/accounts/AccountListPageBase.ts
+27 -2
View File
@@ -6,9 +6,11 @@ import { useSettingsStore } from '@/stores/setting.ts';
import { useUserStore } from '@/stores/user.ts';
import { useAccountsStore } from '@/stores/account.ts';
import type { AccountCategory } from '@/core/account.ts';
import { type AccountCategory, AccountType } from '@/core/account.ts';
import type { Account, CategorizedAccount } from '@/models/account.ts';
import { isObject, isString } from '@/lib/common.ts';
export function useAccountListPageBaseBase() {
const { formatAmountWithCurrency } = useI18n();
@@ -55,6 +57,28 @@ export function useAccountListPageBaseBase() {
return formatAmountWithCurrency(totalBalance, defaultCurrency.value);
}
function accountBalance(account: Account, currentSubAccountId?: string): string | null {
if (account.type === AccountType.SingleAccount.type) {
const balance = accountsStore.getAccountBalance(showAccountBalance.value, account);
if (!isString(balance)) {
return '';
}
return formatAmountWithCurrency(balance, account.currency);
} else if (account.type === AccountType.MultiSubAccounts.type) {
const balanceResult = accountsStore.getAccountSubAccountBalance(showAccountBalance.value, showHidden.value, account, currentSubAccountId);
if (!isObject(balanceResult)) {
return '';
}
return formatAmountWithCurrency(balanceResult.balance, balanceResult.currency);
} else {
return null;
}
}
return {
// states
loading,
@@ -70,6 +94,7 @@ export function useAccountListPageBaseBase() {
totalAssets,
totalLiabilities,
// functions
accountCategoryTotalBalance
accountCategoryTotalBalance,
accountBalance
};
}
src/views/desktop/accounts/ListPage.vue
+4 -27
View File
@@ -230,7 +230,7 @@
{{ tt('Delete') }}
</v-btn>
<v-spacer/>
<span class="account-balance ml-2">{{ accountBalance(element) }}</span>
<span class="account-balance ml-2">{{ accountBalance(element, activeSubAccount[element.id]) }}</span>
</div>
</v-card-text>
</v-card>
@@ -270,8 +270,6 @@ import { useAccountsStore } from '@/stores/account.ts';
import { AccountType, AccountCategory } from '@/core/account.ts';
import type { Account } from '@/models/account.ts';
import { isObject, isString } from '@/lib/common.ts';
import {
mdiEyeOutline,
mdiEyeOffOutline,
@@ -291,7 +289,7 @@ type EditDialogType = InstanceType<typeof EditDialog>;
const display = useDisplay();
const { tt, getCurrencyName, formatAmountWithCurrency, joinMultiText } = useI18n();
const { tt, getCurrencyName, joinMultiText } = useI18n();
const {
loading,
@@ -304,7 +302,8 @@ const {
netAssets,
totalAssets,
totalLiabilities,
accountCategoryTotalBalance
accountCategoryTotalBalance,
accountBalance
} = useAccountListPageBaseBase();
const accountsStore = useAccountsStore();
@@ -395,28 +394,6 @@ function accountCurrency(account: Account): string | null {
}
}
function accountBalance(account: Account): string | null {
if (account.type === AccountType.SingleAccount.type) {
const balance = accountsStore.getAccountBalance(showAccountBalance.value, account);
if (!isString(balance)) {
return '';
}
return formatAmountWithCurrency(balance, account.currency);
} else if (account.type === AccountType.MultiSubAccounts.type) {
const balanceResult = accountsStore.getAccountSubAccountBalance(showAccountBalance.value, showHidden.value, account, activeSubAccount.value[account.id]);
if (!isObject(balanceResult)) {
return '';
}
return formatAmountWithCurrency(balanceResult.balance, balanceResult.currency);
} else {
return null;
}
}
function add(): void {
editDialog.value?.open({
category: activeAccountCategoryType.value
src/views/mobile/accounts/ListPage.vue
+9 -16
View File
@@ -84,7 +84,7 @@
class="nested-list-item"
:id="getAccountDomId(account)"
:class="{ 'has-child-list-item': account.type === AccountType.MultiSubAccounts.type && hasVisibleSubAccount(account), 'actual-first-child': account.id === firstShowingIds.accounts[accountCategory.type], 'actual-last-child': account.id === lastShowingIds.accounts[accountCategory.type] }"
:after="accountBalance(account)"
:after="account.type === AccountType.SingleAccount.type ? accountBalance(account) : ''"
:link="!sortable ? '/transaction/list?accountIds=' + account.id : null"
:key="account.id"
v-for="account in allCategorizedAccountsMap[accountCategory.type].accounts"
@@ -100,7 +100,7 @@
</template>
<template #title>
<div class="display-flex padding-top-half padding-bottom-half">
<div class="nested-list-item-inner display-flex padding-top-half padding-bottom-half">
<ItemIcon icon-type="account" :icon-id="account.icon" :color="account.color"
v-if="account.type === AccountType.MultiSubAccounts.type && hasVisibleSubAccount(account)">
<f7-badge color="gray" class="right-bottom-icon" v-if="account.hidden">
@@ -111,13 +111,16 @@
<span>{{ account.name }}</span>
<div class="item-footer" v-if="account.comment">{{ account.comment }}</div>
</div>
<div class="nested-list-item-after" v-if="account.type === AccountType.MultiSubAccounts.type">
<span>{{ accountBalance(account) }}</span>
</div>
</div>
<li v-if="account.type === AccountType.MultiSubAccounts.type">
<ul class="no-padding">
<f7-list-item class="no-sortable nested-list-item-child"
:class="{ 'actual-first-child': subAccount.id === firstShowingIds.subAccounts[account.id], 'actual-last-child': subAccount.id === lastShowingIds.subAccounts[account.id] }"
:id="getAccountDomId(subAccount)"
:title="subAccount.name" :footer="subAccount.comment" :after="accountBalance(subAccount)"
:title="subAccount.name" :footer="subAccount.comment" :after="accountBalance(account, subAccount.id)"
:link="!sortable ? '/transaction/list?accountIds=' + subAccount.id : null"
:key="subAccount.id"
v-for="subAccount in account.subAccounts"
@@ -186,14 +189,13 @@ import { useAccountsStore } from '@/stores/account.ts';
import { AccountType, AccountCategory } from '@/core/account.ts';
import type { Account, AccountShowingIds } from '@/models/account.ts';
import { isString } from '@/lib/common.ts';
import { onSwipeoutDeleted } from '@/lib/ui/mobile.ts';
const props = defineProps<{
f7router: Router.Router;
}>();
const { tt, formatAmountWithCurrency } = useI18n();
const { tt } = useI18n();
const { showAlert, showToast, routeBackOnError } = useI18nUIComponents();
const {
@@ -206,7 +208,8 @@ const {
netAssets,
totalAssets,
totalLiabilities,
accountCategoryTotalBalance
accountCategoryTotalBalance,
accountBalance
} = useAccountListPageBaseBase();
const accountsStore = useAccountsStore();
@@ -236,16 +239,6 @@ function hasVisibleSubAccount(account: Account): boolean {
return accountsStore.hasVisibleSubAccount(showHidden.value, account);
}
function accountBalance(account: Account): string {
const balance = accountsStore.getAccountBalance(showAccountBalance.value, account);
if (!isString(balance)) {
return '';
}
return formatAmountWithCurrency(balance, account.currency);
}
function getAccountDomId(account: Account): string {
return 'account_' + account.id;
}