import React, { Component } from 'react';
import {getImageUrl} from 'educoder';
import { Modal,Input} from 'antd';
import axios from 'axios';
import './../questioncss/questioncom.css'
//立即申请试用
class PaperDeletModel extends Component {

	constructor(props) {
		super(props);
		this.state={
			newkntypeinput:"",
			errores:false,
			errorestit:'',
			addonAfteronelens3:0,
		}
	}
	isNull=( str )=>{
		if ( str == "" ) return true;
		var regu = "^[ ]+$";
		var re = new RegExp(regu);
		//为空或纯空格为 true    有值为false
		console.log(re.test(str))
		return re.test(str);

	}
	handleChange=(e)=>{

		// this.setState({
		// 				newkntypeinput:	e.target.value
		// 			})
		// //console.log(e.target.value);
		// //console.log(e.target.value.length);

						this.setState({
							newkntypeinput:	e.target.value,
							addonAfteronelens3:e.target.value.length,
							errorestit:'',
							errores:false,
							boolred:false,
						})
		 this.props.setboolred(false);
		//
		
		// //console.log(e);
		//
		// if(e.target.value.length>0){
		// 	if(e.target.value.length>=16){
		// 		var result = e.target.value.substring(0,15);
		// 		this.setState({
		// 			newkntypeinput:	result
		// 		})
		// 	}
		// }
	};

	mysinputOnBlur=(e)=>{
		//console.log("失去焦点了");
	}

	inputOnFocus=(e)=>{
		//console.log("获取焦点");
	}

	NewknTypedeltyoedels=()=>{

		if(this.state.newkntypeinput.length===0){
			this.setState({
				errorestit:'请输入知识点',
				errores:true,
				boolred:true,
			})
			return
		}
		if(this.isNull(this.state.newkntypeinput)===true){
			this.setState({
				errorestit:'不能输入空格',
				errores:true,
				boolred:true,
			})
			return
		}
		this.props.NewknTypedeltyoedel(this.state.newkntypeinput)
	}
	render() {
    let{errores,errorestit,addonAfteronelens3}=this.state;
		return(
			<Modal
				keyboard={false}
				closable={false}
				footer={null}
				destroyOnClose={true}
				title="新增知识点"
				centered={true}
				visible={this.props.NewknTypedel===undefined?false:this.props.NewknTypedel}
				width="442px"
			>
				<div className="educouddiv">
					<style>
						{
							`
							.eduinpus .ant-input{
							  width: 310px !important;
							   border-right: 0px solid #FFFFff !important;
							}
							
							 body{
            width: 100%!important;
          }
							
							`
						}
					</style>
					<div className={this.props.boolred===true?"tabeltext-alignleft mt10 inpustred inpustredysl eduinpus":errores===true?"tabeltext-alignleft mt10 inpustred inpustredysl eduinpus":"tabeltext-alignleft mt10  eduinpus"}>
						<Input className={"eduinpus"} onInput={this.handleChange}  maxLength={15} onBlur={this.mysinputOnBlur } addonAfter={String(addonAfteronelens3)+"/15"} onFocus={this.inputOnFocus }/>
					</div>
					{
						errores===true?
							<p className={"xingcolor"}>{errorestit}</p>
							:""
					}
					<div className={errores===true?"clearfix mt10 edu-txt-center":"clearfix mt30 edu-txt-center"}>
						<a className="task-btn mr30 w80" onClick={()=>this.props.NewknTypedeldel(false)}>取消</a>
						<a className="task-btn task-btn-orange w80" onClick={	()=>this.NewknTypedeltyoedels()}>确定</a>
					</div>
				</div>
			</Modal>
		)
	}
}

export default PaperDeletModel;
