import React from 'react';
/*import PropTypes from 'prop-types';*/
import on from '@common/images/icon-radio-active.png';
import off from '@common/images/icon-radio-default.png';
import disable from './img/disable.png';
import style from './index.less';

/**
 * 单选按钮
 * handleClick:点击触发按键 会将输入的props信息作为参数传入
 * isSelect:是否选中
 * label:右侧显示文字
 */
class Radio extends React.Component {
  constructor(props){
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick(id){
    const {handleClick} = this.props;
    handleClick&&handleClick(id);
  }

  getStyle(){
    if(this.props.display=='block'){
      return {
        display:'block',
        // marginBottom:'10px'
      }
    }
    return {
      display:'inline-block',
      /*marginLeft:'10px'*/
    }
  }

  render() {
    const {id,label,isSelect,disabled} = this.props;
    if(disabled){
      return (
        <div className={style['radio']}
             style={this.getStyle()}>
          <img src={isSelect?disable:off}/>
          <span style={{color:'#aaa'}}>{label}</span>
        </div>
      )
    }
    return (
      <div className={style['radio']}
           onClick={() =>this.handleClick(id)}
           style={this.getStyle()}>
        <img src={isSelect?on:off}/>
        <span>{label}</span>
      </div>
    )
  }
}

/*Radio.propTypes = {
    handleClick:PropTypes.func,
    isSelect:PropTypes.bool,
    name:PropTypes.string
};*/

export default Radio;
