页面高度变化滚动条更新

src/common/components/SearchOption/index.jsx

@@ -40,9 +40,12 @@ class SearchOption extends React.Component {
     componentDidMount(){
       this.props.handleChangeValue('');
       this.textInput.current.focus();
-      const {windowHeight,pageTop,height} = this.props;
+      const {windowHeight,pageTop,height,refreshScroller} = this.props;
+
+      refreshScroller().refresh();    //点开搜索弹窗更新滚动条，
       if(windowHeight - pageTop < height){
-        $("#searchOption")[0].scrollIntoView(false);
+        //$("#searchOption")[0].scrollIntoView(false);
+        refreshScroller().scrollBottom();
       }
     }
     handleClearVal(){

src/components/AddAssistCheck/index.jsx

@@ -229,7 +229,7 @@ class AddAssistCheck extends React.Component {
     </React.Fragment> 
   }
   render() {
-    const { handleChangeValue, list,assistVal,windowHeight,assistList } = this.props;
+    const { handleChangeValue, list,assistVal,windowHeight,assistList, refreshScroller } = this.props;
     const { visible,pageTop } = this.state;
     const contStyle={
       opacity:'0.4',
@@ -244,7 +244,7 @@ class AddAssistCheck extends React.Component {
         {this.getAssistLabel()}
         <div id="searchWrapAssist" style={{ position: "relative", clear: 'both' }}>
           <Add showText="添加辅检项" handleClick={(e) => this.handleSearchShow(e)} id="assistCheck" />
-          {this.state.show ? <SearchOption windowHeight={windowHeight} pageTop={pageTop} height={280} handleChangeValue={handleChangeValue} visible={true}>
+          {this.state.show ? <SearchOption windowHeight={windowHeight} refreshScroller={refreshScroller }  pageTop={pageTop} height={280} handleChangeValue={handleChangeValue} visible={true}>
             {list && list.length>0?this.getSearchList(list):(assistVal == ''?'':<p style={{padding:'5px 30px',color:'#bfbfbf'}}>暂无筛选项</p>)}
             {
               (list && list.length>0) || (assistVal != '') || (assistList&&assistList.length==0)?'':<div>

src/components/AddInspect/index.jsx

@@ -314,7 +314,7 @@ class Inspect extends React.Component {
     }
   }
   render() {
-    const { getInfomation, handleChangeValue,inspectList, inspectVal, list, labelList, windowHeight, delPartItem, handleLabelSub, handleClear, handleConfirm, fillActive, getExcelDataList, handleCloseExcel, handlePush } = this.props;
+    const {refreshScroller, getInfomation, handleChangeValue,inspectList, inspectVal, list, labelList, windowHeight, delPartItem, handleLabelSub, handleClear, handleConfirm, fillActive, getExcelDataList, handleCloseExcel, handlePush } = this.props;
     const { tmpId, tmpIdx, id, pageTop, impId } = this.state;
 
     const contStyle={
@@ -390,7 +390,7 @@ class Inspect extends React.Component {
         </div>
         <div style={{ position: "relative", clear: "both", top: "5px" }}>
           <Add showText="添加化验项" handleClick={(e) => this.handleSearchShow(e)} id="searchWrap" />
-          {this.state.show ? <SearchOption windowHeight={windowHeight} height={280} pageTop={pageTop} handleChangeValue={handleChangeValue} visible={true}>
+          {this.state.show ? <SearchOption windowHeight={windowHeight} height={280} refreshScroller={refreshScroller} pageTop={pageTop} handleChangeValue={handleChangeValue} visible={true}>
             {list && list.length > 0 ? this.getSearchList(list) : (inspectVal == '' ? '' : <p style={{ padding: '5px 30px', color: '#bfbfbf' }}>暂无筛选项</p>)}
             {
               (list && list.length > 0) || (inspectVal != '') || (inspectList&&inspectList.length==0) ? '' : <div>

src/components/AssistCheck/index.jsx

@@ -8,32 +8,9 @@ import { isIE, getUrlArgObject } from '@utils/tools.js';
 import { dragBox } from '@utils/drag';
 import WrapModalBodyPac from '@containers/WrapModalBodyPac';
 import { getExcelList } from '@store/actions/inspect';
-import store from '@store';
 import { host, prefix } from '@utils/config.js';
 
 
-// (function ($) {
-//   var FileAPI = {
-//     // @default: "./dist/"
-//     staticPath: './dists/',
-
-//     // @default: FileAPI.staticPath + "FileAPI.flash.swf"
-//     flashUrl: './dists/FileAPI.flash.swf',
-
-//     // @default: FileAPI.staticPath + "FileAPI.flash.image.swf"
-//     flashImageUrl: './dists/FileAPI.flash.image.swf'
-//   };
-//   return FileAPI
-// })($)
-
-// import "./dists/FileAPI.js";
-
-// const isLocal = window.location.hostname.indexOf('localhost') != -1;
-// const qhost = isLocal ? host + prefix : prefix;
-// const api = {
-//   upload: qhost + '/lisExcelRes/lisExcelAnalysis'
-// };
-// let numFlg = 0;
 class AssistCheck extends React.Component {
   constructor(props){
         super(props);
@@ -53,18 +30,8 @@ class AssistCheck extends React.Component {
         this.closeInIcss=this.closeInIcss.bind(this)
         this.onClose=this.onClose.bind(this)
         this.handleImportExcel=this.handleImportExcel.bind(this)
-    } 
-    // componentDidMount() {
-    //   $(document).click((event) => {
-    //     let searchWrap = $('#importExcelBtns')[0];   // 导入按钮按钮
-    //     let searchOption = $('#importExcelLists')[0];   // 下拉列表
-    //     if (searchOption) {
-    //       if(searchWrap != event.target){
-    //         this.setState({ importLis: false });
-    //       }
-    //     }
-    //   });
-    // }
+    this.refreshScroller = this.refreshScroller.bind(this);
+    }
     handleImportExcel() {
       this.inputRef.click();
     }
@@ -75,75 +42,6 @@ class AssistCheck extends React.Component {
       })
     }
 
-    // handleBindFileApi(){
-    //   const {message} = this.props;
-    //   var ua = navigator.userAgent;
-    //   var _isIE = ua.indexOf("MSIE") > -1;
-    //   if (_isIE) {
-    //     let version = ua.match(/MSIE ([\d.]+)/)[1];
-    //     this.setState({
-    //       ieVersion: version
-    //     })
-    //   }
-    //   $('iframe').bind('load', function () { })
-    //   const { fetchPushInfos } = this.props;
-    //   // FileAPI.debug = true
-    //   $.support.cors = true;
-    //   const that = this;
-    //   var choose = document.getElementById('choose');
-    //   FileAPI.event.on(choose, 'change', function (evt) {
-    //     var files = FileAPI.getFiles(evt);
-    //     FileAPI.filterFiles(files, function (file, info) {
-    //       let name = file.name;
-    //       // if( name.split('.')[1] == 'xlsx' || name.split('.')[1] == 'xls' ){
-    //       //     Notify.error('请选择正确的excel表格')
-    //       //     return false;
-    //       // }else{
-    //       //     return true;
-    //       //   }
-    //         return true;
-    //     },
-    //       function (files, rejected) {
-    //         if (files.length) {
-    //           //console.log(files[0])
-    //           const securityCode = getUrlArgObject("code");
-    //           const appKeyId = getUrlArgObject("appI");
-    //           const appKeySecret = getUrlArgObject("appS");
-    //           FileAPI.upload({
-    //             // url: '/api/icss/lisExcelRes/lisExcelAnalysis',
-    //             url: api.upload,
-    //             data: { hospitalCode: message == '{}' ? '' : message.hospitalCode },
-    //             files: { uploadfile: files[0] },
-    //             headers: {
-    //               appKeyId: appKeyId,
-    //               appKeySecret: appKeySecret,
-    //               securityCode: securityCode
-    //             },
-    //             complete: function (err, xhr) {
-    //               if (!err) {
-    //                 let res = JSON.parse(xhr.response);
-    //                 let message = res.data.messages;
-    //                 // store.dispatch(getExcelList(res.data));
-    //                 // fetchPushInfos && fetchPushInfos();
-    //                 // if (message && message.length != 0) {
-    //                 //   that.setState({
-    //                 //     visible: true,
-    //                 //     dom: message,
-    //                 //     height: message.length
-    //                 //   })
-    //                 // }
-    //                 // $("#choose").val("");
-    //               } else {
-    //                 let res = JSON.parse(xhr.response);
-    //                 Notify.error(res.msg)
-    //               }
-    //             }
-    //           });
-    //         }
-    //       });
-    //   });
-    // }
-    
     onClose() {
       this.setState({
         hide: false
@@ -160,6 +58,12 @@ class AssistCheck extends React.Component {
         hide: false
       })
     }
+  refreshScroller(){
+    //更新滚动条状态，解决容器变大滚动条不更新bug
+    return this.context.scrollArea;
+    //this.context.scrollArea.scrollBottom();
+
+  }
     render(){
         const {checkedListImport,list,getInfomation,windowHeight,hospitalMsg,assistLabel,assistVal,handleChangeValue,handleSign,fetchPushInfos,handleDelAssist,handleChangeAssistValue,handleChangeDate,isRead,winWidth,assistList} = this.props;
         const {showSlideImport,checkSystemIpt,onClose,closeInIcss} = this;
@@ -213,6 +117,7 @@ class AssistCheck extends React.Component {
                     <div style={{padding:'10px',boxSizing:'border-box'}} >
                         <AddAssistCheck 
                             handleChangeValue={handleChangeValue}
+                            refreshScroller={this.refreshScroller}
                             list={list}
                             handleSign={handleSign}
                             assistLabel={assistLabel}
@@ -236,4 +141,7 @@ class AssistCheck extends React.Component {
     }
 }
 
+AssistCheck.contextTypes = {
+  scrollArea: React.PropTypes.object
+};
 export default AssistCheck;

src/components/CurrentIll/index.jsx

@@ -114,7 +114,13 @@ class CurrentIll extends Component{
       }
     } 
   }
-
+  componentWillReceiveProps(nextProps){
+    const contHeightDiff =  nextProps.data&&this.props.data&&nextProps.data.length!==this.props.data.length;
+    const dataDiff = !!nextProps.data!==!!this.props.data;
+    if(contHeightDiff||dataDiff){
+      this.context.scrollArea.refresh();
+    }
+  }
   render(){
     const {hasMain,readMode,fuzhen,isChronic,type,fetchPushInfos,handleInput,isRead,saveText,searchData,totalHide,editClear,data} = this.props;
     const {forbidInput,boxLeft,boxTop} = this.state;
@@ -144,4 +150,7 @@ class CurrentIll extends Component{
   }
 }
 
+CurrentIll.contextTypes = {
+  scrollArea: React.PropTypes.object
+};
 export default CurrentIll;

src/components/DiagResultSearch/index.jsx

@@ -50,7 +50,7 @@ class DiagResultSearch extends Component {
   }
 
   render() {
-    const { show, searchResult, getSearchResult, handleChangeValue,pageTop,windowHeight } = this.props
+    const { show, searchResult, refreshScroller, handleChangeValue,pageTop,windowHeight } = this.props;
 
     const contStyle={
       opacity:'0.4',
@@ -62,7 +62,7 @@ class DiagResultSearch extends Component {
     const barStyle={background:'#777',width:'100%'};
     return (
       show && <div id='diagSearch' className={style['search-box']}>
-        <SearchOption handleChangeValue={handleChangeValue} pageTop={pageTop} windowHeight={windowHeight} height={180} visible={true}>
+        <SearchOption handleChangeValue={handleChangeValue} refreshScroller={refreshScroller} pageTop={pageTop} windowHeight={windowHeight} height={180} visible={true}>
           <ScrollArea speed={0.8}
                       horizontal={false}
                       stopScrollPropagation={true}

src/components/Diagnosis/index.jsx

@@ -1,11 +1,8 @@
 import React, { Component } from 'react';
-import style from './index.less';
 import { Button, ItemBox, ConfirmModal, Loading, Message, Add } from '@commonComp';
 import DiagnosticList from '@containers/DiagnosticList.js';
-// import TreatDrug from '@containers/TreatDrug.js'
 import { getPageCoordinate } from '@utils/tools';
 import DiagResultSearch from '@containers/DiagResultSearch'
-import $ from 'jquery';
 
 class Diagnosis extends Component {
   constructor(props) {
@@ -19,6 +16,7 @@ class Diagnosis extends Component {
     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() {
@@ -40,14 +38,21 @@ class Diagnosis extends Component {
     this.props.show ? this.hideSearch() : this.showSearch()
     this.setState({ pageTop:getPageCoordinate(e).boxTop })
   }
+  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></DiagnosticList>
         <div style={{ marginLeft: '10px', position: 'relative' }}>
           <Add showText="添加诊断结果" handleClick={this.handleshowSearch} id="addDiag" height="50px" />
-          <DiagResultSearch windowHeight={this.props.windowHeight} pageTop={this.state.pageTop} height={150}></DiagResultSearch>
+          <DiagResultSearch
+            refreshScroller={this.refreshScroller} windowHeight={this.props.windowHeight} pageTop={this.state.pageTop} height={150}></DiagResultSearch>
         </div>
 
 
@@ -58,4 +63,7 @@ class Diagnosis extends Component {
   }
 }
 
+Diagnosis.contextTypes = {
+  scrollArea: React.PropTypes.object
+};
 export default Diagnosis;

src/components/Inspect/index.jsx

@@ -48,14 +48,15 @@ class Inspect extends React.Component {
       hide: false,
       importLis:false
     }
-    this.handleImportExcel = this.handleImportExcel.bind(this)
-    this.cancel = this.cancel.bind(this)
-    this.getWarings = this.getWarings.bind(this)
-    this.checkSystemIpt = this.checkSystemIpt.bind(this)
-    this.onClose = this.onClose.bind(this)
-    this.handleBindFileApi = this.handleBindFileApi.bind(this)
-    this.closeInIcss = this.closeInIcss.bind(this)
-    this.showSlideImport = this.showSlideImport.bind(this)
+    this.handleImportExcel = this.handleImportExcel.bind(this);
+    this.cancel = this.cancel.bind(this);
+    this.getWarings = this.getWarings.bind(this);
+    this.checkSystemIpt = this.checkSystemIpt.bind(this);
+    this.onClose = this.onClose.bind(this);
+    this.handleBindFileApi = this.handleBindFileApi.bind(this);
+    this.closeInIcss = this.closeInIcss.bind(this);
+    this.showSlideImport = this.showSlideImport.bind(this);
+    this.refreshScroller = this.refreshScroller.bind(this);
   }  
   componentDidMount() {
     $(document).click((event) => {
@@ -198,8 +199,15 @@ class Inspect extends React.Component {
       importLis:!flg
     })
   }
+  refreshScroller(){
+    //更新滚动条状态，解决容器变大滚动条不更新bug
+    return this.context.scrollArea;
+    /*this.context.scrollArea.refresh();
+    this.context.scrollArea.scrollBottom();*/
+
+  }
   render() {
-    const { fetchPushInfos, getInfomation, hospitalMsg, inspectVal, windowHeight, handleCloseExcel, handleChangeValue, labelListActive, list, handleSign, labelList, handleLabelSub, handleClear, handleConfirm, fillActive, changeActivePart, getExcelDataList, delPartItem, inspectList } = this.props;
+    const { fetchPushInfos,getInfomation, hospitalMsg, inspectVal, windowHeight, handleCloseExcel, handleChangeValue, labelListActive, list, handleSign, labelList, handleLabelSub, handleClear, handleConfirm, fillActive, changeActivePart, getExcelDataList, delPartItem, inspectList } = this.props;
     const { ieVersion, isIE, hide,importLis } = this.state;
     const { checkSystemIpt, onClose,handleBindFileApi,closeInIcss,showSlideImport } = this;
     if(JSON.stringify(hospitalMsg) != {} && document.getElementById("choose")){//动态绑定只绑定一次
@@ -257,6 +265,7 @@ class Inspect extends React.Component {
           <div style={{ padding: '10px', boxSizing: 'border-box' }} >
             <AddInspect
               handleSign={handleSign}
+              refreshScroller={this.refreshScroller}
               handleChangeValue={handleChangeValue}
               list={list}
               handlePush={fetchPushInfos}
@@ -301,4 +310,7 @@ class Inspect extends React.Component {
   }
 }
 
+Inspect.contextTypes = {
+  scrollArea: React.PropTypes.object
+};
 export default Inspect;

src/components/MainSuit/index.jsx

@@ -245,8 +245,13 @@ class MainSuit extends Component{
         clearTimeout(clearTimer);
       },config.delayTime-200); 
   }
-
-
+  /*componentWillReceiveProps(nextProps){   //主诉高度变化不会出现滚动内容看不见的情况，因为已经是最顶部，所以可以不必更新滚动条
+      const contHeightDiff =  nextProps.data&&this.props.data&&nextProps.data.length!==this.props.data.length;
+      const dataDiff = !!nextProps.data!==!!this.props.data;
+      if(contHeightDiff||dataDiff){
+        this.context.scrollArea.refresh();
+      }
+  }*/
   render(){
     const {readMode,type,CommonSymptoms,searchData,fetchPushInfos,isRead,totalHide,handleInput,fuzhen,saveText,editClear,datas,commSymHide} = this.props;
     const {symptom,boxLeft,boxTop} = this.state;
@@ -278,4 +283,7 @@ class MainSuit extends Component{
   }
 }
 
+/*MainSuit.contextTypes = {
+  scrollArea: React.PropTypes.object
+};*/
 export default MainSuit;

src/components/Operation/index.jsx

@@ -277,11 +277,13 @@ class Operation extends Component {
       this.setState({ title: '' })
       save();
     } else if (type == 2) {
-      diagShowTmp(false)
+      diagShowTmp(false);
       this.setState({ title: '' })
       // 慢病标识
       const chronicFlag = chronicMagItem || chronicDesease?true:false;
       clear(chronicFlag);
+      //更新滚动条
+      this.context.scrollArea.refresh();
     } else if (type == 3) {
       if (this.state.title.trim() == '') {
         Notify.error('请输入模板名称')
@@ -352,4 +354,7 @@ class Operation extends Component {
   }
 }
 
+Operation.contextTypes = {
+  scrollArea: React.PropTypes.object
+};
 export default Operation;