import React from 'react'
import style from './index.less'
import PropTypes from 'prop-types'

class Item extends React.Component{
    getClazz(){
        if(this.props.value>this.props.max){
            return `${style.item} ${style.gray}`
        }
        if(this.props.value===this.props.select){
            return `${style.item} ${style.active}`
        }
        return style.item;
    }

    handleClick(){
        if(this.props.value<=this.props.max){
            this.props.handleClick(this.props.value);
        }
    }

    render(){
        return (
            <div className={this.getClazz()} onClick={()=>this.handleClick()}>{`${this.props.value}年`}</div>
        )
    }
}


Item.propTypes={
    value:PropTypes.number,
    handleClick:PropTypes.func,
    select:PropTypes.number,
    max:PropTypes.number
};


export default Item;