app_vue2/components/Ui/Input/Text.vue

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