<template>
    <div class="row bg-white padding-10 m-b-10 rounded">
        <div class="col-3 fs-12">{{data.created_at}}</div>
        <div class="col fs-12"><span v-html="data.description"></span> <a target=”_blank” v-if="[9,11].includes(data.type) " :href="route('transaction.credit_note.download', data.id)"><i class="fa fa-download fs-11 m-l-5 text-secondary hover-primary"></i></a></div>
        <div class="col-2 text-success text-center">{{[5, 9].includes(parseFloat(data.type)) ? formatValue(data.amount) : ''}}</div>
        <div class="col-2 text-danger text-center">{{[1, 11].includes(parseFloat(data.type)) ? '- ' + (formatValue(data.amount)) : ''}}</div>
        <div class="col-2 text-right">{{formatValue(data.running_balance)}}</div>
    </div> 
</template>
<script>
    import componentHandler from '../../../general/mixins/componentHandler';

    export default {
        props: {
            data: {
                required: true,
                type: Object
            },
            deciamls: {
                type: Number,
                required: true
            },
        },
        methods: {
            formatValue(value) {
                if (this.deciamls != 2) {
                    return (Math.round((parseFloat(value) + Number.EPSILON) * 100000) / 100000).toLocaleString('en-US', { minimumFractionDigits: 5, maximumFractionDigits: 5 });
                }

                return (Math.round((parseFloat(value) + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
            }
        },
        mixins: [componentHandler],
    }
</script>