app_vue2/components/Ui/Input/Text.vue

<template>
    <v-text-field
      :value="data"
      :label="$t(label_field)"
      @change="$emit('update', $event, field)"
      :rules="rules"
      :disabled="readOnly"
      :type="type"
      :error="error"
      :error-messages="errorMessage"
    >
    </v-text-field>
</template>

<script lang="ts">
  import {defineComponent} from '@nuxtjs/composition-api'

  export default defineComponent({
    props: {
      label:{
        type: String,
        required: false
      },
      field:{
        type: String,
        required: false
      },
      type:{
        type: String,
        required: false
      },
      data: {
        type: [String, Number],
        required: false
      },
      readOnly: {
        type: Boolean,
        required: false
      },
      rules:{
        type: Array,
        required: false
      },
      error:{
        type: Boolean,
        required: false
      },
      errorMessage:{
        type: String,
        required: false
      }
    },
    setup(props){
      return {
        label_field : props.label ?? props.field
      }
    }
  })
</script>

<style>
  input:read-only{
    color: #666 !important;
  }
</style>