Merge branch 'scrollerTest' into settingDev

# Conflicts:
#	src/components/OtherHistory/index.jsx

package.json

@@ -70,6 +70,7 @@
     "koa2-cors": "^2.0.6",
     "log4js": "^3.0.4",
     "react-redux": "4.4.9",
+    "react-scrollbar": "^0.5.6",
     "react-server": "^0.8.1",
     "redux": "3.5.2",
     "redux-thunk": "2.2.0"

src/common/components/DropList/index.jsx

@@ -1,6 +1,5 @@
 import React,{Component} from 'react';
 import classNames from 'classnames';
-import ReactDom from "react-dom";
 
 import style from "./index.less";
 /****
@@ -24,14 +23,7 @@ class DropList extends Component{
     let isHide = this.props.show?'':style['hide'];
     return classNames(style['list'],name,isHide);
   }
-  
-  getStyle(){
-    const {left,top} = this.props;
-    return {
-      left:left?left+'px':'',
-      top:top?top+'px':''
-    }
-  }
+
   handleSelect(e,item){
     e.stopPropagation();
     const {onSelect} = this.props;
@@ -44,9 +36,7 @@ class DropList extends Component{
   }
   render(){
     const {data,hideTag,boxMark} = this.props;
-    const domNode = document.getElementById('root');
-    return ReactDom.createPortal(
-      <div className={this.getClass()} style={this.getStyle()} contentEditable='false'>
+    return <div className={this.getClass()} contentEditable='false'>
         <ul>
           {data&&data.map((it)=>{
             /*return <li onClick={(e)=>this.handleSelect(e,it)} className={it.selected||(it.selected!==false&&+it.defaultSelect===1)?style['selected']:''}>{it.labelPrefix}{it.questionDetailList&&it.questionDetailList.length>0?it.questionDetailList[0].name:it.name}{it.labelSuffix}</li>*/
@@ -54,8 +44,7 @@ class DropList extends Component{
           })}
           <li onClick={(e)=>this.handleClear(e)} className='red'>清空选项</li>
         </ul>
-      </div>
-    ,domNode)
+      </div>;
   }
 }
 

src/common/components/EditableSpan/index.jsx

@@ -148,7 +148,7 @@ class EditableSpan extends Component{
 
   handleKeydown(e){
     const ev = e||window.event;
-    const {i,setSearchLocation} = this.props;
+    const {i} = this.props;
     const target = ev.target||ev.srcElement;
     let innerVal = target.innerText || target.innerHTML,ele,boxTop;
     //禁止回车事件
@@ -187,13 +187,9 @@ class EditableSpan extends Component{
         obj.focus();
       }
     }
-    // 注释掉，放开会影响删除
-    // ele = document.activeElement;
-    // boxTop = target.innerText?getPageCoordinate(e).boxTop:$(ele).offset().top+30;
-    // setSearchLocation(boxTop,ele.offsetLeft)     //搜索框的位置动态获取
   }  
   handleKeyup(e){
-    const {boxMark,handleKeydown,i,value,removeId,handleClear,delSingleLable,setSearchLocation} = this.props;
+    const {boxMark,handleKeydown,removeId,handleClear} = this.props;
     const {preVal,index} = this.state;
     const ev = e||window.event;
     const target = ev.target||ev.srcElement;
@@ -269,9 +265,6 @@ class EditableSpan extends Component{
           })
         }
       }
-      ele = document.activeElement;
-      boxTop = target.innerText?getPageCoordinate(e).boxTop:$(ele).offset().top+30;
-      setSearchLocation(boxTop,ele.offsetLeft)     //搜索框的位置动态获取
     }
     
   }
@@ -321,8 +314,8 @@ class EditableSpan extends Component{
                       onInput={this.onChange}
                       onFocus={this.handleFocus}
                       onBlur={this.handleBlur}
-                      onkeydown={this.handleKeydown}
-                      onkeyup={this.handleKeyup}></span>;
+                      onKeyDown={this.handleKeydown}
+                      onKeyUp={this.handleKeyup}></span>;
 
   }
 }

src/common/components/ItemBox/index.jsx

