Selaa lähdekoodia

弹窗显示位置设置

luolei 5 vuotta sitten
vanhempi
commit
8e807f71f1

+ 7 - 2
src/components/AddAssistCheck/index.jsx

@@ -3,7 +3,7 @@ import { SearchOption, Calendar, ConfirmModal, Notify, Add ,DelToast} from '@com
 import styles from './index.less';
 import $ from 'jquery';
 import Textarea from './Textarea';
-import { getPageCoordinate,getCurrentDate } from '@utils/tools';
+import { getPageCoordinate,getCurrentDate,setPosition } from '@utils/tools';
 import ScrollArea from 'react-scrollbar';
 
 class AddAssistCheck extends React.Component {
@@ -31,10 +31,14 @@ class AddAssistCheck extends React.Component {
     $(document).click((event) => {
       let _con = $('#searchWrapAssist');   // 设置目标区域
       let _cons = $('#datePick');   // 设置目标区域
+      // let _conClick = $('#assistCheck');   // 点击的按钮
       let _del = document.getElementById("delBox");   // 删除弹窗
       let _close = document.getElementById("assiClose");   // 删除icon
       let _closeTil = $('#delTit')[0];   // 弹窗标题
       if (_con && searchWrapAssist != event.target && !_con.is(event.target) && _con.has(event.target).length === 0) { // Mark 1
+        if(this.state.show){
+          this.props.setHighter(0)
+        }
         this.setState({ show: false });
       }
       if (!_cons.is(event.target) && _cons.has(event.target).length === 0 || event.target.isEqualNode(_close)) { // Mark 1
@@ -86,7 +90,8 @@ class AddAssistCheck extends React.Component {
   handleSearchShow(e) {
     let tmpShow = this.state.show;
     this.setState({ show: !tmpShow,pageTop:getPageCoordinate(e).boxTop })
-    // e.stopPropagation();
+    // e.stopPropagation(); 
+    setPosition(e,"#searchOption",this.props.setHighter)   
   }
   handleShowDate(idx) {
     this.setState({

+ 2 - 11
src/components/AddInspect/SlideSelect/index.jsx

@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import styles from "./index.less";
-import { normalVal,timestampToTime,getPageCoordinate } from '@utils/tools';
+import { normalVal,timestampToTime,getPageCoordinate,setPosition } from '@utils/tools';
 import { InspectCommon, Calendar,DelToast} from '@commonComp';
 import slideUp from "@common/images/slide-up.png";
 import slideDown from "@common/images/slide-down.png";
@@ -88,16 +88,7 @@ class SlideSelect extends Component {
     handleLabelSub(e,questionId,idx);
     handleFillShow(e,idx);
     //弹窗高度超出屏幕,增加页面高度
-    setTimeout(function(){
-      const listHeight =$(listDom.current).height();
-      const contHt = listHeight>358?450:(100+listHeight);
-      const lastHt = windowHeight-getPageCoordinate(e).boxTop;
-      if(lastHt < contHt){
-        //console.log(windowHeight,getPageCoordinate(e).boxTop,contHt,lastHt)
-        setHighter(contHt-lastHt+80);
-      }
-    });
-
+    setPosition(e,"#inspectFill",setHighter)
   }
   render() {
     const {getInfomation,handleConfirm,changeActivePart,handleDelClick,getItemList,date,item,idx,handleFillShow,showDetails,showFill,changeShowFill,handlePush,dateTime,currentIdx,currentData,fillActive,handleShowDate,handleChangeDate,showToast} = this.props;

+ 9 - 1
src/components/AddInspect/index.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { SearchOption, InspectCommon, Calendar, Notify, ConfirmModal, Add, DelToast } from '@commonComp';
 import SlideExcel from './SlideExcel';
 import SlideSelect from './SlideSelect';
-import { deepClone, getPageCoordinate, getStatusImg ,getCurrentDate} from '@utils/tools';
+import { deepClone, getPageCoordinate, getStatusImg ,getCurrentDate,setPosition} from '@utils/tools';
 import styles from './index.less';
 import ScrollArea from 'react-scrollbar';
 import store from '@store';
@@ -90,11 +90,17 @@ class Inspect extends React.Component {
       let _closeTil = $('#delTit')[0];   // 弹窗标题
       if (searchOption) {
         if (searchOption != event.target && searchWrap != event.target && searchWrap != event.target.parentNode && !$.contains(searchOption, event.target)) { // Mark 1
+          if(this.state.show){
+            this.props.setHighter(0)
+          }
           this.setState({ show: false });
         }
       }
       if (inspectFill) {
         if ($(event.target).attr('id') != "getSureTime"&&event.target.getAttribute('data-flg') != 'current' && inspectFill != event.target && !$.contains(inspectFill, event.target)) { // Mark 1
+          if(this.state.showFill){
+            this.props.setHighter(0)
+          }
           this.setState({ showFill: false, date: false });
         }
       }
@@ -117,6 +123,7 @@ class Inspect extends React.Component {
   }
   changeShowFill() {
     this.setState({ showFill: false })
+    this.props.setHighter(0)
   }
   handleChangeDate(info) {
     // let date = info.year+'-'+info.month.toString().padStart(2,'0')+'-'+info.day.toString().padStart(2,'0')
@@ -127,6 +134,7 @@ class Inspect extends React.Component {
     let tmpShow = this.state.show;
     this.setState({ show: !tmpShow, pageTop: getPageCoordinate(e).boxTop })
     // e.stopPropagation();
+    setPosition(e,"#searchOption",this.props.setHighter)
   }
   handleFillShow(e, idx) {
     let tmpShow = this.state.showFill;

+ 2 - 1
src/components/AssistCheck/index.jsx

@@ -65,7 +65,7 @@ class AssistCheck extends React.Component {
 
   }
     render(){
-        const {checkedListImport,list,getInfomation,windowHeight,hospitalMsg,assistLabel,assistVal,handleChangeValue,handleSign,fetchPushInfos,handleDelAssist,handleChangeAssistValue,handleChangeDate,isRead,winWidth,assistList} = this.props;
+        const {setHighter,checkedListImport,list,getInfomation,windowHeight,hospitalMsg,assistLabel,assistVal,handleChangeValue,handleSign,fetchPushInfos,handleDelAssist,handleChangeAssistValue,handleChangeDate,isRead,winWidth,assistList} = this.props;
         const {showSlideImport,checkSystemIpt,onClose,closeInIcss} = this;
         const {importLis,ieVersion,hide} = this.state;
         // if(JSON.stringify(hospitalMsg) != {} && document.getElementById("choose")){//动态绑定只绑定一次
@@ -132,6 +132,7 @@ class AssistCheck extends React.Component {
                             assistVal={assistVal}
                             windowHeight={windowHeight}
                             checkedListImport={checkedListImport}
+                            setHighter={setHighter}
                         >
                         </AddAssistCheck>
                     </div>

+ 1 - 0
src/components/DiagResultSearch/index.jsx

@@ -28,6 +28,7 @@ class DiagResultSearch extends Component {
         } else {
           if (e.target != diagSearch && e.target != addDiag && e.target.parentNode != addDiag && !$.contains(diagSearch, e.target)) {
             that.props.hideSearch();
+            that.props.setHighter(0)
           }
 
 

+ 5 - 3
src/components/Diagnosis/index.jsx

@@ -1,8 +1,9 @@
 import React, { Component } from 'react';
 import { Button, ItemBox, ConfirmModal, Loading, Message, Add } from '@commonComp';
 import DiagnosticList from '@containers/DiagnosticList.js';
-import { getPageCoordinate } from '@utils/tools';
-import DiagResultSearch from '@containers/DiagResultSearch'
+import { getPageCoordinate,setPosition  } from '@utils/tools';
+import DiagResultSearch from '@containers/DiagResultSearch';
+import $ from 'jquery';
 
 class Diagnosis extends Component {
   constructor(props) {
@@ -37,6 +38,7 @@ class Diagnosis extends Component {
   handleshowSearch(e) {
     this.props.show ? this.hideSearch() : this.showSearch()
     this.setState({ pageTop:getPageCoordinate(e).boxTop })
+    setPosition(e,"#searchOption",this.props.setHighter)
   }
   refreshScroller(){
     //更新滚动条状态,解决容器变大滚动条不更新bug
@@ -52,7 +54,7 @@ class Diagnosis extends Component {
         <div style={{ marginLeft: '10px', position: 'relative' }}>
           <Add showText="添加诊断结果" handleClick={this.handleshowSearch} id="addDiag" height="50px" />
           <DiagResultSearch
-            refreshScroller={this.refreshScroller} windowHeight={this.props.windowHeight} pageTop={this.state.pageTop} height={150}></DiagResultSearch>
+            refreshScroller={this.refreshScroller} setHighter={this.props.setHighter} windowHeight={this.props.windowHeight} pageTop={this.state.pageTop} height={150}></DiagResultSearch>
         </div>
 
 

+ 7 - 5
src/components/EMRContainer/index.jsx

@@ -38,8 +38,10 @@ class EMRContainer extends Component {
         });
     }
     setHighter(ht){
-      console.log(this.$div.current.scrollHeight);
-      this.$div.current.style.paddingBottom = ht+'px';
+      // console.log(this.$div.current.scrollHeight);
+      if(this.$div.current){
+        this.$div.current.style.paddingBottom = ht+'px';
+      }
     }
     render() {
         const contStyle={
@@ -59,7 +61,7 @@ class EMRContainer extends Component {
                       verticalScrollbarStyle={barStyle}
                       contentClassName="content">
           <InfoTitle></InfoTitle>
-            <div className={style['inner']} ref={this.$div}>
+            <div className={style['inner']} id="EmrContainer" ref={this.$div}>
                 <MainSuit></MainSuit>
                 <CurrentIll></CurrentIll>
                 <OtherHistory></OtherHistory>
@@ -67,8 +69,8 @@ class EMRContainer extends Component {
                   <CheckBody></CheckBody>
                 </div>
                 <Inspect setHighter={this.setHighter}></Inspect>
-                <AssistCheck></AssistCheck>
-                <Diagnosis></Diagnosis>
+                <AssistCheck setHighter={this.setHighter}></AssistCheck>
+                <Diagnosis setHighter={this.setHighter}></Diagnosis>
                 <AdviceContainer></AdviceContainer>
             </div>
             <OperationContainer></OperationContainer>

+ 19 - 4
src/utils/tools.js

@@ -15,6 +15,7 @@ import { SET_READ_MODE } from "@store/types/typeConfig";
 import config from '@config/index';
 import up from '@images/up.png';
 import down from '@images/down.png';
+import $ from 'jquery';
 
 
 /***
@@ -1366,7 +1367,21 @@ function shiftLocalDelTag(){
   deledTags.shift();
   localStorage.setItem('deletedTags',JSON.stringify(deledTags));
 }
-
+//弹窗显示问题
+function setPosition (e,dom,setHighter){
+  setTimeout(()=>{
+    const contHt =$(dom).height();
+    const wrapHt = $("#EmrContainer").height();//滚动区域高度
+    const clickHt = getPageCoordinate(e).boxTop;//点击高度
+    const scrollHt = Math.abs(parseFloat($("#EmrContainer").parent('.scrollarea-content').css('margin-top'))) //滚动区滚动的距离
+    let btmHt = wrapHt-(clickHt-111)-scrollHt;//点击位置距离底部的距离
+    // console.log(wrapHt,clickHt,scrollHt,btmHt,contHt)
+    if(btmHt<contHt){
+      setHighter(contHt-btmHt+20);
+    }
+    // $(e.target)[0].scrollIntoView(true);
+  },10);
+}
 module.exports = {
     checkType: Type.checkType,
     getIds,
@@ -1420,7 +1435,7 @@ module.exports = {
     getPushList,
     getAllString,
     resetTagtype,
-  handleLocalDelTag,
-  shiftLocalDelTag,
-
+    handleLocalDelTag,
+    shiftLocalDelTag,
+    setPosition
 };