[update] 修改UAT问题：问答库回答改成富文本编辑器，增加附件上传

src/components/FileEcho.vue

@@ -62,6 +62,7 @@ export default {
   watch: {
     fileIds: {
       handler (value) {
+        this.fileList = []
         if (value) {
           this.getFileList()
         }

src/views/businessSupport/questionAnswerLibrary/page/AnswerPage.vue

@@ -58,7 +58,10 @@
           <p class="user-name">{{ item.departName || '' }} {{ item.name }}</p>
           <p v-if="item.isTop" class="top-p">{{ $t('businessSupport.questionAnswer.top') }}</p>
         </div>
-        <div class="answer-form-desc-div">{{ item.answerDescription }}</div>
+        <div class="answer-form-desc-div">
+          <div v-html="item.answerDescription"></div>
+          <file-echo :fileIds="item.attach"/>
+        </div>
         <p class="operate-bottom-p">
           <span>{{ item.createTime }}</span>
           <!--  置顶评论的操作按钮  -->
@@ -86,8 +89,13 @@
         <p class="user-name">{{ currentUser.departIds_dicText || '' }} {{ currentUser.realname }}({{ currentUser.username }})</p>
         <p class="answer_question">{{ $t('businessSupport.questionAnswer.answerQuestion') }}</p>
       </div>
-      <a-textarea v-model="answerDesc" :autoSize="{minRows: 4}" :maxLength="2000"></a-textarea>
+      <u-editor :content="answerDesc" :config="config" ref="ueditor" @editor-onChange="uEditorChange"></u-editor>
-      <p class="answer-desc-num">{{ answerDesc.length }}/2000{{ $t('businessSupport.questionAnswer.word') }}</p>
+      <div class="attach-wrapper">
+        <div class="attach-label">{{ $t('attach') }}</div>
+        <j-upload v-model="attach" returnId multiple />
+      </div>
+<!--      <a-textarea v-model="answerDesc" :autoSize="{minRows: 4}" :maxLength="2000"></a-textarea>-->
+<!--      <p class="answer-desc-num">{{ answerDesc.length }}/2000{{ $t('businessSupport.questionAnswer.word') }}</p>-->
       <a-button class="submit-btn" type="primary" @click="submit" v-has="'quiz:detail:answerSubmit'">{{ $t('submit') }}</a-button>
     </div>
     <!--  图片预览容器 -->
@@ -109,6 +117,8 @@ import { previewPdf } from '@/utils/previewPdf'
 import InternalDetailPage from '@/components/InternalDetailPage'
 import { kkFilePreview } from '@/utils/kkFilePreview'
 import { isHasPermission } from '@/utils/hasPermission'
+import UEditor from '../../../../components/uEditor/UEditor'
+import FileEcho from '../../../../components/FileEcho'
 
 // 支持预览的文件后缀
 const CAN_PREVIEW_FILE_SUFFIX = ['jpg', 'jpeg', 'png', 'pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx']
@@ -118,7 +128,7 @@ const Base64 = require('js-base64').Base64
 
 export default {
   name: 'AnswerPage',
-  components: { InternalDetailPage },
+  components: { FileEcho, InternalDetailPage, UEditor },
   data () {
     return {
       loading: false,
@@ -131,7 +141,101 @@ export default {
         realname: '',
         orgCodeTxt: ''
       },
+      // UE编辑器配置
+      config: {
+        // 可以在此处定义工具栏的内容
+        toolbars: [
+          [
+            'undo', // 撤销
+            'redo', // 重做
+            'bold', // 加粗
+            'italic', // 斜体
+            'underline', // 下划线
+            'strikethrough', // 删除线
+            'subscript', // 下标
+            'superscript', // 上标
+            'fontborder', // 字符边框
+            'fontfamily', // 字体
+            'fontsize', // 字号
+            'forecolor', // 字体颜色
+            // 'backcolor', // 背景色
+            'paragraph', // 段落格式
+            'customstyle', // 自定义标题
+            'indent', // 首行缩进
+            'justifyleft', // 居左对齐
+            'fullscreen', // 全屏
+            'justifyright', // 居右对齐
+            'justifycenter', // 居中对齐
+            'justifyjustify', // 两端对齐
+            'lineheight', // 行间距,
+            'rowspacingtop', // 段前距
+            'rowspacingbottom', // 段后距
+            'directionalityltr', // 从左向右输入
+            'directionalityrtl', // 从右向左输入
+            'cleardoc', // 清空文档
+            'formatmatch', // 格式刷
+            'removeformat', // 清除格式
+            'source', // 源代码
+            'blockquote', // 引用
+            'pasteplain', // 纯文本粘贴模式
+            'selectall', // 全选
+            'horizontal', // 分隔线
+            'time', // 时间
+            'date', // 日期
+            'link', // 超链接
+            'unlink', // 取消链接
+            // 'background', // 背景
+            // 'simpleupload', // 单图上传
+            'imagenone', // 默认
+            'imageleft', // 左浮动
+            'imageright', // 右浮动
+            'imagecenter', // 居中
+            'touppercase', // 字母大写
+            'tolowercase', // 字母小写
+            'emotion', // 表情
+            'spechars', // 特殊字符
+            'searchreplace', // 查询替换
+            'insertunorderedlist', // 无序列表
+            'insertorderedlist', // 有序列表
+            'pagebreak', // 分页
+            'insertframe', // 插入Iframe
+            'charts', // 图表
+            'edittip ', // 编辑提示
+            'autotypeset', // 自动排版
+            'drafts', // 从草稿箱加载
+            'inserttable', // 插入表格
+            'deletetable', // 删除表格,
+            'insertparagraphbeforetable', // ”表格前插入行”
+            'insertrow', // 前插入行
+            'insertcol', // 前插入列
+            'mergeright', // 右合并单元格
+            'mergedown', // 下合并单元格
+            'deleterow', // 删除行
+            'deletecol', // 删除列
+            'splittorows', // 拆分成行
+            'splittocols', // 拆分成列
+            'splittocells', // 完全拆分单元格
+            'inserttitle', // 插入标题
+            'deletecaption', // 删除表格标题,
+            'mergecells', // 合并多个单元格
+            'edittable', // 表格属性
+            'edittd' // 单元格属性
+          ]
+        ],
+        autoHeightEnabled: false,
+        autoFloatEnabled: false,
+        initialContent: '', // 初始化编辑器的内容,也可以通过textarea/script给值，看官网例子
+        autoClearinitialContent: true, // 是否自动清除编辑器初始内容，注意：如果focus属性设置为true,这个也为真，那么编辑器一上来就会触发导致初始化的内容看不到了
+        initialFrameWidth: '100%',
+        elementPathEnabled: false,
+        initialFrameHeight: 300,
+        maximumWords: 4000,
+        BaseUrl: '',
+        UEDITOR_HOME_URL: '/ueditor/',
+        editTableIndex: 1
+      },
       answerDesc: '',
+      attach: '', // 回答的附件
       canAnswer: false,
       userInfo: {},
       image: false,
@@ -248,6 +352,11 @@ export default {
         }
       })
     },
+    // 获取表格内容
+    uEditorChange (val) {
+      console.log('--------------uEditorChange------------', val)
+      this.answerDesc = val
+    },
     submit () {
       if (!this.answerDesc) {
         this.$message.warning(this.$t('businessSupport.questionAnswer.pleaseEnterAnswerDesc'))
@@ -256,11 +365,15 @@ export default {
       const param = {}
       param.problemId = this.model.id
       param.answerDescription = this.answerDesc
+      param.attach = this.attach
       answerQuiz(param).then(res => {
         if (res.success) {
           this.$message.success(res.message)
           this.initData(this.model.id)
+          this.$refs.ueditor.execCommand()
           this.answerDesc = ''
+          this.attach = ''
+          this.$forceUpdate()
         } else {
           this.$message.warning(res.message)
         }
@@ -476,4 +589,25 @@ export default {
     }
   }
 }
+
+/deep/ .edui-default .edui-editor {
+  width: 100% !important;
+}
+
+/deep/ .edui-default .edui-toolbar {
+  line-height: 20px;
+}
+
+.attach-wrapper {
+  display: flex;
+  align-items: baseline;
+  margin-top: 20px;
+  .attach-label {
+    width: 4em;
+    font-size: 16px;
+    font-family: PingFang SC-Regular, PingFang SC, sans-serif;
+    font-weight: 400;
+    color: #86909C;
+  }
+}
 </style>