@@ -23,8 +23,9 @@ class ItemBox extends Component {
     this.handleInput = this.handleInput.bind(this);
   }
   getBoxStyle(){
-    const {boxHeight,boxWidth,boxLineHeight,marginTop,backgroundColor} = this.props;
-    return {width:boxWidth?boxWidth:undefined,height:boxHeight?boxHeight:undefined,lineHeight:boxLineHeight?boxLineHeight:'22px',marginTop:marginTop,backgroundColor:backgroundColor?backgroundColor:''};
+    const {boxHeight,boxWidth,boxLineHeight,marginTop,backgroundColor,style} = this.props;
+    const sty = {width:boxWidth?boxWidth:undefined,height:boxHeight?boxHeight:undefined,lineHeight:boxLineHeight?boxLineHeight:'22px',marginTop:marginTop,backgroundColor:backgroundColor?backgroundColor:''};
+    return style?Object.assign(style,sty):sty;
   }
 
   handleClick(e){

src/common/components/ItemBox/index.less

@@ -2,7 +2,6 @@
 
 .box{
   margin: 2px 20px;
-  word-break: break-all;
   word-break: break-word;
   .title{
     width: 65px;
@@ -19,7 +18,7 @@
   .content{
     // height:120px;
     min-height: 38px;
-    margin-left: 60px;
+    margin:0 470px 0 60px;
     position: relative;
     padding:5px;
     outline: none;

src/common/components/NumberPan/index.jsx

@@ -52,19 +52,19 @@ class NumberPan extends Component{
   getStyle(){
     const {left,top,show} = this.props;
     return {
-      left:left?left+'px':'0',
-      top:top?top+'px':'0',
+      /*left:left?left+'px':'0',
+      top:top?top+'px':'0',*/
       display:show?'table':'none'        //table onBlur阻止冒泡是为了修复multSpread中数字键盘点击触发最外层数字组件onBlur事件
     }
   }
   render(){
     const select = this.handleSelect;
     const domNode = document.getElementById('root');
-    return ReactDom.createPortal(
-       <div className={style['panBox']} 
+    return <div className={style['panBox']}
                 style={this.getStyle()}
                 onBlur={(e)=>e.stopPropagation()} 
-                onDoubleClick={(e)=>e.stopPropagation()}>
+                onDoubleClick={(e)=>e.stopPropagation()}
+                onClick={(e)=>e.stopPropagation()}>
       <table className={style['pan']} >
         <tr>
           <td><button onMouseUp={select}>1</button></td>
@@ -92,7 +92,6 @@ class NumberPan extends Component{
         </tr>
       </table>
       </div>
-    ,domNode)
   }
 }
 

src/common/components/NumberUnitPan/index.jsx

@@ -61,8 +61,8 @@ class NumberUnitPan extends Component{
   getStyle(){
     const {left,top,show} = this.props;
     return {
-      left:left?left+'px':'0',
-      top:top?top+'px':'0',
+      /*left:left?left+'px':'0',
+      top:top?top+'px':'0',*/
       display:show?'table':'none'
     }
   }
@@ -76,8 +76,7 @@ class NumberUnitPan extends Component{
   }
   render(){
     const domNode = document.getElementById('root');
-    return ReactDom.createPortal( 
-      <div className={style['panBox']} onBlur={(e)=>e.stopPropagation()} onDoubleClick={(e)=>e.stopPropagation()} style={this.getStyle()}>
+    return <div className={style['panBox']} onBlur={(e)=>e.stopPropagation()} style={this.getStyle()}>
         <table className={style['pan']} >
         <tr>
           <td><span onClick={this.handleSelect}>1</span></td>
@@ -117,7 +116,6 @@ class NumberUnitPan extends Component{
         </tr>
       </table>
       </div>
-    ,domNode)
   }
 }
 

src/components/AddAssistCheck/index.jsx

@@ -4,7 +4,7 @@ import styles from './index.less';
 import $ from 'jquery';
 import Textarea from './Textarea';
 import { getPageCoordinate,getCurrentDate } from '@utils/tools';
-import close from './img/close.png';
+import ScrollArea from 'react-scrollbar';
 
 class AddAssistCheck extends React.Component {
   constructor(props) {
@@ -231,6 +231,14 @@ class AddAssistCheck extends React.Component {
   render() {
     const { handleChangeValue, list,assistVal,windowHeight,assistList } = this.props;
     const { visible,pageTop } = this.state;
+    const contStyle={
+      opacity:'0.4',
+      right:'0',
+      top:'1px',
+      zIndex:'15',
+      width:'14px',
+      background:'#f1f1f1'};
+    const barStyle={background:'#777',width:'100%'};
     return (
       <div className={styles.wrapper}>
         {this.getAssistLabel()}
@@ -241,9 +249,18 @@ class AddAssistCheck extends React.Component {
             {
               (list && list.length>0) || (assistVal != '') || (assistList&&assistList.length==0)?'':<div>
                 <p style={{padding:'5px 30px',color:'#bfbfbf'}}>常用辅检项</p>
+                <ScrollArea speed={0.8}
+                            horizontal={false}
+                            stopScrollPropagation={true}
+                            style={{height:'225px'}}
+                            className={styles["area"]}
+                            verticalContainerStyle={contStyle}
+                            verticalScrollbarStyle={barStyle}
+                            contentClassName="content">
                 {
                   this.getCommonList()
                 }
+                </ScrollArea>
               </div>
             }
           </SearchOption> : ''}

src/components/AddAssistCheck/index.less

@@ -27,8 +27,8 @@
 }
 
 .searchLiUl {
-  overflow-y: auto;
-  max-height: 225px;
+ /* overflow-y: auto;
+  max-height: 225px;*/
   // min-height: 80px;
 }
 

src/components/AddInspect/index.jsx

@@ -4,10 +4,7 @@ import SlideExcel from './SlideExcel';
 import SlideSelect from './SlideSelect';
 import { deepClone, getPageCoordinate, getStatusImg ,getCurrentDate} from '@utils/tools';
 import styles from './index.less';
-import date1 from './img/date1.png';
-import close from './img/close.png';
-import slideUp from "@common/images/slide-up.png";
-import slideDown from "@common/images/slide-down.png";
+import ScrollArea from 'react-scrollbar';
 import store from '@store';
 import $ from 'jquery';
 class Inspect extends React.Component {
@@ -320,6 +317,14 @@ class Inspect extends React.Component {
     const { 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={
+      opacity:'0.4',
+      right:'0',
+      top:'1px',
+      zIndex:'15',
+      width:'14px',
+      background:'#f1f1f1'};
+    const barStyle={background:'#777',width:'100%'};
     return (
       <div className={styles.wrapper}>
         <div className={styles.check}>
@@ -390,9 +395,18 @@ class Inspect extends React.Component {
             {
               (list && list.length > 0) || (inspectVal != '') || (inspectList&&inspectList.length==0) ? '' : <div>
                 <p style={{ padding: '5px 30px', color: '#bfbfbf' }}>常用化验项</p>
+                <ScrollArea speed={0.8}
+                            horizontal={false}
+                            stopScrollPropagation={true}
+                            style={{height:'225px'}}
+                            className={styles["area"]}
+                            verticalContainerStyle={contStyle}
+                            verticalScrollbarStyle={barStyle}
+                            contentClassName="content">
                 {
                   this.getCommonList()
                 }
+                </ScrollArea>
               </div>
             }
           </SearchOption> : ''}

src/components/AddInspect/index.less

@@ -89,8 +89,8 @@
     display: none;
 }
 .searchLiUl {
-  overflow-y: auto;
-  max-height: 225px;
+  /*overflow-y: auto;
+  max-height: 225px;*/
   // min-height: 80px;
 }
 .searchLi {

src/components/AssistCheck/index.less

@@ -3,9 +3,8 @@
 
 
 .top {
-    margin-left: 60px;
     position: relative;
-    margin: 20px 20px -21px 20px;
+    margin: 20px 490px -21px 20px;
     span {
         margin-left: 60px;
         border: 1px dashed @part-border-color;

src/components/CheckBody/index.jsx

@@ -16,8 +16,6 @@ class CheckBody extends Component{
       boxMark:'4',
       boxLeft:0,
       boxTop:0,
-      tmpScroll:0,
-      tmpTop:0,
       showAll:false
     };
     this.handleClick = this.handleClick.bind(this);
@@ -32,7 +30,6 @@ class CheckBody extends Component{
         showAll:next.defaultShowAll
       })
     }
-    this.setState({boxLeft:next.boxLeft})
   }
   isThereHigh(arr,ids){
     if(!arr||!ids){
@@ -77,26 +74,15 @@ class CheckBody extends Component{
       return ;
     }
     //若使用e.target，因为是onClick事件中，值可能是itembox的而不是span因此会有bug
-    
-    let leftL=0;      //用焦点元素的左边距替换鼠标点击的左边距，高度还是鼠标点击的位置
-    if(isIE()){
-      leftL = getPageCoordinate(e).boxLeft
-    }else{
-      const ele = document.activeElement;
-      if(ele.toString().indexOf('HTMLSpanElement') != -1){     //点击的不是span无法聚焦就不再设置位置
-        leftL = ele.offsetLeft+90
-      }
-    }
-    getSearchLocation(getPageCoordinate(e).boxTop,leftL);
+    //搜索框位置
+    const ele = document.activeElement;
+    const height = ele.offsetHeight;
+    let boxTop = (+(ele.offsetTop)+height);
+    let boxLeft = ele.offsetLeft;
     this.setState({
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
+      boxLeft:boxLeft,
+      boxTop:boxTop
     });
-    windowEventHandler('scroll',()=>{      //弹窗跟随滚动条滚动或者关闭弹窗
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      let boxTop = this.state.tmpTop - scrollYs + this.state.tmpScroll;
-      getSearchLocation(boxTop,this.state.boxLeft)
-    },$("#addScrollEvent")[0])
   }
   handleSearchSelect(obj){
    const {questionId,name} = obj;
@@ -122,8 +108,8 @@ class CheckBody extends Component{
     });
   }
   render(){
-    const {searchData,totalHide,data,boxLeft,boxTop,saveText} = this.props;
-
+    const {searchData,totalHide,data,saveText} = this.props;
+    const {boxLeft,boxTop} = this.state;
     return <ItemBox title='查体' handleClick={this.handleClick}>
         {this.getLabels()}
         {/*{showMoreBtn?more:''}*/}

src/components/CurrentIll/index.jsx

@@ -14,8 +14,6 @@ class CurrentIll extends Component{
       forbidInput:false,
       boxLeft:0,
       boxTop:0,
-      tmpScroll:0,
-      tmpTop:0,
       setDataTimer:null
     }
     this.toggleEditable = this.toggleEditable.bind(this);
@@ -25,10 +23,6 @@ class CurrentIll extends Component{
     this.handleClick = this.handleClick.bind(this);
     this.handleBlur = this.handleBlur.bind(this);
   }
-  
-  componentWillReceiveProps(nextProps){
-    this.setState({boxLeft:nextProps.boxLeft})
-  }
 
   toggleEditable(){
     this.setState({
@@ -76,29 +70,16 @@ class CurrentIll extends Component{
     ev.target.innerText?(ev.target.innerText = ""):(ev.target.innerHTML="");
   }
 
-  handleClick(e){//让搜索框跟随鼠标点击移动
-    // e.stopPropagation(); //冒泡到最顶层关闭其他下拉
-    //若使用e.target，因为是onClick事件中，值可能是itembox的而不是span因此会有bug
-    const {getSearchLocation} = this.props;
-    let leftL=0;      //用焦点元素的左边距替换鼠标点击的左边距，高度还是鼠标点击的位置
-    if(isIE()){
-      leftL = getPageCoordinate(e).boxLeft
-    }else{
-      const ele = document.activeElement;
-      if(ele.toString().indexOf('HTMLSpanElement') != -1){     //点击的不是span无法聚焦就不再设置位置
-        leftL = ele.offsetLeft+90
-      }
-    }
-    getSearchLocation(getPageCoordinate(e).boxTop,leftL)
+  handleClick(e){
+    //搜索框位置
+    const ele = document.activeElement;
+    const height = ele.offsetHeight;
+    let boxTop = (+(ele.offsetTop)+height);
+    let boxLeft = ele.offsetLeft;
     this.setState({
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
+      boxLeft:boxLeft,
+      boxTop:boxTop
     });
-    windowEventHandler('scroll',()=>{      //弹窗跟随滚动条滚动或者关闭弹窗
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      let boxTop = this.state.tmpTop - scrollYs + this.state.tmpScroll
-      getSearchLocation(boxTop,this.state.boxLeft)
-    },$("#addScrollEvent")[0])
   }
 
   handleSearchSelect(obj){
@@ -135,8 +116,8 @@ class CurrentIll extends Component{
   }
 
   render(){
-    const {fuzhen,isChronic,type,fetchPushInfos,handleInput,isRead,saveText,searchData,totalHide,editClear,data,boxLeft,boxTop} = this.props;
-    const {forbidInput} = this.state;
+    const {fuzhen,isChronic,type,fetchPushInfos,handleInput,isRead,saveText,searchData,totalHide,editClear,data} = this.props;
+    const {forbidInput,boxLeft,boxTop} = this.state;
     const searchFlag = searchData.length > 0 ? true : false;
     if(+type===1){      //文本模式
       return <Textarea  title='现病史' boxMark='2'

src/components/DiagResultSearch/index.jsx

@@ -1,10 +1,8 @@
 import React, { Component } from 'react';
 import style from './index.less';
-import close from './img/close.png'
-import search from './img/search.png'
 import DiagnosticItem from '@containers/DiagnosticItem'
 import { SearchOption } from '@commonComp';
-import config from '@config/index';
+import ScrollArea from 'react-scrollbar';
 import $ from 'jquery';
 class DiagResultSearch extends Component {
   constructor(props) {
@@ -54,10 +52,27 @@ class DiagResultSearch extends Component {
   render() {
     const { show, searchResult, getSearchResult, handleChangeValue,pageTop,windowHeight } = this.props
 
+    const contStyle={
+      opacity:'0.4',
+      right:'0',
+      top:'1px',
+      zIndex:'15',
+      width:'14px',
+      background:'#f1f1f1'};
+    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}>
+          <ScrollArea speed={0.8}
+                      horizontal={false}
+                      stopScrollPropagation={true}
+                      style={{height:'225px'}}
+                      className={style["area"]}
+                      verticalContainerStyle={contStyle}
+                      verticalScrollbarStyle={barStyle}
+                      contentClassName="content">
           {this.getSearchList(searchResult)}
+          </ScrollArea>
         </SearchOption>
       </div>
     )

src/components/DiagResultSearch/index.less

@@ -41,8 +41,8 @@
 // }
 
 .search-result {
-    overflow-y: auto;
-    max-height: 225px;
+    /*overflow-y: auto;
+    max-height: 225px;*/
     min-height: 80px;
 }
 

src/components/EMRContainer/index.jsx

@@ -11,6 +11,7 @@ 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 {getWindowInnerHeight,getWindowInnerWidth,windowEventHandler} from '@utils/tools';
 
 class EMRContainer extends Component {
@@ -22,12 +23,12 @@ class EMRContainer extends Component {
         // const {initHospital} = this.props;
         // initHospital()
         const height = getWindowInnerHeight() - 175;
-        const width = getWindowInnerWidth() - 480;
+        const width = getWindowInnerWidth() - 20;
         this.$cont.current.style.height = height+"px";
         this.$cont.current.style.width = width + "px";
         windowEventHandler('resize', ()=>{
           const height = getWindowInnerHeight() - 175;
-          const width = getWindowInnerWidth() - 480;
+          const width = getWindowInnerWidth() - 20;
           if(this.$cont.current){
             this.$cont.current.style.height = height + "px";
             this.$cont.current.style.width = width + "px";
@@ -35,8 +36,23 @@ class EMRContainer extends Component {
         });
     }
     render() {
-        return <div className={style['EMR-container']} ref={this.$cont} id="addScrollEvent">
-            <InfoTitle></InfoTitle>
+        const contStyle={
+                          opacity:'0.4',
+                          top:'1px',
+                          right:'460px',
+                          zIndex:'15',
+                          width:'14px',
+                          background:'#f1f1f1'};
+        const barStyle={background:'#777',width:'100%',marginLeft:'0'};
+        return <div className={style['EMR-container']}
+                    ref={this.$cont} id="addScrollEvent">
+          <ScrollArea speed={0.8}
+                      horizontal={false}
+                      className={style["area"]}
+                      verticalContainerStyle={contStyle}
+                      verticalScrollbarStyle={barStyle}
+                      contentClassName="content">
+          <InfoTitle></InfoTitle>
             <div className={style['inner']}>
                 <MainSuit></MainSuit>
                 <CurrentIll></CurrentIll>
@@ -50,6 +66,7 @@ class EMRContainer extends Component {
                 <AdviceContainer></AdviceContainer>
             </div>
             <OperationContainer></OperationContainer>
+          </ScrollArea>
         </div>
     }
 }

src/components/EMRContainer/index.less

@@ -1,7 +1,11 @@
 @import "~@less/variables.less";
+.area{
+   height: 100%;
+    min-width: 1006px;
+ }
 .EMR-container{
   background: #fff;
-  margin-top: 60px;
+  margin:60px 20px 0 0;
   // margin-right:@push-width + 10px;
   padding: 0px 0 10px 0 ;
   box-sizing: border-box;
@@ -14,7 +18,7 @@
 }
 .inner{
   padding-top:20px;
-  padding-bottom: 20px;
+  padding-bottom: 48px;
 }
 .keep {
     position: absolute;

src/components/Inspect/index.jsx

@@ -251,6 +251,7 @@ class Inspect extends React.Component {
           title={'化验'}
           editable={false}
           border={true}
+          style={{marginRight:'0'}}
           marginTop={'20px'}
         >
           <div style={{ padding: '10px', boxSizing: 'border-box' }} >

src/components/Inspect/index.less

@@ -1,7 +1,9 @@
 @import "~@less/mixin.less";
 
+.wrapper{
+  margin-right: 470px;
+}
 .top {
-    margin-left: 60px;
     position: relative;
     margin: 20px 20px -21px 20px;
     span {

src/components/MainSuit/index.jsx

@@ -22,8 +22,6 @@ class MainSuit extends Component{
       inpText:'',
       clearTimer:null,
       overFlag:false,
-      tmpScroll:0,
-      tmpTop:0,
     };
     this.toggleEditable = this.toggleEditable.bind(this);
     this.handleFocus = this.handleFocus.bind(this);
@@ -33,9 +31,6 @@ class MainSuit extends Component{
     this.handleClick = this.handleClick.bind(this);
     this.handleBlur = this.handleBlur.bind(this);
   }
-  componentWillReceiveProps(nextProps){
-    this.setState({boxLeft:nextProps.boxLeft})
-  }
   toggleEditable(){
     this.setState({
       boxEditable:!this.state.boxEditable
@@ -134,28 +129,17 @@ class MainSuit extends Component{
   }
 
 
-  handleClick(e){//让搜索框跟随鼠标点击移动
+  handleClick(e){
     // e.stopPropagation(); //冒泡到最顶层关闭其他下拉
-    //若使用e.target，因为是onClick事件中，值可能是itembox的而不是span因此会有bug
-    const {getSearchLocation} = this.props;
-    let leftL=0;      //用焦点元素的左边距替换鼠标点击的左边距，高度还是鼠标点击的位置
-    let num = this.props.datas.length == 0?0:60
-    if(isIE()){
-      leftL = getPageCoordinate(e).boxLeft
-    }else{
-      const ele = document.activeElement;
-      leftL = ele.offsetLeft+num
-    }
-    getSearchLocation(getPageCoordinate(e).boxTop,leftL)
+    //搜索框位置
+    const ele = document.activeElement;
+    const height = ele.offsetHeight;
+    let boxTop = (+(ele.offsetTop)+height);
+    let boxLeft = ele.offsetLeft;
     this.setState({
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
+      boxLeft:boxLeft,
+      boxTop:boxTop
     });
-    windowEventHandler('scroll',()=>{      //弹窗跟随滚动条滚动或者关闭弹窗
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      let boxTop = this.state.tmpTop - scrollYs + this.state.tmpScroll
-      getSearchLocation(boxTop,this.state.boxLeft)
-    },$("#addScrollEvent")[0])
   }
 
   handleChange(e){
@@ -265,8 +249,8 @@ class MainSuit extends Component{
 
 
   render(){
-    const {type,CommonSymptoms,searchData,fetchPushInfos,isRead,totalHide,handleInput,fuzhen,saveText,editClear,datas,commSymHide,boxLeft,boxTop} = this.props;
-    const {symptom} = this.state;
+    const {type,CommonSymptoms,searchData,fetchPushInfos,isRead,totalHide,handleInput,fuzhen,saveText,editClear,datas,commSymHide} = this.props;
+    const {symptom,boxLeft,boxTop} = this.state;
     const symptomFlag = CommonSymptoms.length>0 ? true : false;
     const searchFlag = searchData.length>0 ? true : false;
     const boxTop1 = datas.length>0?boxTop:45;

src/components/MultSpread/index.jsx

@@ -84,8 +84,6 @@ class MultSpread extends Component{
           const list = it.questionDetailList&&it.questionDetailList.length>0?it.questionDetailList:it.questionMapping;
           return <RadioDrop data={list}
                             boxMark={boxMark}
-                            prefix={it.labelPrefix}
-                            suffix={it.labelSuffix}
                             placeholder={it.name}
                             show={show}
                             value = {it.value}
@@ -104,8 +102,6 @@ class MultSpread extends Component{
                            show={showArr&&showArr[inx]}
                            order={it.textGenerate}
                            type={boxMark}
-                           textPrefix={it.labelPrefix}
-                           textSuffix={it.labelSuffix}
                            id={it.id}
                            hideTag={true}></Multiple>;
         case +it.controlType===5://带单位数字键盘

src/components/Multiple/SlideItem/index.jsx

@@ -2,14 +2,12 @@ import react from "react";
 import style from "./index.less";
 import classNames from 'classnames';
 import {deepClone} from '@utils/tools.js';
-import ReactDom from "react-dom";
 /**
   单列多选组件下拉 2019-2-20 By_liucf
   接收参数：
   show：是否展示下拉
   data：下拉数据
   handleConfirm: 确定事件
-  left、top: 下拉框的位置，
   seleData、seleId：选中的数据和id，回读标识选中状态用
 **/
 
@@ -66,10 +64,8 @@ class SlideItem extends react.Component{
   }
 
   getStyle(){
-    const {left,top,show} = this.props;
+    const {show} = this.props;
     return {
-      left:left?left+'px':'0',
-      top:top?top+'px':'0',
       display:show?'table':'none' 
     }
   }
@@ -81,9 +77,7 @@ class SlideItem extends react.Component{
   }
   render(){
     const {data} = this.props;
-    const domNode = document.getElementById('root');
-    return ReactDom.createPortal(
-      <div className={this.getListClass()} style={this.getStyle()} contentEditable="false">
+    return <div className={this.getListClass()} style={this.getStyle()} contentEditable="false">
         <ul>
           {data&&data.map((it)=>{
           return <li onClick={(e)=>this.handleSelect(e,it)} className={this.getSeleStyle(it.id)} title={it.name.length>8?it.name:''}>{it.name&&it.name.length>8?it.name.slice(0,8)+'...':it.name}</li>
@@ -91,7 +85,7 @@ class SlideItem extends react.Component{
           <li onClick={this.handleClear} className={style['mClear']}>清空选项</li>
           <li onClick={this.handleClick} className={style['mConfirm']}>确定</li>
         </ul>
-      </div>,domNode)
+      </div>
   }
 }
 

src/components/Multiple/index.jsx

@@ -2,7 +2,7 @@ import react from "react";
 import style from "./index.less";
 import $ from 'jquery';
 import classNames from 'classnames';
-import {handleEnter,isIE,filterArr,deepClone,filterDataArr,getPageCoordinate} from '@utils/tools.js';
+import {handleEnter,isIE,filterArr,deepClone,filterDataArr} from '@utils/tools.js';
 import {Notify} from '@commonComp';
 import SlideItem from "./SlideItem";
 import config from '@config/index.js';
@@ -27,10 +27,6 @@ class Multiple extends react.Component{
       labelVal:"",
       seleData:seleData||"",
       seleId:seleId||[],
-      boxLeft:null,
-      boxTop:null,
-      tmpScroll:null,
-      tmpTop:null
     }
     this.$div = React.createRef();
     this.handleShow = this.handleShow.bind(this);
@@ -62,29 +58,13 @@ class Multiple extends react.Component{
 
   handleShow(e){//单击
     e&&e.stopPropagation();
-    let boxLeft = e.pageX -133 + 'px';
-    let offsetTop = e.target.offsetTop;
-    const ht = e.target.offsetHeight;   //如杂音选中文字有多行时，写死会遮挡
-    let boxTop = offsetTop + ht +2 + 'px';
-    this.setState({
-      boxLeft:getPageCoordinate(e).boxLeft,
-      boxTop:getPageCoordinate(e).boxTop,
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
-    })
-    $("#addScrollEvent").scroll(()=>{
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      this.setState({
-        boxTop:this.state.tmpTop - scrollYs + this.state.tmpScroll
-      })
-    })
      this.setStateInit();
     const {ikey,handleShow,placeholder,flag,id,value,tagType,type} = this.props;
     const that = this;
     clearTimeout(this.state.timer);
     this.state.timer = setTimeout(function(){
       if (that.state.editable) {//如果处于编辑状态点击不显示下拉框
-        return
+        return;
       }else{
         handleShow&&handleShow({ikey,placeholder,flag,id,value,tagType,type});
       }
@@ -174,7 +154,7 @@ class Multiple extends react.Component{
   }
   render(){
     const {placeholder,value,show,data,hideTag} = this.props;
-    const {editable,boxTop,boxLeft,seleData,seleId} = this.state;
+    const {editable,seleData,seleId} = this.state;
     return <div className={style["container"]}>
       <div className={this.getClass()}
       ref={this.$div}
@@ -186,9 +166,7 @@ class Multiple extends react.Component{
       contentEditable={editable}>{value||placeholder}</div>
       <div className={this.getListClass()} contentEditable="false">
         <SlideItem 
-          show={show} 
-          left={boxLeft} 
-          top={boxTop} 
+          show={show}
           data={data} 
           seleData={seleData} 
           seleId={seleId} 

src/components/NumberDrop/index.jsx

@@ -2,8 +2,6 @@ import React,{Component} from 'react';
 import className from 'classnames';
 import {NumberPan,Notify} from '@commonComp';
 import style from './index.less';
-import $ from "jquery";
-import {getPageCoordinate} from '@utils/tools.js';
 /***
  * author:zn@2018-11-19
  * 接收参数：
@@ -23,10 +21,6 @@ class NumberDrop extends Component{
       sltTimer:null,
       blurTimer:null,
       hasSelect:false,       //是否点过下拉键盘
-      boxLeft:0,
-      boxTop:0,
-      tmpTop:0,
-      tmpScroll:0,
       placeholder:props.placeholder
     };
     this.$span = React.createRef();
@@ -98,6 +92,7 @@ class NumberDrop extends Component{
     }
   }
   handleNumClick(e){     //数字框不可编辑的状态时点击事件，点击将数字框变为可输入且下拉不再显示直到失焦后再次聚集
+    e.stopPropagation();
     const {show,handleShow,ikey,id,patId,handleHide,value} = this.props;
     if(show) {
       handleHide && handleHide();
@@ -108,20 +103,7 @@ class NumberDrop extends Component{
         hasSelect:false
       });
       handleShow&&handleShow({ikey,id:patId||id});
-      this.setState({
-        boxLeft:getPageCoordinate(e).boxLeft,
-        boxTop:getPageCoordinate(e).boxTop,
-        tmpScroll: $("#addScrollEvent")[0].scrollTop,
-        tmpTop:getPageCoordinate(e).boxTop
-      });
-      $("#addScrollEvent").scroll(()=>{
-        let scrollYs = $("#addScrollEvent")[0].scrollTop;
-        this.setState({
-          boxTop:this.state.tmpTop - scrollYs + this.state.tmpScroll
-        })
-      })
     }
-    e.stopPropagation();
   }
   validSymbols(txt,min,max){
     //输入只有一个～或/时判断两边是否为合理数字，有多个为不合理
@@ -215,8 +197,9 @@ class NumberDrop extends Component{
   }
   render(){
     const {prefix,suffix,show,value,handleHide,allClick} = this.props;
-    const {placeholder,hasSelect,boxTop,boxLeft} = this.state;
+    const {placeholder,hasSelect} = this.state;
     return <div className={this.getClasses()}
+                style={{position:'relative'}}
                 onClick={allClick?this.handleNumClick:null}>
       <span>{prefix}</span>
       <span onFocus={this.handleNumFocus}
@@ -224,7 +207,7 @@ class NumberDrop extends Component{
             contentEditable={true}
             style={{minWidth:'10px',display:'inline-block',textAlign:'center'}}
             ref = {this.$span}
-            onKeyDown={this.handleKeyDowm}
+            onKeyUp={this.handleKeyDowm}
             onBlur={this.numInpBlur}
             onInput={this.handleSpanInp}
             className={this.getSpanClass()}
@@ -233,9 +216,7 @@ class NumberDrop extends Component{
       <NumberPan handleSelect={this.select.bind(this)}
                  onClose={handleHide}
                  show={show}
-                 toClear={!hasSelect}
-                 left={boxLeft}
-                 top={boxTop}/>
+                 toClear={!hasSelect}/>
     </div>
   }
 }

src/components/NumberUnitDrop/index.jsx

@@ -3,7 +3,7 @@ import className from 'classnames';
 import {NumberUnitPan} from '@commonComp';
 import style from './index.less';
 import config from '@config/index.js';
-import {filterArr,handleEnter,isIE,getPageCoordinate,filterDataArr} from '@utils/tools.js';
+import {filterArr,handleEnter,isIE,filterDataArr} from '@utils/tools.js';
 import {Notify} from '@commonComp';
 import $ from 'jquery';
 /***
@@ -27,10 +27,6 @@ class NumberUnitDrop extends Component{
       value:props.value,
       // placeholderFlag:false,
       labelVal:'',
-      boxLeft:0,
-      boxTop:0,
-      tmpTop:0,
-      tmpScroll:0
     };
     this.$span = React.createRef();
     this.$pre = React.createRef();
@@ -68,17 +64,7 @@ class NumberUnitDrop extends Component{
     },300);
     this.setState({
       timer,
-      boxLeft:getPageCoordinate(e).boxLeft,
-      boxTop:getPageCoordinate(e).boxTop,
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
     });
-    $("#addScrollEvent").scroll(()=>{
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      this.setState({
-        boxTop:this.state.tmpTop - scrollYs + this.state.tmpScroll
-      })
-    })
     handleHide&&handleHide();
   }
 
@@ -99,7 +85,7 @@ class NumberUnitDrop extends Component{
 
   render(){
     const {placeholder,prefix,suffix,show,value,handleHide,hideTag} = this.props;
-    const {editable,hasSelect,boxLeft,boxTop} = this.state;
+    const {editable,hasSelect} = this.state;
     return <div className={this.getClasses()}
                 ref={this.$cont}
                 onClick={this.handleNumClick}>
@@ -110,8 +96,6 @@ class NumberUnitDrop extends Component{
       <span ref = {this.$suf}>{suffix?' '+suffix:suffix}</span>
       <NumberUnitPan handleSelect={(obj)=>this.select(obj)}
                  onClose={handleHide}
-                 top={boxTop}
-                 left={boxLeft}
                  show={show} toClear={!hasSelect} value={value}/>
     </div>
   }

src/components/OtherHistory/index.jsx

@@ -12,18 +12,13 @@ class OtherHistory extends Component{
       boxMark:'3',
       editable:true,
       boxLeft:0,
-      boxTop:0,
-      tmpScroll:0,
-      tmpTop:0
+      boxTop:0
     };
     this.handleClick = this.handleClick.bind(this);
     this.handleSearchSelect = this.handleSearchSelect.bind(this);
     this.getData = this.getData.bind(this);
   }
-  
-  componentWillReceiveProps(nextProps){
-    this.setState({boxLeft:nextProps.boxLeft})
-  }
+
   handleSearchSelect(obj){
     const {questionId,name} = obj;
     const {fetchModules,focusTextIndex,span,searchInEnd} = this.props;
@@ -46,35 +41,23 @@ class OtherHistory extends Component{
       setInitData();
     }
   }
-  handleClick(e){//让搜索框跟随鼠标点击移动
+  handleClick(e){
     //e.stopPropagation();
-    const {getSearchLocation} = this.props;
-    //若使用e.target，因为是onClick事件中，值可能是itembox的而不是span因此会有bug
-    this.getData();
-    let leftL=0;      //用焦点元素的左边距替换鼠标点击的左边距，高度还是鼠标点击的位置
-    if(isIE()){
-      leftL = getPageCoordinate(e).boxLeft
-    }else{
-      const ele = document.activeElement;
-      if(ele.toString().indexOf('HTMLSpanElement') != -1){     //点击的不是span无法聚焦就不再设置位置
-        leftL = ele.offsetLeft+90
-      }
-    }
-    getSearchLocation(getPageCoordinate(e).boxTop,leftL)
+    //搜索框位置
+    const ele = document.activeElement;
+    const height = ele.offsetHeight;
+    let boxTop = (+(ele.offsetTop)+height);
+    let boxLeft = ele.offsetLeft;
     this.setState({
-      // boxLeft:getPageCoordinate(e).boxLeft,
-      // boxLeft:leftL,
-      // boxTop:getPageCoordinate(e).boxTop,
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
+      boxLeft:boxLeft,
+      boxTop:boxTop
     });
-    windowEventHandler('scroll',()=>{      //弹窗跟随滚动条滚动或者关闭弹窗
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      let boxTop = this.state.tmpTop - scrollYs + this.state.tmpScroll
-      getSearchLocation(boxTop,this.state.boxLeft)
-    },$("#addScrollEvent")[0])
+    //若使用e.target，因为是onClick事件中，值可能是itembox的而不是span因此会有bug
+    this.getData();
   }
   render(){
+    const {hasMain,totalHide,searchData,isRead,type,fetchPushInfos,handleInput,saveText} = this.props;
+    const {boxLeft,boxTop} = this.state;
     const {hasMain,searchData,totalHide,isRead,type,fetchPushInfos,handleInput,saveText,boxTop,boxLeft} = this.props;
     //智能模式有数据时不切换文本，文本模式有数据时不切换智能
     if(+type===1){      //文本模式
@@ -89,7 +72,7 @@ class OtherHistory extends Component{
     return  <div>
       <ItemBox title='其他史' isRead={isRead} handleClick={this.handleClick}>
         {this.getLabels()}
-        {searchData && searchData.length>0?<SearchDrop data={searchData} show={!totalHide} left={boxLeft} top={boxTop} onSelect={this.handleSearchSelect}></SearchDrop>:''}
+        {searchData && searchData.length>0?<SearchDrop data={searchData} show={true} top={boxTop} left={boxLeft} onSelect={this.handleSearchSelect}></SearchDrop>:''}
       </ItemBox>
     </div>
   }

src/components/PushContainer/index.less

@@ -2,7 +2,7 @@
 
 .container{
   background: #fff;
-  width: @push-width;
+  width: 460px;/*@push-width;*/
   float: right;
   padding-top: 20px;
   // z-index: 200;
@@ -12,6 +12,7 @@
   // bottom: 10px;
   // right: 10px;
   padding-bottom:50px;
+  border-left: 10px #e4e6e7 solid;
 }
 .title{
   color:#666;

src/components/RadioDrop/index.jsx

@@ -1,5 +1,5 @@
 import React,{Component} from 'react';
-import {handleEnter,getPageCoordinate,windowEventHandler} from '@utils/tools.js';
+import {handleEnter,windowEventHandler} from '@utils/tools.js';
 import {DropList} from '@commonComp';
 import classNames from 'classnames';
 import style from "./index.less";
@@ -24,10 +24,6 @@ class RadioDrop extends Component{
     this.state={
       editable:false,
       timer:null,
-      boxLeft:0,
-      boxTop:0,
-      tmpScroll:0,
-      tmpTop:0,
     };
     this.$cont = React.createRef();
     this.isIE = navigator.appName=="Microsoft Internet Explorer" && navigator.appVersion.split(";")[1].replace(/[ ]/g,"")=="MSIE8.0";
@@ -88,17 +84,7 @@ class RadioDrop extends Component{
     
     this.setState({
       timer,
-      boxLeft:getPageCoordinate(e).boxLeft,
-      boxTop:getPageCoordinate(e).boxTop,
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
     });
-    windowEventHandler('scroll',()=>{      //弹窗跟随滚动条滚动或者关闭弹窗
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      this.setState({
-        boxTop:this.state.tmpTop - scrollYs + this.state.tmpScroll
-      })
-    },$("#addScrollEvent")[0])
   }
   componentDidMount(){    //默认值选中
     const {data,ikey,handleSelect,hideTag,mainSaveText,value,boxMark} = this.props;
@@ -145,21 +131,18 @@ class RadioDrop extends Component{
     handleDbclick&&handleDbclick({id:patId||id});
   }
   render(){
-    const {data,prefix,suffix,placeholder,show,value,hideTag,boxMark} = this.props;
-    const {boxLeft,boxTop} = this.state;
+    const {data,placeholder,show,value,hideTag,boxMark} = this.props;
     return <div className={style['container']} ref = {this.$cont}>
-      {prefix}
       <div className={this.getClass()}
            onBlur={this.handleEditLabel}
            contentEditable={this.state.editable}
            onDoubleClick={hideTag?null:this.handledbClick}
            onFocus={(e)=>{e.stopPropagation()}}
            onClick={(e)=>this.handleShow(e,true)}
-           onkeydown={handleEnter}>
+           onKeyDown={handleEnter}>
         {value||placeholder}
       </div>
-      {suffix}
-      <DropList onSelect={this.handleSelect} boxMark={boxMark} data={data} left={boxLeft} top={boxTop} show={show} hideTag={hideTag}/>
+      <DropList onSelect={this.handleSelect} boxMark={boxMark} data={data} show={show} hideTag={hideTag}/>
     </div>
   }
 }

src/components/RadioInpDrop/index.jsx

@@ -1,5 +1,5 @@
 import React,{Component} from 'react';
-import {handleEnter,getPageCoordinate,windowEventHandler,filterDataArr,getLabelIndex} from '@utils/tools.js';
+import {handleEnter,windowEventHandler,filterDataArr,getLabelIndex} from '@utils/tools.js';
 import {DropList,Notify} from '@commonComp';
 import config from '@config/index';
 import style from "./index.less";
@@ -22,10 +22,6 @@ class RadioInpDrop extends Component{
     this.state={
       editable:false,
       timer:null,
-      boxLeft:0,
-      boxTop:0,
-      tmpScroll:0,
-      tmpTop:0,
       texts:props.vals||{0:props.value||props.placeholder},
       over:false
     };
@@ -92,10 +88,6 @@ class RadioInpDrop extends Component{
     
     this.setState({
       timer,
-      boxLeft:getPageCoordinate(e).boxLeft,
-      boxTop:getPageCoordinate(e).boxTop,
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
     });
     windowEventHandler('scroll',()=>{      //弹窗跟随滚动条滚动或者关闭弹窗
       let scrollYs = $("#addScrollEvent")[0].scrollTop;
@@ -190,23 +182,10 @@ class RadioInpDrop extends Component{
         list.push(<span>&nbsp;{temp}</span>);
       }
     }
-    /*if(value&&value.indexOf(config.radioOptionPer)!=-1){
-      let arr = [],inpIndex='';
-      let list = value.split(config.radioOptionPer);
-      list.map((it,i)=>{
-        arr.push(<InputComp value={it}></InputComp>);
-        inpIndex = (i+1)*2-1;
-        if(i!=list.length-1){
-          arr.push(<InputComp handleInp={this.handleInnerInp} editable={true} index={inpIndex}></InputComp>);
-        }
-      });
-      return arr;
-    }*/
     return list;
   }
   render(){
     const {data,show,vals,placeholder,hideTag} = this.props;
-    const {boxLeft,boxTop} = this.state;
     return <div className={style['container']} ref = {this.$cont}>
       <div className={this.getClass()}
            onBlur={this.handleEditLabel}
@@ -216,7 +195,7 @@ class RadioInpDrop extends Component{
            onKeyDown={handleEnter}>
         {vals?this.parseInputDom():<span>{placeholder}</span>}
       </div>
-      <DropList onSelect={this.handleSelect} data={data} left={boxLeft} top={boxTop} show={show}/>
+      <DropList onSelect={this.handleSelect} data={data} show={show}/>
     </div>
   }
 }

src/components/SearchDrop/index.jsx

@@ -1,6 +1,5 @@
 import React,{Component} from 'react';
 import classNames from 'classnames';
-import ReactDom from "react-dom";
 
 import style from "./index.less";
 /****
@@ -40,7 +39,6 @@ class SearchDrop extends Component{
     }
     return classNames(style['list'],name,isHide);
   }
-
   getStyle(){
     const {left,top} = this.props;
     return {
@@ -48,7 +46,6 @@ class SearchDrop extends Component{
       top:top?top+'px':''
     }
   }
-
   handleSelect(e,item){
     // onClick事件换成onmouseup--点击清除后谷歌下搜索结果点击不上去的情况
     e.stopPropagation();
@@ -60,7 +57,7 @@ class SearchDrop extends Component{
     const {mainEmpty} = this.props;
     let litext = '';
     if(mainEmpty){
-      return <div className={this.getClass()} contenteditable="false" id="searchBox" style={this.getStyle()}>
+      return <div className={this.getClass()} id="searchBox" style={this.getStyle()}>
           <ul>
             {this.props.data&&this.props.data.map((it)=>{
               litext = it.showType==1?it.name:it.name+'（'+it.retrievalName+'）';
@@ -70,17 +67,14 @@ class SearchDrop extends Component{
         </div>
     }else{
       
-      const domNode = document.getElementById('root');
-      return ReactDom.createPortal(
-        <div className={this.getClass()} contenteditable="false" id="searchBox" style={this.getStyle()}>
+      return <div className={this.getClass()} id="searchBox" style={this.getStyle()}>
           <ul>
             {this.props.data&&this.props.data.map((it)=>{
               litext = it.showType==1?it.name:it.name+'（'+it.retrievalName+'）';
               return <li onClick={(e)=>this.handleSelect(e,it)} title={litext}>{litext}</li>
             })}
           </ul>
-        </div>
-      ,domNode)
+        </div>;
     }
     
   }

src/components/SearchDrop/index.less

@@ -4,7 +4,6 @@
   overflow-y: auto;
   overflow-x: hidden;
   .pop;
-  left: 85px;
   padding: 0 0 10px;
   li{
     width: 200px;

src/components/SpreadDrop/index.jsx

@@ -2,9 +2,8 @@ import React,{Component} from 'react';
 import classNames from 'classnames';
 import config from '@config/index.js';
 import style from './index.less';
-import {deepClone,filterArr,handleEnter,isIE,getPageCoordinate,windowEventHandler,filterDataArr,getIds} from '@utils/tools.js';
+import {deepClone,filterArr,handleEnter,isIE,windowEventHandler,filterDataArr,getIds} from '@utils/tools.js';
 import {Notify} from '@commonComp';
-import ReactDom from "react-dom";
 import $ from 'jquery';
 /****
  * 标签组合下拉,选中的项目展开
@@ -45,10 +44,6 @@ class SpreadDrop extends Component{
       ban:{},  //放'伴'字段
       editable:false,      //双击编辑
       labelVal:'',  //存放标签原有的值--主诉字数限制用
-      boxLeft:0,
-      boxTop:0,
-      tmpScroll:0,
-      tmpTop:0,
     };
     this.$div = React.createRef();
     this.handleSelect = this.handleSelect.bind(this);
@@ -66,37 +61,12 @@ class SpreadDrop extends Component{
   handleShow(e){//单击
     e&&e.stopPropagation();
     const {ikey,handleShow,placeholder,flag,id,value,tagType,type,data,windowWidth} = this.props;
-    // let boxLeft = e.pageX -175 + 'px';
-    // let offsetTop = e.target.offsetTop;
-    // const ht = e.target.offsetHeight;   //如杂音选中文字有多行时，写死会遮挡
-    // let boxTop = offsetTop + ht +2 + 'px';
-    // this.setState({
-    //   boxLeft:boxLeft,
-    //   boxTop:boxTop
-    // })
-    let num = 0,leftLen;//判断为五类切超出页面
+    let num = 0;//判断为五类切超出页面
     data && data.map((item)=>{
       if(item.formPosition != 1){
         ++num
       }
-    })
-    if(num >= 5 && windowWidth-getPageCoordinate(e).boxLeft < 760){
-      leftLen = windowWidth-780
-    }else{
-      leftLen = getPageCoordinate(e).boxLeft
-    }
-    this.setState({
-      boxLeft:leftLen,
-      boxTop:getPageCoordinate(e).boxTop,
-      tmpScroll: $("#addScrollEvent")[0].scrollTop,
-      tmpTop:getPageCoordinate(e).boxTop
     });
-    windowEventHandler('scroll',()=>{      //弹窗跟随滚动条滚动或者关闭弹窗
-      let scrollYs = $("#addScrollEvent")[0].scrollTop;
-      this.setState({
-        boxTop:this.state.tmpTop - scrollYs + this.state.tmpScroll
-      })
-    },$("#addScrollEvent")[0])
     // window.event? window.event.cancelBubble = true : e.stopPropagation();
      this.setStateInit();      //恢复初始选中状态
     const that = this;
@@ -366,7 +336,7 @@ class SpreadDrop extends Component{
 
   render(){
     const {placeholder,value,show,data,order} = this.props;
-    const {editable,boxLeft,boxTop} = this.state;
+    const {editable} = this.state;
     return  <div className={style['container']}
               onFocus={(e)=>e.stopPropagation()}
               onBlur={(e)=>e.stopPropagation()}
@@ -381,8 +351,8 @@ class SpreadDrop extends Component{
         onInput={this.onChange}
         onkeydown={handleEnter}
         >{value||placeholder}</div>
-          <ListItems data={data} left={boxLeft} order={order}
-            top={boxTop} show={show} handleSelect={this.handleSelect} handleConfirm={this.handleConfirm} handleClear={this.handleClear} {...this.state}></ListItems>
+          <ListItems data={data} order={order}
+             show={show} handleSelect={this.handleSelect} handleConfirm={this.handleConfirm} handleClear={this.handleClear} {...this.state}></ListItems>
       </div>
   }
 }
@@ -418,26 +388,21 @@ class ListItems extends Component{
     return list;
   }
   getStyle(){
-    const {left,top,show} = this.props;
+    const {show} = this.props;
     return {
-      left:left?left+'px':'',
-      top:top?top+'px':'',
       display:show?'block':'none'
     }
   }
   render (){
     const {handleClear,handleConfirm,order} = this.props;
-    const domNode = document.getElementById('root');
-    return ReactDom.createPortal(
-      <div className={style["drop-list"]} style={this.getStyle()} contentEditable="false" onClick={(e)=>{e.stopPropagation();}}>
+    return <div className={style["drop-list"]} style={this.getStyle()} contentEditable="false" onClick={(e)=>{e.stopPropagation();}}>
         <p className={style['orderTips']}>按{order?'从左到右从上到下':'点击'}顺序成文</p>
         {this.getLabels()}
-        <div className="oper">
+        <div className="oper clearfix">
           <span className={style['clear']} onClick={handleClear}>清空选项</span>
           <span className={style['confirm']} onClick={handleConfirm}>确定</span>
         </div>
       </div>
-    ,domNode)
   }
 }
 

src/components/SpreadDrop/index.less

@@ -6,7 +6,7 @@
 }
 .drop-list{
   .pop;
-  padding:20px 20px 20px 0;
+  padding:8px 20px 25px 0;
   .row{
     display: inline-block;
     // width: 200px;
@@ -24,6 +24,8 @@
     padding-left: 20px;
     cursor: pointer;
     .mult-li;
+    height: 30px;
+    line-height: 30px;
   }
   .selected{
     .select-li;
@@ -49,13 +51,18 @@
 }
 .orderTips{
   color: #bfbfbf;
-  margin:0 0 10px 28px;
+  margin:0 0 0 28px;
 }
 .clear{
   .btnCom;
   .clear;
+  height: auto;
+  line-height: unset;
 }
 .confirm{
   .btnCom;
   .confirm;
+  height: auto;
+  line-height: unset;
+  width: 60px;
 }

src/containers/CheckBody.js

@@ -1,7 +1,7 @@
 import {connect} from 'react-redux';
 import CheckBody from '@components/CheckBody';
 import {getModule,getInitData} from '@store/async-actions/fetchModules.js';
-import {HIDE,RESET,SETDROPSHOW,ISREAD,SEARCH_DROP_LOCATION,MODI_LOADING} from '@store/types/homePage.js';
+import {HIDE,RESET,SETDROPSHOW,ISREAD,MODI_LOADING} from '@store/types/homePage.js';
 import {SELECTSEARCHDATA} from "@store/types/checkBody";
 import {billing} from '@store/async-actions/pushMessage';
 import {didPushParamChange,filterDataArr} from '@utils/tools.js';
@@ -23,8 +23,6 @@ function mapStateToProps(state){
     span:checkBody.span,
     searchInEnd:checkBody.searchInEnd,      //是否在搜索末尾插入结果
     selecteds:checkBody.selecteds,       //普通多选选中状态
-    boxTop:state.homePage.boxTop,
-    boxLeft:state.homePage.boxLeft,
     importLabel:checkBody.importLabel,    //需高亮的标签id
   }
 }
@@ -58,14 +56,6 @@ function mapDispatchToProps(dispatch){
         }
       });
     },
-    getSearchLocation(top,left){
-      dispatch({
-        type:SEARCH_DROP_LOCATION,
-        top:top,
-        left:left,
-        dis:0
-      })
-    }
   }
 }
 

src/containers/CurrentIll.js

@@ -4,11 +4,10 @@ import CurrentIll from '@components/CurrentIll';
 import {INSERT_PROCESS,SET_CURRENT_DATA,SETTEXTMODEVALUE,SET_LABEL_MODULE,SELECT_SEARCHDATA,CLEAR_CURRENT_EDIT,SAVE_CURR_FREE} from '@store/types/currentIll';
 import {pushMessage} from '../store/async-actions/pushContainer';
 import {getModules} from '../store/async-actions/fetchModules.js';
-import {SETDROPSHOW} from '@types/homePage.js';
-import {HIDE,RESET,CLICKCOUNT,ISREAD,SEARCH_DROP_LOCATION} from '@store/types/homePage.js';
+import {HIDE,RESET,CLICKCOUNT,ISREAD,SETDROPSHOW} from '@store/types/homePage';
 import {billing} from '@store/async-actions/pushMessage';
-import {getModule} from '@store/async-actions/fetchModules.js';
-import {didPushParamChange} from '@utils/tools.js';
+import {getModule} from '@store/async-actions/fetchModules';
+import {didPushParamChange} from '@utils/tools';
 import {Notify} from '@commonComp';
 
 function mapStateToProps(state) {
@@ -36,8 +35,6 @@ function mapStateToProps(state) {
         symptomIds:currentIll.symptomIds,//症状id，去重用
         isRead:homePage.isRead,
         fuzhen:diagnosticList.mainSuitStr,//诊断第一个复诊值
-        boxTop:homePage.boxTop,
-        boxLeft:homePage.boxLeft,
         allModules:homePage.allModules,
         // isChronic:!!diagnosticList.chronicMagItem,
         isChronic:mainSuit.chronicDesease?mainSuit.chronicDesease:diagnosticList.chronicMagItem,
@@ -139,15 +136,6 @@ function mapDispatchToProps(dispatch) {
               editClear:bool
             })
         },
-        
-      getSearchLocation(top,left){
-        dispatch({
-          type:SEARCH_DROP_LOCATION,
-          top:top,
-          left:left,
-          dis:0
-        })
-      },
       freeText(item){//自由输入
         dispatch({
           type: SAVE_CURR_FREE,

src/containers/EditableSpan.js

@@ -4,11 +4,11 @@ import {SETCHECKTEXT,SETSEARCHDATA,CHECK_FOCUS_INDEX,CHECKBODY_CLEAR,DEL_CHECKBO
 import {SET_SEARCH,MAIN_FOCUS_INDEX,CLEAR_SEARCH,SETMAINTEXT,DEL_MAIN,REMOVE_MAIN_ID,DEL_MAIN_LABLE} from '@types/mainSuit';
 import {SETOTHERTEXT,SETOTHERSEARCHDATA,OTHER_FOCUS_INDEX,OTHERHIS_CLEAR,DEL_OTHERHIS,REMOVE_OTHER_ID,DEL_OTHERHIS_LABLE} from '@types/otherHistory';
 import {SET_CURRENT_SEARCH,CURRENT_CLEAR,SETCURRENTTEXT,CURRENT_FOCUS_INDEX,DEL_CURRENT,REMOVE_CURR_ID,DEL_CURRENT_LABLE} from '@types/currentIll';
-import {getSearch} from '@store/async-actions/fetchModules.js';
+import {getSearch} from '@store/async-actions/fetchModules';
 import {billing} from '@store/async-actions/pushMessage';
-import {didPushParamChange,storageLocal} from '@utils/tools.js';
-import {SETTEXTFOCUS,SEARCH_DROP_LOCATION,RESET,SETDROPSHOW,ISREAD} from '@types/homePage';
-import config from '@config/index.js';
+import {didPushParamChange,storageLocal} from '@utils/tools';
+import {SETTEXTFOCUS,RESET,SETDROPSHOW,ISREAD} from '@types/homePage';
+import config from '@config/index';
 
 function mapStateToProps(state){//console.log(state)
   return {
@@ -82,16 +82,7 @@ function otherHisSearch(obj) {
 }
 
 function mapDispatchToProps(dispatch,state) {
-  const dis = JSON.stringify(state.saveText) == '[]'?0:60;
   return {
-    setSearchLocation(top,left){
-      dispatch({
-        type:SEARCH_DROP_LOCATION,
-        top:top,
-        left:left,
-        dis:dis
-      })
-    },
     setFocusIndex(obj){//将选中值插入相应位置
 
       const {i,boxMark} = obj;

src/containers/MainSuit.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { connect } from 'react-redux';
 import MainSuit from '@components/MainSuit';
 import {CLEAR_COMSYMPTOMS,SHOW_TAIL,INSERT_MAIN,CLEAR_SEARCH,SET_SEARCH,SAVE_FREE,SET_DATA,INSERT_SEARCH,SETTEXTMODEVALUE,SET_FEATURE,SAVE_CHRONIC,SHOW_HISTORY_BOX,HIDE_HISTORY_BOX} from '@store/types/mainSuit';
-import {RESET,CLICKCOUNT,ISREAD,SEARCH_DROP_LOCATION,MODI_LOADING} from '@store/types/homePage.js';
+import {RESET,CLICKCOUNT,ISREAD,MODI_LOADING} from '@store/types/homePage.js';
 import {getCommSymptoms,getCommSymptomPush} from '@store/async-actions/mainSuit.js'
 import {CLEAR_DIAGNOSE} from '@store/types/diagnosticList';
 import {getSearch,getFeature,autoFillModules} from '@store/async-actions/fetchModules';
@@ -34,8 +34,6 @@ function mapStateToProps(state) {//console.log(state)
     mainIds:mainSuit.mainIds,//选中症状的id，搜索去重用
     isRead:homePage.isRead,
     commSymHide:homePage.commSymHide,
-    boxTop:homePage.boxTop,
-    boxLeft:homePage.boxLeft,
     currentData:state.currentIll.data,
     allModules:homePage.allModules,
     chronicDesease:mainSuit.chronicDesease?mainSuit.chronicDesease:diagnosticList.chronicMagItem,
@@ -164,25 +162,6 @@ function mapDispatchToProps(dispatch) {
             type:CLEAR_DIAGNOSE,
           })
       },
-      getSearchLocation(top,left){
-        dispatch({
-          type:SEARCH_DROP_LOCATION,
-          top:top,
-          left:left,
-          dis:0
-        })
-      },
-      /*async getSymptomFeature(item){
-        const it = item&&item.trim();
-        const symptomFeature = await getFeature(it);
-        if(symptomFeature.data.code==0){
-          const data = symptomFeature.data.data;
-          dispatch({
-            type:SET_FEATURE,
-            data:data
-          })
-        }
-      },*/
       getSymptomFeature(data){
         dispatch({
           type:SET_FEATURE,

src/containers/OtherHistory.js

@@ -2,7 +2,7 @@ import React from 'react';
 import {connect} from 'react-redux';
 import OtherHistory from "../components/OtherHistory";
 import {SETSELECTED,CLEARSELECTED,CONFIRMSELECTED,SELECTOTHERSEARCHDATA,SETDATA,SETTEXTMODEVALUE,OTHEREDICLEAR} from '@types/otherHistory';
-import {HIDE,RESET,ISREAD,SEARCH_DROP_LOCATION} from '@store/types/homePage.js';
+import {HIDE,RESET,ISREAD} from '@store/types/homePage.js';
 import {getModule,setOtherHisModule} from '@store/async-actions/fetchModules.js';
 import {billing} from '@store/async-actions/pushMessage';
 import {didPushParamChange,filterDataArr,fullfillText} from '@utils/tools.js';
@@ -27,8 +27,6 @@ function mapStateToProps(state){
     selecteds:otherHistory.selecteds,       //普通多选选中状态
     editClear:otherHistory.editClear,       //编辑状态
     isRead:state.homePage.isRead,
-    boxTop:state.homePage.boxTop,
-    boxLeft:state.homePage.boxLeft,
   }
 }
 
@@ -86,14 +84,6 @@ function mapDispatchToProps(dispatch,store){
         bool:bool
       })
     },
-    getSearchLocation(top,left){
-      dispatch({
-        type:SEARCH_DROP_LOCATION,
-        top:top,
-        left:left,
-        dis:0
-      })
-    }
   }
 }
 

src/containers/eleType.js

@@ -29,8 +29,6 @@ export function singleRadio(params){
       const custom= JSON.parse(localStorage.getItem('radio'+data.id));
       const list = data.questionDetailList&&data.questionDetailList.length>0?data.questionDetailList:data.questionMapping;
       return <RadioDrop data={custom&&custom.length?[...custom,...list]:list}
-                        prefix={data.labelPrefix}
-                        suffix={data.labelSuffix}
                         placeholder={data.name}
                         show={showArr&&showArr[showInx]}
                         value = {data.value}

src/store/actions/homePage.js

@@ -100,14 +100,7 @@ export const setLabelToEdit = (state,action)=>{
   res.update=Math.random();
   return res;
 };
-//编辑状态
-export const searchDropLocation = (state,action)=>{
-  let res = Object.assign({},state);
-  // console.log(action,'dir')
-  res.boxTop = action.top?action.top:res.boxTop;
-  res.boxLeft = action.left?action.left+action.dis:res.left;
-  return res;
-};
+
 export const getInspectList = (state,action)=>{
   let res = Object.assign({},state);
   res.inspectList = action.data

src/store/reducers/homePage.js

@@ -1,6 +1,6 @@
 import {HIDE,RESET,SETINITDATA,SETDROPSHOW,SETADDITEMINIT,SETT0EDIT,SETREADDITEMS,
-  HIDEDROP,CLICKCOUNT,ISREAD,SETOTHERHISTORY,SETMINSCREEN,MODI_LOADING,SEARCH_DROP_LOCATION,GET_INSPECT_LIST,GET_ASSIST_LIST,SETALLMODULES,SETSYSTEMCONFIG} from '../types/homePage.js';
-import {showDrop,setAddItemInit,setLabelToEdit,confirmHide,clickNum,searchDropLocation,getInspectList,getAssistList} from '../actions/homePage.js';
+  HIDEDROP,CLICKCOUNT,ISREAD,SETOTHERHISTORY,SETMINSCREEN,MODI_LOADING,GET_INSPECT_LIST,GET_ASSIST_LIST,SETALLMODULES,SETSYSTEMCONFIG} from '../types/homePage.js';
+import {showDrop,setAddItemInit,setLabelToEdit,confirmHide,clickNum,getInspectList,getAssistList} from '../actions/homePage.js';
 
 const initState = {
   totalHide:false,
@@ -63,8 +63,6 @@ export default function (state=initState,action) {
       // res.loadingFlag = false;
       res.loadingFlag = action.flag;
       return res;
-    case SEARCH_DROP_LOCATION:
-      return searchDropLocation(state,action);
     case GET_INSPECT_LIST:
       return getInspectList(state,action);
     case GET_ASSIST_LIST:

src/store/types/homePage.js

@@ -12,7 +12,6 @@ export const ISREAD = 'is_history_or_template';     //是否回读或模板数
 export const SETOTHERHISTORY = 'set_otherHis_history';    //其他史历史数据暂存
 export const SETMINSCREEN = 'SETMINSCREEN';    //1024标识
 export const MODI_LOADING = 'MODI_LOADING';    //1024标识
-export const SEARCH_DROP_LOCATION = 'SEARCH_DROP_LOCATION';    //1024标识
 export const GET_ASSIST_LIST = 'GET_ASSIST_LIST';    //辅检
 export const GET_INSPECT_LIST = 'GET_INSPECT_LIST';    //化验
 export const SETALLMODULES = 'SETALLMODULES';    //储存所有模板数据