知识搜索滚动条添加，enter

src/components/MedicalInfo/index.jsx

@@ -8,7 +8,6 @@ class MedicalInfo extends Component {
         super(props);
         this.$inp = React.createRef();
         this.$cont = React.createRef();
-        this.$contList = React.createRef();
         this.state={
           val:''
         };
@@ -16,6 +15,7 @@ class MedicalInfo extends Component {
         this.handleChange = this.handleChange.bind(this);
         this.clear = this.clear.bind(this);
         this.getSearchList = this.getSearchList.bind(this);
+        this.handleEnter = this.handleEnter.bind(this);
     }
     getSearchList() {
         const { getAllConceptDetail,searchResult } = this.props;
@@ -37,6 +37,11 @@ class MedicalInfo extends Component {
         val:this.$inp.current.value
       });
   }
+  handleEnter(e){
+      if(e.keyCode==13){
+        this.search();
+      }
+  }
   clear(){
     this.$inp.current.value = '';
     this.setState({
@@ -44,14 +49,12 @@ class MedicalInfo extends Component {
     });
   }
   componentDidMount(){
-    const height = getWindowInnerHeight()-234;
+    const height = getWindowInnerHeight()-170;
     this.$cont.current.style.height = height+"px";
-    this.$contList.current.style.height = height-30+"px";
     if(this.$cont.current){
       windowEventHandler('resize', ()=>{
-        const height = getWindowInnerHeight()-234;
+        const height = getWindowInnerHeight()-170;
         this.$cont.current.style.height = height+"px";
-        this.$contList.current.style.height = height-30+"px";
       });
     }
   }
@@ -59,27 +62,24 @@ class MedicalInfo extends Component {
         const {searchResult} = this.props;
         const {val} = this.state;
         return (
-        <div className={style['mefical-info-wrapper']}>
-            <div className={style['search-cont']}>
+            <div className={style['search-cont']} ref={this.$cont}>
+              <div className={style['search-box']}>
                 <p className={style['title']}>医学知识搜索</p>
                 <p className={style['cont']}>
-                  <input type="text" className={style['input']} ref={this.$inp} onInput={this.handleChange}/>
+                  <input type="text" className={style['input']} ref={this.$inp} onInput={this.handleChange} onKeyUp={this.handleEnter}/>
                   {val?<img src={delIcon} alt="清空" onClick={this.clear}/>:''}
                   <button onClick={this.search}>搜索</button>
                 </p>
-                <div className={style['result-box']} ref={this.$cont}>
-                  <div className={style['result']} style={searchResult&&searchResult.length>0? {'display': 'block'} : {'display': 'none'}}>
-                      <p className={style['title']}>查询内容</p>
-                      <ul className={style['result-list']} ref={this.$contList}>
-                        {this.getSearchList()}
-                      </ul>
-                  </div>
-                  <p className={style['no-data']} style={searchResult&&searchResult.length>0? {'display': 'none'} : {'display': 'block'}}>暂无搜索结果！</p>
-                </div>
-              
+              </div>
+              {searchResult&&searchResult.length>0?<div className={style['result']}>
+                    <p className={style['title']}>查询内容</p>
+                    <ul>
+                      {this.getSearchList()}
+                    </ul>
+              </div>:<p className={style['no-data']}>暂无搜索结果！</p>}
              </div>
-        </div>
-        
+
+
         )
 
         

src/components/MedicalInfo/index.less

@@ -7,6 +7,17 @@
     position: relative;
 }
 .search-cont{
+    padding: 0px 15px;
+    line-height: 20px;
+    position: relative;
+    overflow: hidden;
+    .search-box{
+        position: fixed;
+        z-index: 9;
+        background: #fff;
+        width: 430px;
+        padding: 0 0 15px;
+    }
     .cont{
         position: relative;
         img{
@@ -37,15 +48,14 @@
         line-height: 34px;
         color: #fff;
         background: #2A9BD5;
-        border:1px #2A9BD5 solid;
         text-align: center;
         border: none;
     }
-    .result-list {
-        overflow: auto;
-    }
     .result{
-        padding-top: 15px;
+        padding: 78px 5px 0 0;
+        height: 100%;
+        overflow: auto;
+        box-sizing: border-box;
         li{
             border-bottom:1px #CECECE solid;
             line-height: 42px;
@@ -78,5 +88,6 @@
         color:#979797;
         text-align: center;
         line-height: 40px;
+        margin-top: 66px;
     }
 }

src/components/ScaleSearch/index.jsx

@@ -8,13 +8,13 @@ class ScaleSearch extends Component {
     super(props);
     this.$inp = React.createRef();
     this.$cont = React.createRef();
-    this.$contList = React.createRef();
     this.state={
       val:''
     };
     this.search = this.search.bind(this);
     this.handleChange = this.handleChange.bind(this);
     this.clear = this.clear.bind(this);
+    this.handleEnter = this.handleEnter.bind(this);
   }
   getResult(id){
     const {formulaResult} = this.props;
@@ -52,6 +52,11 @@ class ScaleSearch extends Component {
       val:this.$inp.current.value
     });
   }
+  handleEnter(e){
+    if(e.keyCode==13){
+      this.search();
+    }
+  }
   clear(){
     this.$inp.current.value = '';
     this.setState({
@@ -59,14 +64,12 @@ class ScaleSearch extends Component {
     });
   }
   componentDidMount(){
-    const height = getWindowInnerHeight()-234;
+    const height = getWindowInnerHeight()-170;
     this.$cont.current.style.height = height+"px";
-    this.$contList.current.style.height = height-30+"px";
     if(this.$cont.current){
       windowEventHandler('resize', ()=>{
-        const height = getWindowInnerHeight()-234;
+        const height = getWindowInnerHeight()-170;
         this.$cont.current.style.height = height+"px";
-        this.$contList.current.style.height = height-30+"px";
       });
     }
   }
@@ -74,30 +77,26 @@ class ScaleSearch extends Component {
     const {searchResult} = this.props;
     const {val} = this.state;
     return (
-      <div className={style['mefical-info-wrapper']}>
-            <div className={style['search-cont']}>
-                <p className={style['title']}>量表搜索</p>
-                <p className={style['cont']}>
-                  <input type="text" className={style['input']} ref={this.$inp} onInput={this.handleChange}/>
-                  {val?<img src={delIcon} alt="清空" onClick={this.clear}/>:''}
-                  <button onClick={this.search}>搜索</button>
-                </p>
-                <div className={style['result-box']} ref={this.$cont}>
-                  <div className={style['result']} style={searchResult&&searchResult.length>0? {'display': 'block'} : {'display': 'none'}}>
-                      <p className={style['title']}>查询内容</p>
-                      <ul className={style['result-list']} ref={this.$contList}>
-                        {this.getSearchList()}
-                      </ul>
-                  </div>
-                  <p className={style['no-data']} style={searchResult&&searchResult.length>0? {'display': 'none'} : {'display': 'block'}}>暂无搜索结果！</p>
-                </div>
-              
-             </div>
+        <div className={style['search-cont']} ref={this.$cont}>
+          <div className={style['search-box']}>
+            <p className={style['title']}>量表搜索</p>
+            <p className={style['cont']}>
+              <input type="text" className={style['input']} ref={this.$inp} onInput={this.handleChange} onKeyUp={this.handleEnter}/>
+              {val?<img src={delIcon} alt="清空" onClick={this.clear}/>:''}
+              <button onClick={this.search}>搜索</button>
+            </p>
+          </div>
+          {searchResult&&searchResult.length>0?<div className={style['result']}>
+            <p className={style['title']}>查询内容</p>
+            <ul>
+              {this.getSearchList()}
+            </ul>
+          </div>:<p className={style['no-data']}>暂无搜索结果！</p>}
         </div>
-
     )
 
 
+
   }
 }
 

src/components/ScaleSearch/index.less

@@ -7,6 +7,17 @@
   position: relative;
 }
 .search-cont{
+  padding: 0px 15px;
+  line-height: 20px;
+  position: relative;
+  overflow: hidden;
+  .search-box{
+    position: fixed;
+    z-index: 9;
+    background: #fff;
+    width: 430px;
+    padding: 0 0 15px;
+  }
   .cont{
     position: relative;
     img{
@@ -37,15 +48,14 @@
     line-height: 34px;
     color: #fff;
     background: #2A9BD5;
-    border:1px #2A9BD5 solid;
     text-align: center;
     border: none;
   }
-  .result-list {
-    overflow: auto;
-  }
   .result{
-    padding-top: 15px;
+    padding: 78px 5px 0 0;
+    height: 100%;
+    overflow: auto;
+    box-sizing: border-box;
     li{
       border-bottom:1px #CECECE solid;
       line-height: 42px;
@@ -83,5 +93,6 @@
     color:#979797;
     text-align: center;
     line-height: 40px;
+    margin-top: 66px;
   }
 }