瀏覽代碼

Merge branch 'dev5.3.3' into dev/new1

zhouna 5 年之前
父節點
當前提交
46c22ff689

+ 37 - 29
src/common/components/InlineTag/index.jsx

@@ -1,6 +1,8 @@
 import React, { Component } from "react";
 import style from "./index.less";
 import classNames from 'classnames';
+import Notify from '@commonComp/Notify';
+import config from '@config/index';
 /***
  * 标签组件
  * author:zn@2018-11-08
@@ -17,7 +19,7 @@ class InlineTag extends Component {
     this.$span = React.createRef();
     this.state = {
       value:props.value||'',
-      placeholder:props.placeholder||''
+      over:false
     };
     this.handleBlur = this.handleBlur.bind(this);
     this.handleInput = this.handleInput.bind(this);
@@ -26,35 +28,50 @@ class InlineTag extends Component {
   }
   handleInput(e){       //输入时保存临时值,在修改灰显为黑色时判断用
     e.stopPropagation();
-    const value = e.target.innerText||e.target.innerHTML.replace(/ $|^ /,'');//兼容firefox26
+    const {mainSaveText,ikey,prefix,suffix,value,boxMark} = this.props;
+    const val = e.target.innerText||e.target.innerHTML.replace(/ $|^ /,'');//兼容firefox26
+    const myval = prefix+val+suffix;
+    const i = ikey.split("-")[1];
+    const tempArr = [...mainSaveText];
+    tempArr.splice(i,1);
+    let lefts = tempArr.join("");
+    if(boxMark==='1'&&(lefts+myval).length>config.limited) {      //主诉超过字数限制提示并禁止输入
+      e.target.innerHTML = value||'';
+      Notify.info(config.limitText);
+      this.setState({
+        over:true
+      });
+      return;
+    }
     this.setState({
-      value:value
-    })
+      value:val,
+      over:false
+    });
   }
   handleBlur(e){         //鼠标离开是保存值到store中
     e.stopPropagation(); //不阻止会触发外层div的失焦事件
-    const value = e.target.innerText||e.target.innerHTML.replace(/ $|^ /,'');;
-    const {handleInput,ikey,prefix,suffix,placeholder} = this.props;
-    if(!value.trim()){
+    const val = e.target.innerText||e.target.innerHTML.replace(/ $|^ /,'');
+    const {handleInput,ikey,prefix,suffix,placeholder,value,boxMark} = this.props;
+    if(!val.trim()){
       this.setState({
-        placeholder:placeholder,
         value:''
       });
+      e.target.innerHTML = placeholder;
     }
-    //this.$span.current.innerText?(this.$span.current.innerText=''):(this.$span.current.innerHTML='');      //修改生成文字变成输入的2倍bug
-    handleInput&&handleInput({text:value.trim(),ikey,prefix,suffix});
-    this.setState({
-      value:value.trim()
-    });
+    if(boxMark==='1'&&this.state.over){     //超过字数限制,显示输入前的值
+      e.target.innerHTML = value||'';
+      return;
+    }
+    //主诉未超过字数限制,保存值
+    e.target.innerHTML = val.trim();
+    handleInput&&handleInput({text:val.trim(),ikey,prefix,suffix});
   }
   handleFocus(e){
     e.stopPropagation();
-    const text = e.target.innerText || e.target.innerHTML.replace(/ $|^ /,'');;
+    const text = e.target.innerText || e.target.innerHTML.replace(/ $|^ /,'');
     const {placeholder} = this.props;
     if(text.trim()==placeholder){
-      this.setState({
-        placeholder:''
-      });
+      e.target.innerHTML = '';
     }
   }
   getStyle(){
@@ -91,21 +108,12 @@ class InlineTag extends Component {
   }
   componentDidMount(){
     //设置最小宽度避免输入后宽度跳动
+    this.$span.current.innerHTML=this.props.placeholder;
     const spanWidth = window.getComputedStyle(this.$span.current).width;
     this.$span.current.style.minWidth=spanWidth;
   }
-  componentWillReceiveProps(nextProps){
-    if((nextProps.placeholder == this.props.placeholder)&&(nextProps.value == this.props.value)){
-      return
-    }
-    this.setState({
-      placeholder:nextProps.placeholder,
-      value:nextProps.value
-    })
-  }
   render(){
-    const {prefix,suffix,value} = this.props;
-    const {placeholder} = this.state;
+    const {prefix,suffix} = this.props;
     return <div className={this.getStyle()}
                 onClick={this.handleFixClick}>
                 <span>{prefix}</span>
@@ -115,7 +123,7 @@ class InlineTag extends Component {
                       onInput={this.handleInput}
                       onFocus={this.handleFocus}
                       onClick={(e)=>{e.stopPropagation();}}
-                      ref={this.$span}>&nbsp;{value||placeholder}</span>
+                      ref={this.$span}></span>
                 <span>{suffix}</span>
             </div>;
     }

+ 1 - 1
src/components/AddAssistCheck/index.jsx

@@ -85,6 +85,7 @@ class AddAssistCheck extends React.Component {
   delConfirm(type) {
     const { handleDelAssist, handlePush } = this.props;
     const { id,activeName } = this.state;
+    $(".TextareaRsize").css({marginTop:0});
     handleDelAssist && handleDelAssist(id,activeName,type);
     handlePush && handlePush();           //右侧推送
     this.setState({
@@ -195,7 +196,6 @@ class AddAssistCheck extends React.Component {
       width:'8px',
       background:'#f1f1f1'};
     const barStyle={background:'#777',width:'100%'};
-    $(".TextareaRsize").css({marginTop:0})
     return <React.Fragment>
       {
         checkedListImport.map((part,index)=>{

+ 65 - 42
src/components/RadioInpDrop/index.jsx

@@ -21,14 +21,13 @@ class RadioInpDrop extends Component{
     super(props);
     this.state={
       texts:props.vals||{0:props.value||props.placeholder},
-      over:false,
     };
     this.$cont = React.createRef();
     this.isIE = navigator.appName=="Microsoft Internet Explorer" && navigator.appVersion.split(";")[1].replace(/[ ]/g,"")=="MSIE8.0";
     this.handleSelect = this.handleSelect.bind(this);
     this.handleShow = this.handleShow.bind(this);
     this.parseInputDom = this.parseInputDom.bind(this);
-    this.handleInnerInp = this.handleInnerInp.bind(this);
+    this.handleInnerBlur = this.handleInnerBlur.bind(this);
   }
   getClass(){
     const {value,hideTag,show,isImports,isExtBlue} = this.props;
@@ -83,45 +82,31 @@ class RadioInpDrop extends Component{
       })
     },$("#addScrollEvent")[0])
   }
-  handleInnerInp(i,val){
+  handleInnerBlur(i,val){
     const {ikey,boxMark,handleSaveInp,mainSaveText} = this.props;
-    let vals = this.state.texts; 
-
-    // 主诉字数限制
-    if(boxMark==1){
-      let preText = vals[i].value;
-      let mainText = filterDataArr(mainSaveText);
-      let lengths = 0;
-      if(preText){
-        lengths = mainText.length + (val.length - preText.length);
-      }else{
-        lengths = mainText.length + val.length;
-      }
-      //console.log("val:",val,"preVal:",preText,"mainText:",mainText,"lengths:",lengths,this.state.texts)
-      if(lengths >= config.limited){
-        Notify.info(config.limitText);
-        this.setState({
-          over:true
-        });
-        return
-      }
-    }
-    
+    let vals = this.state.texts;
     vals[i].value=val;
     this.setState({
       texts:vals,
-      over:false
     });
     handleSaveInp({values:vals,ikey,boxMark,mainSaveText});
   }
   parseInputDom(){
-    const {value,placeholder} = this.props;
-    const {texts,over} = this.state;
+    const {mainSaveText,ikey,boxMark} = this.props;
+    const {texts} = this.state;
+    const inx = ikey.split("-")[1];
     let temp='',list=[];
     for(let i in texts){
       temp = texts[i];
       if(typeof temp=='object'){
-        list.push(<InputComp handleInp={this.handleInnerInp} index={i} value={temp.value} over={over}></InputComp>);
+        list.push(<InputComp handleBlur={this.handleInnerBlur}
+                             mainSaveText={mainSaveText}
+                             index={i}
+                             inx = {inx}
+                             texts={texts}
+                             boxMark={boxMark}
+                             value={temp.value}
+                             ></InputComp>);
       }else{
         list.push(<span>&nbsp;{temp}</span>);
       }
@@ -147,34 +132,72 @@ class InputComp extends Component{
     super(props);
     this.$inp = React.createRef();
     this.handleBlur = this.handleBlur.bind(this);
+    this.handleInp = this.handleInp.bind(this);
   }
   handleBlur(e){
     e.stopPropagation();
+    if(this.over){
+      return;
+    }
     // FF26 只有innerHTML
     const text = e.target.innerText || e.target.innerHTML;
-    const {handleInp,index,value} = this.props;
-    e.target.innerText?(e.target.innerText = ''):(e.target.innerHTML = '');
+    const {handleBlur,index} = this.props;
+    e.target.innerHTML = '';
     // FF26 会把&nbsp; 也获取到
-    handleInp(index,text.replace('&nbsp;',''));
+    handleBlur(index,text.replace('&nbsp;',''));
   }
-  componentWillReceiveProps(next){
-    if(next.over&&!this.props.over){
-      const inp = this.$inp.current;
-      const value = this.props.value;
-      setTimeout(function(){
-        inp.innerText?(inp.innerText = ''):(inp.innerHTML = '');
-        inp.innerText?(inp.innerText = value):(inp.innerHTML = value);
-      })
+  getTextVal(obj=[],index){
+    let str = '';
+    Object.keys(obj).map((it)=>{
+      if(typeof obj[it]==='string'){
+        str += obj[it];
+      }else{
+        if(it!==index){       //当前输入框文字不记录,避免重复计算
+          str += obj[it].value;
+        }
+      }
+    });
+    return str;
+  }
+  handleInp(e){
+    const val = e.target.innerText||e.target.innerHTML;
+    const {mainSaveText,value,index,texts,inx,boxMark} = this.props;
+    if(boxMark==='1'){
+      const textVal = this.getTextVal(texts,index);    //已存的单选含自由输入生成的文字
+      const tempArr = [...mainSaveText];
+      tempArr.splice(inx,1);
+      const otherVal = tempArr.join("");      //主诉其他的已填文字
+      //console.log(textVal,otherVal,val)
+      //超出主诉限制提示并不可继续输入
+      if((textVal+otherVal+val).length>config.limited){
+        e.target.innerHTML=value||'';
+        this.over=true;
+        //e.target.blur();
+        Notify.info(config.limitText);
+        return;
+      }
+      this.over=false;
     }
+    this.over=false;
+  }
+  componentWillReceiveProps(next){
+    //超过限制时,再点开下拉被删除的输入文字又出现bug修改
+    const inp = this.$inp.current;
+    const value = next.value;
+    inp.innerHTML = '';
+    setTimeout(function(){
+      inp.innerHTML = value;
+    });
   }
   render(){
     const {value} = this.props;
     return <span contentEditable={true}
-                          ref={this.$inp}
+                 ref={this.$inp}
                  className={style['inner-inp']}
                  onClick={(e)=>{e.stopPropagation()}}
                  onFocus={(e)=>{e.stopPropagation()}}
-                 onBlur={this.handleBlur}>&nbsp;{value}</span>
+                 onInput={this.handleInp}
+                 onBlur={this.handleBlur}>&nbsp;</span>
   }
 }
 

+ 3 - 0
src/components/RadioInpDrop/index.less

@@ -30,4 +30,7 @@
   min-width:30px;
   text-align:center;
   word-break: break-all;
+  /**ff26必需**/
+  min-height: 22px;
+  vertical-align: middle;
 }

+ 3 - 1
src/containers/InlineTag.js

@@ -8,7 +8,9 @@ import InlineTag from "../common/components/InlineTag";
 import {getLabelIndex} from '@utils/tools.js';
 
 function mapStateToProps(state){
-  return {}
+  return {
+    mainSaveText:state.mainSuit.saveText,
+  }
 }
 
 const tagInpActions = {

+ 1 - 0
src/containers/eleType.js

@@ -73,6 +73,7 @@ export function singleRadio(params){
     case 6:
       return <InlineTag prefix={data.labelPrefix}
                         suffix={data.labelSuffix}
+                        boxMark={boxMark}
                         placeholder={data.name}
                         isExtBlue={data.specFlag===4?true:false}
                         value={data.value}