修改表头分离表格和语音矩阵

src/components/Adult/inputModules/HeaderSeparate/components/CellEdit.vue

@@ -67,78 +67,75 @@
 
       <template v-else-if="cellData.type === 'mulText'">
         <div class="adult-book-input-item">
-            <span class="adult-book-lable">题干部分：</span>
-            <el-button type="primary" @click="setOptionDetail()"
-              >添加句子</el-button
-            >
-          </div>
-          <div
-            v-if="cellData.mulText.detail.length > 0"
-            style="padding: 10px 0px 10px 86px"
+          <span class="adult-book-lable">题干部分：</span>
+          <el-button type="primary" @click="setOptionDetail()"
+            >添加句子</el-button
           >
-            <ul
-              class="option-detail-detail"
-              v-for="(dItem, dIndex) in cellData.mulText.detail"
-              :key="'ddItem' + dIndex"
+        </div>
+        <div
+          v-if="cellData.mulText.detail.length > 0"
+          style="padding: 10px 0px 10px 86px"
+        >
+          <ul
+            v-for="(dItem, dIndex) in cellData.mulText.detail"
+            :key="'ddItem' + dIndex"
+            class="option-detail-detail"
+          >
+            <li
+              v-for="(ddItem, ddIndex) in dItem.detail"
+              :key="'ddItem' + dIndex + ddIndex"
             >
-              <li
-                v-for="(ddItem, ddIndex) in dItem.detail"
-                :key="'ddItem' + dIndex + ddIndex"
+              <span
+                :class="[
+                  ddItem.config.wordPadding.indexOf('left') > -1 ? 'dleft' : '',
+                  ddItem.config.wordPadding.indexOf('right') > -1
+                    ? 'dright'
+                    : '',
+                  !ddItem.sentence ? 'placeholder' : '',
+                ]"
+                >{{ ddItem.sentence }}</span
               >
-                <span
-                  :class="[
-                    ddItem.config.wordPadding.indexOf('left') > -1
-                      ? 'dleft'
-                      : '',
-                    ddItem.config.wordPadding.indexOf('right') > -1
-                      ? 'dright'
-                      : '',
-                    !ddItem.sentence ? 'placeholder' : '',
-                  ]"
-                  >{{ ddItem.sentence }}</span
-                >
-              </li>
-              <i
-                class="el-icon-edit"
-                @click.prevent="
-                  setOptionDetail('edit', dItem, dIndex)
-                "
-                style="margin-left: 14px"
-              ></i>
-              <i
-                class="el-icon-delete"
-                @click.prevent="deleteOptionDetail(cellData.mulText.detail, dIndex)"
-                style="margin-left: 14px"
-              ></i>
-            </ul>
-          </div>
-          <div class="correct-box">
-            <div
-              style="width: 600px"
-            >
-              <div style="padding-top: 10px">
-                <span style="display: block; margin-bottom: 10px"
-                  >句子填空答案：<b style="font-size: 12px"
-                    >请输入本题答案，答案用换行符隔开；如果有的输入框没有答案，答案请输入??</b
-                  ></span
-                >
-                <el-input
-                  class="adult-book-input"
-                  type="textarea"
-                  :autosize="{ minRows: 2 }"
-                  v-model="cellData.mulText.correct.completeInput"
-                  placeholder="请输入句子填空答案"
-                  @blur="onBlur"
-                  maxlength="1000"
-                ></el-input>
-              </div>
+            </li>
+            <i
+              class="el-icon-edit"
+              style="margin-left: 14px"
+              @click.prevent="setOptionDetail('edit', dItem, dIndex)"
+            />
+            <i
+              class="el-icon-delete"
+              style="margin-left: 14px"
+              @click.prevent="
+                deleteOptionDetail(cellData.mulText.detail, dIndex)
+              "
+            />
+          </ul>
+        </div>
+        <div class="correct-box">
+          <div style="width: 600px">
+            <div style="padding-top: 10px">
+              <span style="display: block; margin-bottom: 10px">
+                句子填空答案：
+                <b style="font-size: 12px">
+                  请输入本题答案，答案用换行符隔开；如果有的输入框没有答案，答案请输入??
+                </b>
+              </span>
+              <el-input
+                v-model="cellData.mulText.correct.completeInput"
+                class="adult-book-input"
+                type="textarea"
+                :autosize="{ minRows: 2 }"
+                placeholder="请输入句子填空答案"
+                maxlength="1000"
+                @blur="onBlur"
+              />
             </div>
           </div>
