<template>
    <el-radio-group
        :value='value'
        :size='size'
        :fill='fill'
        :textColor='textColor'
        :disabled='disabled'
        @input='input'
    >
        <template v-if='parrent === "button"'>
            <el-radio-button
                v-for='item in data'
                :key='item[realProps.value]'
                :label='item[realProps.value]'
                :disabled='item[realProps.disabled]'
                :name='item.name'
            >{{item[realProps.label]}}</el-radio-button>
        </template>
        <template v-else>
            <el-radio
                v-for='item in data'
                :key='item[realProps.value]'
                :label='item[realProps.value]'
                :disabled='item[realProps.disabled]'
                :border='item.border'
                :size='item.size'
                :name='item.name'
            >{{item[realProps.label]}}</el-radio>
        </template>
    </el-radio-group>
</template>

<script>
import Radio from '@ued_fpi/element-ui/packages/radio';
import RadioButton from '@ued_fpi/element-ui/packages/radio-button';
import RadioGroup from '@ued_fpi/element-ui/packages/radio-group';
export default {
  name: 'ElDynamicRadio',
  props: {
    value: String,
    size: String,
    fill: String,
    textColor: String,
    disabled: Boolean,
    data: {
      type: Array,
      default() {
        return [];
      }
    },
    props: Object,
    parrent: String // 只区分el-radio和el-radio-button，只有当parrent为button时，使用el-radio-button
  },
  comments: {
    ElRadioGroup: RadioGroup,
    ElRadioButton: RadioButton,
    ElRadio: Radio
  },
  computed: {
    realProps() {
      return {
        label: 'label',
        value: 'value',
        disabled: 'disabled',
        ...this.props
      };
    }
  },
  methods: {
    input(val) {
      this.$emit('input', val);
    }
  }
};
</script>