<template>
  <div class="radio-group-form">
    <el-form-item
      :key="item.model"
      :prop="item.model"
      :label="item.label || ''"
      :label-width="item.labelWidth || item['label-width'] || ''"
      :required="item.required || false"
      :rules="item.rules || []"
      :size="item.size"
    >
      <el-checkbox-group
        v-bind="item.attrs"
        v-on="$listeners"
        v-model="formData[item.model]"
        :style="{ width: item.modelWidth || item['model-width'] || '89%' }"
        :disabled="item.disabled || false"
      >
        <el-checkbox
          v-for="checkbox in item.values"
          :label="checkbox.value"
          :key="checkbox.value"
        >{{checkbox.label}}</el-checkbox>
      </el-checkbox-group>
    </el-form-item>
  </div>
</template>

<script>
export default {
  name: 'CheckboxGroupForm',
  componentName: 'CheckboxGroupForm',
  props: {
    item: {
      type: Object,
      default () {
        return {}
      }
    },
    formData: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  data () {
    return {}
  }
}
</script>
