refactor(仪表板): 优化修复富文本显示文案，tab页中的显示优化 (#2936)

* fix(仪表板): 修复富文本在tab页无效的问题

* refactor(富文本): 富文本编辑区结果展示文案修改，去掉下钻

* refactor(富文本): 富文本字段选择按钮再进入编辑状态再显示

* fix(仪表板): 富文本初始化进入仪表板编辑状态保存按钮会显示可以用问题

Co-authored-by: wangjiahao <1522128093@qq.com>

frontend/src/components/canvas/components/Editor/EditBar.vue

@@ -45,7 +45,7 @@
         @mousedown="fieldsAreaDown"
       >
         <fields-list :fields="curFields" :element="element" />
-        <i slot="reference" :title="$t('panel.select_field')" class="icon iconfont icon-datasource-select" style="margin-left: 4px;cursor: pointer;font-size: 14px;" />
+        <i slot="reference" :disabled="element.editing" :title="$t('panel.select_field')" class="icon iconfont icon-datasource-select" style="margin-left: 4px;cursor: pointer;font-size: 14px;" />
       </el-popover>
       <span :title="$t('panel.jump')">
         <a v-if="showJumpFlag" :title="curComponent.hyperlinks.content " :target="curComponent.hyperlinks.openMode " :href="curComponent.hyperlinks.content ">
@@ -131,7 +131,7 @@ export default {
       return this.curComponent.type === 'view' && this.curComponent.propValue.innerType !== 'richTextView'
     },
     selectFieldShow() {
-      return this.activeModel === 'edit' && this.curComponent.type === 'view' && this.curComponent.propValue.innerType === 'richTextView'
+      return this.activeModel === 'edit' && this.curComponent.type === 'view' && this.curComponent.propValue.innerType === 'richTextView' && this.curComponent.editing
     },
     curComponentTypes() {
       const types = []

frontend/src/components/canvas/custom-component/DeRichTextView.vue

@@ -131,9 +131,9 @@ export default {
     viewInit(){
       bus.$on('fieldSelect-' + this.element.propValue.viewId, this.fieldSelect)
       tinymce.init({})
+      this.myValue = this.assignment(this.element.propValue.textValue)
+      bus.$on('initCurFields-' + this.element.id, this.initCurFieldsChange)
       this.$nextTick(()=>{
-        this.myValue = this.assignment(this.element.propValue.textValue)
-        bus.$on('initCurFields-' + this.element.id, this.initCurFieldsChange)
         this.initReady=true
       })
     },

frontend/src/components/widget/DeWidget/DeTabs.vue

@@ -159,6 +159,7 @@ import { mapState } from 'vuex'
 import { chartCopy } from '@/api/chart/chart'
 import { buildFilterMap } from '@/utils/conditionUtil'
 import TabUseList from '@/views/panel/AssistComponent/tabUseList'
+import {findPanelElementInfo} from "@/api/panel/panel";
 
 export default {
   name: 'DeTabls',
@@ -366,7 +367,8 @@ export default {
           component = JSON.parse(JSON.stringify(componentTemp))
           const propValue = {
             id: newComponentId,
-            viewId: componentInfo.id
+            viewId: componentInfo.id,
+            textValue: ''
           }
           component.propValue = propValue
           component.filters = []
@@ -382,9 +384,20 @@ export default {
         this.curItem.name = newComponentId
         this.viewDialogVisible = false
         this.activeTabName = newComponentId
-        this.$store.dispatch('chart/setViewId', component.propValue.viewId)
-        this.styleChange()
+        if(node.modelInnerType==='richTextView'){
+          findPanelElementInfo(node.innerId).then(viewElement =>{
+            if(viewElement.data){
+              this.curItem.content.propValue.textValue = viewElement.data.propValue.textValue
+            }
+            this.$store.dispatch('chart/setViewId', component.propValue.viewId)
+            this.styleChange()
+          })
+        }else{
+          this.$store.dispatch('chart/setViewId', component.propValue.viewId)
+          this.styleChange()
+        }
       })
+
     },
 
     setComponentInfo() {