Browse Source

右侧点击计算公式位置修改(2842)

zhangxc 5 năm trước cách đây
mục cha
commit
2790be4cb2
1 tập tin đã thay đổi với 31 bổ sung11 xóa
  1. 31 11
      src/components/ChronicInfo/index.jsx

+ 31 - 11
src/components/ChronicInfo/index.jsx

@@ -51,6 +51,8 @@ class ChronicInfo extends React.Component{
     };
     };
     this.$result = React.createRef();
     this.$result = React.createRef();
     this.$content = React.createRef();
     this.$content = React.createRef();
+    this.$calcuFormula = React.createRef();
+    this.$resultLikely = React.createRef();
     this.showInfo = this.showInfo.bind(this);
     this.showInfo = this.showInfo.bind(this);
     this.closeInfo = this.closeInfo.bind(this);
     this.closeInfo = this.closeInfo.bind(this);
     this.showOption = this.showOption.bind(this);
     this.showOption = this.showOption.bind(this);
@@ -96,16 +98,24 @@ class ChronicInfo extends React.Component{
       infoId:null
       infoId:null
     })
     })
   }
   }
-  showOption(id){
+  showOption(id,e){
     this.setState({
     this.setState({
       optionId:id,
       optionId:id,
       formulaId:null //关闭计算公式
       formulaId:null //关闭计算公式
     });
     });
     const {patDom} = this.props;
     const {patDom} = this.props;
     const ht = $(patDom.current).height();
     const ht = $(patDom.current).height();
-    setTimeout(function(){
-      $(patDom.current).scrollTop(ht+200);
-    })
+    const bottom = ht+120-e.clientY
+    
+    // setTimeout(function(){
+
+    //   $(patDom.current).scrollTop(ht);
+    // })
+    if(bottom < 220) {
+      setTimeout(()=>{
+        this.$resultLikely.current.scrollIntoView(true)
+      })
+    }
   }
   }
   closeOption(){
   closeOption(){
     // 关闭-有可能结果则保持与结果一致,没有就保持最新选择的内容
     // 关闭-有可能结果则保持与结果一致,没有就保持最新选择的内容
@@ -190,18 +200,28 @@ class ChronicInfo extends React.Component{
       ff:false
       ff:false
     })
     })
   }
   }
- 
-  showFormula(id){//计算公式
+  showFormula(id,e){//计算公式
     this.setState({
     this.setState({
       formulaId:id,
       formulaId:id,
       optionId:null  //关闭可能结果
       optionId:null  //关闭可能结果
     });
     });
     const {patDom} = this.props;
     const {patDom} = this.props;
     const ht = $(patDom.current).height();
     const ht = $(patDom.current).height();
-    setTimeout(function(){
-      $(patDom.current).scrollTop(ht+200);
-    })
+  
+    const bottom = ht+120-e.clientY
+    
+    // setTimeout(function(){
+
+    //   $(patDom.current).scrollTop(ht);
+    // })
+    if(bottom < 340) {
+      setTimeout(()=>{
+        this.$calcuFormula.current.scrollIntoView(true)
+      })
+    }
+   
   }
   }
+
   closeFormula(it){
   closeFormula(it){
     const {formulaId,isCalculated} =this.state;
     const {formulaId,isCalculated} =this.state;
     if(!isCalculated){
     if(!isCalculated){
@@ -415,7 +435,7 @@ class ChronicInfo extends React.Component{
                           // const details = calcuValues&&calcuValues[v.conceptId]||it.content.details;
                           // const details = calcuValues&&calcuValues[v.conceptId]||it.content.details;
                           //每次都取最新推送内容
                           //每次都取最新推送内容
                           const details = it.content.details || [];
                           const details = it.content.details || [];
-                          return <div className={style["marTop"]}>
+                          return <div className={style["marTop"]}  ref={this.$calcuFormula}>
                             <span className={style["limit"]}>
                             <span className={style["limit"]}>
                               计算公式结果:
                               计算公式结果:
                               <i className={style["blue"]} onClick={this.showFormula.bind(this,v.conceptId)}>{result?result:'请选择'}</i>
                               <i className={style["blue"]} onClick={this.showFormula.bind(this,v.conceptId)}>{result?result:'请选择'}</i>
@@ -484,7 +504,7 @@ class ChronicInfo extends React.Component{
                             </MiniToast>}
                             </MiniToast>}
                           </div>
                           </div>
                         }else if(it.type==3){
                         }else if(it.type==3){
-                          return <div className={style["marTop"]}>
+                          return <div className={style["marTop"]} ref={this.$resultLikely}>
                             <span className={style["limit"]}>
                             <span className={style["limit"]}>
                               可能结果:
                               可能结果:
                               <i onClick={this.showOption.bind(this,v.conceptId)} className={style["blue"]}>{possible[v.conceptId]?possible[v.conceptId]:'请选择'}</i>
                               <i onClick={this.showOption.bind(this,v.conceptId)} className={style["blue"]}>{possible[v.conceptId]?possible[v.conceptId]:'请选择'}</i>