import React,{Component} from 'react';
import {Button,InlineTag,ItemBox,Textarea,Notify} from '@commonComp';
import chooseType from '@containers/eleType.js';
import SearchDrop from '@components/SearchDrop';
import {filterDataArr,getPageCoordinate,windowEventHandler,isIE} from '@utils/tools'
import $ from 'jquery';

class OtherHistory extends Component{
  constructor(props){
    super(props);
    this.state = {
      boxMark:'3',
      editable:true,
      boxLeft:0,
      boxTop:0
    };
    this.handleClick = this.handleClick.bind(this);
    this.handleSearchSelect = this.handleSearchSelect.bind(this);
    this.getData = this.getData.bind(this);
  }

  handleSearchSelect(obj){
    const {questionId,name} = obj;
    const {fetchModules,focusTextIndex,span,searchInEnd} = this.props;
    fetchModules&&fetchModules({id:questionId,index:focusTextIndex,name,span,searchInEnd});
  }
  getLabels(){
    const {data,showArr,saveText} = this.props;
    const {boxMark} = this.state;
    let list = data.map((item,i)=>{
      return chooseType({item,boxMark,i,hideTag:false,showArr,saveText});
    });
    return list;
  }
  getData(){
    //第一次聚焦其他史时，主诉有数据则获取最近一次其他史记录（没有的话显示初始模板），主诉无数据则显示提示；其他时间其他史模板数据不调接口
    const {hasMain,type,setInitData,isEmpty} = this.props;
    //无主诉提示在EditableSpan里
    //智能模式有主诉或者文本模式获取最近历史
    if(hasMain&&isEmpty!=false){
      setInitData();
    }
  }
  handleClick(e){
    //e.stopPropagation();
    //搜索框位置
    const ele = document.activeElement;
    const height = ele.offsetHeight;
    let boxTop = (+(ele.offsetTop)+height);
    let boxLeft = ele.offsetLeft;
    this.setState({
      boxLeft:boxLeft+50,
      boxTop:boxTop
    });
    //若使用e.target，因为是onClick事件中，值可能是itembox的而不是span因此会有bug
    this.getData();
  }
  render(){
    const {readMode,hasMain,hideAllDrop,searchData,isRead,type,fetchPushInfos,handleInput,saveText} = this.props;
    const {boxLeft,boxTop} = this.state;
    const mode = readMode===null||readMode===-1?type:readMode;
    //智能模式有数据时不切换文本，文本模式有数据时不切换智能
    if(+mode===1){      //文本模式
      return <Textarea title='其他史' boxMark='3'
                       isRead={isRead}
                       value={saveText[0]}
                       handlePush={fetchPushInfos}
                       handleInput={handleInput}
                       handleFocus={this.getData}
                       hasMain={hasMain}/>;
    }
    return  <div>
      <ItemBox title='其他史' isRead={isRead} handleClick={this.handleClick} hideAllDrop={hideAllDrop}>
        {this.getLabels()}
        {searchData && searchData.length>0?<SearchDrop data={searchData} show={true} top={boxTop} left={boxLeft} onSelect={this.handleSearchSelect}></SearchDrop>:''}
      </ItemBox>
    </div>
  }
}

export default OtherHistory;