<!--
Case à cocher

@see https://vuetifyjs.com/en/components/checkboxes/
-->

<template>
  <v-container
    class="px-0"
    fluid
  >
    <v-checkbox
      :value="data"
      :label="$t(label_field)"
      :disabled="readonly"
      @change="$emit('update', $event, field)"
    />
  </v-container>
</template>

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

export default defineComponent({
  props: {
    field: {
      type: String,
      required: false,
      default: null
    },
    label: {
      type: String,
      required: false,
      default: ''
    },
    data: {
      type: Boolean,
      required: false
    },
    readonly: {
      type: Boolean,
      required: false
    }
  },
  setup (props) {
    return {
      label_field: props.label ?? props.field
    }
  }
})
</script>

<style scoped>
</style>
