Преглед изворни кода

Merge branch 'dev5.3.1' into dev/new1

luolei пре 5 година
родитељ
комит
93466c9d1e

+ 21 - 22
src/components/PushItems/PushDiag/index.jsx

@@ -3,7 +3,7 @@ import style from './index.less';
 import DiagnosticItem from '@containers/DiagnosticItem'
 import showImg from "@common/images/show.png";
 import hideImg from "@common/images/close.png";
-
+import $ from 'jquery'
 
 /***
  * 接收参数:
@@ -18,8 +18,10 @@ class PushDiag extends Component {
     constructor(props) {
         super(props)
         this.state = {
-            showMore: true,
+            domH:'',
+            showSlide:true
         }
+        this.$ide = React.createRef()
         this.handleShow = this.handleShow.bind(this)
     }
     componentWillMount() {
@@ -27,37 +29,34 @@ class PushDiag extends Component {
             moreNum: this.props.maxShowNum
         })
     }
-
-    handleShow(ItemNum) {
+    componentDidMount(){
+        let domH = this.$ide.current.offsetHeight
+        this.setState({
+            domH:domH
+        })
+    }
+    handleShow() {
         this.setState({
-            showMore: !this.state.showMore
-        },()=>{
-            this.setState({
-                moreNum: this.state.showMore ?  this.props.maxShowNum : ItemNum
-            })
+            showSlide:!this.state.showSlide
         })
     }
 
     render() {
-        const { icon, title, titleBg,  diagList, maxShowNum } = this.props
-        const { showMore,moreNum } = this.state
+        const { icon, title, titleBg,  diagList } = this.props
+        const { domH,showSlide } = this.state
         let ItemNum = 0;
         return (<div className={style['push-diag-wrapper']}>
             <h1 className={style['push-diag-title']} style={{background:titleBg}}><img className={style['push-diag-icon']} src={icon} />{title}</h1>
-            <div className={style['push-diag-box']}>
-                {maxShowNum ? diagList.map((item, index) => {
-                    ItemNum = ItemNum + item.name.length + 1;
-                    if (ItemNum <= moreNum) {
+            <div className={`${style['push-diag-box']} ${domH>50&&showSlide?style['push-diag-more-slide-d']:style['push-diag-more-slide-u']}`} ref={this.$ide}>
+                {
+                    diagList.map((item, index) => {
+                        ItemNum = ItemNum + item.name.length + 1;
                         return <div key={item.id} className={style['push-diag-item']}><DiagnosticItem item={item} type='disSelect'/></div>
-                    }
-                }) : diagList.map((item, index) => {
-                return <div key={item.id} className={style['push-diag-item']}><DiagnosticItem item={item} type='disSelect'/></div>
-                })}
-                {ItemNum > maxShowNum && <div onClick={() => this.handleShow(ItemNum)} className={style['push-diag-more']}>{showMore ? ' 更多': '收起'}<img className={style['push-diag-more-icon']} src={showMore ? showImg : hideImg}/></div>}
+                    })
+                }
+                {domH>50&&<div onClick={() => this.handleShow()} className={`${style['push-diag-more']} ${showSlide?style['push-diag-more-d']:style['push-diag-more-u']}`}>{showSlide ? ' 更多': '收起'}<img className={style['push-diag-more-icon']} src={showSlide ? showImg : hideImg}/></div>}
 
             </div>
-            
-            
         </div>)
     }
 } 

+ 17 - 1
src/components/PushItems/PushDiag/index.less

@@ -14,7 +14,8 @@
     margin-right: 5px;
 }
 .push-diag-box {
-    padding: 0 0 15px 15px;
+    padding: 5px 0 15px 15px;
+    position: relative;
 }
 .push-diag-item {
     display: inline-block;
@@ -29,6 +30,13 @@
     clear: both;
     margin-top: 10px;
     margin-right: 9px;
+}
+.push-diag-more-d {
+    position: absolute;
+    right: 0;
+    top: 5px;
+}
+.push-diag-more-u {
     float: right;
 }
 .push-diag-box:after{display:block;clear:both;content:"";visibility:hidden;height:0}
@@ -37,4 +45,12 @@
     width: 10px;
     height: 10px;
     position: relative;
+}
+.push-diag-more-slide-d {
+    padding-right: 55px;
+    overflow: hidden;
+    height: 44px;
+}
+.push-diag-more-slide-u {
+    height: auto;
 }

+ 1 - 1
src/components/PushItems/RecommendInspect/index.jsx

@@ -8,7 +8,7 @@ class RecommendInspect extends Component {
     constructor(props) {
         super(props)
         this.state = {
-            showAll: false,
+            showAll: false
         }
         this.renderItem = this.renderItem.bind(this)
     }

+ 0 - 3
src/components/PushItems/index.jsx

@@ -199,7 +199,6 @@ class PushItems extends Component {
                 icon={doubtImg}
                 title="初步诊断"
                 diagList={doubt}
-                maxShowNum={24}
               />
             )}
             {possible && possible.length > 0 && (
@@ -208,7 +207,6 @@ class PushItems extends Component {
                 icon={possibleImg}
                 title="可能诊断"
                 diagList={possible}
-                maxShowNum={24}
               />
             )}
             {likely && likely.length > 0 && (
@@ -217,7 +215,6 @@ class PushItems extends Component {
                 icon={likelyImg}
                 title="鉴别诊断"
                 diagList={likely}
-                maxShowNum={24}
               />
             )}
             <div className={style["diagnose"]}>