火狐placeholder模拟

src/components/AddAssistCheck/Textarea/index.jsx

@@ -1,14 +1,17 @@
 import React, { Component } from "react";
 import style from "./index.less";
 import config from '@config/index';
+import $ from 'jquery';
 
 class Textarea extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      timer:null
+      timer:null,
+      val:'报告描述或意见'
     };
     this.$dom = React.createRef();
+    this.$domW = React.createRef();
     this.handleInput = this.handleInput.bind(this);
     this.handleFocus = this.handleFocus.bind(this);
     this.handleBlur = this.handleBlur.bind(this);
@@ -24,6 +27,11 @@ class Textarea extends Component {
       handlePush&&handlePush();
       clearTimeout(stimer);
     },config.delayPushTime);
+    if(text.trim() != ''){
+      this.setState({val:''})
+    }else{
+      this.setState({val:'报告描述或意见'})
+    }
     this.setState({
       timer
     });
@@ -44,26 +52,32 @@ class Textarea extends Component {
     const {value} = this.props;
     if(value){
       this.$dom.current.innerText = value||'';
+      this.setState({val:''})
     }
   }
   handleFocus(e){
-    console.log(e.target)
-    
+    this.setState({val:''})
   }
   handleBlur(e){
-    console.log(e.target)
+    let str = this.$dom.current.innerText
+    if(str.trim() == ''){
+      this.setState({val:'报告描述或意见'})
+    }
   }
   render() {
-    const {value} = this.props;
+    const {val} = this.state;
     return (
-      <div className={style.divTextarea}
-          contenteditable={true}
-          ref={this.$dom}
-          onInput={this.handleInput}
-          onFocus={this.handleFocus}
-          onBlur={this.handleBlur}
-          onPropertyChange={this.handleInput}
-      ></div>
+      <div className={style.textWap}>
+        <div className={style.divTextarea}
+            contenteditable={true}
+            ref={this.$dom}
+            onInput={this.handleInput}
+            onFocus={this.handleFocus}
+            onBlur={this.handleBlur}
+            onPropertyChange={this.handleInput}
+        ></div>
+        <p className={style.textareaWarring} id="textareaWarring">{val}</p>
+      </div>
     );
   }
 }

src/components/AddAssistCheck/Textarea/index.less

@@ -10,11 +10,24 @@
   line-height: 20px;
   resize: none;
   font-family: inherit;
+  position: relative;
+  z-index: 10;
 }
-.divTextarea:empty:before{ 
-  content: '报告描述或意见'; 
-  color: gray; 
-} 
-.divTextarea:focus:before{
-  content:none;
-}
+.textWap {
+  overflow: hidden;
+  position: relative;
+  .textareaWarring {
+    position: absolute;
+    left: 0;
+    top: 0;
+    color: #a5a3a3;
+    z-index: 5;
+  }
+}
+// .divTextarea:empty:before{ 
+//   content: '报告描述或意见'; 
+//   color: #a5a3a3; 
+// } 
+// .divTextarea:focus:before{
+//   content:none;
+// }

src/utils/tools.js

@@ -591,7 +591,8 @@ function isAllClear(jsonData,jsonStr,baseList){
     jsonData.present.length < 1 &&
     // jsonData.other.length < 1 && 
     (jsonData.other.length > 0 ? baseList.checkBody.isEmpty : true) &&
-    jsonData.vital.length < 1 &&
+    // jsonData.vital.length < 1 &&
+    (jsonData.vital.length > 0 ? baseList.otherHistory.isEmpty : true) &&
     jsonData.diag.length < 1 &&
     jsonData.pacs.length < 1 &&
     jsonData.lis.labelList.length < 1 &&