Text.vue 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <!--
  2. Champs de saisie de texte
  3. @see https://vuetifyjs.com/en/components/text-fields/
  4. -->
  5. <template>
  6. <v-text-field
  7. autocomplete="off"
  8. :value="data"
  9. :label="$t(label_field)"
  10. :rules="rules"
  11. :disabled="readonly"
  12. :type="type"
  13. :error="error"
  14. :error-messages="errorMessage"
  15. @change="$emit('update', $event, field)"
  16. />
  17. </template>
  18. <script lang="ts">
  19. import { defineComponent } from '@nuxtjs/composition-api'
  20. export default defineComponent({
  21. props: {
  22. label: {
  23. type: String,
  24. required: false,
  25. default: null
  26. },
  27. field: {
  28. type: String,
  29. required: false,
  30. default: null
  31. },
  32. type: {
  33. type: String,
  34. required: false,
  35. default: null
  36. },
  37. data: {
  38. type: [String, Number],
  39. required: false,
  40. default: null
  41. },
  42. readonly: {
  43. type: Boolean,
  44. required: false
  45. },
  46. rules: {
  47. type: Array,
  48. required: false,
  49. default: () => []
  50. },
  51. error: {
  52. type: Boolean,
  53. required: false
  54. },
  55. errorMessage: {
  56. type: String,
  57. required: false,
  58. default: null
  59. }
  60. },
  61. setup (props) {
  62. return {
  63. label_field: props.label ?? props.field
  64. }
  65. }
  66. })
  67. </script>
  68. <style>
  69. input:read-only{
  70. color: #666 !important;
  71. }
  72. </style>