import React,{PropTypes} from 'react';
import ReactDOM from 'react-dom';  
import cx from 'classnames';
import s from './form.scss';
import {Form,Input} from 'antd';
const FormItem = Form.Item;

class TextField extends React.Component {
    constructor(props) {
        super(props);   
        this.validateField=this.validateField.bind(this); 
        this.getHelp=this.getHelp.bind(this);
    }
    static propTypes = {  
        label:PropTypes.string,
        options:PropTypes.object,
        tabular:PropTypes.bool,
        field:PropTypes.object,
        addonBefore:PropTypes.string,
        addonAfter:PropTypes.string,
        help:PropTypes.string,
        inputStyle:PropTypes.object
    } 
    static defaultProps={ 
        tabular:false,
        addonBefore:null,
        addonAfter:null,
        help:'',
        inputStyle:{}
    }
    validateField(){
        const {field={}}=this.props; 
        if(field.error&&field.touched){
            return 'error';
        }else if(field.touched&&!field.error)
            return 'success';
        else{
            return null;
        }
    }
    getHelp(){
        const {help,field={}}=this.props;
        if(field.touched){
            return field.error;
        }else if(help){
            return help;
        }else{
            return "";
        }
    }
    render(){    
        const {label,options,name,tabular,field={},addonBefore,addonAfter,inputStyle}=this.props;
        // console.log('^&&^%&^%&^%&^%&^%&^',field)
        return( 
           <FormItem
                label={label}
                labelCol={{ span: 6 }}
                wrapperCol={{ span: tabular?24:14 }}
                required={options.is_required}
                validateStatus={this.validateField()}
                help={this.getHelp()} 
            >
              <Input  addonBefore={addonBefore} addonAfter={addonAfter} name={name} value={field.value} onChange={field.onChange} style={{display:'inline-block',...inputStyle}} placeholder={options.tooltip} size="default" />
            </FormItem>
        )
    }
}



export default TextField;