import React, { PureComponent } from "react";
import style from "./index.less";
import Notify from '../Notify';
import config from '@config/index';
import {isIE,moveEnd} from '@utils/tools.js';
import {getFeature} from '@store/async-actions/fetchModules';
import {getAllDataList,getAllDataStringList,ifOtherClear,setFontColorSize} from "@utils/tools.js";
import store from '@store';
import $ from "jquery";
import {SET_CURRENT_MODULE} from '@types/homePage';
import {getMRAnalyse} from '@store/async-actions/pushMessage';

class BlockInp extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      timer:null,
      inpText:'',
    };
    this.$dom = React.createRef();
    this.handleInput = this.handleInput.bind(this);
    this.handleFocus = this.handleFocus.bind(this);
    //this.handleBlur = this.handleBlur.bind(this);
    this.handleKeydown = this.handleKeydown.bind(this);
    this.handleBlur = this.handleBlur.bind(this);
  }
  handleFocus(e){            //初始显示props中的值，focus已经显示输入的值，避免值更新闪烁
    const {boxMark,title,handlePush} = this.props;
    const state = store.getState()
    const moduleName = state.homePage.moduleName
    //黏贴时去掉html格式
    const that = this;
    let txt = '';
    $(this.$dom.current).on("paste",function(e){
      setTimeout(function(){
        txt = that.$dom.current.innerText||that.$dom.current.innerHTML;
        that.$dom.current.innerHTML = txt;
        moveEnd($(that.$dom.current)[0]);     //光标落到最后去
      });
    });
    handlePush&&handlePush({boxMark,isFocus:true,state});    //主诉、现病史空白聚焦推送
    if(moduleName != title) {
      store.dispatch({
        type: SET_CURRENT_MODULE,
        moduleName:title
      })
      store.dispatch(getMRAnalyse())
    }


  }
  handleInput(e){
    const {handleInput,handlePush,boxMark} = this.props;
    const text = e.target.innerText || e.target.innerHTML.replace(/&nbsp;+/g,' ').replace(/<br>$/,'');
    // console.log(text,999999999999)
    const stimer = this.state.timer;//console.log(e.target,text)
    this.setState({
      inpText:text,
    })

    //存值到store  FF26 会有一个<br>
    handleInput&&handleInput({text:text.replace('<br>',''),boxMark});
    //右侧推送--延时推送
    clearTimeout(stimer);
    let timer = setTimeout(function(){
      handlePush&&handlePush({boxMark});
      clearTimeout(stimer);
    },config.delayPushTime);
    this.setState({
      timer
    });
  }
  handleBlur(e){
    //解除绑定事件
    $(this.$dom.current).off("paste");
  }
  handleKeydown(e){
    const ev = e||window.event;
    if(ev.keyCode==13){return false;}
  }
  componentWillReceiveProps(next){
    const isRead = this.props.isRead;
    if(next.isRead != isRead){    //value对比解决复诊不显示bug,复诊对比解决关标跳到前面bug
      this.$dom.current.innerHTML = next.value||'';   //ff26下不支持innerText，但ref会自动加上innerText属性，所以上面的判断不为空
      this.setState({
        inpText: next.value
      });
    }
  }
  componentDidMount(){
    const {value} = this.props;
    if(value){
      //this.$dom.current.innerText?(this.$dom.current.innerText = value||''):(this.$dom.current.innerText=value||'');
      this.$dom.current.innerText=value||'';
    }
    if(isIE()){
      $(this.$dom.current).onIe8Input(function(e){
        this.handleInput(e)
      },this);
    }
  }
  render() {
    const { title,boxMark } = this.props;
    // console.log(this.props,'=============');
    return (
      <div className={style["box"]}>
        <div className={`${style["title"]} ${setFontColorSize(2,4)}`}>{title}</div>
        <div className={`${style["content"]} ${setFontColorSize(2,5)}`}
             onFocus={this.handleFocus}
             ref={this.$dom}
             contentEditable={true}
             onInput={this.handleInput}
             onkeydown={this.handleKeydown}
             onBlur={+boxMark===1?this.handleBlur:null}>
        </div>
      </div>
    );
  }
}

export default BlockInp;
