modify account selection sheet

This commit is contained in:
MaysWind
2020-12-21 01:22:44 +08:00
parent b660b3c5d6
commit 173215d4c1
4 changed files with 171 additions and 93 deletions
@@ -15,7 +15,7 @@
v-for="item in items"
:key="primaryKeyField ? item[primaryKeyField] : item"
:value="primaryValueField ? item[primaryValueField] : item"
:title="primaryTitleField ? item[primaryTitleField] : item"
:title="primaryTitleField ? (primaryTitleI18n ? $t(item[primaryTitleField]) : item[primaryTitleField]) : (primaryTitleI18n ? $t(item) : item)"
@click="onPrimaryItemClicked(item)">
<f7-icon slot="media"
:icon="item[primaryIconField] | icon(primaryIconType)"
@@ -33,7 +33,7 @@
v-for="subItem in selectedPrimaryItem[primarySubItemsField]"
:key="secondaryKeyField ? subItem[secondaryKeyField] : subItem"
:value="secondaryValueField ? subItem[secondaryValueField] : subItem"
:title="secondaryTitleField ? subItem[secondaryTitleField] : subItem"
:title="secondaryTitleField ? (secondaryTitleI18n ? $t(subItem[secondaryTitleField]) : subItem[secondaryTitleField]) : (secondaryTitleI18n ? $t(subItem) : subItem)"
@click="onSecondaryItemClicked(subItem)">
<f7-icon slot="media"
:icon="subItem[secondaryIconField] | icon(secondaryIconType)"
@@ -56,6 +56,7 @@ export default {
'primaryKeyField',
'primaryValueField',
'primaryTitleField',
'primaryTitleI18n',
'primaryIconField',
'primaryIconType',
'primaryColorField',
@@ -63,6 +64,7 @@ export default {
'secondaryKeyField',
'secondaryValueField',
'secondaryTitleField',
'secondaryTitleI18n',
'secondaryIconField',
'secondaryIconType',
'secondaryColorField',
@@ -80,10 +82,25 @@ export default {
computed: {
selectedPrimaryItem() {
if (this.primaryValueField) {
for (let i = 0; i < this.items.length; i++) {
const item = this.items[i];
if (this.currentPrimaryValue === item[this.primaryValueField]) {
return item;
if (this.$utilities.isArray(this.items)) {
for (let i = 0; i < this.items.length; i++) {
const item = this.items[i];
if (this.currentPrimaryValue === item[this.primaryValueField]) {
return item;
}
}
} else {
for (let field in this.items) {
if (!Object.prototype.hasOwnProperty.call(this.items, field)) {
continue;
}
const item = this.items[field];
if (this.currentPrimaryValue === item[this.primaryValueField]) {
return item;
}
}
}
} else {
@@ -125,21 +142,42 @@ export default {
return this.currentSecondaryValue === subItem;
}
},
isPrimaryItemHasSecondaryValue(primaryItem, secondaryValue) {
for (let i = 0; i < primaryItem[this.primarySubItemsField].length; i++) {
const secondaryItem = primaryItem[this.primarySubItemsField][i];
if (this.secondaryValueField && secondaryItem[this.secondaryValueField] === secondaryValue) {
return true;
} else if (!this.secondaryValueField && secondaryItem === secondaryValue) {
return true;
}
}
return false;
},
getPrimaryValueBySecondaryValue(secondaryValue) {
if (this.primarySubItemsField) {
for (let i = 0; i < this.items.length; i++) {
const primaryItem = this.items[i];
if (this.$utilities.isArray(this.items)) {
for (let i = 0; i < this.items.length; i++) {
const primaryItem = this.items[i];
for (let j = 0; j < primaryItem[this.primarySubItemsField].length; j++) {
const secondaryItem = primaryItem[this.primarySubItemsField][j];
if (this.secondaryValueField && secondaryItem[this.secondaryValueField] === secondaryValue) {
if (this.isPrimaryItemHasSecondaryValue(primaryItem, secondaryValue)) {
if (this.primaryValueField) {
return primaryItem[this.primaryValueField];
} else {
return primaryItem;
}
} else if (!this.secondaryValueField && secondaryItem === secondaryValue) {
}
}
} else {
for (let field in this.items) {
if (!Object.prototype.hasOwnProperty.call(this.items, field)) {
continue;
}
const primaryItem = this.items[field];
if (this.isPrimaryItemHasSecondaryValue(primaryItem, secondaryValue)) {
if (this.primaryValueField) {
return primaryItem[this.primaryValueField];
} else {
+53 -7
View File
@@ -265,6 +265,35 @@ function parseUserAgent(ua) {
};
}
function getCategoryInfo(categoryId) {
for (let i = 0; i < accountConstants.allCategories.length; i++) {
if (accountConstants.allCategories[i].id === categoryId) {
return accountConstants.allCategories[i];
}
}
return null;
}
function getPlainAccounts(allAccounts) {
const ret = [];
for (let i = 0; i < allAccounts.length; i++) {
const account = allAccounts[i];
if (account.type === accountConstants.allAccountTypes.SingleAccount) {
ret.push(account);
} else if (account.type === accountConstants.allAccountTypes.MultiSubAccounts) {
for (let j = 0; j < account.subAccounts.length; j++) {
const subAccount = account.subAccounts[j];
ret.push(subAccount);
}
}
}
return ret;
}
function getCategorizedAccounts(allAccounts) {
const ret = {};
@@ -272,11 +301,22 @@ function getCategorizedAccounts(allAccounts) {
const account = allAccounts[i];
if (!ret[account.category]) {
ret[account.category] = [];
const categoryInfo = getCategoryInfo(account.category);
if (categoryInfo) {
ret[account.category] = {
category: account.category,
name: categoryInfo.name,
icon: categoryInfo.defaultAccountIconId,
accounts: []
};
}
}
const accountList = ret[account.category];
accountList.push(account);
if (ret[account.category]) {
const accountList = ret[account.category].accounts;
accountList.push(account);
}
}
return ret;
@@ -288,7 +328,11 @@ function getAccountByAccountId(categorizedAccounts, accountId) {
continue;
}
const accountList = categorizedAccounts[category];
if (!categorizedAccounts[category].accounts) {
continue;
}
const accountList = categorizedAccounts[category].accounts;
for (let i = 0; i < accountList.length; i++) {
if (accountList[i].id === accountId) {
@@ -307,12 +351,12 @@ function getAllFilteredAccountsBalance(categorizedAccounts, accountFilter) {
for (let categoryIdx = 0; categoryIdx < allAccountCategories.length; categoryIdx++) {
const accountCategory = allAccountCategories[categoryIdx];
if (!categorizedAccounts[accountCategory.id]) {
if (!categorizedAccounts[accountCategory.id] || !categorizedAccounts[accountCategory.id].accounts) {
continue;
}
for (let accountIdx = 0; accountIdx < categorizedAccounts[accountCategory.id].length; accountIdx++) {
const account = categorizedAccounts[accountCategory.id][accountIdx];
for (let accountIdx = 0; accountIdx < categorizedAccounts[accountCategory.id].accounts.length; accountIdx++) {
const account = categorizedAccounts[accountCategory.id].accounts[accountIdx];
if (account.hidden || !accountFilter(account)) {
continue;
@@ -362,6 +406,8 @@ export default {
stringToArrayBuffer,
generateRandomString,
parseUserAgent,
getCategoryInfo,
getPlainAccounts,
getCategorizedAccounts,
getAccountByAccountId,
getAllFilteredAccountsBalance,
+32 -25
View File
@@ -119,7 +119,7 @@
</f7-card-header>
<f7-card-content class="no-safe-areas" :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"
<f7-list-item v-for="account in categorizedAccounts[accountCategory.id].accounts" v-show="showHidden || !account.hidden"
:key="account.id" :id="account | accountDomId"
:class="{ 'nested-list-item': true, 'has-child-list-item': account.type === $constants.account.allAccountTypes.MultiSubAccounts }"
:after="accountBalance(account) | currency(account.currency)"
@@ -195,7 +195,7 @@
export default {
data() {
return {
accounts: {},
categorizedAccounts: {},
loading: true,
showHidden: false,
sortable: false,
@@ -214,12 +214,12 @@ export default {
allAccountCount() {
let allAccountCount = 0;
for (let category in this.accounts) {
if (!Object.prototype.hasOwnProperty.call(this.accounts, category)) {
for (let category in this.categorizedAccounts) {
if (!Object.prototype.hasOwnProperty.call(this.categorizedAccounts, category)) {
continue;
}
allAccountCount += this.accounts[category].length;
allAccountCount += this.categorizedAccounts[category].accounts.length;
}
return allAccountCount;
@@ -228,12 +228,12 @@ export default {
let allAccountCount = 0;
let shownAccountCount = 0;
for (let category in this.accounts) {
if (!Object.prototype.hasOwnProperty.call(this.accounts, category)) {
for (let category in this.categorizedAccounts) {
if (!Object.prototype.hasOwnProperty.call(this.categorizedAccounts, category)) {
continue;
}
const accountList = this.accounts[category];
const accountList = this.categorizedAccounts[category].accounts;
for (let i = 0; i < accountList.length; i++) {
if (!accountList[i].hidden) {
@@ -257,7 +257,9 @@ export default {
for (let i = 0; i < allAccountCategories.length; i++) {
const accountCategory = allAccountCategories[i];
if (this.$utilities.isArray(this.accounts[accountCategory.id]) && this.accounts[accountCategory.id].length) {
if (this.categorizedAccounts[accountCategory.id] &&
this.$utilities.isArray(this.categorizedAccounts[accountCategory.id].accounts) &&
this.categorizedAccounts[accountCategory.id].accounts.length) {
usedAccountCategories.push(accountCategory);
}
}
@@ -269,7 +271,7 @@ export default {
return '***';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, () => true);
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.categorizedAccounts, () => true);
let netAssets = 0;
let hasUnCalculatedAmount = false;
@@ -299,7 +301,7 @@ export default {
return '***';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, account => account.isAsset);
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.categorizedAccounts, account => account.isAsset);
let totalAssets = 0;
let hasUnCalculatedAmount = false;
@@ -329,7 +331,7 @@ export default {
return '***';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, account => account.isLiability);
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.categorizedAccounts, account => account.isLiability);
let totalLiabilities = 0;
let hasUnCalculatedAmount = false;
@@ -370,7 +372,7 @@ export default {
return;
}
self.accounts = self.$utilities.getCategorizedAccounts(data.result);
self.categorizedAccounts = self.$utilities.getCategorizedAccounts(data.result);
self.loading = false;
}).catch(error => {
self.$logger.error('failed to load account list', error);
@@ -413,7 +415,7 @@ export default {
return;
}
self.accounts = self.$utilities.getCategorizedAccounts(data.result);
self.categorizedAccounts = self.$utilities.getCategorizedAccounts(data.result);
}).catch(error => {
self.$logger.error('failed to reload account list', error);
@@ -429,14 +431,16 @@ export default {
});
},
hasShownAccount(accountCategory) {
if (!this.accounts[accountCategory.id].length) {
if (!this.categorizedAccounts[accountCategory.id] ||
!this.categorizedAccounts[accountCategory.id].accounts ||
!this.categorizedAccounts[accountCategory.id].accounts.length) {
return false;
}
let shownCount = 0;
for (let i = 0; i < this.accounts[accountCategory.id].length; i++) {
const account = this.accounts[accountCategory.id][i];
for (let i = 0; i < this.categorizedAccounts[accountCategory.id].accounts.length; i++) {
const account = this.categorizedAccounts[accountCategory.id].accounts[i];
if (!account.hidden) {
shownCount++;
@@ -465,7 +469,7 @@ export default {
return '***';
}
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.accounts, account => account.category === accountCategory.id);
const accountsBalance = this.$utilities.getAllFilteredAccountsBalance(this.categorizedAccounts, account => account.category === accountCategory.id);
let totalBalance = 0;
let hasUnCalculatedAmount = false;
@@ -506,14 +510,17 @@ export default {
}
const id = event.el.id.substr(8); // account_
const account = this.$utilities.getAccountByAccountId(this.accounts, id);
const account = this.$utilities.getAccountByAccountId(this.categorizedAccounts, id);
if (!account || !this.accounts[account.category] || !this.accounts[account.category][event.to]) {
if (!account ||
!this.categorizedAccounts[account.category] ||
!this.categorizedAccounts[account.category].accounts ||
!this.categorizedAccounts[account.category].accounts[event.to]) {
this.$toast('Unable to move account');
return;
}
const accountList = this.accounts[account.category];
const accountList = this.categorizedAccounts[account.category].accounts;
accountList.splice(event.to, 0, accountList.splice(event.from, 1)[0]);
this.displayOrderModified = true;
@@ -530,12 +537,12 @@ export default {
self.displayOrderSaving = true;
for (let category in self.accounts) {
if (!Object.prototype.hasOwnProperty.call(self.accounts, category)) {
for (let category in self.categorizedAccounts) {
if (!Object.prototype.hasOwnProperty.call(self.categorizedAccounts, category)) {
continue;
}
const accountList = self.accounts[category];
const accountList = self.categorizedAccounts[category].accounts;
for (let i = 0; i < accountList.length; i++) {
newDisplayOrders.push({
@@ -650,7 +657,7 @@ export default {
}
app.swipeout.delete($$(`#${self.$options.filters.accountDomId(account)}`), () => {
const accountList = self.accounts[account.category];
const accountList = self.categorizedAccounts[account.category].accounts;
for (let i = 0; i < accountList.length; i++) {
if (accountList[i].id === account.id) {
accountList.splice(i, 1);
+35 -48
View File
@@ -144,36 +144,40 @@
<f7-list-item
class="transaction-edit-account"
link="#"
:class="{ 'disabled': !plainAllAccounts.length }"
:class="{ 'disabled': !allAccounts.length }"
:header="$t(sourceAccountName)"
:title="transaction.sourceAccountId | accountName(plainAllAccounts)"
:title="transaction.sourceAccountId | accountName(allAccounts)"
@click="transaction.showSourceAccountSheet = true"
>
<list-item-selection-sheet value-type="item"
key-field="id" value-field="id" title-field="name"
icon-field="icon" icon-type="account" color-field="color"
:items="plainAllAccounts"
:show.sync="transaction.showSourceAccountSheet"
v-model="transaction.sourceAccountId">
</list-item-selection-sheet>
<two-column-list-item-selection-sheet primary-key-field="id" primary-value-field="category" primary-title-field="name"
primary-icon-field="icon" primary-icon-type="account" :primary-title-i18n="true"
primary-sub-items-field="accounts"
secondary-key-field="id" secondary-value-field="id" secondary-title-field="name"
secondary-icon-field="icon" secondary-icon-type="account" secondary-color-field="color"
:items="categoriedAccounts"
:show.sync="transaction.showSourceAccountSheet"
v-model="transaction.sourceAccountId">
</two-column-list-item-selection-sheet>
</f7-list-item>
<f7-list-item
class="transaction-edit-account"
link="#"
:class="{ 'disabled': !plainAllAccounts.length }"
:class="{ 'disabled': !allAccounts.length }"
:header="$t('Destination Account')"
:title="transaction.destinationAccountId | accountName(plainAllAccounts)"
:title="transaction.destinationAccountId | accountName(allAccounts)"
v-if="transaction.type === $constants.transaction.allTransactionTypes.Transfer"
@click="transaction.showDestinationAccountSheet = true"
>
<list-item-selection-sheet value-type="item"
key-field="id" value-field="id" title-field="name"
icon-field="icon" icon-type="account" color-field="color"
:items="plainAllAccounts"
:show.sync="transaction.showDestinationAccountSheet"
v-model="transaction.destinationAccountId">
</list-item-selection-sheet>
<two-column-list-item-selection-sheet primary-key-field="id" primary-value-field="category" primary-title-field="name"
primary-icon-field="icon" primary-icon-type="account" :primary-title-i18n="true"
primary-sub-items-field="accounts"
secondary-key-field="id" secondary-value-field="id" secondary-title-field="name"
secondary-icon-field="icon" secondary-icon-type="account" secondary-color-field="color"
:items="categoriedAccounts"
:show.sync="transaction.showDestinationAccountSheet"
v-model="transaction.destinationAccountId">
</two-column-list-item-selection-sheet>
</f7-list-item>
<f7-list-input
@@ -247,6 +251,7 @@ export default {
showDestinationAccountSheet: false
},
allAccounts: [],
categoriedAccounts: [],
allCategories: {},
allTags: [],
loading: true,
@@ -318,25 +323,6 @@ export default {
destinationAmountFontSize() {
return this.getFontSizeByAmount(this.transaction.destinationAmount);
},
plainAllAccounts() {
const ret = [];
for (let i = 0; i < this.allAccounts.length; i++) {
const account = this.allAccounts[i];
if (account.type === this.$constants.account.allAccountTypes.SingleAccount) {
ret.push(account);
continue;
}
for (let j = 0; j < account.subAccounts.length; j++) {
const subAccount = account.subAccounts[j];
ret.push(subAccount);
}
}
return ret;
},
inputIsEmpty() {
return !!this.inputEmptyProblemMessage;
},
@@ -351,13 +337,13 @@ export default {
} else if (this.transaction.type === this.$constants.transaction.allTransactionTypes.Transfer) {
let sourceAccount, destinationAccount = null;
for (let i = 0; i < this.plainAllAccounts.length; i++) {
if (this.plainAllAccounts[i].id === this.transaction.sourceAccountId) {
sourceAccount = this.plainAllAccounts[i];
for (let i = 0; i < this.allAccounts.length; i++) {
if (this.allAccounts[i].id === this.transaction.sourceAccountId) {
sourceAccount = this.allAccounts[i];
}
if (this.plainAllAccounts[i].id === this.transaction.destinationAccountId) {
destinationAccount = this.plainAllAccounts[i];
if (this.allAccounts[i].id === this.transaction.destinationAccountId) {
destinationAccount = this.allAccounts[i];
}
if (sourceAccount && destinationAccount) {
@@ -418,11 +404,11 @@ export default {
}
Promise.all(promises).then(function (responses) {
const accountDta = responses[0].data;
const accountData = responses[0].data;
const categoryData = responses[1].data;
const tagData = responses[2].data;
if (!accountDta || !accountDta.success || !accountDta.result) {
if (!accountData || !accountData.success || !accountData.result) {
self.$toast('Unable to get account list');
router.back();
return;
@@ -446,7 +432,8 @@ export default {
return;
}
self.allAccounts = accountDta.result;
self.allAccounts = self.$utilities.getPlainAccounts(accountData.result);
self.categoriedAccounts = self.$utilities.getCategorizedAccounts(self.allAccounts);
self.allCategories = categoryData.result;
self.allTags = tagData.result;
@@ -465,9 +452,9 @@ export default {
self.transaction.transferCategory = self.getFirstAvailableCategoryId(self.allCategories[self.$constants.category.allCategoryTypes.Transfer]);
}
if (self.plainAllAccounts.length) {
self.transaction.sourceAccountId = self.plainAllAccounts[0].id;
self.transaction.destinationAccountId = self.plainAllAccounts[0].id;
if (self.allAccounts.length) {
self.transaction.sourceAccountId = self.allAccounts[0].id;
self.transaction.destinationAccountId = self.allAccounts[0].id;
}
if (self.editTransactionId) {