+        </div>
       </template>
 
       <template v-if="cellData.isCross">
         <div>勾叉答案</div>
-        <CrossTick :cellData="cellData" />
+        <CrossTick :cell-data="cellData" />
       </template>
     </div>
     <div slot="footer">
@@ -152,7 +149,11 @@
       :visible.sync="addStemVisible"
       width="50%"
     >
-      <SentenceSegTemp :detail="optionItemDetail" :segModel="'words'" :type="'config_table'" />
+      <SentenceSegTemp
+        :detail="optionItemDetail"
+        :seg-model="'words'"
+        :type="'config_table'"
+      />
       <span slot="footer" class="dialog-footer">
         <el-button @click="addStemVisible = false">取 消</el-button>
         <el-button type="primary" @click="saveOptionDetail">确 定</el-button>
@@ -219,8 +220,8 @@ export default {
     confirm() {
       this.$emit("close");
     },
-    //添加句子
-    setOptionDetail( type, dItem, dIndex) {
+    // 添加句子
+    setOptionDetail(type, dItem, dIndex) {
       let _this = this;
       _this.addStemVisible = true;
       if (type == "edit") {
@@ -230,9 +231,9 @@ export default {
           hengLeg: -1,
           detail: [
             {
-              pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
-              sentence: "", //句子
-              segList: [], //分词结果
+              pyPosition: "top", // top 拼音在上面；bottom 拼音在下面
+              sentence: "", // 句子
+              segList: [], // 分词结果
               seg_words: "",
               wordsList: [],
               hengList: [],
@@ -241,9 +242,9 @@ export default {
                 fontColor: "#000",
                 fontFamily: "FZJCGFKTK",
                 wordPadding: [],
-                conAlign: 'center'
+                conAlign: "center",
               },
-              input_Isexample: false
+              input_Isexample: false,
             },
           ],
           fn_check_list: {
@@ -255,28 +256,25 @@ export default {
       this.datailIndex = dIndex;
       this.detailSelectType = type;
     },
-    //删除句子
+    // 删除句子
     deleteOptionDetail(detail, dIndex) {
-        this.$confirm("确定要删除吗?", "提示", {
-            confirmButtonText: "确定",
-            cancelButtonText: "取消",
-            type: "warning",
-        })
-        .then(() => {
-            detail.splice(dIndex, 1);
-        })
+      this.$confirm("确定要删除吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        detail.splice(dIndex, 1);
+      });
     },
-    //保存句子
+    // 保存句子
     saveOptionDetail() {
-      let _this = this;
-      _this.addStemVisible = false;
-      if (_this.detailSelectType == "edit") {
-        let optionItem = JSON.parse(JSON.stringify(_this.optionItemDetail));
-        _this.cellData.mulText.detail[_this.datailIndex] =
-          optionItem;
+      this.addStemVisible = false;
+      if (this.detailSelectType === "edit") {
+        let optionItem = JSON.parse(JSON.stringify(this.optionItemDetail));
+        this.cellData.mulText.detail[this.datailIndex] = optionItem;
       } else {
-        let optionItem = JSON.parse(JSON.stringify(_this.optionItemDetail));
-        _this.cellData.mulText.detail.push(optionItem);
+        let optionItem = JSON.parse(JSON.stringify(this.optionItemDetail));
+        this.cellData.mulText.detail.push(optionItem);
       }
     },
     onBlur(item, field) {
@@ -312,7 +310,7 @@ export default {
       &.dleft {
         padding-left: 4px;
       }
-      &.dright{
+      &.dright {
         padding-right: 4px;
       }
     }

src/components/Adult/inputModules/VoiceMatrix.vue

@@ -12,8 +12,8 @@
       <template
         v-if="
           curQue.mp3_list &&
-            curQue.mp3_list.length > 0 &&
-            curQue.mp3_list[0].source === 'tts'
+          curQue.mp3_list.length > 0 &&
+          curQue.mp3_list[0].source === 'tts'
         "
       >
         <div class="create_mp3_list">
@@ -23,7 +23,7 @@
             src="../../../assets/adult/del-close.png"
             class="mp3_del"
             @click="delMp3"
-          >
+          />
         </div>
       </template>
       <template v-else>
@@ -33,7 +33,8 @@
           type="primary"
           :style="{ margin: '12px 0' }"
           @click="createdMp3"
-        >生成音频</el-button>
+          >生成音频</el-button
+        >
       </template>
 
       <upload
@@ -53,11 +54,9 @@
       分配lrc
     </el-button>
 
-    <el-button
-      type="primary"
-      size="small"
-      @click="analyzeVoiceFile"
-    >根据语音和文本进行打点标记</el-button>
+    <el-button type="primary" size="small" @click="analyzeVoiceFile"
+      >根据语音和文本进行打点标记</el-button
+    >
     <span :style="{ margin: '12px' }">匹配模式</span>
     <el-select v-model="match_type" size="small">
       <el-option
@@ -201,9 +200,21 @@
                     maxlength="200"
                     show-word-limit
                   />
-                  <el-radio v-model="column.text_brackets.brackets_outer_type" label="chs">中文</el-radio>
-                  <el-radio v-model="column.text_brackets.brackets_outer_type" label="english">英文</el-radio>
-                  <el-radio v-model="column.text_brackets.brackets_outer_type" label="pinyin">拼音</el-radio>
+                  <el-radio
+                    v-model="column.text_brackets.brackets_outer_type"
+                    label="chs"
+                    >中文</el-radio
+                  >
+                  <el-radio
+                    v-model="column.text_brackets.brackets_outer_type"
+                    label="english"
+                    >英文</el-radio
+                  >
+                  <el-radio
+                    v-model="column.text_brackets.brackets_outer_type"
+                    label="pinyin"
+                    >拼音</el-radio
+                  >
                   <span>&nbsp;[&nbsp;</span>
                   <el-input
                     v-model="column.text_brackets.brackets_inner"
@@ -211,9 +222,17 @@
                     maxlength="200"
                     show-word-limit
                   />
-                  <span :style="{'margin-right': '12px'}">&nbsp;]</span>
-                  <el-radio v-model="column.text_brackets.brackets_inner_type" label="english">英文</el-radio>
-                  <el-radio v-model="column.text_brackets.brackets_inner_type" label="pinyin">拼音</el-radio>
+                  <span :style="{ 'margin-right': '12px' }">&nbsp;]</span>
+                  <el-radio
+                    v-model="column.text_brackets.brackets_inner_type"
+                    label="english"
+                    >英文</el-radio
+                  >
+                  <el-radio
+                    v-model="column.text_brackets.brackets_inner_type"
+                    label="pinyin"
+                    >拼音</el-radio
+                  >
                 </template>
               </div>
             </div>
@@ -232,7 +251,7 @@ import { getContentFile, textCreadMp3 } from "@/api/ajax";
 export default {
   components: {
     Upload,
-    SentenceSegwordChs
+    SentenceSegwordChs,
   },
   props: {
     curQue: {
@@ -251,16 +270,16 @@ export default {
             rowSelection: false,
             columnSelection: false,
             firstLineHighlight: false,
-            matrix: []
+            matrix: [],
           },
-          lrc_arr: []
+          lrc_arr: [],
         };
-      }
+      },
     },
     changeCurQue: {
       type: Function,
-      required: true
-    }
+      required: true,
+    },
   },
   data() {
     return {
@@ -271,31 +290,31 @@ export default {
       typeList: [
         {
           type: "text",
-          name: "文本"
+          name: "文本",
         },
         {
           type: "connection",
-          name: "连接"
+          name: "连接",
         },
         {
           type: "SentenceSegwordChs",
-          name: "句子分词"
+          name: "句子分词",
         },
         {
           type: "PinyinEnglish",
-          name: "拼音 + 英文"
+          name: "拼音 + 英文",
         },
         // 解决拼音中括号的兼容性问题
         {
           type: "textBrackets",
-          name: "文本中有括号"
-        }
+          name: "文本中有括号",
+        },
       ],
       matchTypeList: [
         { type: "pinyin", name: "纯拼音（例：yu）" },
         { type: "chinese", name: "中文（例：鱼）" },
-        { type: "pinyinWithToneMark", name: "拼音符号音调（例：yú）" }
-      ]
+        { type: "pinyinWithToneMark", name: "拼音符号音调（例：yú）" },
+      ],
     };
   },
   created() {
@@ -330,18 +349,18 @@ export default {
               sentence: "", // 句子
               segList: [], // 分词结果
               seg_words: "",
-              wordsList: []
+              wordsList: [],
             },
             pinyin_english_data: {
               pinyin: "",
-              english: ""
+              english: "",
             },
             text_brackets: {
               brackets_inner: "",
-              brackets_inner_type: 'english',
+              brackets_inner_type: "english",
               brackets_outer: "",
-              brackets_outer_type: 'chs'
-            }
+              brackets_outer_type: "chs",
+            },
           };
         }
       }
