解决富文本与填表题问题

src/components/common/RichText.vue

@@ -367,7 +367,11 @@ export default {
       this.$emit('handleRichTextBlur');
       let content = tinymce.get(this.id).getContent();
       // 判断富文本中是否有 字母+数字+空格 的组合，如果没有，直接返回
-      if (!content.match(/[a-zA-Z]+\d(\s| )*/)) {
+      let isHasPinyin = content
+        .split(/<[^>]+>/g)
+        .filter((item) => item)
+        .some((item) => item.match(/[a-zA-Z]+\d(\s|&nbsp;)*/));
+      if (!isHasPinyin) {
         return;
       }
       // 用标签分割富文本，保留标签
@@ -378,7 +382,12 @@ export default {
         // 如果是标签，直接返回
         // 如果是文本，将文本按空格分割为数组，如果是拼音，将拼音转为带音调的拼音
         .map((item) => {
-          return reg.test(item) ? item : item.split(/\s+/).map((item) => handleToneValue(item));
+          // 重置正则，使用全局匹配 g 时需要重置，否则会出现匹配不到的情况，因为 lastIndex 会一直累加，test 方法会从 lastIndex 开始匹配
+          reg.lastIndex = 0;
+          if (reg.test(item)) {
+            return item;
+          }
+          return item.split(/\s+/).map((item) => handleToneValue(item));
         })
         // 如果是标签，直接返回
         // 二维数组，转为拼音，并打平为一维数组

src/views/exercise_questions/create/components/exercises/TalkPictureQuestion.vue

@@ -39,7 +39,7 @@
               </div>
               <div v-if="isEnable(data.property.is_enable_analysis)" class="item-rich">
                 <label>解析</label>
-                <RichText v-model="data.analysis" :font-size="14" placeholder="输入解析" />
+                <RichText v-model="item.analysis" :font-size="14" placeholder="输入解析" />
               </div>
             </div>
           </template>

src/views/exercise_questions/preview/TableFillPreview.vue

@@ -46,12 +46,11 @@
                 <el-input
                   v-model="li.text"
                   :disabled="disabled"
+                  type="textarea"
                   class="fill"
+                  resize="none"
                   placeholder="请输入"
-                  :style="[
-                    { cursor: disabled ? 'not-allowed' : 'pointer' },
-                    { width: Math.max(80, li.text.length * 12) + 'pt' },
-                  ]"
+                  :style="[{ cursor: disabled ? 'not-allowed' : 'pointer' }]"
                   @blur="handleTone(li.text, i, j)"
                 />
               </template>
@@ -134,8 +133,9 @@ export default {
         this.optionList.forEach((item) => {
           item.forEach((li) => {
             if (['input'].includes(li.type)) {
-              let findIndex = this.answer.answer_list.findIndex(({ mark }) => mark === li.mark);
-              if (findIndex === -1 && li.text.length <= 0) {
+              const findIndex = this.answer.answer_list.findIndex(({ mark }) => mark === li.mark);
+              if (findIndex === -1 && li.text.length <= 0) return;
+              if (findIndex !== -1 && li.text.length <= 0) {
                 this.answer.answer_list.splice(findIndex, 1);
                 return;
               }
@@ -148,7 +148,6 @@ export default {
               }
               if (findIndex !== -1) {
                 this.answer.answer_list[findIndex].value = li.text;
-                return;
               }
             }
           });
@@ -235,17 +234,16 @@ $table-border: 1px solid #e0e0e0;
           overflow: auto;
 
           .item-content {
+            flex: 1;
             padding: 8px 12px;
           }
 
-          %input,
-          .el-input.fill {
+          .el-textarea.fill {
             display: inline-flex;
             align-items: center;
-            width: 120px;
             margin: 0 2px;
 
-            :deep input.el-input__inner {
+            :deep .el-textarea__inner {
               padding: 0;
               font-size: 16px;
               color: $font-color;
@@ -253,15 +251,10 @@ $table-border: 1px solid #e0e0e0;
               background-color: #fff;
               border-width: 0;
               border-radius: 0;
-            }
-          }
 
-          .input {
-            @extend %input;
-
-            :deep input.el-input__inner {
-              text-align: center;
-              border-bottom: 1px solid $font-color;
+              &::placeholder {
+                line-height: 42px;
+              }
             }
           }
         }