import React, { Component } from 'react';
import { Button, ItemBox, ConfirmModal, Loading, Message, Add } from '@commonComp';
import DiagnosticList from '@containers/DiagnosticList.js';
import { getPageCoordinate,setPosition  } from '@utils/tools';
import DiagResultSearch from '@containers/DiagResultSearch';
import $ from 'jquery';

class Diagnosis extends Component {
  constructor(props) {
    super(props);

    this.state = {
      diagType: 0,
      showSearch: props.show,
      pageTop: ''
    }
    this.showSearch = this.showSearch.bind(this);
    this.hideSearch = this.hideSearch.bind(this);
    this.handleshowSearch = this.handleshowSearch.bind(this);
    this.refreshScroller = this.refreshScroller.bind(this);

  }
  componentWillReceiveProps() {
    this.setState({
      showSearch: this.props.show
    })
  }


  showSearch() {
    const { showSearch } = this.props;
    showSearch && showSearch()
  }
  hideSearch() {
    const { hideSearch } = this.props;
    hideSearch && hideSearch()
  }
  handleshowSearch(e) {
    this.props.show ? this.hideSearch() : this.showSearch();
    this.setState({ pageTop:getPageCoordinate(e).boxTop });
    setPosition(e,"#searchOption",this.props.setHighter)
  }
  refreshScroller(){
    //更新滚动条状态，解决容器变大滚动条不更新bug
    return this.context.scrollArea;
    /*this.context.scrollArea.refresh();
    this.context.scrollArea.scrollBottom();*/

  }
  render() {
    return (<div id="diagnosisResult">
      <ItemBox id="diagnosis" title='诊断' boxHeight='auto' titleTop='22px' marginTop='9px' backgroundColor='#EAF7FD'>
        <DiagnosticList refreshScroller={this.refreshScroller}></DiagnosticList>
        <div style={{ marginLeft: '10px', position: 'relative' }}>
          <Add showText="添加诊断结果" handleClick={this.handleshowSearch} id="addDiag" height="50px" />
          <DiagResultSearch
            refreshScroller={this.refreshScroller} setHighter={this.props.setHighter} windowHeight={this.props.windowHeight} pageTop={this.state.pageTop} height={150}></DiagResultSearch>
        </div>


      </ItemBox>
      {/* <TreatDrug></TreatDrug> */}
      <Message></Message>
    </div>)
  }
}

Diagnosis.contextTypes = {
  scrollArea: React.PropTypes.object
};
export default Diagnosis;