Merge remote-tracking branch 'origin/ChronicMag' into dev/new1

src/common/components/DelToast/index.jsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import style from './index.less';
+/**
+* 化验辅检删除弹窗 @Liucf 2019-5-22
+* 接收参数：
+* show：展示组件
+* name：删除项的名称
+* confirm：删除事件处理函数
+* cancel：取消事件处理函数
+*/
+
+class DelToast extends React.PureComponent{
+  constructor(props){
+    super(props);
+    this.handleDel = this.handleDel.bind(this);
+    this.handleCancel = this.handleCancel.bind(this);
+  }
+  handleDel(){
+    const {confirm} = this.props;
+    confirm&&confirm();
+  }
+  handleCancel(){
+    const {cancel} = this.props;
+    cancel&&cancel();
+  }
+  render(){
+    const {show,name} = this.props;
+    if(show){
+      return <div className={style['del-box']} id="delBox">
+        <div className={style['del-con']}>
+          <div className={style['del-tri']}></div>
+          <div className={style['del-title']}>删除 {name} ？</div>
+          <div className={style['del-foot']}>
+            <span className={`${style['del-btn']} ${style['del-del']}`} onClick={this.handleDel}>删除</span>
+            <span className={`${style['del-btn']} ${style['del-cancel']}`} onClick={this.handleCancel}>取消</span>
+          </div>
+        </div>
+      </div>
+    }
+    return ''
+  }
+}
+
+export default DelToast;

src/common/components/DelToast/index.less

@@ -0,0 +1,51 @@
+// @import "~@less/mixin.less";
+.del-box{
+  position: absolute;
+  width: 206px;
+  height: 106px;
+  box-shadow: 2px 2px 5px rgba(0,0,0,.4);
+  background: #fff;
+  z-index: 66;
+  text-align: center;
+  padding: 20px;
+  right: -30px;
+  top: 40px;
+}
+.del-con{
+  position: relative;
+  .del-tri{
+    width: 0; 
+    height: 0;
+    border-width: 10px;
+    border-style: solid;
+    border-color: transparent transparent #fff transparent;
+    position: absolute;
+    top: -40px;
+    right: 10px;
+  }
+  .del-title{
+    margin-bottom: 19px;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+  }
+  .del-foot{
+    .del-btn{
+      display: inline-block;
+      width: 63px;
+      height: 26px;
+      line-height: 26px;
+      text-align: center;
+      cursor: pointer;
+    }
+    .del-del{
+      color: #fff;
+      background: #EC3E3E;
+      margin: 0 20px 0 10px;
+    }
+    .del-cancel{
+      color:#000;
+      background: #E5E5E5;
+    }
+  }
+}

src/common/components/InspectCommon/index.less

@@ -25,11 +25,13 @@
         float: right;
         color: @blue;
         font-weight: bold;
+        cursor: pointer;
     }
     .clear {
         float: left;
         // font-weight: bold;
         bottom: 0;
+        cursor: pointer;
     }
 }
 

src/common/components/NumberPan/index.jsx