@@ -350,7 +369,7 @@ export default {
 
     setIsTitle(index, isTitle, e) {
       if (e.target.className !== "el-checkbox__original") return;
-      this.curQue.voiceMatrix.matrix[index].forEach(item => {
+      this.curQue.voiceMatrix.matrix[index].forEach((item) => {
         item.isTitle = !isTitle;
       });
     },
@@ -361,8 +380,8 @@ export default {
         return this.$message.warning("请先上传mp3文件");
       }
       let text_list = [];
-      this.curQue.voiceMatrix.matrix.forEach(row => {
-        row.forEach(({ type, text, sentence_data }, i) => {
+      this.curQue.voiceMatrix.matrix.forEach((row) => {
+        row.forEach(({ type, text, sentence_data, pinyin_english_data }, i) => {
           if (type === "connection" || (type === "text" && text.length === 0)) {
             row[i].lrc_data = {};
             return;
@@ -374,6 +393,9 @@ export default {
           if (type === "SentenceSegwordChs") {
             text_list.push(sentence_data.sentence);
           }
+          if (type === "PinyinEnglish") {
+            text_list.push(pinyin_english_data.pinyin);
+          }
         });
       });
       let loading = this.$loading({ text: "正在分析，请等待" });
@@ -381,7 +403,7 @@ export default {
         file_id: mp3_list[0].file_id,
         text_list,
         language: "ZH",
-        match_type: this.match_type
+        match_type: this.match_type,
       })
         .then(({ lrc_list }) => {
           loading.close();
@@ -400,7 +422,7 @@ export default {
       }
       getContentFile("tool-ParseLRCFile", {
         content_type: "FILE",
-        file_id: this.curQue.lrc_list[0].file_id
+        file_id: this.curQue.lrc_list[0].file_id,
       }).then(({ lrc_list }) => {
         this.curQue.lrc_arr = lrc_list;
         this.distribution();
@@ -413,7 +435,7 @@ export default {
         return this.$message.warning("没有标记可分配");
       }
       let curIndex = 0;
-      this.curQue.voiceMatrix.matrix.forEach(row => {
+      this.curQue.voiceMatrix.matrix.forEach((row) => {
         row.forEach(({ type, text }, i) => {
           if (type === "connection" || (type === "text" && text.length === 0)) {
             row[i].lrc_data = {};
@@ -435,8 +457,8 @@ export default {
         return this.$message.warning("已有音频，请勿重复生成");
       }
       let article = "";
-      this.curQue.voiceMatrix.matrix.forEach(item => {
-        item.forEach(({ type, text, sentence_data: { sentence }}) => {
+      this.curQue.voiceMatrix.matrix.forEach((item) => {
+        item.forEach(({ type, text, sentence_data: { sentence } }) => {
           if (type === "text" && text.length > 0) {
             article += "\n" + text;
             return;
@@ -451,7 +473,7 @@ export default {
       }
       this.createdMp3loading = true;
       textCreadMp3({
-        text: article
+        text: article,
       }).then(({ data }) => {
         data.fileInfo.id = "[FID##" + data.fileInfo.file_id + "##FID]";
         data.fileInfo.name = data.fileInfo.file_name;
@@ -470,10 +492,9 @@ export default {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning",
-      })
-        .then(() => {
-          this.curQue.mp3_list.splice(0, 1);
-        });
+      }).then(() => {
+        this.curQue.mp3_list.splice(0, 1);
+      });
     },
 
     changeMp3(fileList) {
@@ -481,18 +502,15 @@ export default {
       let articleImgRes = [];
       articleImgList.forEach(({ response, name }) => {
         if (response) {
-          let {
-            file_url,
-            file_id,
-            media_duration
-          } = response.file_info_list[0];
+          let { file_url, file_id, media_duration } =
+            response.file_info_list[0];
 
           articleImgRes.push({
             name,
             media_duration,
             temporary_url: file_url,
             url: "[FID##" + file_id + "##FID]",
-            file_id
+            file_id,
           });
         }
       });
@@ -509,7 +527,7 @@ export default {
             duration: fileList.media_duration,
             url: fileList.file_url,
             id: "[FID##" + fileList.file_id + "##FID]",
-            file_id: fileList.file_id
+            file_id: fileList.file_id,
           });
         }
       });
@@ -518,16 +536,16 @@ export default {
 
     number(attr) {
       let val = this[attr];
-      if (val.length <= 0) return '';
+      if (val.length <= 0) return "";
       if (/(^1[012345678]$)|(^\d{1}$)/g.test(val)) {
         return (this[attr] = Number(val));
       }
       if (val.length >= 2 && /^\d*$/g.test(val)) {
         return (this[attr] = 18);
       }
-      this[attr] = '';
-    }
-  }
+      this[attr] = "";
+    },
+  },
 };
 </script>
 

src/components/Adult/preview/HeaderSparate/index.vue

@@ -9,7 +9,7 @@
           v-for="(item, i) in curQue.tableData.colsConfig.width"
           :key="`col-${i}`"
           :style="{ width: `${item.val}px` }"
-        >
+        />
       </colgroup>
 
       <thead>
@@ -67,7 +67,9 @@
               >
                 <template v-if="col.type === 'content'">
                   <span v-if="col.text.length > 0" class="content">
-                    {{ col.text }}
+                    {{
+                      judgeAnswer === "standardAnswer" ? col.answer : col.text
+                    }}
                   </span>
                   <template v-else>
                     <el-input
@@ -85,7 +87,7 @@
                         judgeAnswer == 'standardAnswer'
                           ? (col.answer = col.answer.trim())
                           : (curQue.Bookanswer[i].content[j].answer =
-                            curQue.Bookanswer[i].content[j].answer.trim())
+                              curQue.Bookanswer[i].content[j].answer.trim())
                       "
                       @input="enterAnswer(i, j, 'input')"
                     />
@@ -118,7 +120,7 @@
                     >
                       {{
                         curQue.pinyinPosition === "top" ||
-                          curQue.pinyinPosition == "left"
+                        curQue.pinyinPosition == "left"
                           ? pinyin
                           : chs
                       }}
@@ -145,7 +147,7 @@
                     >
                       {{
                         curQue.pinyinPosition === "top" ||
-                          curQue.pinyinPosition == "left"
+                        curQue.pinyinPosition == "left"
                           ? chs
                           : pinyin
                       }}
@@ -223,15 +225,15 @@
                         <template
                           v-if="
                             sddItem.img_list &&
-                              sddItem.img_list.length > 0 &&
-                              sddItem.img_list[0].id
+                            sddItem.img_list.length > 0 &&
+                            sddItem.img_list[0].id
                           "
                         >
                           <img
                             :src="sddItem.img_list[0].id"
                             class="sddItem_img_list"
                             :style="[imgStyle(sddItem)]"
-                          >
+                          />
                         </template>
                       </div>
                     </div>
@@ -358,12 +360,12 @@ export default {
         arr.push({
           content: [],
         });
-        item.content.forEach(items => {
+        item.content.forEach((items) => {
           if (items.type === "mulText") {
             flag = true;
           }
           arr[i].content.push({
-            answer: "",
+            answer: items.answer || "",
             CrossAnswer: "",
             userAnswerJudge:
               items.answer ||
@@ -379,8 +381,8 @@ export default {
         this.$set(this.curQue, "Bookanswer", arr);
       }
     } else {
-      this.curQue.Bookanswer.forEach(item => {
-        item.content.forEach(item => {
+      this.curQue.Bookanswer.forEach((item) => {
+        item.content.forEach((item) => {
           if (item.userAnswerJudge === "[JUDGE##F##JUDGE]") {
             this.userError = true;
             return;
@@ -536,7 +538,7 @@ export default {
             items.mulText.detail.forEach((sdItem, sdIndex) => {
               let isHasPY = 0;
               let maxFontsize = 0;
-              sdItem.detail.forEach(sddItem => {
+              sdItem.detail.forEach((sddItem) => {
                 if (sddItem.wordsList.length > 0) {
                   sddItem.wordsList.forEach((sItem, sIndex) => {
                     let reg = /_{2,}/g;