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

add net assets/total assets/total liabilities in account list page

Browse Source
This commit is contained in:
MaysWind
2020-11-17 00:52:26 +08:00
parent 5dbb662f46
commit 391588fdf6
5 changed files with 169 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/consts/account.js
+7
View File
@@ -2,36 +2,43 @@ const allAccountCategories = [
{
id: 1,
name: 'Cash',
isAsset: true,
defaultAccountIconId: '1'
},
{
id: 2,
name: 'Debit Card',
isAsset: true,
defaultAccountIconId: '2'
},
{
id: 3,
name: 'Credit Card',
isLiability: true,
defaultAccountIconId: '2'
},
{
id: 4,
name: 'Virtual Account',
isAsset: true,
defaultAccountIconId: '3'
},
{
id: 5,
name: 'Debt Account',
isLiability: true,
defaultAccountIconId: '4'
},
{
id: 6,
name: 'Receivables',
isAsset: true,
defaultAccountIconId: '5'
},
{
id: 7,
name: 'Investment Account',
isAsset: true,
defaultAccountIconId: '6'
}
];
src/lib/utils.js
+37
View File
@@ -1,3 +1,5 @@
import accountConstants from '../consts/account.js'
function isFunction(val) {
return typeof(val) === 'function';
}
@@ -61,6 +63,40 @@ function getAccountByAccountId(categorizedAccounts, accountId) {
return null;
}
function getAllFilteredAccountsBalance(categorizedAccounts, accountCategoryFilter) {
const allAccountCategories = accountConstants.allCategories;
const ret = [];
for (let categoryIdx = 0; categoryIdx < allAccountCategories.length; categoryIdx++) {
const accountCategory = allAccountCategories[categoryIdx];
if (!accountCategoryFilter(accountCategory) || !categorizedAccounts[accountCategory.id]) {
continue;
}
for (let accountIdx = 0; accountIdx < categorizedAccounts[accountCategory.id].length; accountIdx++) {
const account = categorizedAccounts[accountCategory.id][accountIdx];
if (account.type === accountConstants.allAccountTypes.SingleAccount) {
ret.push({
balance: account.balance,
currency: account.currency
});
} else if (account.type === accountConstants.allAccountTypes.MultiSubAccounts) {
for (let subAccountIdx = 0; subAccountIdx < account.subAccounts.length; subAccountIdx++) {
const subAccount = account.subAccounts[subAccountIdx];
ret.push({
balance: subAccount.balance,
currency: subAccount.currency
});
}
}
}
}
return ret;
}
export default {
isFunction,
isObject,
@@ -70,4 +106,5 @@ export default {
isBoolean,
getCategorizedAccounts,
getAccountByAccountId,
getAllFilteredAccountsBalance,
};
src/locales/en.js
+3
View File
@@ -301,6 +301,9 @@ export default {
'Transaction Details': 'Transaction Details',
'Account List': 'Account List',
'New Transaction': 'New Transaction',
'Net assets': 'Net assets',
'Total assets': 'Total assets',
'Total liabilities': 'Total liabilities',
'Expense': 'Expense',
'Income': 'Income',
'Transfer': 'Transfer',
src/locales/zh_Hans.js
+3
View File
@@ -301,6 +301,9 @@ export default {
'Transaction Details': '交易详情',
'Account List': '账户列表',
'New Transaction': '新交易',
'Net assets': '净资产',
'Total assets': '总资产',
'Total liabilities': '总负债',
'Expense': '支出',
'Income': '收入',
'Transfer': '转账',
src/views/mobile/accounts/AccountList.vue
+119 -2
View File
@@ -9,6 +9,24 @@
</f7-nav-right>
</f7-navbar>
<f7-card :class="{ 'bg-color-yellow': true, 'skeleton-text': loading }">
<f7-card-header class="display-block" style="padding-top: 100px;">
<small :style="{ opacity: 0.6 }">{{ $t('Net assets') }}</small><br />
<big>{{ netAssets | currency(defaultCurrency) }}</big>
<f7-link class="margin-left-half" @click="toggleShowAccountBalance()">
<f7-icon :f7="showAccountBalance ? 'eye_slash_fill' : 'eye_fill'" size="18px"></f7-icon>
</f7-link>
<br />
<small class="account-overview-info" :style="{ opacity: 0.6 }">
<span>{{ $t('Total assets') }}</span>
<span>{{ totalAssets | currency(defaultCurrency) }}</span>
<span>|</span>
<span>{{ $t('Total liabilities') }}</span>
<span>{{ totalLiabilities | currency(defaultCurrency) }}</span>
</small>
</f7-card-header>
</f7-card>
<f7-card class="skeleton-text" v-if="loading">
<f7-card-header>Account Category</f7-card-header>
<f7-card-content :padding="false">
@@ -47,7 +65,12 @@
</f7-card>
<f7-card v-for="accountCategory in usedAccountCategories" :key="accountCategory.id" v-show="showHidden || hasShownAccount(accountCategory)">
<f7-card-header>{{ $t(accountCategory.name) }}</f7-card-header>
<f7-card-header>
<small :style="{ opacity: 0.6 }">
<span>{{ $t(accountCategory.name) }}</span>
<span style="margin-left: 10px">{{ accountCategoryTotalBalance(accountCategory) | currency(defaultCurrency) }}</span>
</small>
</f7-card-header>
<f7-card-content :padding="false">
<f7-list sortable :sortable-enabled="sortable" @sortable:sort="onSort">
<f7-list-item v-for="account in accounts[accountCategory.id]" v-show="showHidden || !account.hidden"
@@ -109,11 +132,15 @@ export default {
loading: true,
showHidden: false,
sortable: false,
showAccountBalance: this.$settings.isShowAccountBalance(),
displayOrderModified: false,
displayOrderSaving: false
};
},
computed: {
defaultCurrency() {
return this.$user.getUserInfo() ? this.$user.getUserInfo().defaultCurrency : this.$t('default.currency');
},
noAvailableAccount() {
let allAccountCount = 0;
let shownAccountCount = 0;
@@ -153,6 +180,63 @@ export default {
}
return usedAccountCategories;
},
netAssets() {
if (!this.showAccountBalance) {
return '---';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, () => true);
let netAssets = 0;
for (let i = 0; i < accountsBalance.length; i++) {
if (accountsBalance[i].currency === this.defaultCurrency) {
netAssets += accountsBalance[i].balance;
} else {
// TODO: calculate exchange rate
netAssets += accountsBalance[i].balance;
}
}
return netAssets;
},
totalAssets() {
if (!this.showAccountBalance) {
return '---';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, category => category.isAsset);
let totalAssets = 0;
for (let i = 0; i < accountsBalance.length; i++) {
if (accountsBalance[i].currency === this.defaultCurrency) {
totalAssets += accountsBalance[i].balance;
} else {
// TODO: calculate exchange rate
totalAssets += accountsBalance[i].balance;
}
}
return totalAssets;
},
totalLiabilities() {
if (!this.showAccountBalance) {
return '---';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, category => category.isLiability);
let totalLiabilities = 0;
for (let i = 0; i < accountsBalance.length; i++) {
if (accountsBalance[i].currency === this.defaultCurrency) {
totalLiabilities += accountsBalance[i].balance;
} else {
// TODO: calculate exchange rate
totalLiabilities += accountsBalance[i].balance;
}
}
return totalLiabilities;
}
},
created() {
@@ -227,17 +311,40 @@ export default {
return shownCount > 0;
},
toggleShowAccountBalance() {
this.showAccountBalance = !this.showAccountBalance;
this.$settings.setShowAccountBalance(this.showAccountBalance);
},
accountBalance(account) {
if (account.type !== this.$constants.account.allAccountTypes.SingleAccount) {
return null;
}
if (this.$settings.isShowAccountBalance()) {
if (this.showAccountBalance) {
return account.balance;
} else {
return '---';
}
},
accountCategoryTotalBalance(accountCategory) {
if (!this.showAccountBalance) {
return '---';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, category => category.id === accountCategory.id);
let totalBalance = 0;
for (let i = 0; i < accountsBalance.length; i++) {
if (accountsBalance[i].currency === this.defaultCurrency) {
totalBalance += accountsBalance[i].balance;
} else {
// TODO: calculate exchange rate
totalBalance += accountsBalance[i].balance;
}
}
return totalBalance;
},
setSortable() {
this.showHidden = true;
this.sortable = true;
@@ -404,3 +511,13 @@ export default {
}
};
</script>
<style>
.account-overview-info > span {
margin-right: 4px;
}
.account-overview-info > span:last-child {
margin-right: 0;
}
</style>