@@ -67,28 +67,28 @@ class NumberPan extends Component{
                 onDoubleClick={(e)=>e.stopPropagation()}>
       <table className={style['pan']} >
         <tr>
-          <td><button onClick={select}>1</button></td>
-          <td><button onClick={select}>2</button></td>
-          <td><button onClick={select}>3</button></td>
-          <td><button onClick={select}>/</button></td>
+          <td><button onMouseUp={select}>1</button></td>
+          <td><button onMouseUp={select}>2</button></td>
+          <td><button onMouseUp={select}>3</button></td>
+          <td><button onMouseUp={select}>/</button></td>
         </tr>
         <tr>
-          <td><button onClick={select}>4</button></td>
-          <td><button onClick={select}>5</button></td>
-          <td><button onClick={select}>6</button></td>
-          <td><button onClick={this.handleBack.bind(this)}><img src={backspace} onClick={this.handleBack.bind(this)} /></button></td>
+          <td><button onMouseUp={select}>4</button></td>
+          <td><button onMouseUp={select}>5</button></td>
+          <td><button onMouseUp={select}>6</button></td>
+          <td><button onMouseUp={this.handleBack.bind(this)}><img src={backspace} onClick={this.handleBack.bind(this)} /></button></td>
         </tr>
         <tr>
-          <td><button onClick={select}>7</button></td>
-          <td><button onClick={select}>8</button></td>
-          <td><button onClick={select}>9</button></td>
-          <td><button onClick={this.handleClear.bind(this)} className={style['clearN']}>清空</button></td>
+          <td><button onMouseUp={select}>7</button></td>
+          <td><button onMouseUp={select}>8</button></td>
+          <td><button onMouseUp={select}>9</button></td>
+          <td><button onMouseUp={this.handleClear.bind(this)} className={style['clearN']}>清空</button></td>
         </tr>
         <tr>
-          <td><button onClick={select}>.</button></td>
-          <td><button onClick={select}>0</button></td>
-          <td><button onClick={select}>～</button></td>
-          <td><button onClick={this.handleClose.bind(this)} className={style['confirm']}>确定</button></td>
+          <td><button onMouseUp={select}>.</button></td>
+          <td><button onMouseUp={select}>0</button></td>
+          <td><button onMouseUp={select}>～</button></td>
+          <td><button onMouseUp={this.handleClose.bind(this)} className={style['confirm']}>确定</button></td>
         </tr>
       </table>
       </div>

src/common/components/SearchOption/index.jsx

@@ -4,6 +4,7 @@ import clear from './imgs/clear.png';
 import search from './imgs/search.png';
 import PropTypes from "prop-types";
 import config from '@config/index';
+import $ from 'jquery';
 /**
  * 前提条件父元素有定位
  * visible  搜索显示隐藏
@@ -39,6 +40,10 @@ class SearchOption extends React.Component {
     componentDidMount(){
       this.props.handleChangeValue('');
       this.textInput.current.focus();
+      const {windowHeight,pageTop,height} = this.props;
+      if(windowHeight - pageTop < height){
+        $("#searchOption")[0].scrollIntoView(false);
+      }
     }
     handleClearVal(){
         const { handleChangeValue } = this.props;

src/common/components/SearchOption/index.less

@@ -5,10 +5,10 @@
     padding: 8px;
     box-sizing: border-box;
     position: absolute;
-    top: 40px;
+    top: 30px;
     z-index: 99;
     background-color: #fff;
-    margin-bottom: 80px;
+    // margin-bottom: 80px;
     .llStyle;
     .autoList {
         // max-height: 225px;

src/common/components/index.js

@@ -23,6 +23,7 @@ import NumberUnitPan from "./NumberUnitPan";
 import Add from "./Add";
 import ComplexModal from "./ComplexModal";
 import MiniToast from "./MiniToast";
+import DelToast from "./DelToast";
 
 module.exports = {
     Banner,
@@ -49,5 +50,6 @@ module.exports = {
     NumberUnitPan,
     Add,
     ComplexModal,
-    MiniToast
+    MiniToast,
+    DelToast
 };

src/common/less/variables.less

@@ -45,6 +45,8 @@
 @dropdwon-height:200px;
 @selected-bg:#fff;
 @import-color:#ffad5f;
+@closeIcon:url(../images/del_nor.png);
+@closeHor:url(../images/del_hor.png);
 
 /*********推送内容容器宽度*************/
 @push-width: 450px;
@@ -200,7 +202,6 @@
   text-align: left;
   padding-left: 5px;
   cursor: default;
-  display: inline-block;
   width: 99px;
   height: 26px;
   line-height: 26px;
@@ -218,7 +219,6 @@
   text-align: left;
   padding-left: 5px;
   cursor: default;
-  display: inline-block;
   width: 99px;
   height: 26px;
   line-height: 26px;

src/components/AddAssistCheck/index.jsx

@@ -1,8 +1,9 @@
 import React from 'react';
-import { SearchOption, Calendar, ConfirmModal, Notify, Add } from '@commonComp';
+import { SearchOption, Calendar, ConfirmModal, Notify, Add ,DelToast} from '@commonComp';
 import styles from './index.less';
 import $ from 'jquery';
 import Textarea from './Textarea';
+import { getPageCoordinate } from '@utils/tools';
 import close from './img/close.png';
 
 class AddAssistCheck extends React.Component {
@@ -14,7 +15,9 @@ class AddAssistCheck extends React.Component {
       dateTime: "",
       active: '',
       visible: false,
-      id: null
+      pageTop:'',
+      id: null,
+      activeName:''
     }
     this.handleShowDate = this.handleShowDate.bind(this)
     this.getCurrentDate = this.getCurrentDate.bind(this)
@@ -25,10 +28,11 @@ class AddAssistCheck extends React.Component {
     this.handleCancel = this.handleCancel.bind(this)
   }
 
-  handleDelClick(id) {
+  handleDelClick(id,item) {
     this.setState({
       visible: true,
-      id: id
+      id: id,
+      activeName:item.name
     })
   }
 
@@ -39,7 +43,8 @@ class AddAssistCheck extends React.Component {
     handlePush && handlePush();           //右侧推送
     this.setState({
       visible: false,
-      id: null
+      id: null,
+      activeName:''
     })
     Notify.success("删除成功");
   }
@@ -47,7 +52,8 @@ class AddAssistCheck extends React.Component {
   handleCancel() {
     this.setState({
       visible: false,
-      id: null
+      id: null,
+      activeName:''
     })
   }
 
@@ -55,18 +61,28 @@ class AddAssistCheck extends React.Component {
     $(document).click((event) => {
       let _con = $('#searchWrapAssist');   // 设置目标区域
       let _cons = $('#datePick');   // 设置目标区域
+      let _del = $('#delBox')[0];   // 删除弹窗
+      let _close = $('#assiClose')[0];   // 删除icon
+      // console.log(111,event.target,_del,_close)
       if (_con && searchWrapAssist != event.target && !_con.is(event.target) && _con.has(event.target).length === 0) { // Mark 1
         this.setState({ show: false });
       }
       if (!_cons.is(event.target) && _cons.has(event.target).length === 0) { // Mark 1
         this.setState({ date: false });
       }
+      if(event.target != _close && event.target != _del && event.target.parentNode != _del){
+          this.setState({
+            visible: false,
+            id: null,
+            activeName:''
+          })
+      }
     });
     this.getCurrentDate();
   }
   handleSearchShow(e) {
     let tmpShow = this.state.show;
-    this.setState({ show: !tmpShow })
+    this.setState({ show: !tmpShow,pageTop:getPageCoordinate(e).boxTop })
     // e.stopPropagation();
   }
   handleShowDate(idx) {
@@ -124,10 +140,11 @@ class AddAssistCheck extends React.Component {
   }
   getAssistLabel() {
     const { assistLabel, handleChangeAssistValue, handleChangeDate, isRead, handlePush, winWidth,getInfomation } = this.props;
+    const { visible,activeName,id } = this.state;
     return <ul className={styles.labelWrap} id="datePick">
       {
         assistLabel.map((item, idx) => {
-          return (<li key={item.id} className={styles.assistLists}>
+          return (<li key={item.questionId} className={styles.assistLists}>
             <span className={styles.assistName} style={{ width: winWidth < 1200 ? '120px' : 'auto' }}>
               <span className={styles.tagSpan}>
                 {item.name}：
@@ -140,25 +157,30 @@ class AddAssistCheck extends React.Component {
             <div className={styles.pointerFinger}>
               <p onClick={() => this.handleShowDate(idx)}>报告日期：<span>{item.time || this.state.dateTime}</span></p>
               <i onClick={() => this.handleShowDate(idx)}></i>
-              <a href="javascript:void(0);" onClick={() => { this.handleDelClick(idx) }}><img src={close} alt="" /></a>
+              {/*<a href="javascript:void(0);" onClick={() => { this.handleDelClick(idx,item) }}><img src={close} alt="" /></a>*/}
+              <span className={styles.closeIcon} id="assiClose" onClick={() => { this.handleDelClick(idx,item) }}></span>
               <div style={{ display: this.state.date && idx == this.state.active ? "block" : "none", position: "relative" }}>
                 <Calendar isShow={true} handleChange={(info) => { handleChangeDate(info, idx); this.setState({ date: false }) }}></Calendar>
               </div>
             </div>
+          <DelToast show={idx==id?visible:false}
+                    name={activeName} 
+                    cancel={this.handleCancel}
+                    confirm={this.delConfirm}/>
           </li>)
         })
       }
     </ul>
   }
   render() {
-    const { handleChangeValue, list,assistVal } = this.props;
-    const { visible } = this.state;
+    const { handleChangeValue, list,assistVal,windowHeight } = this.props;
+    const { visible,pageTop } = this.state;
     return (
       <div className={styles.wrapper}>
         {this.getAssistLabel()}
         <div id="searchWrapAssist" style={{ position: "relative", clear: 'both' }}>
           <Add showText="添加辅检项" handleClick={(e) => this.handleSearchShow(e)} id="assistCheck" />
-          {this.state.show ? <SearchOption handleChangeValue={handleChangeValue} visible={true}>
+          {this.state.show ? <SearchOption windowHeight={windowHeight} pageTop={pageTop} height={280} handleChangeValue={handleChangeValue} visible={true}>
             {list && list.length>0?this.getSearchList(list):(assistVal == ''?'':<p style={{padding:'5px 30px',color:'#bfbfbf'}}>暂无筛选项</p>)}
             {
               list && list.length>0 || (assistVal != '')?'':<div>
@@ -170,7 +192,7 @@ class AddAssistCheck extends React.Component {
             }
           </SearchOption> : ''}
         </div>
-        <ConfirmModal
+        {/*<ConfirmModal
           visible={visible}
           confirm={this.delConfirm}
           close={this.handleCancel}
@@ -182,7 +204,7 @@ class AddAssistCheck extends React.Component {
           oKBg={'#3B9ED0'}
         >
           <p className={styles['center']}>是否删除该辅检项？</p>
-        </ConfirmModal>
+        </ConfirmModal>*/}
       </div>
     )
   }

src/components/AddAssistCheck/index.less

@@ -1,5 +1,4 @@
 @import "~@less/variables.less";
-
 .staticTag {
     cursor: pointer;
     color: @blue;
@@ -38,6 +37,7 @@
         box-sizing: border-box;
         position: relative;
         clear: both;
+        border-radius: 4px;
         .pointerFinger {
             width: 222px;
             position: absolute;
@@ -50,7 +50,7 @@
                 cursor: pointer;
                 background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAAH6ji2bAAAABGdBTUEAALGPC/xhBQAAANtJREFUOBHFU90RwiAMDj3H8FV3KQ4AxwAO5QQwgbvoY90DQ+/gUpogXj3bF/L75ctXANj7c85pY0zMPKy1U7bLmQqG4hFjwPIL8UEp9aI+UOxFotcRZ3MALEmu8I+xWoGk2VpiQqhoWneSmoXZvfWehaubsVgBoGxdxb93EekhdbVyKjWh5iNSvcUYjxJIK57WxN5rCOE+13E/scWCy2WMzLC81haTTzlkOONtf6I4KTM8SFPTWqjLicujZk/v/ZnLdV9ZrpmLiQwlBhwIjWVAjStOG6+NpsA/s99BMkpktdAgdAAAAABJRU5ErkJggg==') no-repeat;
             }
-            a {
+            /* a {
                 img {
                   width: 13px;
                   height: 13px;
@@ -58,9 +58,21 @@
                   cursor: pointer;
                   display: inline-block;
                   position: absolute;
-                  right: -4px;
+                  // right: -4px;
+                  right: 3px;
                   top: 2px;
                 }
+            } */
+            .closeIcon{
+              display: inline-block;
+              width: 15px;
+              height: 15px;
+              cursor: pointer;
+              position: absolute;
+              right: 3px;
+              top: 2px;
+              background: @closeIcon;
+              background-size: 100% 100%;
             }
             p{
                 display: inline-block;
@@ -85,6 +97,13 @@
           width: 100%;
         }
     }
+    .assistLists:hover{
+      background:#F2F2F2;
+      .closeIcon{
+        background: @closeHor;
+        background-size: 100% 100%;
+      }
+    }
 }
 .center {
     text-align: center;

src/components/AddInspect/SlideSelect/index.jsx

@@ -1,7 +1,7 @@
 import React, { Component } from "react";
 import styles from "./index.less";
 import { normalVal,timestampToTime } from '@utils/tools';
-import { InspectCommon, Calendar} from '@commonComp';
+import { InspectCommon, Calendar,DelToast} from '@commonComp';
 import slideUp from "@common/images/slide-up.png";
 import slideDown from "@common/images/slide-down.png";
 import date1 from '../img/date1.png';
@@ -12,9 +12,14 @@ class SlideSelect extends Component {
     super(props);
     this.state = {
       show:false,
+      activeInd:false,
+      activeName:''
     };
     this.toTime = this.toTime.bind(this)
     this.handleSlide = this.handleSlide.bind(this)
+    this.handleDel = this.handleDel.bind(this)
+    this.handleCancel = this.handleCancel.bind(this)
+    this.delConfirm = this.delConfirm.bind(this)
   }
   toTime(time){
     let tmpTim = time.split(',').join('')-0
@@ -34,9 +39,31 @@ class SlideSelect extends Component {
       show:!tmpShow
     })
   }
+  handleDel(){
+    const {handleDelClick,idx,item} = this.props;
+    this.setState({
+      activeInd:true,
+      activeName:item.name
+    })
+    handleDelClick&&handleDelClick(1,idx);
+  }
+  handleCancel(){
+    this.setState({
+      activeInd:false,
+      activeName:''
+    })
+  }
+  delConfirm(){
+    const {handleDelConfirm} = this.props;
+    handleDelConfirm&&handleDelConfirm();
+    this.setState({
+      activeInd:false,
+      activeName:''
+    })
+  }
   render() {
     const {getInfomation,handleConfirm,changeActivePart,handleDelClick,getItemList,date,item,idx,handleFillShow,showDetails,handleLabelSub,showFill,changeShowFill,handlePush,dateTime,currentIdx,currentData,fillActive,handleShowDate,handleChangeDate} = this.props;
-    const {show} = this.state;
+    const {show,activeInd,activeName} = this.state;
     let numPlus = 0,numPlus1 = 0;
     return (
       <li key={item.questionId} className={styles.slideLi}> 
@@ -153,7 +180,12 @@ class SlideSelect extends Component {
                 : null
             }
         </div>
-        <img className={styles.partDel} src={close} alt="删除项" onClick={()=>{handleDelClick(1,idx)}}/>
+        {/*<img className={styles.partDel} src={close} alt="删除项" onClick={()=>{handleDelClick(1,idx)}}/>*/}
+        <span className={styles.partDel} onClick={this.handleDel}></span>
+        <DelToast show={activeInd?true:false}
+                    name={activeName} 
+                    cancel={this.handleCancel}
+                    confirm={this.delConfirm}/>
     </li>
     );
   }

src/components/AddInspect/SlideSelect/index.less

@@ -3,8 +3,7 @@
     // cursor: pointer;
     color: #767676;
     position: relative;
-    padding-top: 10px;
-    padding-bottom: 10px;
+    padding: 10px 10px 10px 0;
     border-bottom:1px dashed #989DA3;
     i {
         font-style: normal;
@@ -26,17 +25,27 @@
         vertical-align: top;
     } 
     .partDel {
-        width: 13px;
-        height: 13px;
+        width: 15px;
+        height: 15px;
         margin-bottom: 11px;
         cursor: pointer;
         display: inline-block;
         position: absolute;
-        right: 0;
-        top: 12px;
-        background-color: #fff;
+        right: 3px;
+        top: 13px;
+        // background-color: #fff;
+        background: @closeIcon;
+        background-size: 100% 100%;
     }
 }
+.slideLi:hover{
+    background:#F2F2F2;
+    border-radius: 4px;
+       .partDel{
+        background: @closeHor;
+        background-size: 100% 100%;
+      } 
+}
 .staticTagActive {
     cursor: pointer;
     color: #333;

src/components/AddInspect/index.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
-import { SearchOption, InspectCommon, Calendar ,Notify,ConfirmModal,Add} from '@commonComp';
+import { SearchOption, InspectCommon, Calendar ,Notify,ConfirmModal,Add,DelToast} from '@commonComp';
 import SlideExcel from './SlideExcel';
 import SlideSelect from './SlideSelect';
-import { deepClone } from '@utils/tools';
+import { deepClone,getPageCoordinate } from '@utils/tools';
 import styles from './index.less';
 import date1 from './img/date1.png';
 import close from './img/close.png';
@@ -22,11 +22,11 @@ class Inspect extends React.Component {
       currentData: {},
       numPlus: 0,     //判断是否所有的填写单都是空
       num: 0,            //暂存数据，获取一次，不能每次都是新的数据
-      toastText: '',
-      visible: false,
       type: null,
       id: null,
-      tmpIds: [],      //内层外层
+      pageTop:'',
+      // tmpIds: [],      //内层外层
+      importFlag:false   //导入数据删除标识
     }
     this.handleChangeDate = this.handleChangeDate.bind(this)
     this.handleShowDate = this.handleShowDate.bind(this)
@@ -52,9 +52,9 @@ class Inspect extends React.Component {
       handleCloseExcel(id)
     }
     this.setState({
-      visible: false,
       type: null,
       id: null,
+      importFlag:false
     })
     Notify.success("删除成功");
     handlePush && handlePush();       //右侧推送
@@ -62,24 +62,19 @@ class Inspect extends React.Component {
   handleDelClick(type, idx) {
     this.setState({
       type: type,
-      id: idx,
-      visible: true
+      id: idx
     })
-    if (type == 1) {//单项
+    if (type == 2){
       this.setState({
-        toastText: '是否删除该化验项？'
-      })
-    } else if (type == 2) {//导入项
-      this.setState({
-        toastText: '是否删除导入项？'
+        importFlag: true
       })
     }
   }
   handleCancel() {
     this.setState({
-      visible: false,
       type: null,
       id: null,
+      importFlag:false
     })
   }
   componentDidMount() {
@@ -114,7 +109,7 @@ class Inspect extends React.Component {
   }
   handleSearchShow(e) {
     let tmpShow = this.state.show;
-    this.setState({ show: !tmpShow })
+    this.setState({ show: !tmpShow,pageTop:getPageCoordinate(e).boxTop })
     // e.stopPropagation();
   }
   handleFillShow(e, idx) {
@@ -284,18 +279,23 @@ class Inspect extends React.Component {
     }
   }
   render() {
-    const { getInfomation,handleChangeValue,inspectVal, list, labelList, delPartItem, handleLabelSub, handleClear, handleConfirm, fillActive, getExcelDataList, handleCloseExcel, handlePush } = this.props;
-    const { toastText, visible, tmpId, tmpIdx } = this.state;
+    const { getInfomation,handleChangeValue,inspectVal, list, labelList,windowHeight, delPartItem, handleLabelSub, handleClear, handleConfirm, fillActive, getExcelDataList, handleCloseExcel, handlePush } = this.props;
+    const { tmpId, tmpIdx,id ,importFlag,pageTop} = this.state;
 
     return (
       <div className={styles.wrapper}>
         <div className={styles.check}>
           {
-            getExcelDataList.length > 0 && getExcelDataList.map((items, id) => {
+            getExcelDataList.length > 0 && getExcelDataList.map((items, ind) => {
               return <div style={{ marginTop: '10px' }}>
                 {
                   items && items.lisExcelRes.length > 0 ? <ul className={styles.excelDataLists}>
-                    <img className={styles.close} src={close} alt="关闭导入excel数据" onClick={() => { this.handleDelClick(2, id) }} />
+                    {/*<img className={styles.close} src={close} alt="关闭导入excel数据" onClick={() => { this.handleDelClick(2, id) }} />*/}
+                    <span className={styles.close} onClick={() => { this.handleDelClick(2, ind) }}></span>
+                    <DelToast show={id==ind && importFlag?true:false}
+                    name="该导入项" 
+                    cancel={this.handleCancel}
+                    confirm={this.delConfirm}/>
                     {
                       items.lisExcelRes.map((item, idx) => {
                         return <SlideExcel
@@ -334,6 +334,7 @@ class Inspect extends React.Component {
                   getItemList={this.getItemList}
                   changeActivePart={this.changeActivePart}
                   handleDelClick={this.handleDelClick}
+                  handleDelConfirm={this.delConfirm}
                   handleConfirm={handleConfirm}
                   getInfomation={getInfomation}
                 ></SlideSelect>
@@ -343,7 +344,7 @@ class Inspect extends React.Component {
         </div>
         <div style={{ position: "relative", clear: "both" }}>
           <Add showText="添加化验项" handleClick={(e) => this.handleSearchShow(e)} id="searchWrap" />
-          {this.state.show ? <SearchOption handleChangeValue={handleChangeValue} visible={true}>
+          {this.state.show ? <SearchOption windowHeight={windowHeight} height={280} pageTop={pageTop} handleChangeValue={handleChangeValue} visible={true}>
             {list && list.length>0?this.getSearchList(list):(inspectVal == ''?'':<p style={{padding:'5px 30px',color:'#bfbfbf'}}>暂无筛选项</p>)}
             {
               list && list.length>0 || (inspectVal != '')?'':<div>
@@ -355,19 +356,6 @@ class Inspect extends React.Component {
             }
           </SearchOption> : ''}
         </div>
-        <ConfirmModal
-          visible={visible}
-          confirm={this.delConfirm}
-          close={this.handleCancel}
-          cancel={this.handleCancel}
-          okText="删除"
-          cancelText='取消'
-          okBorderColor={'#3B9ED0'}
-          okColor={'#fff'}
-          oKBg={'#3B9ED0'}
-        >
-          <p className={styles['center']}>{toastText}</p>
-        </ConfirmModal>
       </div>
     )
   }

src/components/AddInspect/index.less

@@ -174,14 +174,17 @@
     background-color: rgba(237,237,237,0.4);
     border: 1px solid #ccc;
     .close {
-        width: 13px;
-        height: 13px;
+        display: inline-block;
+        width: 15px;
+        height: 15px;
         position: absolute;
-        top: -5px;
-        right: -5px;
+        top: -10px;
+        right: -6px;
         z-index: 30;
-        background-color: #fff;
         border-radius: 50%;
+        background: @closeIcon;
+        background-size: 100% 100%;
+        background-color: #fff;
     }
     .excelDataLis {
         padding: 2px 0px;
@@ -211,6 +214,14 @@
         }
     }
 }
+.excelDataLists:hover{
+    .close{
+        background: @closeHor;
+        background-size: 100% 100%;
+        background-color: #fff;
+        cursor: pointer;
+    }   
+}
 .center {
     text-align: center;
     font-size: 16px;

src/components/AssistCheck/index.jsx

@@ -10,7 +10,7 @@ class AssistCheck extends React.Component {
     }
 
     render(){
-        const {list,getInfomation,assistLabel,assistVal,handleChangeValue,handleSign,fetchPushInfos,handleDelAssist,handleChangeAssistValue,handleChangeDate,isRead,winWidth,assistList} = this.props;
+        const {list,getInfomation,windowHeight,assistLabel,assistVal,handleChangeValue,handleSign,fetchPushInfos,handleDelAssist,handleChangeAssistValue,handleChangeDate,isRead,winWidth,assistList} = this.props;
         return (
             <div className={styles.wrapper}>
                 <div className={styles.top}>
@@ -39,6 +39,7 @@ class AssistCheck extends React.Component {
                             getInfomation={getInfomation}
                             assistList={assistList}
                             assistVal={assistVal}
+                            windowHeight={windowHeight}
                         >
 
                         </AddAssistCheck>

src/components/DiagResultSearch/index.jsx

@@ -3,67 +3,67 @@ import style from './index.less';
 import close from './img/close.png'
 import search from './img/search.png'
 import DiagnosticItem from '@containers/DiagnosticItem'
-import { SearchOption} from '@commonComp';
+import { SearchOption } from '@commonComp';
 import config from '@config/index';
 import $ from 'jquery';
 class DiagResultSearch extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-           
-        };
-      
-        this.getSearchList =  this.getSearchList.bind(this)
+  constructor(props) {
+    super(props);
+    this.state = {
 
-    }
-    componentWillReceiveProps(nextProps){
-    }
-    componentDidMount () {
-        const that = this
-        $(document).click(function (e) {
-            var diagSearch=$('#diagSearch')[0];
-            var addDiag = $('#addDiag')[0];
-            var confirm = $('#confirm')[0];
-            if(diagSearch) {
-                if(confirm) {
-                    
-                } else {
-                    if (e.target!= diagSearch && e.target!= addDiag && e.target.parentNode!= addDiag && !$.contains(diagSearch, e.target) ) {
-                        that.props.hideSearch();
-                    }
+    };
 
+    this.getSearchList = this.getSearchList.bind(this)
+
+  }
+  componentWillReceiveProps(nextProps) {
+  }
+  componentDidMount() {
+    const that = this
+    $(document).click(function (e) {
+      var diagSearch = $('#diagSearch')[0];
+      var addDiag = $('#addDiag')[0];
+      var confirm = $('#confirm')[0];
+      if (diagSearch) {
+        if (confirm) {
+
+        } else {
+          if (e.target != diagSearch && e.target != addDiag && e.target.parentNode != addDiag && !$.contains(diagSearch, e.target)) {
+            that.props.hideSearch();
+          }
 
-                }
-                
-            }
-            
-        })
-    }
 
-    getSearchList(searchResult) {
-        return <div className={style['search-result']}>
-                    
-        {
-            searchResult && searchResult.map((item) => {
-                return(<div  key={item.id} className={style['search-result-item']}><DiagnosticItem title={true} item={item} clearInput={this.clearInput}/></div>)
-            })
         }
+
+      }
+
+    })
+  }
+
+  getSearchList(searchResult) {
+    return <div className={style['search-result']}>
+
+      {
+        searchResult && searchResult.map((item) => {
+          return (<div key={item.id} className={style['search-result-item']}><DiagnosticItem title={true} item={item} clearInput={this.clearInput} /></div>)
+        })
+      }
     </div>
-    }
-   
-    render(){
-        const  { show, searchResult, getSearchResult, handleChangeValue } = this.props
-       
-        return(
-            show&&<div id='diagSearch' className={style['search-box']}>
-                <SearchOption handleChangeValue={handleChangeValue} visible={true}>
-                    {this.getSearchList(searchResult)}
-                </SearchOption>
-            </div>
-        )
-       
-       
-    }
+  }
+
+  render() {
+    const { show, searchResult, getSearchResult, handleChangeValue,pageTop,windowHeight } = this.props
+
+    return (
+      show && <div id='diagSearch' className={style['search-box']}>
+        <SearchOption handleChangeValue={handleChangeValue} pageTop={pageTop} windowHeight={windowHeight} height={180} visible={true}>
+          {this.getSearchList(searchResult)}
+        </SearchOption>
+      </div>
+    )
+
+
+  }
 }
 
 export default DiagResultSearch;

src/components/Diagnosis/index.jsx

@@ -1,60 +1,63 @@
 import React, { Component } from 'react';
 import style from './index.less';
-import {Button, ItemBox, ConfirmModal, Loading, Message,Add} from '@commonComp';
+import { Button, ItemBox, ConfirmModal, Loading, Message, Add } from '@commonComp';
 import DiagnosticList from '@containers/DiagnosticList.js';
 // import TreatDrug from '@containers/TreatDrug.js'
+import { getPageCoordinate } from '@utils/tools';
 import DiagResultSearch from '@containers/DiagResultSearch'
 import $ from 'jquery';
 
 class Diagnosis extends Component {
-    constructor(props) {
-        super(props);
-
-        this.state = {
-            diagType: 0,
-            showSearch: props.show,
-        }
-        this.showSearch = this.showSearch.bind(this);
-        this.hideSearch = this.hideSearch.bind(this);
-        this.handleshowSearch = this.handleshowSearch.bind(this);
-        
-    }
-    componentWillReceiveProps() {
-        this.setState({
-            showSearch: this.props.show
-        })
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      diagType: 0,
+      showSearch: props.show,
+      pageTop: ''
     }
+    this.showSearch = this.showSearch.bind(this);
+    this.hideSearch = this.hideSearch.bind(this);
+    this.handleshowSearch = this.handleshowSearch.bind(this);
 
+  }
+  componentWillReceiveProps() {
+    this.setState({
+      showSearch: this.props.show
+    })
+  }
 
-    showSearch() {
-        const { showSearch } = this.props
-        showSearch && showSearch()
-    }
-    hideSearch() {
-        const { hideSearch } = this.props
-        hideSearch && hideSearch()
-    }
-    handleshowSearch() {
-        this.props.show ? this.hideSearch() : this.showSearch()
-    }
 
-    render() {
-        
-        
-        return (<div id="diagnosisResult">
-            <ItemBox  id="diagnosis" title='诊断'  boxHeight='auto' titleTop='22px' marginTop='9px' backgroundColor='#EAF7FD'>
-                <DiagnosticList></DiagnosticList>
-                <div style={{marginLeft:'10px', position:'relative'}}>
-                    <Add showText="添加诊断结果" handleClick={this.handleshowSearch} id="addDiag" height="50px"/>
-                    <DiagResultSearch></DiagResultSearch>
-                </div>
-               
-                
-            </ItemBox>
-            {/* <TreatDrug></TreatDrug> */}
-            <Message></Message>
-        </div>)
-    }
+  showSearch() {
+    const { showSearch } = this.props
+    showSearch && showSearch()
+  }
+  hideSearch() {
+    const { hideSearch } = this.props
+    hideSearch && hideSearch()
+  }
+  handleshowSearch(e) {
+    this.props.show ? this.hideSearch() : this.showSearch()
+    this.setState({ pageTop:getPageCoordinate(e).boxTop })
+  }
+
+  render() {
+
+
+    return (<div id="diagnosisResult">
+      <ItemBox id="diagnosis" title='诊断' boxHeight='auto' titleTop='22px' marginTop='9px' backgroundColor='#EAF7FD'>
+        <DiagnosticList></DiagnosticList>
+        <div style={{ marginLeft: '10px', position: 'relative' }}>
+          <Add showText="添加诊断结果" handleClick={this.handleshowSearch} id="addDiag" height="50px" />
+          <DiagResultSearch windowHeight={this.props.windowHeight} pageTop={this.state.pageTop} height={150}></DiagResultSearch>
+        </div>
+
+
+      </ItemBox>
+      {/* <TreatDrug></TreatDrug> */}
+      <Message></Message>
+    </div>)
+  }
 }
 
 export default Diagnosis;

src/components/Inspect/index.jsx

@@ -147,7 +147,7 @@ class Inspect extends React.Component {
         </ul>
     }
     render() {
-        const {fetchPushInfos,getInfomation,inspectVal, handleCloseExcel, handleChangeValue, labelListActive, list, handleSign, labelList, handleLabelSub, handleClear, handleConfirm, fillActive, changeActivePart, getExcelDataList,delPartItem,inspectList } = this.props;
+        const {fetchPushInfos,getInfomation,inspectVal,windowHeight, handleCloseExcel, handleChangeValue, labelListActive, list, handleSign, labelList, handleLabelSub, handleClear, handleConfirm, fillActive, changeActivePart, getExcelDataList,delPartItem,inspectList } = this.props;
         const {ieVersion,isIE} = this.state;
         return (
             <div className={styles.wrapper} >
@@ -186,6 +186,7 @@ class Inspect extends React.Component {
                             inspectList={inspectList}
                             getInfomation={getInfomation}
                             inspectVal={inspectVal}
+                            windowHeight={windowHeight}
                         >
                         </AddInspect>
                     </div>

src/components/MultSpread/index.jsx

@@ -49,9 +49,23 @@ class MultSpread extends Component{
       numDoms:doms
     });
   }
+  moveEnd(obj) {
+    if(window.getSelection){//ie11 10 9 ff safari
+      obj.focus(); //解决ff不获取焦点无法定位问题
+      var range = window.getSelection();//创建range
+      range.selectAllChildren(obj);//range 选择obj下所有子内容
+      range.collapseToEnd();//光标移至最后
+    }
+    else if (document.selection) {//ie10 9 8 7 6 5
+      var range = document.selection.createRange();//创建选择对象
+      range.moveToElementText(obj);//range定位到obj
+      range.collapse(false);//光标移至最后
+      range.select();
+    }
+  }
   setNextFocus(i){
     const doms = this.state.numDoms;
-    doms[i+1]&&doms[i+1].current.focus();
+    doms[i+1]&&this.moveEnd(doms[i+1].current)
   }
   getLabels(){
     const {data,ikey,showArr,copyId,selecteds,boxMark} = this.props;

src/components/NumberDrop/index.jsx

@@ -21,6 +21,7 @@ class NumberDrop extends Component{
       editable:false,      //标签是否可输入
       timer:null,
       sltTimer:null,
+      blurTimer:null,
       hasSelect:false,       //是否点过下拉键盘
       boxLeft:0,
       boxTop:0,
@@ -43,8 +44,10 @@ class NumberDrop extends Component{
     this.beyondArea = this.beyondArea.bind(this);
   }
   select(text){        //选中键盘上数字事件
+    //placeholder修改后，第一次点击键盘触发blur后onClick不触发，原因未知，改为onMouseup可触发
     let timer = null;
     clearTimeout(this.state.sltTimer);
+    clearTimeout(this.state.blurTimer);
     const {handleSelect,ikey,suffix,prefix,mainSaveText,min,max} = this.props;
     const needCompare=min!=undefined&&max!=undefined;
     if(!text){
@@ -164,28 +167,31 @@ class NumberDrop extends Component{
   numInpBlur(e){        //数字框失焦，保存值到store中
     e.stopPropagation();
     const {handleSelect,ikey,suffix,prefix,mainSaveText,min,max,show} = this.props;
-    if(show){      //修改清空后第一次点击键盘不触发click事件bug
+    /*if(show){      //修改清空后第一次点击键盘不触发click事件bug--失焦placehoder消失，弃用
       return;
-    }
+    }*/
     //输入超出合理范围或输入不是数字提示且清空
     const needCompare=min!=undefined&&max!=undefined;
-    //if(needCompare){
-      const txt = e.target.innerText.trim();
-      const isFine = this.validSymbols(txt,min,max);      //有～或/时是否合理
-      const hasSymbol = /[\/|\～]/g.test(txt);           //是否有～或/
-      const singleFine = (!isNaN(+txt)&&!needCompare)||(!isNaN(+txt)&&needCompare&&parseFloat(min)<=parseFloat(txt)&&parseFloat(txt)<=parseFloat(max));   //无～或/时是否合理
-      if(txt!=''&&(!hasSymbol&&!singleFine)||(hasSymbol&&!isFine)){
-        this.beyondArea();
-        return;
-      }
-    //}
+    const txt = e.target.innerText.trim();
+    const isFine = this.validSymbols(txt,min,max);      //有～或/时是否合理
+    const hasSymbol = /[\/|\～]/g.test(txt);           //是否有～或/
+    const singleFine = (!isNaN(+txt)&&!needCompare)||(!isNaN(+txt)&&needCompare&&parseFloat(min)<=parseFloat(txt)&&parseFloat(txt)<=parseFloat(max));   //无～或/时是否合理
+    if(txt!=''&&(!hasSymbol&&!singleFine)||(hasSymbol&&!isFine)){
+      this.beyondArea();
+      return;
+    }
 
     //输入为空时显示placeholder
-    if(!e.target.innerText.trim()){
-      this.setState({
-        placeholder:this.props.placeholder
-      });
-    }
+    const timer = setTimeout(()=>{
+      if(!e.target.innerText.trim()){
+        this.setState({
+          placeholder:this.props.placeholder
+        });
+      }
+    },200);
+    this.setState({
+      blurTimer:timer
+    });
 
     const val = e.target.innerText.trim();
     const {placeholder} = this.state;
@@ -227,7 +233,6 @@ class NumberDrop extends Component{
   }
   handleBlur(e){     //双击编辑blur
     const {handleLabelChange,ikey,boxMark,value} = this.props;
-    //if(!this.state.editable) return;
     this.setState({
       editable: false
     });
@@ -239,7 +244,6 @@ class NumberDrop extends Component{
     handleLabelChange && handleLabelChange({ikey,changeVal,type:boxMark,totalVal,prefix,suffix});
   }
   getSpanClass(){       //将被替换的文字选中状态显示
-    //const {hasSelect} = this.state;
     const cls = this.props.show?style['blued']:'';
     return cls;
   }
@@ -248,14 +252,13 @@ class NumberDrop extends Component{
     const spanWidth = window.getComputedStyle(this.$span.current).width;
     this.$span.current.style.minWidth=spanWidth;
     //保存输入框dom以便聚焦
-    const {saveDoms,num} = this.props;
-    //console.log(num);
+    const {saveDoms} = this.props;
     saveDoms&&saveDoms(this.$span);
-    //console.log(this.props.inputRef)
   }
   render(){
     const {prefix,suffix,show,value,handleHide,allClick} = this.props;
-    const {numEditable,placeholder,editable,hasSelect,boxTop,boxLeft} = this.state;
+    const {placeholder,editable,hasSelect,boxTop,boxLeft} = this.state;
+    //console.log(prefix,value,placeholder+'1',this.props.placeholder)
     return <div className={this.getClasses()}
                 ref={this.$cont}
                 onDoubleClick={this.changeToEdit}

src/components/SpreadDrop/index.jsx

@@ -56,6 +56,7 @@ class SpreadDrop extends Component{
   }
   handleShow(e){//单击
     e&&e.stopPropagation();
+    const {ikey,handleShow,placeholder,flag,id,value,tagType,type,data,windowWidth} = this.props;
     // let boxLeft = e.pageX -175 + 'px';
     // let offsetTop = e.target.offsetTop;
     // const ht = e.target.offsetHeight;   //如杂音选中文字有多行时，写死会遮挡
@@ -64,8 +65,19 @@ class SpreadDrop extends Component{
     //   boxLeft:boxLeft,
     //   boxTop:boxTop
     // })
+    let num = 0,leftLen;//判断为五类切超出页面
+    data && data.map((item)=>{
+      if(item.formPosition != 1){
+        ++num
+      }
+    })
+    if(num >= 5 && windowWidth-getPageCoordinate(e).boxLeft < 760){
+      leftLen = windowWidth-780
+    }else{
+      leftLen = getPageCoordinate(e).boxLeft
+    }
     this.setState({
-      boxLeft:getPageCoordinate(e).boxLeft,
+      boxLeft:leftLen,
       boxTop:getPageCoordinate(e).boxTop,
       tmpScroll: $("#addScrollEvent")[0].scrollTop,
       tmpTop:getPageCoordinate(e).boxTop
@@ -78,7 +90,6 @@ class SpreadDrop extends Component{
     },$("#addScrollEvent")[0])
     // window.event? window.event.cancelBubble = true : e.stopPropagation();
      this.setStateInit();      //恢复初始选中状态
-    const {ikey,handleShow,placeholder,flag,id,value,tagType,type} = this.props;
     const that = this;
     this.btnClickFlag = false;
     clearTimeout(this.state.timer);

src/containers/AssistCheck.js

@@ -16,6 +16,7 @@ function mapStateToProps(state) {
         winWidth:state.homePage.windowWidth,
         assistList:state.homePage.assistList,
         assistVal:state.assistCheck.assistVal,
+        windowHeight:state.homePage.windowHeight
     }
 }
 

src/containers/Diagnosis.js

@@ -6,6 +6,7 @@ import { SHOW_SEARCH,  HIDE_SEARCH } from '@store/types/diagnosticSearch';
 function mapStateToProps(state) {
     return {
         show: state.diagnosticSearch.show,
+        windowHeight:state.homePage.windowHeight
     }
 }
 

src/containers/Inspect.js

@@ -12,6 +12,7 @@ function mapStateToProps(state) {//console.log(state)
         getExcelDataList:state.inspect.getExcelDataList,
         labelListActive:state.inspect.labelListActive,
         inspectList:state.homePage.inspectList,
+        windowHeight:state.homePage.windowHeight,
         inspectVal:state.inspect.inspectVal
     }
 }

src/containers/SpreadDrop.js

@@ -19,6 +19,7 @@ function mapStateToProps(state) {//console.log(state);
   return {
     mainSaveText:state.mainSuit.saveText,
     mainData:state.mainSuit.data,
+    windowWidth:state.homePage.windowWidth
   }
 }