<template>
  <label class="e-checkbox__item" :class="[{'e-checkbox__item--disabled':disabled}]">
    <span class="e-checkbox__item--box">
      <input type="checkbox" name="checkbox" :value="value" :disabled="disabled" v-model="checkedModels" @change="onChange" />
      <i class="e-font e-font-check"></i>
    </span>
    <span class="e-checkbox__item--text"><slot></slot></span>
  </label>
</template>
<script>
export default{
  name:'emmm-checkbox-item',
  data(){
    return {
      checkedModels: []
    }
  },
  props:{
    value: [String, Number],
    disabled: Boolean
  },
  methods: {
    onChange (event) {
      if (this.disabled) return
      this.$parent.change(this.checkedModels)
    }
  }
}
</script>
<style>
</style>
