import React,{Component} from 'react'
import {Checkbox as Checkbox1} from 'antd'
import FormItem from './FormItem'


const CheckboxGroup1 = Checkbox1.Group;


export  class Checkbox extends Component{
    onChange=e=>{
        this.props.onChange && this.props.onChange(e.target.checked)
        this.props.onAfterChange && this.props.onAfterChange(e.target.checked)
    }
    render()
    {
        return (<Checkbox1 {...this.props} onChange={this.onChange}/>)
    }
}

export  class CheckboxItem extends Component{
    constructor(props)
    {
        super(props)
        this.state = {hadBlur:false}
    }

    setBlur=()=>{
        if(!this.state.hadBlur)
            this.setState({hadBlur:true})
        this.props.onBlur && this.props.onBlur()
    }
    render()
    {
        const {InputProps,ItemProps,...res} = this.props
        const  help = (InputProps && InputProps.formBlur) || this.state.hadBlur ? InputProps.help :''
        return (
            <FormItem validateStatus={help?"error":null}  help={help} {...ItemProps}>
                <Checkbox {...InputProps} {...res} onBlur={this.setBlur}/>
            </FormItem>
        )
    }
}

export class CheckboxGroup extends Component{
    onChange=checkedValues=>{
        this.props.onChange && this.props.onChange(checkedValues)
        this.props.onAfterChange && this.props.onAfterChange(checkedValues)
    }
    render()
    {
        const {code,...rest} = this.props
        return (<CheckboxGroup1 {...rest} options={code} onChange={this.onChange}/>)
    }
}

export class CheckboxGroupItem  extends Component{
    constructor(props)
    {
        super(props)
        this.state = {hadBlur:false}
    }

    setBlur=()=>{
        if(!this.state.hadBlur)
            this.setState({hadBlur:true})
        this.props.onBlur && this.props.onBlur()
    }
    render()
    {
        const {InputProps,ItemProps} = this.props
        const  help = (InputProps && InputProps.formBlur) || this.state.hadBlur ? InputProps.help :''
        return (
            <FormItem validateStatus={help?"error":null}  help={help} {...ItemProps}>
                <CheckboxGroup {...InputProps} onBlur={this.setBlur}/>
            </FormItem>
        )
    }
}