TextComponent.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <v-textarea
  3. :value="data"
  4. :label="$t(label_field)"
  5. @change="update"
  6. :rules="rules"
  7. :disabled="readOnly"
  8. ></v-textarea>
  9. </template>
  10. <script lang="ts">
  11. import {computed, defineComponent, toRef} from '@nuxtjs/composition-api'
  12. import {useRepositoryHelper} from "~/use/store/useRepository";
  13. import {Repository} from "@vuex-orm/core";
  14. import {Model} from "~/models/Model";
  15. export default defineComponent({
  16. props: {
  17. repository: {
  18. type: Object as () => Repository<Model>,
  19. required: true
  20. },
  21. entry:{
  22. type: Object,
  23. required: true
  24. },
  25. field: {
  26. type: String,
  27. required: true
  28. },
  29. label: {
  30. type: String,
  31. required: false
  32. },
  33. rules: {
  34. type: Array,
  35. required: false
  36. }
  37. },
  38. setup(props){
  39. const {label, field, repository } = props
  40. const entry = toRef(props, 'entry')
  41. const label_field = label ?? field;
  42. const data = computed(() => entry.value[field])
  43. const update = (newValue:string) => useRepositoryHelper.updateStoreFromField(repository, entry.value, newValue, field)
  44. const readOnly = computed(() => useRepositoryHelper.getReadOnly(repository))
  45. return {
  46. label_field,
  47. data,
  48. readOnly,
  49. update
  50. }
  51. }
  52. })
  53. </script>
  54. <style scoped>
  55. </style>