<common-input :inputValue="product.price" v-model="product.price" v-validate="'required'" name="price"></common-input>

<template>
    <input type="text" :id="id" class="form-control" v-model="value" @keyup="checkData">
</template>
<script>
    const {unformat} = require('number-currency-format');
    import axiosGetPost from '../../helper/axiosGetPostCommon';

    export default {
        extends: axiosGetPost,
        props: ['id','inputValue'],
        data() {
            return {
                value: ''
            }
        },
        mounted() {
        },
        watch: {
            value: function (newVal) {
                this.processData(newVal);
            },
        },
        created() {
            this.editData();
        },
        methods: {
            editData(){
                let instance = this;
                if (this.inputValue) {
                    this.value = instance.numberFormat(this.inputValue);
                    let check = this.value.search(this.currencySymbol);
                    this.value = this.value.slice(check);
                }
            },
            checkData(value) {
                let formattedNumber = '';
                if (this.value && this.value != this.currencySymbol) {
                    formattedNumber = unformat(this.value, {
                        thousandSeparator: this.thousandSeparator,
                        decimalSeparator: this.decimalSeparator,
                    });
                }

                this.$emit('input', formattedNumber);
            },
            processData(newVal) {
                let allowChar, check, checkDecimalSep;

                if (this.thousandSeparator === "space") this.thousandSeparator = ' ';

                allowChar = new RegExp("[^0-9b" + this.thousandSeparator + this.decimalSeparator + "b]", "is");
                this.$set(this, 'value', newVal.replace(allowChar, ''));
                check = this.value.substring(0, 1);

                if (check == this.decimalSeparator || check == this.thousandSeparator) this.value = this.value.substring(1);

                let currentChar = newVal.slice(-1);
                if (currentChar == this.thousandSeparator || currentChar == this.currencySymbol || currentChar == this.decimalSeparator) {

                    checkDecimalSep = newVal.split(this.decimalSeparator).length - 1;

                    if (checkDecimalSep > 1) {
                        this.value = this.value.substring(0, this.value.length - 1);
                    }
                }
            }
        }
    }

</script>