luolei 5 роки тому
батько
коміт
ba2aa7d11d

+ 50 - 19
src/common/components/EditableSpan/index.jsx

@@ -17,6 +17,7 @@ import $ from 'jquery';
  * * text:标签内文字
  *
  * ****/
+let indexNum = '';
 
 class EditableSpan extends Component{
   constructor(props){
@@ -50,6 +51,7 @@ class EditableSpan extends Component{
         that.$span.current.innerHTML = txt;
       });
     })
+    
     const {mainSaveText,full,setFocusIndex,i,boxMark,value}= this.props;
     let mainText = filterDataArr(mainSaveText);//主诉字数
     if(+boxMark==3||+boxMark==4){         //主诉为空,且第一次聚焦其他史查体时提示且不可输入
@@ -141,7 +143,7 @@ class EditableSpan extends Component{
         var range = window.getSelection();//创建range
         range.selectAllChildren(obj);//range 选择obj下所有子内容
         if(flg){
-          range.collapseToStart();//光标移至最后
+          range.collapseToStart();//光标移至开头
         }else{
           range.collapseToEnd();//光标移至最后
         }
@@ -151,7 +153,7 @@ class EditableSpan extends Component{
       var range = document.selection.createRange();//创建选择对象
       range.moveToElementText(obj);//range定位到obj
       if(flg){
-        range.collapse(true);//光标移至最后
+        range.collapse(true);//光标移至开头
       }else{
         range.collapse(false);//光标移至最后
       }
@@ -173,16 +175,20 @@ class EditableSpan extends Component{
         preVal:innerVal
       })
     }
+
     let range = window.getSelection();
     let textIndex = range.focusOffset;
-    
-    
     let preObj = $(this.$span.current).prev();
     let nexObj = $(this.$span.current).next();
-    if(preObj &&preObj[0] && preObj[0].nodeName !="DIV"&&textIndex == 0&&innerVal.length>0&&ev.keyCode==8){//在span的第一位
+    // console.log(indexNum , innerVal.length,'***')
+    if(preObj &&preObj[0] && preObj[0].nodeName !="DIV"&&indexNum == 0&&innerVal.length>0&&ev.keyCode==8){//在span的第一位
+      console.log(textIndex,'span第一位')
+      if(textIndex != indexNum){return}
       let obj = preObj[0]&&preObj[0].nodeName=="DIV"?preObj.prev():preObj;
       this.moveEnd(obj[0]);
-    }else if(nexObj &&nexObj[0] && nexObj[0].nodeName !="DIV"&&textIndex == innerVal.length&&innerVal.length>0&&ev.keyCode==46){//最后一位
+    }else if(nexObj &&nexObj[0] && nexObj[0].nodeName !="DIV"&&indexNum == innerVal.length&&innerVal.length>0&&ev.keyCode==46){//最后一位
+      console.log(textIndex,'span最后一位')
+      if(textIndex != indexNum){return}
       let obj = nexObj[0]&&nexObj[0].nodeName=="DIV"?nexObj.next():nexObj;
       this.moveEnd(obj[0],true);
     }
@@ -191,7 +197,7 @@ class EditableSpan extends Component{
     if(ev.keyCode==37&& i!=0){//向左
       let preObj = $(this.$span.current).prev();
       let obj = preObj[0]&&preObj[0].nodeName=="DIV"?preObj.prev():preObj;
-      if(textIndex == 0){
+      if(indexNum == 0){
         if(ev.preventDefault){//阻止默认事件
           ev.preventDefault();
         }else{
@@ -201,11 +207,15 @@ class EditableSpan extends Component{
           this.moveEnd(obj[0]);
         }
       }
+      let range = window.getSelection();
+      indexNum = range.focusNode.length;
+      console.log('光标位置:'+range.focusOffset,range.anchorOffset)
     }
     if(ev.keyCode==39){//向右
+      let curObj = $(this.$span.current)
       let nextObj = $(this.$span.current).next();
       let obj = nextObj[0]&&nextObj[0].nodeName=="DIV"?nextObj.next():nextObj;
-      if(textIndex == textLength || textLength==undefined || (textIndex == 0 && textLength==1)){
+      if(indexNum == textLength || textLength==undefined || (indexNum == 0 && textLength==1)){
         if(ev.preventDefault){//阻止默认事件
           ev.preventDefault();
         }else{
@@ -213,14 +223,18 @@ class EditableSpan extends Component{
         }
         if(obj){
           // obj.focus();
+          console.log(90909)
           this.moveEnd(obj[0],1)
+          
         }
       }
+      let range = window.getSelection();
+      indexNum = range&&range.focusNode.length||indexNum;
     }
-
+    console.log('光标位置最后为:'+indexNum)
   }
   handleKeyup(e){
-    const {boxMark,handleKeydown,removeId,handleClear,removeSpan} = this.props;
+    const {boxMark,handleKeydown,removeId,handleClear,removeSpan,handleChange} = this.props;
     const {preVal,index} = this.state;
     const ev = e||window.event;
     const target = ev.target||ev.srcElement;
@@ -235,10 +249,11 @@ class EditableSpan extends Component{
       // ||textIndex ==innerVal.length&&preObj[0].nodeName=="DIV"
       let range = window.getSelection();
       let textIndex = range.focusOffset;
+
       let nextObj = $(this.$span.current);
       let nexObj = $(this.$span.current).next();
-      let neObj = $(this.$span.current).next().next();
       let preObj = $(this.$span.current).prev();
+      let nexVal = nexObj[0]&&nexObj[0].innerText || nexObj[0]&&nexObj[0].innerHTML; 
       if(preVal.trim().length==1&& !innerVal){
         removeId && removeId({boxMark,i:index,text:"",flag:'del'});
         handleClear && handleClear({boxMark});//删除最后一个字时清空搜索结果,避免现病史搜索框不立即消失的情况
@@ -253,6 +268,7 @@ class EditableSpan extends Component{
       //action里往后删除
       if(innerVal == preVal){
         let data = innerVal.trim();
+        console.log(!!nextObj , !config.punctuationReg.test(','),data)
         if(nextObj && !config.punctuationReg.test(data) || data=='<br>'){
           // console.log(nextObj,nexObj,neObj)
           // nextObj.focus();
@@ -261,18 +277,20 @@ class EditableSpan extends Component{
           if(nextObj && nextObj[0] && nextObj[0].nodeName !=="DIV"){
             // IE浏览器focus光标在最后,其他浏览器在最前
             // nextObj.focus();
-            this.moveEnd(nextObj[0]);
+            this.moveEnd(nextObj[0],1);
           }
           /*this.setState({
             index: null
           })*/
-        }else if(textIndex ==innerVal.length&&nexObj[0]&&nexObj[0].nodeName=="DIV"){
+        }else if(indexNum ==innerVal.length&&nexObj[0]&&nexObj[0].nodeName=="DIV"){
           console.log(99)
           handleKeydown&&handleKeydown({boxMark,i:index+1,text:data,flag:'del'});
           this.moveEnd(nextObj[0]);
-        }else if(nexObj[0].nodeName=="SPAN"){
-          console.log(999)
-          handleKeydown&&handleKeydown({boxMark,i:index,text:'',flag:'del'});
+        }else if(nexObj[0]&&nexObj[0].nodeName=="SPAN"){
+          console.log((nexVal))
+          if(nexVal == ''||!config.punctuationReg.test(nexVal)){
+            handleKeydown&&handleKeydown({boxMark,i:index+1,text:'',flag:'del'});
+          }
           this.moveEnd(nextObj[0]);
         }
       }
@@ -283,6 +301,7 @@ class EditableSpan extends Component{
       // 前面是标签,内容为空时再删一次才移除标签;前面是文本,则直接移除;
       let preObj = $(this.$span.current).prev();
       if(index!==0&&preVal.trim().length==1&& !innerVal){
+        console.log(77)
         removeId && removeId({boxMark,i:index,text:""});
         handleClear && handleClear({boxMark});//删除最后一个字时清空搜索结果,避免现病史搜索框不立即消失的情况
         if(preObj[0].nodeName !=="DIV"){
@@ -292,8 +311,15 @@ class EditableSpan extends Component{
 
       let range = window.getSelection();
       let textIndex = range.focusOffset;
+      console.log(textIndex,11111111111)
       if(innerVal !== preVal){
-
+        //   let nextObj = $(this.$span.current);
+        //   let data = innerVal.trim();
+        //   let tmpVal = data.substr(0,data.length-1)
+        //   handleChange&&handleChange({text1:tmpVal,boxMark,i:index});
+        //   console.log(nextObj,tmpVal,indexNum,textIndex)
+        //   nextObj.html(tmpVal)
+        //   this.moveEnd(nextObj[0])
       }else{
         // 中英文数字和下划线--单独删除标签
         /*const reg = new RegExp("([\u4E00-\uFA29]|[\uE7C7-\uE7F3]|[a-zA-Z0-9_])");
@@ -310,14 +336,17 @@ class EditableSpan extends Component{
         // let pattern = new RegExp(/^\,?$|^\,?$|^\.?$|^\。?$|^\、?$|^\;?$|^\;?$|^\:?$|^\:?$|\s/);
         // if(index!==0 && pattern.test(data)){
         // 后半段是处理IE
-        if(index!==0 && !config.punctuationReg.test(data) || index!==0 && data=='<br>'||textIndex ==0&&preObj[0]&&preObj[0].nodeName=="DIV"){
+        if(index!==0 && !config.punctuationReg.test(data) || index!==0 && data=='<br>'||indexNum ==0&&preObj[0]&&preObj[0].nodeName=="DIV"){
           // let preObj = $(this.$span.current).prev();
+          console.log(111)
           let obj = preObj[0].nodeName=="DIV"?preObj.prev():preObj;
           handleKeydown&&handleKeydown({boxMark,i:index,text:data,flag:'backsp'});
           this.moveEnd(obj[0]);
           this.setState({
             index: null
           })
+        }else if(indexNum == 0&&preObj[0]&&preObj[0].nodeName=="SPAN"){
+          console.log(3333)
         }
       }
       // 主诉使用模板删除最后一个空span时移除
@@ -325,7 +354,6 @@ class EditableSpan extends Component{
         removeSpan();
       }
     }
-
   }
   componentWillReceiveProps(next){
     const isRead = this.props.isRead;
@@ -335,6 +363,9 @@ class EditableSpan extends Component{
   }
   handleClick(e){
     $(this.$span.current).attr({"contentEditable":true}).focus()
+    let range = window.getSelection();
+    let textIndex = range.focusOffset;
+    indexNum = textIndex
   }
   componentDidMount(){
     const {value} = this.props;

+ 4 - 1
src/store/actions/mainSuit.js

@@ -712,11 +712,12 @@ export function backspaceText(state,action){
   let res = Object.assign({},state);
   const {delIndex,flag} = action;
   const data = res.data;
+  console.log(action,data,data[delIndex+1])
   if(flag == 'backsp'){
     if(data[delIndex-1].flag&&data[delIndex-1].flag==3){
     // if(data[delIndex-1].tagType==8 ||data[delIndex-1].flag&&data[delIndex-1].flag==3){
       // 前一个是文本标签或者子模板 不做处理
-    }else if(data[delIndex-1].tagType==8){
+    }else if(data[delIndex-1]&&data[delIndex-1].tagType==8){
       data.splice(delIndex,1);
       res.saveText.splice(delIndex,1);
     }
@@ -728,6 +729,8 @@ export function backspaceText(state,action){
   }else if(flag == 'del'){
     if(data[delIndex+1] && data[delIndex+1].flag&&data[delIndex+1].flag==3){
       // 后一个是文本标签或者子模板 不做处理
+      // data.splice(delIndex,1);
+      // res.saveText.splice(delIndex,1);
     }else if(data[delIndex+1] && data[delIndex+1].tagType==8){
       data.splice(delIndex,1);
       res.saveText.splice(delIndex,1);