support adding / deleting sub account after account created (#77)

This commit is contained in:
MaysWind
2025-04-26 23:36:23 +08:00
parent e7e2cc8081
commit 78ba43480b
20 changed files with 520 additions and 76 deletions
@@ -91,6 +91,10 @@ export function useAccountEditPageBaseBase() {
}
}
function isNewAccount(account: Account): boolean {
return account.id === '' || account.id === '0';
}
function isInputEmpty(): boolean {
const isAccountEmpty = !!getInputEmptyProblemMessage(account.value, false);
@@ -172,6 +176,7 @@ export function useAccountEditPageBaseBase() {
isAccountSupportCreditCardStatementDate,
// functions
getAccountCreditCardStatementDate,
isNewAccount,
isInputEmpty,
getAccountOrSubAccountProblemMessage,
addSubAccount,
@@ -8,7 +8,7 @@
<v-progress-circular indeterminate size="22" class="ml-2" v-if="loading"></v-progress-circular>
</div>
<v-btn density="comfortable" color="default" variant="text" class="ml-2" :icon="true"
:disabled="loading || submitting || !!editAccountId || account.type !== AccountType.MultiSubAccounts.type">
:disabled="loading || submitting || account.type !== AccountType.MultiSubAccounts.type">
<v-icon :icon="mdiDotsVertical" />
<v-menu activator="parent">
<v-list>
@@ -30,7 +30,7 @@
<v-tab :key="idx" :value="idx" v-for="(subAccount, idx) in subAccounts">
<span>{{ tt('Sub Account') + ' #' + (idx + 1) }}</span>
<v-btn class="ml-2" color="error" size="24" variant="text"
:icon="mdiDeleteOutline" v-if="!editAccountId"
:icon="mdiDeleteOutline"
@click="removeSubAccount(subAccount)"></v-btn>
</v-tab>
</template>
@@ -109,7 +109,7 @@
v-model="selectedAccount.color" />
</v-col>
<v-col cols="12" :md="currentAccountIndex < 0 && isAccountSupportCreditCardStatementDate ? 6 : 12" v-if="account.type === AccountType.SingleAccount.type || currentAccountIndex >= 0">
<currency-select :disabled="loading || submitting || !!editAccountId"
<currency-select :disabled="loading || submitting || (!!editAccountId && !isNewAccount(selectedAccount))"
:label="tt('Currency')"
:placeholder="tt('Currency')"
v-model="selectedAccount.currency" />
@@ -128,9 +128,9 @@
v-model="account.creditCardStatementDate"
></v-autocomplete>
</v-col>
<v-col cols="12" :md="!editAccountId && selectedAccount.balance ? 6 : 12"
<v-col cols="12" :md="(!editAccountId || isNewAccount(selectedAccount)) && selectedAccount.balance ? 6 : 12"
v-if="account.type === AccountType.SingleAccount.type || currentAccountIndex >= 0">
<amount-input :disabled="loading || submitting || !!editAccountId"
<amount-input :disabled="loading || submitting || (!!editAccountId && !isNewAccount(selectedAccount))"
:persistent-placeholder="true"
:currency="selectedAccount.currency"
:show-currency="true"
@@ -140,7 +140,7 @@
v-model="selectedAccount.balance"/>
</v-col>
<v-col cols="12" md="6" v-show="selectedAccount.balance"
v-if="!editAccountId && (account.type === AccountType.SingleAccount.type || currentAccountIndex >= 0)">
v-if="(!editAccountId || isNewAccount(selectedAccount)) && (account.type === AccountType.SingleAccount.type || currentAccountIndex >= 0)">
<date-time-select
:disabled="loading || submitting"
:label="tt('Balance Time')"
@@ -158,7 +158,7 @@
v-model="selectedAccount.comment"
/>
</v-col>
<v-col class="py-0" cols="12" md="12" v-if="editAccountId">
<v-col class="py-0" cols="12" md="12" v-if="editAccountId && !isNewAccount(selectedAccount)">
<v-switch :disabled="loading || submitting"
:label="tt('Visible')" v-model="selectedAccount.visible"/>
</v-col>
@@ -236,6 +236,7 @@ const {
allAccountTypes,
allAvailableMonthDays,
isAccountSupportCreditCardStatementDate,
isNewAccount,
isInputEmpty,
getAccountOrSubAccountProblemMessage,
addSubAccount,
@@ -288,6 +289,7 @@ function open(options?: { id?: string, currentAccount?: Account, category?: numb
account.value.fillFrom(newAccount);
subAccounts.value = [];
currentAccountIndex.value = -1;
clientSessionId.value = generateRandomUUID();
if (options && options.id) {
if (options.currentAccount) {
@@ -317,7 +319,6 @@ function open(options?: { id?: string, currentAccount?: Account, category?: numb
}
editAccountId.value = null;
clientSessionId.value = generateRandomUUID();
loading.value = false;
}
+8 -8
View File
@@ -4,7 +4,7 @@
<f7-nav-left :back-link="tt('Back')"></f7-nav-left>
<f7-nav-title :title="tt(title)"></f7-nav-title>
<f7-nav-right>
<f7-link icon-f7="ellipsis" :class="{ 'disabled': editAccountId || account.type !== AccountType.MultiSubAccounts.type }" @click="showMoreActionSheet = true"></f7-link>
<f7-link icon-f7="ellipsis" :class="{ 'disabled': account.type !== AccountType.MultiSubAccounts.type }" @click="showMoreActionSheet = true"></f7-link>
<f7-link :class="{ 'disabled': isInputEmpty() || submitting }" :text="tt(saveButtonTitle)" @click="save"></f7-link>
</f7-nav-right>
</f7-navbar>
@@ -354,7 +354,6 @@
<small>{{ tt('Sub Account') + ' #' + (idx + 1) }}</small>
<f7-button rasied fill class="subaccount-delete-button" color="red" icon-f7="trash" icon-size="16px"
:tooltip="tt('Remove Sub-account')"
v-if="!editAccountId"
@click="removeSubAccount(subAccount, false)">
</f7-button>
</f7-list-item>
@@ -420,9 +419,9 @@
<f7-list-item
class="list-item-with-header-and-title list-item-no-item-after"
link="#"
:class="{ 'disabled': editAccountId }"
:class="{ 'disabled': editAccountId && !isNewAccount(subAccount) }"
:header="tt('Currency')"
:no-chevron="!!editAccountId"
:no-chevron="!!editAccountId && !isNewAccount(subAccount)"
@click="subAccountContexts[idx].showCurrencyPopup = true"
>
<template #title>
@@ -447,7 +446,7 @@
<f7-list-item
link="#" no-chevron
class="list-item-with-header-and-title"
:class="{ 'disabled': editAccountId }"
:class="{ 'disabled': editAccountId && !isNewAccount(subAccount) }"
:header="account.isLiability ? tt('Sub-account Outstanding Balance') : tt('Sub-account Balance')"
:title="formatAccountDisplayBalance(subAccount)"
@click="subAccountContexts[idx].showBalanceSheet = true"
@@ -465,7 +464,7 @@
class="account-edit-balancetime list-item-with-header-and-title"
link="#" no-chevron
v-show="subAccount.balance"
v-if="!editAccountId"
v-if="!editAccountId || isNewAccount(subAccount)"
>
<template #header>
<div class="account-edit-balancetime-header" @click="showDateTimeDialog(subAccountContexts[idx], 'time')">{{ tt('Sub-account Balance Time') }}</div>
@@ -481,7 +480,7 @@
</date-time-selection-sheet>
</f7-list-item>
<f7-list-item :title="tt('Visible')" v-if="editAccountId">
<f7-list-item :title="tt('Visible')" v-if="editAccountId && !isNewAccount(subAccount)">
<f7-toggle :checked="subAccount.visible" @toggle:change="subAccount.visible = $event"></f7-toggle>
</f7-list-item>
@@ -573,6 +572,7 @@ const {
allAvailableMonthDays,
isAccountSupportCreditCardStatementDate,
getAccountCreditCardStatementDate,
isNewAccount,
isInputEmpty,
getAccountOrSubAccountProblemMessage,
addSubAccount,
@@ -625,6 +625,7 @@ function formatAccountBalanceTime(account: Account): string {
function init(): void {
const query = props.f7route.query;
clientSessionId.value = generateRandomUUID();
if (query['id']) {
loading.value = true;
@@ -651,7 +652,6 @@ function init(): void {
}
});
} else {
clientSessionId.value = generateRandomUUID();
loading.value = false;
}
}