<script setup>
import { ref, watch } from 'vue';
import { QInput } from 'quasar';

const props = defineProps({
    modelValue: {
        type: String,
        default: '',
    },
});

const emit = defineEmits(['update:modelValue', 'accountShortToStandard']);

let internalValue = ref(props.modelValue);

watch(
    () => props.modelValue,
    (newVal) => {
        internalValue.value = newVal;
    }
);

watch(
    () => internalValue.value,
    (newVal) => {
        emit('update:modelValue', newVal);
        accountShortToStandard();
    }
);

function accountShortToStandard() {
    internalValue.value = internalValue.value.replace(
        '.',
        '0'.repeat(11 - internalValue.value.length)
    );
}
</script>

<template>
    <q-input v-model="internalValue" />
</template>
