support hiding transaction amount

src/lib/services.js

@@ -258,7 +258,7 @@ export default {
     getTransaction: ({ id }) => {
         return axios.get(`v1/transactions/get.json?id=${id}&trim_account=true&trim_category=true&trim_tag=true`);
     },
-    addTransaction: ({ type, categoryId, time, sourceAccountId, destinationAccountId, sourceAmount, destinationAmount, tagIds, comment, utcOffset }) => {
+    addTransaction: ({ type, categoryId, time, sourceAccountId, destinationAccountId, sourceAmount, destinationAmount, hideAmount, tagIds, comment, utcOffset }) => {
         return axios.post('v1/transactions/add.json', {
             type,
             categoryId,
@@ -267,12 +267,13 @@ export default {
             destinationAccountId,
             sourceAmount,
             destinationAmount,
+            hideAmount,
             tagIds,
             comment,
             utcOffset
         });
     },
-    modifyTransaction: ({ id, type, categoryId, time, sourceAccountId, destinationAccountId, sourceAmount, destinationAmount, tagIds, comment, utcOffset }) => {
+    modifyTransaction: ({ id, type, categoryId, time, sourceAccountId, destinationAccountId, sourceAmount, destinationAmount, hideAmount, tagIds, comment, utcOffset }) => {
         return axios.post('v1/transactions/modify.json', {
             id,
             type,
@@ -282,6 +283,7 @@ export default {
             destinationAccountId,
             sourceAmount,
             destinationAmount,
+            hideAmount,
             tagIds,
             comment,
             utcOffset

src/locales/en.js

@@ -787,6 +787,8 @@ export default {
     'Income Amount': 'Income Amount',
     'Transfer Out Amount': 'Transfer Out Amount',
     'Transfer In Amount': 'Transfer In Amount',
+    'Show Amount': 'Show Amount',
+    'Hide Amount': 'Hide Amount',
     'Category': 'Category',
     'Account': 'Account',
     'Source Account': 'Source Account',

src/locales/zh_Hans.js

@@ -787,6 +787,8 @@ export default {
     'Income Amount': '收入金额',
     'Transfer Out Amount': '转出金额',
     'Transfer In Amount': '转入金额',
+    'Show Amount': '显示金额',
+    'Hide Amount': '隐藏金额',
     'Category': '分类',
     'Account': '账户',
     'Source Account': '来源账户',

src/views/mobile/transactions/Edit.vue

@@ -4,6 +4,7 @@
             <f7-nav-left :back-link="$t('Back')"></f7-nav-left>
             <f7-nav-title :title="$t(title)"></f7-nav-title>
             <f7-nav-right>
+                <f7-link icon-f7="ellipsis" @click="showMoreActionSheet = true" v-if="mode !== 'view'"></f7-link>
                 <f7-link :class="{ 'disabled': inputIsEmpty || submitting }" :text="$t(saveButtonTitle)" @click="save" v-if="mode !== 'view'"></f7-link>
             </f7-nav-right>
 
@@ -47,7 +48,7 @@
                         :class="{ 'color-theme-teal': transaction.type === $constants.transaction.allTransactionTypes.Expense, 'color-theme-red': transaction.type === $constants.transaction.allTransactionTypes.Income }"
                         :style="{ fontSize: sourceAmountFontSize + 'px' }"
                         :header="$t(sourceAmountName)"
-                        :title="transaction.sourceAmount | currency"
+                        :title="transaction.sourceAmount | finalAmount(transaction.hideAmount) | currency"
                         @click="showSourceAmountSheet = true"
                     >
                         <number-pad-sheet :min-value="$constants.transaction.minAmount"
@@ -62,7 +63,7 @@
                         link="#" no-chevron
                         :style="{ fontSize: destinationAmountFontSize + 'px' }"
                         :header="$t('Transfer In Amount')"
-                        :title="transaction.destinationAmount | currency"
+                        :title="transaction.destinationAmount | finalAmount(transaction.hideAmount) | currency"
                         @click="showDestinationAmountSheet = true"
                         v-if="transaction.type === $constants.transaction.allTransactionTypes.Transfer"
                     >
@@ -254,6 +255,16 @@
             </f7-card-content>
         </f7-card>
 
+        <f7-actions close-by-outside-click close-on-escape :opened="showMoreActionSheet" @actions:closed="showMoreActionSheet = false">
+            <f7-actions-group>
+                <f7-actions-button v-if="transaction.hideAmount" @click="transaction.hideAmount = false">{{ $t('Show Amount') }}</f7-actions-button>
+                <f7-actions-button v-if="!transaction.hideAmount" @click="transaction.hideAmount = true">{{ $t('Hide Amount') }}</f7-actions-button>
+            </f7-actions-group>
+            <f7-actions-group>
+                <f7-actions-button bold close>{{ $t('Cancel') }}</f7-actions-button>
+            </f7-actions-group>
+        </f7-actions>
+
         <f7-toolbar tabbar bottom v-if="mode !== 'view'">
             <f7-link :class="{ 'disabled': inputIsEmpty || submitting }" @click="save">
                 {{ $t(saveButtonTitle) }}
@@ -294,6 +305,7 @@ export default {
                 destinationAccountId: '',
                 sourceAmount: 0,
                 destinationAmount: 0,
+                hideAmount: false,
                 tagIds: [],
                 comment: ''
             },
@@ -301,6 +313,7 @@ export default {
             loadingError: null,
             submitting: false,
             showAccountBalance: self.$settings.isShowAccountBalance(),
+            showMoreActionSheet: false,
             showSourceAmountSheet: false,
             showDestinationAmountSheet: false,
             showCategorySheet: false,
@@ -659,6 +672,7 @@ export default {
                     self.transaction.destinationAmount = transaction.destinationAmount;
                 }
 
+                self.transaction.hideAmount = transaction.hideAmount;
                 self.transaction.tagIds = transaction.tagIds || [];
                 self.transaction.comment = transaction.comment;
             }
@@ -697,6 +711,7 @@ export default {
                 sourceAmount: self.transaction.sourceAmount,
                 destinationAccountId: '0',
                 destinationAmount: 0,
+                hideAmount: self.transaction.hideAmount,
                 tagIds: self.transaction.tagIds,
                 comment: self.transaction.comment,
                 utcOffset: self.transaction.utcOffset
@@ -802,6 +817,13 @@ export default {
         }
     },
     filters: {
+        finalAmount(amount, hideAmount) {
+            if (hideAmount) {
+                return '***';
+            }
+
+            return amount;
+        },
         primaryCategoryName(categoryId, allCategories) {
             for (let i = 0; i < allCategories.length; i++) {
                 for (let j = 0; j < allCategories[i].subCategories.length; j++) {

src/views/mobile/transactions/List.vue

@@ -329,8 +329,8 @@
                                 </div>
                                 <div slot="after" class="transaction-amount" v-if="transaction.sourceAccount"
                                      :class="{ 'text-color-teal': transaction.type === $constants.transaction.allTransactionTypes.Expense, 'text-color-red': transaction.type === $constants.transaction.allTransactionTypes.Income }">
-                                    <span v-if="!query.accountId || query.accountId === '0' || (transaction.sourceAccount && transaction.sourceAccount.id === query.accountId)">{{ transaction.sourceAmount | currency(transaction.sourceAccount.currency) }}</span>
-                                    <span v-else-if="query.accountId && query.accountId !== '0' && transaction.destinationAccount && transaction.destinationAccount.id === query.accountId">{{ transaction.destinationAmount | currency(transaction.destinationAccount.currency) }}</span>
+                                    <span v-if="!query.accountId || query.accountId === '0' || (transaction.sourceAccount && transaction.sourceAccount.id === query.accountId)">{{ transaction.sourceAmount | finalAmount(transaction.hideAmount) | currency(transaction.sourceAccount.currency) }}</span>
+                                    <span v-else-if="query.accountId && query.accountId !== '0' && transaction.destinationAccount && transaction.destinationAccount.id === query.accountId">{{ transaction.destinationAmount | finalAmount(transaction.hideAmount) | currency(transaction.destinationAccount.currency) }}</span>
                                 </div>
                                 <f7-swipeout-actions right>
                                     <f7-swipeout-button color="primary" close
@@ -840,6 +840,13 @@ export default {
         }
     },
     filters: {
+        finalAmount(amount, hideAmount) {
+            if (hideAmount) {
+                return '***';
+            }
+
+            return amount;
+        },
         transactionTypeName(type, allTransactionTypes) {
             if (type === allTransactionTypes.Income) {
                 return 'Income';