|
@@ -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;
|