app_vue2/components/Form/Input/CheckboxComponent.vue

<template>
  <v-container
    class="px-0"
    fluid
  >
    <v-checkbox
      :value="data"
      :label="$t(label_field)"
      @change="update"
      :disabled="readOnly"
    ></v-checkbox>
  </v-container>
</template>

<script lang="ts">
  import {computed, defineComponent, toRef} from '@nuxtjs/composition-api'
  import {useRepositoryHelper} from "~/use/store/useRepository";
  import {Repository} from "@vuex-orm/core";
  import {Model} from "~/models/Model";

  export default defineComponent({
    props: {
      repository: {
        type: Object as () => Repository<Model>,
        required: true
      },
      entry:{
        type: Object,
        required: true
      },
      field: {
        type: String,
        required: true
      },
      label: {
        type: String,
        required: false
      }
    },
    setup(props){
      const {label, field, repository } = props
      const entry = toRef(props, 'entry')

      const label_field = label ?? field;

      const data = computed(() => entry.value[field])
      const update = (newValue:string) => useRepositoryHelper.updateStoreFromField(repository, entry.value, newValue, field)
      const readOnly = computed(() => useRepositoryHelper.getReadOnly(repository))

      return {
        label_field,
        readOnly,
        data,
        update
      }
    }
  })
</script>

<style scoped>
</style>