<template>
  <el-radio-group
    v-model="localRadioValue"
    @change="changeRadio"
  >
    <template v-for="item in radioList">
      <el-radio
        v-if="type === 'el-radio'"
        :key="item.id"
        :label="item.id"
        :disabled="item.disabled"
      >{{ item.label }}</el-radio>
      <el-radio-button
        v-if="type === 'el-radio-button'"
        :key="item.id"
        :label="item.id"
        :disabled="item.disabled"
      >{{ item.label }}</el-radio-button>
    </template>
  </el-radio-group>
</template>

<script>
export default {
  name: 'PsRadio',
  props: {
    dubbleClick: {
      type: Boolean,
      default: false
    },
    radioList: {
      require: true,
      type: Array,
      default: () => {
        return []
      }
    },
    valueName: {
      type: Object,
      default: () => {
        return {}
      }
    },
    type: {
      type: String,
      default: 'el-radio'
    }
  },
  watch: {
    //动态属性
    valueName: {
      handler(val) {
        this.localValueName = val
      },
      deep: true,
      immediate: true
    },
    //radio列表数组
    radioList: {
      handler(val) {
        //当传入动态属性时把传入的radio对象的key改为{id:'',label:''}形式
        if (this.localValueName) {
          let keyMap = {}
          for (let key in this.localValueName) {
            keyMap[this.localValueName[key]] = key
          }
          for (var i = 0; i < val.length; i++) {
            let obj = val[i]
            for (var key in obj) {
              let newKey = keyMap[key]
              if (newKey) {
                obj[newKey] = obj[key]
                delete obj[key]
              }
            }
          }
          this.localRadioValue = val[0].id
          this.$emit('changeRadio', this.localRadioValue)
        } else {
          //没有传入动态属性时默认radio对象形式默认就是{id:'',label:''}形式
          this.localRadioValue = val[0].id
          this.$emit('changeRadio', this.localRadioValue)
        }
      },
      deep: true,
      immediate: true
    }
  },
  data() {
    return {
      //组件内部radio选中绑定的值
      localRadioValue: '',
      //本地拓展属性
      localValueName: '',
      //本地列表数组
      localRadioList: []
    }
  },
  created() {},
  mounted() {},
  methods: {
    handleChangeitem() {
      // // 双击取消radio选中
      // if (this.dubbleClick) {
      //   e.id == this.localRadioValue
      //     ? (this.localRadioValue = "")
      //     : (this.localRadioValue = e.id);
      //   this.$emit("changeRadio", this.localRadioValue);
      // } else {
      //   this.localRadioValue = e.id
      //   this.$emit("changeRadio", this.localRadioValue);
      // }
    },
    changeRadio(val) {
      //切换raido时改变绑定的数据
      this.$emit('changeRadio', val)
    }
  }
}
</script>

<style>
</style>
