富文本编辑状态控制

src/components/dashboardDesigner/chartView.jsx

@@ -85,7 +85,7 @@ class ChartView extends React.Component {
                 }
             }
         }else if(viewType === 'richText') { // 富文本类型
-            children = <RichTextEditor content={content} onContentChange={(content) => {
+            children = <RichTextEditor readOnly={!editMode} content={content} onContentChange={(content) => {
                 dispatch({ type: 'dashboardDesigner/modifyItem', fields: { code: item.code, content } });
             }}/>
         }else {

src/components/dashboardDesigner/richTextEditor.jsx

@@ -16,7 +16,7 @@ class RichTextEditor extends Component {
         );
     }
     componentDidMount() {
-        const { content, onContentChange } = this.props;
+        const { content, onContentChange, readOnly } = this.props;
         const elem = this.refs.editorElem;
         const editor = new E(elem);
         editor.customConfig.onchange = (html) => {
@@ -26,6 +26,9 @@ class RichTextEditor extends Component {
             }
         }; // 使用 onchange 函数监听内容的变化
         editor.customConfig.onfocus = () => {
+            if(readOnly) {
+                return;
+            }
             this.setState({
                 _html: editor.txt.html()
             });
@@ -64,6 +67,8 @@ class RichTextEditor extends Component {
         editor.create()
         // editor.blur();
         editor.txt.html(content);
+
+        editor.$textElem.attr('contenteditable', !readOnly)
     }
 }
 

src/components/dashboardDesigner/viewLayout.less

@@ -90,7 +90,7 @@
           overflow: auto;
           border: none !important;
           .w-e-text {
-            pointer-events: none;
+            // pointer-events: none;
             padding: 0 14px;
             &>table {
               margin: 0;