瀏覽代碼

修改infomation图标居中样式

zhangxc 6 年之前
父節點
當前提交
100f86f749

+ 1 - 0
src/common/components/ConfirmModal/index.less

@@ -27,6 +27,7 @@
     right: 0px;
     width: 40px;
     height: 40px;
+    cursor: pointer;
 }
 
 .modal-content {

+ 9 - 12
src/components/Treat/AdverseReactions/index.jsx

@@ -19,9 +19,6 @@ class AdverseReactions extends Component {
         this.props.changeReact(it, index);
     }
     handleMouseEnterDrug(index, item) {
-        const drugNameWidth = parseInt($('#'+item.id)[0].offsetWidth)
-        const imgLeft = drugNameWidth/2-8
-        $('#'+item.id).find('img').css('left', imgLeft)
         this.setState({
             currentIndex: index,
         })
@@ -61,19 +58,19 @@ class AdverseReactions extends Component {
                     <span className={style['last-treat-name-box']}
                         
                     >   
-                        <span   id={item.id} 
+                        <span   
                                 className={style['last-treat-big-name-box']} 
                                 onMouseEnter={this.handleMouseEnterDrug.bind(this, index, item)}
                                 onMouseLeave = {this.handleMouseLeaveDrug}
                         >
-                            {item.tagName}:
-                            {<img className={style['info-img']}  
-                                style ={currentIndex === index  ? {display: "inline-block"} : {display: "none"}}
-                                src={currentIndex === index ?(hasEnterImg ? info3 : info2 ): info2} 
-                                onMouseEnter={this.handleMouseEnterImg.bind(this)}
-                                onMouseLeave = {this.handleMouseLeaveImg}
-                                onClick={() =>{this.setDrugInfo(item);showDrugInfo();}}/>}
-                        
+                            <span className={style['last-treat-big-name']} >{item.tagName}:
+                                {<img className={style['info-img']}  
+                                    style ={currentIndex === index  ? {display: "inline-block"} : {display: "none"}}
+                                    src={currentIndex === index ?(hasEnterImg ? info3 : info2 ): info2} 
+                                    onMouseEnter={this.handleMouseEnterImg.bind(this)}
+                                    onMouseLeave = {this.handleMouseLeaveImg}
+                                    onClick={() =>{this.setDrugInfo(item);showDrugInfo();}}/>}
+                            </span>
                         </span>
                         
                     </span>

+ 6 - 2
src/components/Treat/AdverseReactions/index.less

@@ -35,11 +35,15 @@
 .info-img {
     position: absolute;
     width: 15px;
-    position: absolute;
-    top: -8px;
+    top: -15px;
+    left: 50%;
+    margin-left: -8px;
 }
 .last-treat-big-name-box {
     display: inline-block;
     
 }
+.last-treat-big-name {
+    position: relative;
+}
 

+ 0 - 4
src/components/Treat/DrugTreat/index.jsx

@@ -28,9 +28,6 @@ class DrugTreat extends Component {
         selectDrug && selectDrug(index,ii);
     }
     handleMouseEnterDrug(ii, index, it) {
-        const drugNameWidth = parseInt($('#'+it.medicitionName)[0].offsetWidth)
-        const imgLeft = drugNameWidth/2-10
-        $('#'+it.medicitionName).find('img').css('left', imgLeft)
         this.setState({
             currentIndex: index,
             currentImg: ii
@@ -99,7 +96,6 @@ class DrugTreat extends Component {
                                         {ii === 0 ? '' : ', '}
                                         <span onMouseEnter={this.handleMouseEnterDrug.bind(this, ii , index, it)}
                                               onMouseLeave = {this.handleMouseLeaveDrug}
-                                              id={it.medicitionName}
                                               className={style['drug-name-wrapper']} 
                                         >
                                             <span className={style['drug-name']}  

+ 2 - 0
src/components/Treat/DrugTreat/index.less

@@ -35,6 +35,8 @@
     width: 15px;
     position: absolute;
     top: -15px;
+    left: 50%;
+    margin-left: -7px;
 }
 .info-flag {
     display: inline-block;