newICSS/src/components/BlockEmrCont/index.jsx

import React, { Component } from 'react';
import Diagnosis from '@containers/Diagnosis';
import Inspect from '@containers/Inspect';
import AssistCheck from '@containers/AssistCheck';
import OperationContainer from '../../containers/OperationContainer'
import style from './index.less';
import AdviceContainer from '../../containers/AdviceContainer';
import InfoTitle from '@components/InfoTitle'
import ScrollArea from 'react-scrollbar';
import MainSuit from './MainSuit';
import CurrentIll from './CurrentIll';
import PastHistory from './PastHistory'
import PersonalHistory from './PersonalHistory'
import FamilyHistory from './FamilyHistory'
import MarriageHistory from './marriageHistory'
import NewAdvice from '@containers/NewAdvice';
import PushDataContainer from '@containers/PushDataContainer'
import MenstruationHistory from './MenstruationHistory'
// import OtherHistory from './OtherHistory';
import CheckBody from './CheckBody';
import {getWindowInnerHeight,getWindowInnerWidth,windowEventHandler} from '@utils/tools';
import store from '@store';

class BlockEMRCont extends Component {
  constructor(props){
    super(props);
    this.state = {
      isShowSexInput : true
    }
    this.$cont = React.createRef();
    this.$div = React.createRef();
    this.setHighter = this.setHighter.bind(this);
  }
  componentDidMount(){
    // const height = getWindowInnerHeight() - 175;
    // const width = getWindowInnerWidth() - 20;
    // this.$cont.current.style.height = height+"px";
    // this.$cont.current.style.minWidth = width + "px";
    // windowEventHandler('resize', ()=>{
    //   const height = getWindowInnerHeight() - 175;
    //   const width = getWindowInnerWidth() - 20;
    //   if(this.$cont.current){
    //     this.$cont.current.style.height = height + "px";
    //     this.$cont.current.style.minWidth = width + "px";
    //   }
    // });
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.patInfoData && nextProps.patInfoData.patInfoData[3].value === 1){
      this.setState({
        isShowSexInput : false
      })
    }else {
      this.setState({
        isShowSexInput: true
      })
    }
  }

  setHighter(ht){
    // console.log(ht, '-=-=-ht=-------');
    // console.log(this.$div.current.scrollHeight,'-=-this.$div.current.scrollHeight=-=-------');
    // if (this.$div.current) {
    //   this.$div.current.style.paddingBottom = ht + 'px';
    // }
    //  低分辨率屏幕 处理 高度,暂时定为检验 + 48px   检查 +96px,可解决bug但是需要后期优化 2020/08/21
    if (this.$div.current && ht === 48){
      this.$div.current.style.paddingBottom = ht+'px';
    }
    if (this.$div.current && ht === 96) {
      this.$div.current.style.paddingBottom = ht + 'px';
    }
  }
  render() {
    const { isShowSexInput} = this.state
    const contStyle={
      opacity:'0.4',
      top:'1px',
      right:'0px',
      zIndex:'15',
      width:'14px',
      background:'#f1f1f1'};
    const barStyle={background:'#777',width:'100%',marginLeft:'0'};
    return <div className={style['EMR-container']}
                ref={this.$cont} id="addBlockScrollEvent">
      <InfoTitle hideHistory={true}></InfoTitle>
      <ScrollArea speed={1}
                  horizontal={false}
                  className={style["area"]}
                  verticalContainerStyle={contStyle}
                  verticalScrollbarStyle={barStyle}
                  contentClassName="content">
        <div className={style['inner']} id="EmrBlockContainer" ref={this.$div}>
          <MainSuit></MainSuit>
          <CurrentIll></CurrentIll>
          {/* 既往史 */}
          <PastHistory></PastHistory>
          {/* 个人史 */}
          <PersonalHistory></PersonalHistory>
          {/* 家族史 */}
          <FamilyHistory></FamilyHistory>
          {/* 婚育史 */}
          <MarriageHistory></MarriageHistory>
          {/* 月经史 */}
          {isShowSexInput && <MenstruationHistory></MenstruationHistory>}
          
          {/* <OtherHistory></OtherHistory> */}
          <CheckBody setHighter={this.setHighter}></CheckBody>
          {/* 检验 */}
          <Inspect setHighter={this.setHighter}></Inspect>
          {/* 检查 */}
          <AssistCheck setHighter={this.setHighter}></AssistCheck>
          {/* 诊断 */}
          <Diagnosis setHighter={this.setHighter} hideChronic={true}></Diagnosis>
          {/* 医嘱 */}
          <NewAdvice setHighter={this.setHighter}></NewAdvice>
          {/* <AdviceContainer></AdviceContainer> */}
        </div>
      </ScrollArea>
      <PushDataContainer></PushDataContainer>
      <OperationContainer hideLabel={true}></OperationContainer>
    </div>
  }
}
export default BlockEMRCont;