<template>
  <div>
    <WlPic
      v-if="selectImg && isSelect"
      :src="selectImg"
      class="select-img"
      :style="selectImgStyle"
    ></WlPic>
    <WlRadioIcon
      v-else
      :isChoosed="isSelect"
      v-bind="$attrs"
      :style="[`background-color: ${isSelect ? themeColor : unSelectColor}`, iconStyleExtra]"
      class="single-radio"
      @onClick="$emit('onClick')"
    />
  </div>
</template>

<script>
/*
 * @Author: yangxin
 * @Date: 2021-09-18 15:37:45
 * @Last Modified by: yangxin
 * @Last Modified time: 2022-07-21 16:19:09
 */
import WlPic from "@packages/components/Common/WlPic/src/index.vue";
import WlRadioIcon from "@packages/components/Common/WlRadioIcon/src/index.vue";
export default {
  name: "SingleRadio",
  components: { WlRadioIcon, WlPic },
  props: {
    isSelect: {
      type: Boolean,
      default: false,
    },
    themeColor: {
      type: String,
      default: "#1C9FFF",
    },
    unSelectColor: {
      type: String,
      default: "rgba(0,0,0,0.03)",
    },
    iconStyleExtra: {
      type: Object,
      default: () => {},
    },
    selectImg: {
      type: String,
      default: "",
    },
    selectImgStyle: {
      type: Object,
      default: () => {},
    },
  },
};
</script>
<style lang="scss" scoped>
.select-img {
  width: j(24);
  cursor: pointer;
  height: j(24);
}
.single-radio{
  cursor: pointer;
}
</style>
