修改治疗方案样式

src/components/Treat/DrugTreat/index.jsx

@@ -43,21 +43,25 @@ class DrugTreat extends Component {
                 <h3 className={style['drug-title']}><img className={style['drug-icon']} src={drugIcon}/> 常用药物治疗</h3>
                 {treatment.map((item, index) => {
                     return(<div className={style['drug-content']}>
-                        {index + 1 + '. ' }{item.drugsName}:&nbsp;
-                        {item.medicitionsList.map((it, ii) => {
-                            return ((it.isShow == 1 || it.selected) && <span style={it.forbidden === '2' ? {opacity: '0.3', filter:'alpha(opacity=30)'} : ''}>
-                                    {ii === 0 ? '' : ', '}
-                                    <span className={style['drug-name']}  
-                                          onDoubleClick={() =>{this.setDrugInfo(it);showDrugInfo();}} 
-                                          onClick={()=>{it.forbidden === '2' ? '' : this.handleSelect(index,ii)}} style={it.selected ? {color: '#3B9ED0', borderBottom: '1px solid #3B9ED0'}:''}>
-                                        {it.medicitionName}
-                                    </span>
-                                    {/* {it.showInfo && it.showInfo==='1'&& <img className={style['info-img']} src={info} onClick={() =>{this.setDrugInfo(it);showDrugInfo();}}/>} */}
-                                    {it.forbidden === '1' ? <span className={style['info-flag']} style={{border: '1px solid #F4C051', background: '#F4C051',marginLeft: '5px'}}>慎用</span>: it.forbidden === '2' ? <span className={style['info-flag']} style={{border: '1px solid #000',marginLeft: '5px'}}>禁用</span> : ''}, 使用率{it.rate}
-                                    
-                                </span>)
-                        })}
-                        {<span className={style['drug-more']} onClick={() =>this.setOtherRecommend(item, index)} ><img className={style['info-img']} src={more} />更多同类药</span> }
+                        <div  className={style['drug-name-box']}>
+                            {index + 1 + '. ' }{item.drugsName}:&nbsp;
+                            {item.medicitionsList.map((it, ii) => {
+                                return ((it.isShow == 1 || it.selected) && <span style={it.forbidden === '2' ? {opacity: '0.3', filter:'alpha(opacity=30)'} : ''}>
+                                        {ii === 0 ? '' : ', '}
+                                        <span className={style['drug-name']}  
+                                            onDoubleClick={() =>{this.setDrugInfo(it);showDrugInfo();}} 
+                                            onClick={()=>{it.forbidden === '2' ? '' : this.handleSelect(index,ii)}} style={it.selected ? {color: '#3B9ED0', borderBottom: '1px solid #3B9ED0'}:''}>
+                                            {it.medicitionName}
+                                        </span>
+                                        {/* {it.showInfo && it.showInfo==='1'&& <img className={style['info-img']} src={info} onClick={() =>{this.setDrugInfo(it);showDrugInfo();}}/>} */}
+                                        {it.forbidden === '1' ? <span className={style['info-flag']} style={{border: '1px solid #F4C051', background: '#F4C051',marginLeft: '5px'}}>慎用</span>: it.forbidden === '2' ? <span className={style['info-flag']} style={{border: '1px solid #000',marginLeft: '5px'}}>禁用</span> : ''}, 使用率{it.rate}
+                                        
+                                    </span>)
+                            })}
+
+                        </div>
+                        {<div className={style['drug-more']} onClick={() =>this.setOtherRecommend(item, index)} ><img className={style['info-img']} src={more} />更多同类药</div> }
+                        
                     </div>)
                 })}
             </div>

src/components/Treat/DrugTreat/index.less

@@ -9,6 +9,7 @@
     margin: 10px;
 }
 .drug-content {
+    position: relative;
     line-height: 36px;
     border-bottom: 1px dashed #D2D2D2;
 }
@@ -31,10 +32,16 @@
     text-align: center;
 }
 .drug-more {
-    display: inline-block;
     cursor: pointer;
-    float: right;
     color: #3B9ED0;
+    position: absolute;
+    right: 0;
+    top: 50%;
+    margin-top: -18px;
+}
+.drug-name-box {
+    float: left;
+    width: 530px;
 }
 .drug-content:after{display:block;clear:both;content:"";visibility:hidden;height:0}
 .drug-content{zoom:1}

src/components/Treat/index.jsx

@@ -7,8 +7,8 @@ import DrugInfo from '@components/TreatDesc/DrugInfo';
 import Notify from '@commonComp/Notify'
 import close from './img/close.png';
 import generalIcon from './img/general.png';
-
 import surgicalIcon from './img/surgical.png';
+import $ from "jquery";
 
 class Treat extends Component {
     constructor(props){
@@ -19,6 +19,7 @@ class Treat extends Component {
     }
 
     hideTreat() {
+        $('#treatDescBox').css({'display': 'none'});
         const { hideTreat,clearTreat } = this.props;
         clearTreat && clearTreat();
         hideTreat && hideTreat();

src/components/TreatDesc/DrugInfo/index.less

@@ -7,7 +7,7 @@
     margin-left: -425px;
     margin-top: -340px;
     background: #fff;
-    z-index: 103;
+    z-index: 303;
     
 }
 .drug-desc-wrapper {

src/components/TreatDesc/index.jsx

@@ -27,7 +27,7 @@ class TreatDesc extends Component {
         const { title, basic, otherDrugIndex, drugDesc} = treatDesc
         return (treatment && treatment.length >0 && <div  className={style['treat-desc-box']}>
             
-            {title && title === '药品推荐' ? <div id='treatDescBox'>
+            {title && title === '药品推荐' ? <div className={style['similar-drug-box']} id='treatDescBox'>
                 {/* { basic && basic.length > 0 && <div> //推荐依据不需要展示
                     <h3 className={style['recommend-title']}>推荐依据</h3>
                     {basic.map((item, index) =>{

src/components/TreatDesc/index.less

@@ -32,6 +32,9 @@
     position: absolute;
     right: 0px;
 }
+.similar-drug-box {
+    display: none;
+}
 .similar-drug {
     position: absolute;
     padding-top: 40px;