exchange-2.0/resources/assets/vue/components/banks/elements/BankInComponent.vue

<template>
    <div class="row align-items-center">
        <div class="col">
            <div class="row m-b-5">
                <div class="col">
                    <div class="font-heading fs-10 muted all-caps">Bank In Amount</div>
                    <div class="font-heading fs-14">
                        <span class="text-success bold">{{(Math.round((item.original_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}} {{item.original_currency.short_code}}</span>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="font-heading all-caps fs-10 bold">{{item.recipient_bank_account.holder_name}}</div>
                </div>
            </div>
            <div class="row">
                <div class="col">
                    <div class="font-heading all-caps fs-10 bold">{{item.recipient_bank_account.bank_name}}<span class="m-l-5">({{item.recipient_bank_account.bank_branch}})</span>: <span class="text-primary">{{item.recipient_bank_account.type === 3 ? item.recipient_bank_account.account_no : item.recipient_bank_account.account_no.replace(/[^\dA-Z]/g, '').replace(/(.{4})/g, '$1 ').trim() }}</span></div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import componentHandler from '../../../general/mixins/componentHandler';
    export default {
        props: {
            section: {
                default: 'banksSection'
            }
        },
        mixins: [componentHandler]
    }
</script>