语音矩阵

1. 解决不选择单元格报错
2. 将录音列表同步到全屏组件

src/components/Adult/preview/AudioCompareMatrix.vue

@@ -39,9 +39,9 @@
         "
         :class="[
           'compare-disable',
-          type == 'full' ? 'compare-disable-big' : '',
+          type == 'full' ? 'compare-disable-big' : ''
         ]"
-      />
+      >
     </template>
   </div>
 </template>
@@ -53,7 +53,7 @@ import AudioRed from "./components/AudioRed.vue";
 export default {
   components: {
     AudioLine,
-    AudioRed,
+    AudioRed
   },
   props: [
     "themeColor",
@@ -64,13 +64,13 @@ export default {
     "sentPause",
     "matrixSelectLrc",
     "getCurTime",
-    "curTime",
+    "curTime"
   ],
   data() {
     return {
       playing: false,
       stopAudio: true,
-      unWatch: null,
+      unWatch: null
     };
   },
   watch: {
@@ -90,12 +90,18 @@ export default {
       if (!newVal) {
         this.playChange(false);
       }
-    },
+    }
   },
   methods: {
     playAudio() {
       if (this.playing) return this.handleParentPlay();
       if (this.unWatch) return this.$refs.audioLine.PlayAudio();
+      console.log(this.matrixSelectLrc);
+      if (this.matrixSelectLrc === null) {
+        this.sentPause(true);
+        this.playChange(false);
+        return;
+      }
       if (this.matrixSelectLrc.length <= 0) return;
 
       this.lrcPlay(this.matrixSelectLrc[0], 0);
@@ -108,7 +114,7 @@ export default {
         this.$refs.audioLine.PlayAudio();
         if (end_time === -1) return;
         let end = end_time / 1000 - 0.01;
-        this.unWatch = this.$watch("curTime", (val) => {
+        this.unWatch = this.$watch("curTime", val => {
           if (val >= end) {
             this.unWatch();
             this.handleParentPlay();
@@ -136,8 +142,8 @@ export default {
     // 音频播放时改变布尔值
     handleChangeStopAudio() {
       this.stopAudio = false;
-    },
-  },
+    }
+  }
 };
 </script>
 

src/components/Adult/preview/Soundrecord.vue

@@ -18,8 +18,7 @@
           selectIndex || selectIndex == 0 ? 'record-black' : '',
           type && type == 'normal' ? 'record-time-flex' : '',
         ]"
-        >{{ isPlaying ? "-" : "" }}{{ handleDateTime(recordtime) }}</span
-      >
+      >{{ isPlaying ? "-" : "" }}{{ handleDateTime(recordtime) }}</span>
       <div v-if="type && type == 'normal'" class="line" />
       <div
         :class="['playBack', hasMicro]"
@@ -90,8 +89,7 @@
           microphoneStatus ? 'record-ing' : '',
           selectIndex || selectIndex == 0 ? 'record-black' : '',
         ]"
-        >{{ isPlaying ? "-" : "" }}{{ handleDateTime(recordtime) }}</span
-      >
+      >{{ isPlaying ? "-" : "" }}{{ handleDateTime(recordtime) }}</span>
       <el-select
         v-model="selectIndex"
         placeholder="无录音"
@@ -166,7 +164,7 @@ export default {
   computed: {},
   watch: {
     sentIndex: {
-      handler: function (newVal, oldVal) {
+      handler (newVal, oldVal) {
         if (newVal != oldVal) {
           if (this.recordList.length > 0) {
             this.selectIndex = 0;
@@ -274,12 +272,12 @@ export default {
               JSON.parse(JSON.stringify(_this.recordList)),
               _this.tmIndex
             );
-            if (this.recordList[this.selectIndex].selectData)
+            if (this.recordList[this.selectIndex].selectData) {
               this.$emit(
                 "getSelectData",
                 this.recordList[this.selectIndex].selectData
               );
-            //   }
+            }
           };
         }
       }
@@ -367,8 +365,7 @@ export default {
       this.audio.pause();
       this.oldIndex = null;
       this.$emit("getWavblob", this.wavblob);
-      if (this.recordList[index].selectData)
-        this.$emit("getSelectData", this.recordList[index].selectData);
+      if (this.recordList[index].selectData) { this.$emit("getSelectData", this.recordList[index].selectData); }
       this.$emit("sentPause", false);
     },
     handleDelete() {

src/components/Adult/preview/Soundrecorddiff.vue

@@ -2,8 +2,8 @@
 <template>
   <div class="NNPE-Book-record">
     <div
-      :class="['record-main', microphoneStatus ? 'active' : '']"
       v-if="!TaskModel || TaskModel != 'ANSWER'"
+      :class="['record-main', microphoneStatus ? 'active' : '']"
     >
       <div class="record-main-inner" @click="microphone">
         <div class="record" />
@@ -16,12 +16,12 @@
     <div
       v-if="
         (TaskModel != 'ANSWER' && !microphoneStatus && recordList.length > 0) ||
-        TaskModel == 'ANSWER'
+          TaskModel == 'ANSWER'
       "
       :class="[
         'hasRecord',
         bgIndex == 1 ? 'hasRecord-white' : '',
-        TaskModel == 'ANSWER' ? 'hasRecord-answer' : '',
+        TaskModel == 'ANSWER' ? 'hasRecord-answer' : ''
       ]"
     >
       <div
@@ -37,13 +37,12 @@
       <span
         class="record-time"
         :class="[TaskModel == 'ANSWER' ? 'disabled' : '']"
-        >{{ isPlaying ? "-" : "" }}{{ handleDateTime(recordtime) }}</span
-      >
+      >{{ isPlaying ? "-" : "" }}{{ handleDateTime(recordtime) }}</span>
       <el-select
         v-model="selectIndex"
         placeholder="无录音"
-        @change="handleChangeRecord"
         :popper-append-to-body="false"
+        @change="handleChangeRecord"
       >
         <el-option
           v-for="(item, index) in recordList"
@@ -53,9 +52,9 @@
         />
       </el-select>
       <a
+        v-if="TaskModel != 'ANSWER'"
         class="record-delete"
         @click="handleDelete"
-        v-if="TaskModel != 'ANSWER'"
       />
     </div>
   </div>
@@ -80,7 +79,7 @@ export default {
       recorder: new Recorder({
         sampleBits: 16, // 采样位数，支持 8 或 16，默认是16
         sampleRate: 16000, // 采样率，支持 11025、16000、22050、24000、44100、48000，根据浏览器默认值，我的chrome是48000
-        numChannels: 1, // 声道，支持 1 或 2， 默认是1
+        numChannels: 1 // 声道，支持 1 或 2， 默认是1
       }),
       microphoneStatus: false,
       hasMicro: "", // 录音后的样式class
@@ -93,16 +92,15 @@ export default {
       selectIndex: null, // 选中的录音索引
       oldIndex: null, // 存储播放录音索引
       playtime: 0, // 播放时间
-      isPlaying: false,
+      isPlaying: false
     };
   },
-  computed: {},
   watch: {},
   // 生命周期 - 创建完成（可以访问当前this实例）
   created() {
     this.handleActive();
     let that = this;
-    window.stopAudioSound = function () {
+    window.stopAudioSound = function() {
       if (that.audio) {
         that.audio.pause();
       }
@@ -116,6 +114,10 @@ export default {
       : [];
     if (_this.recordList.length > 0) {
       _this.selectIndex = 0;
+      this.$emit(
+        "getSelectData",
+        this.recordList[0].selectData
+      );
       _this.recordFile = _this.recordList.length + 1;
       _this.handleChangeRecord(0);
       if (_this.TaskModel != "ANSWER") {
@@ -125,21 +127,19 @@ export default {
         );
       }
       _this.$forceUpdate();
-    } else {
-      if (_this.TaskModel == "ANSWER") {
-        _this.hasMicro = "disabled";
-      }
+    } else if (_this.TaskModel == "ANSWER") {
+      _this.hasMicro = "disabled";
     }
-    _this.audio.addEventListener("play", function () {
+    _this.audio.addEventListener("play", function() {
       _this.changeStatus("active");
       _this.isPlaying = true;
       _this.$emit("getPlayStatus", true);
     });
-    _this.audio.addEventListener("pause", function () {
+    _this.audio.addEventListener("pause", function() {
       _this.changeStatus("normal");
       _this.$emit("getPlayStatus", false);
     });
-    _this.audio.addEventListener("ended", function () {
+    _this.audio.addEventListener("ended", function() {
       _this.changeStatus("normal");
       _this.isPlaying = false;
       _this.$emit("getPlayStatus", false);
@@ -175,7 +175,7 @@ export default {
           name: _this.fileName
             ? _this.fileName + _this.recordFile
             : "新录音" + _this.recordFile,
-          id: _this.recordFile + Math.round(Math.random() * 10),
+          id: _this.recordFile + Math.round(Math.random() * 10)
         };
         if (this.selectData) obj.selectData = this.selectData;
         _this.recordList.push(obj);
@@ -309,10 +309,10 @@ export default {
       if (this.hasMicro) {
         if (this.selectIndex || this.selectIndex == 0) {
           this.recordList.splice(this.selectIndex, 1);
-          _this.$emit(
+          this.$emit(
             "handleWav",
-            JSON.parse(JSON.stringify(_this.recordList)),
-            _this.tmIndex
+            JSON.parse(JSON.stringify(this.recordList)),
+            this.tmIndex
           );
           this.selectIndex =
             this.recordList.length > 0 ? this.recordList.length - 1 : null;
@@ -333,8 +333,8 @@ export default {
         }
         this.$emit("getRerordStatus", this.recordList.length > 0);
       }
-    },
-  }, // 如果页面有keep-alive缓存功能，这个函数会触发
+    }
+  } // 如果页面有keep-alive缓存功能，这个函数会触发
 };
 </script>
 <style lang="scss" scoped>

src/components/Adult/preview/VoiceMatrix.vue

@@ -6,7 +6,7 @@
           :class="[
             themeColor.length === 0 || themeColor === 'red'
               ? 'serial-number'
-              : `serial-number-${themeColor}`,
+              : `serial-number-${themeColor}`
           ]"
         >
           {{ curQue.voiceMatrix.audioSerialNumber }}
@@ -22,7 +22,7 @@
           :class="[
             'Repeat-16',
             'audio-simple-repeat',
-            isRepeat ? '' : 'disabled',
+            isRepeat ? '' : 'disabled'
           ]"
           @click="isRepeat = !isRepeat"
         />
@@ -45,7 +45,7 @@
         v-if="curQue.voiceMatrix.matrix.length > 0"
         class="matrix"
         :style="{
-          'grid-template': `36px repeat(${curQue.voiceMatrix.matrix.length}, auto) minmax(36px, 1fr) / 36px repeat(${curQue.voiceMatrix.matrix[0].length}, auto) minmax(36px, 1fr)`,
+          'grid-template': `36px repeat(${curQue.voiceMatrix.matrix.length}, auto) minmax(36px, 1fr) / 36px repeat(${curQue.voiceMatrix.matrix[0].length}, auto) minmax(36px, 1fr)`
         }"
         @mouseleave="clearSelectCell"
       >
@@ -60,7 +60,7 @@
                 (selectColumn === i ||
                   (selectedLine.type === 'column' && selectedLine.index === i))
                 ? 'read'
-                : '',
+                : ''
             ]"
             @mouseenter="checkboxMouseenter(selectColumn === i, 'column')"
           >
@@ -76,7 +76,7 @@
                 `matrix-checkbox-row-${themeColor}`,
                 selectedLine.type === 'column' && selectedLine.index === i
                   ? 'active'
-                  : '',
+                  : ''
               ]"
               @click="selectRowOrColumn(i, 'column')"
             />
@@ -93,7 +93,7 @@
                 (selectRow === i ||
                   (selectedLine.type === 'row' && selectedLine.index === i))
                 ? 'read'
-                : '',
+                : ''
             ]"
             @mouseenter="checkboxMouseenter(selectRow === i, 'row')"
           >
@@ -107,7 +107,7 @@
                 `matrix-checkbox-column-${themeColor}`,
                 selectedLine.type === 'row' && selectedLine.index === i
                   ? 'active'
-                  : '',
+                  : ''
               ]"
               @click="selectRowOrColumn(i, 'row')"
             />
@@ -131,7 +131,7 @@
                 (i === 0 && curQue.voiceMatrix.firstLineHighlight) ||
                   (j === row.length - 1 && curQue.voiceMatrix.lastColumnHighlight)
                   ? `highlight-${themeColor}`
-                  : '',
+                  : ''
               ]"
               @mouseenter="matrixCellMouseenter(i, j, column.type)"
             >
@@ -153,7 +153,7 @@
                       column.lrc_data.end_time === -1)
                     ? 'playing'
                     : '',
-                  column.isTitle ? 'title' : '',
+                  column.isTitle ? 'title' : ''
                 ]"
                 @click="matrixCellClick(i, j)"
               >
@@ -167,7 +167,7 @@
                   'connection',
                   i === 0 && curQue.voiceMatrix.firstLineHighlight
                     ? `highlight-bc-${themeColor}`
-                    : '',
+                    : ''
                 ]"
               />
               <!-- 分词 -->
@@ -188,27 +188,55 @@
                       column.lrc_data.end_time === -1)
                     ? 'playing'
                     : '',
-                  column.isTitle ? 'title' : '',
+                  column.isTitle ? 'title' : ''
                 ]"
                 :style="{
-                  'grid-template-columns': `repeat(${column.sentence_data.wordsList.length}, auto)`,
+                  'grid-template-columns': `repeat(${column.sentence_data.wordsList.length}, auto)`
                 }"
                 @click="matrixCellClick(i, j)"
               >
-                <template v-for="({pinyin, chs}, w) in column.sentence_data.wordsList">
+                <template
+                  v-for="({ pinyin, chs }, w) in column.sentence_data.wordsList"
+                >
                   <span
-                    :key="`${column.sentence_data.pyPosition === 'top' ? 'pinyin' : 'chs'}-${w}`"
-                    :class="column.sentence_data.pyPosition === 'top' ? 'pinyin' : 'chs'"
+                    :key="
+                      `${
+                        column.sentence_data.pyPosition === 'top'
+                          ? 'pinyin'
+                          : 'chs'
+                      }-${w}`
+                    "
+                    :class="
+                      column.sentence_data.pyPosition === 'top'
+                        ? 'pinyin'
+                        : 'chs'
+                    "
                   >
-                    {{ column.sentence_data.pyPosition === 'top' ? pinyin : chs }}
+                    {{
+                      column.sentence_data.pyPosition === "top" ? pinyin : chs
+                    }}
                   </span>
                 </template>
-                <template v-for="({pinyin, chs}, w) in column.sentence_data.wordsList">
+                <template
+                  v-for="({ pinyin, chs }, w) in column.sentence_data.wordsList"
+                >
                   <span
-                    :key="`${column.sentence_data.pyPosition === 'top' ? 'chs' : 'pinyin'}-${w}`"
-                    :class="column.sentence_data.pyPosition === 'top' ? 'chs' : 'pinyin'"
+                    :key="
+                      `${
+                        column.sentence_data.pyPosition === 'top'
+                          ? 'chs'
+                          : 'pinyin'
+                      }-${w}`
+                    "
+                    :class="
+                      column.sentence_data.pyPosition === 'top'
+                        ? 'chs'
+                        : 'pinyin'
+                    "
                   >
-                    {{ column.sentence_data.pyPosition === 'top' ? chs : pinyin }}
+                    {{
+                      column.sentence_data.pyPosition === "top" ? chs : pinyin
+                    }}
                   </span>
                 </template>
               </div>
@@ -230,7 +258,7 @@
                       column.lrc_data.end_time === -1)
                     ? 'playing'
                     : '',
-                  column.isTitle ? 'title' : '',
+                  column.isTitle ? 'title' : ''
                 ]"
                 @click="matrixCellClick(i, j)"
               >
@@ -261,7 +289,7 @@
                       column.lrc_data.end_time === -1)
                     ? 'playing'
                     : '',
-                  column.isTitle ? 'title' : '',
+                  column.isTitle ? 'title' : ''
                 ]"
                 @click="matrixCellClick(i, j)"
               >
@@ -286,7 +314,7 @@
                 (selectRow === i ||
                   (selectedLine.type === 'row' && selectedLine.index === i))
                 ? 'read'
-                : '',
+                : ''
             ]"
             @mouseenter="clearSelectCell"
           />
@@ -302,7 +330,7 @@
                 (selectColumn === i ||
                   (selectedLine.type === 'column' && selectedLine.index === i))
                 ? 'read'
-                : '',
+                : ''
             ]"
             @mouseenter="clearSelectCell"
           />
@@ -318,13 +346,13 @@
         class="luyin-box"
         :file-name="fileName"
         :select-data="selectData"
+        :answer-record-list="curQue.Bookanswer.recordList"
+        :task-model="TaskModel"
         @getWavblob="getWavblob"
         @getSelectData="getSelectData"
         @handleParentPlay="pauseOtherAudio"
         @sentPause="sentPause"
         @handleWav="handleWav"
-        :answerRecordList="curQue.Bookanswer.recordList"
-        :TaskModel="TaskModel"
       />
       <audio-compare
         :style="{ flex: 1 }"
@@ -350,8 +378,11 @@
         :theme-color="themeColor"
         :cur-que="curQue"
         :mp3="mp3Url"
+        :matrix-select-lrc="matrixSelectLrc"
+        :record-list="curQue.Bookanswer.recordList"
         @exitFullscreen="exitFullscreen"
         @changeIsFull="changeIsFull"
+        @handleWav="handleWav"
       />
     </div>
   </div>
@@ -369,13 +400,15 @@ export default {
     AudioLine,
     Soundrecord,
     AudioCompare,
-    VoiceFullscreen,
+    VoiceFullscreen
   },
   props: ["curQue", "themeColor", "TaskModel"],
   data() {
     return {
       // 组件id
-      cid: Math.random().toString(36).substr(2, 10),
+      cid: Math.random()
+        .toString(36)
+        .substr(2, 10),
       isFull: false,
       curTime: 0,
       playing: false,
@@ -389,18 +422,18 @@ export default {
       // 行、列选中
       selectedLine: {
         type: "",
-        index: 0,
+        index: 0
       },
       // 点击选中
       selectCell: {
         row: -1,
-        column: -1,
+        column: -1
       },
       isRepeat: false,
       // 跟读所需属性
       wavblob: null,
       isRecord: false,
-      matrixSelectLrc: null,
+      matrixSelectLrc: null
     };
   },
   computed: {
@@ -434,7 +467,7 @@ export default {
         type: type.length > 0 && index >= 0 ? type : "cell",
         index,
         row,
-        column,
+        column
       };
     },
 
@@ -458,12 +491,12 @@ export default {
         return require("../../../assets/NPC/full-screen-red.png");
       }
       return require(`../../../assets/NPC/full-screen-${themeColor}.png`);
-    },
+    }
   },
   watch: {
     hasSelectedCell() {
       this.handleParentPlay();
-    },
+    }
   },
   created() {
     Bus.$on("audioPause", id => {
@@ -472,10 +505,10 @@ export default {
       this.handleParentPlay();
     });
     if (!this.curQue.Bookanswer) {
-        let bookanswer = {
-            recordList: [],
-        }
-        this.$set(this.curQue, "Bookanswer", bookanswer);
+      let bookanswer = {
+        recordList: []
+      };
+      this.$set(this.curQue, "Bookanswer", bookanswer);
     }
   },
 
@@ -484,7 +517,11 @@ export default {
       .querySelector("body")
       .addEventListener("click", this.restoreAudioStatus);
     // 如果一行内有两个语音矩阵，隐藏 全屏模式 文字
-    if (Number(window.getComputedStyle(this.$refs.fullscreen).width.replace('px', '')) < 80) {
+    if (
+      Number(
+        window.getComputedStyle(this.$refs.fullscreen).width.replace("px", "")
+      ) < 80
+    ) {
       this.$refs.fullscreen.children[0].hidden = true;
     }
   },
@@ -529,8 +566,13 @@ export default {
     },
 
     setRecordingFileName(row, column) {
-      let { type, text, sentence_data, pinyin_english_data, text_brackets } =
-        this.curQue.voiceMatrix.matrix[row][column];
+      let {
+        type,
+        text,
+        sentence_data,
+        pinyin_english_data,
+        text_brackets
+      } = this.curQue.voiceMatrix.matrix[row][column];
       if (type === "text") this.fileName = text;
       if (type === "SentenceSegwordChs") this.fileName = sentence_data.sentence;
       if (type === "PinyinEnglish") this.fileName = pinyin_english_data.pinyin;
@@ -549,7 +591,7 @@ export default {
         "matrix-checkbox-row-",
         "audio-simple-image",
         "audio-simple-repeat",
-        "luyin-box",
+        "luyin-box"
       ];
 
       let operable = event.path.some(item => {
@@ -685,6 +727,10 @@ export default {
 
     getSelectData({ type, index, row, column }) {
       if (type === "") return;
+      if (index === 0 && row === -1 && column === -1) {
+        this.matrixSelectLrc = null;
+        return;
+      }
       let arr = [];
       if (type.length > 0 && index >= 0 && type === "row") {
         this.curQue.voiceMatrix.matrix[index].forEach(item => {
@@ -722,7 +768,7 @@ export default {
           return {
             begin_time: lrc_data.begin_time,
             end_time: this.mp3Duration,
-            text: lrc_data.text,
+            text: lrc_data.text
           };
         }
         return lrc_data;
@@ -792,11 +838,10 @@ export default {
         });
       });
     },
-    handleWav(list, tmIndex) {
-      tmIndex = tmIndex ? tmIndex : 0;
+    handleWav(list, tmIndex = 0) {
       this.$set(this.curQue.Bookanswer, "recordList", list);
-    },
-  },
+    }
+  }
 };
 </script>
 

src/components/Adult/preview/VoiceMatrixFullscreen.vue

@@ -428,6 +428,7 @@
             :bg-index="bgIndex"
             :file-name="fileName"
             :select-data="selectData"
+            :answer-record-list="recordList"
             @getSelectData="getSelectData"
             @getWavblob="getWavblob"
             @handleParentPlay="handleParentPlay"
@@ -435,6 +436,7 @@
             @getRerordStatus="getRerordStatus"
             @getMicrophoneStatus="getMicrophoneStatus"
             @getPlayStatus="getPlayStatus"
+            @handleWav="handleWav"
           />
           <div
             v-if="isShowCompare"
@@ -473,7 +475,7 @@ export default {
     AudioCompare,
     Wordcard
   },
-  props: ["mp3", "curQue", "themeColor"],
+  props: ["mp3", "curQue", "themeColor", "recordList"],
   data() {
     return {
       hzSize: 48,
@@ -773,8 +775,16 @@ export default {
       this.wavblob = wavblob;
     },
 
+    handleWav(list, tmIndex = 0) {
+      this.$emit("handleWav", list, tmIndex);
+    },
+
     getSelectData({ type, index, row, column }) {
       if (type === "") return;
+      if (index === 0 && row === -1 && column === -1) {
+        this.matrixSelectLrc = null;
+        return;
+      }
       let arr = [];
       if (type.length > 0 && index >= 0 && type === "row") {
         this.curQue.voiceMatrix.matrix[index].forEach(item => {

src/views/courseView.vue

@@ -10,14 +10,14 @@
           ref="treeView"
           :book-id="bookId"
           :change-id="changeId"
-          :changeTreeData="changeTreeData"
-          :currentTreeID="chapterId"
+          :change-tree-data="changeTreeData"
+          :current-tree-i-d="chapterId"
         />
       </div>
       <div
         id="data-screen"
-        :class="['inner', fullscreen ? 'inner-full' : '']"
         v-loading="loading"
+        :class="['inner', fullscreen ? 'inner-full' : '']"
       >
         <!-- 显示答案按钮 -->
         <!-- <a v-if="chapterId" :class="['answerShow',isAnswerShow?'answerShowTrue':'']" @click="handleAnswerShow">显示答案</a> -->
@@ -30,12 +30,12 @@
             v-if="!treeFlag"
             src="../assets/common/icon-view-back.png"
             @click="treeShow"
-          />
+          >
           <img
             v-if="!treeFlag"
             src="../assets/common/icon-treelist.png"
             @click="chooseCourseware"
-          />
+          >
           <!-- <h2 class="title">{{ chapterName }}</h2> -->
           <!-- <el-switch
             v-if="!treeFlag"
@@ -49,14 +49,14 @@
           ref="preview"
           :context="context"
           :que-index="queIndex"
-          :currentTreeID="chapterId"
-          :FatherTreeData="FatherTreeData"
+          :current-tree-i-d="chapterId"
+          :father-tree-data="FatherTreeData"
           :change-id="changeId"
-          :themeColor="themeColor"
-          :isShowTitle="true"
-          :bookAnswerContent="bookAnswerContent"
-          :TaskModel="TaskModel"
-          :isShowSave="false"
+          :theme-color="themeColor"
+          :is-show-title="true"
+          :book-answer-content="bookAnswerContent"
+          :task-model="TaskModel"
+          :is-show-save="true"
           @finishTaskMaterial="finishTaskMaterial"
         />
       </div>
@@ -96,7 +96,7 @@ export default {
       switchvalue: true, // 生词模式
       isAnswerShow: false, // 是否显示答案
       answer: [
-        //假数据
+        // 假数据
         {
           table_list: [
             [
@@ -110,7 +110,7 @@ export default {
         },
       ],
       bookAnswerContent: '',
-      TaskModel: "", //TEST 考试模式； PRACTICE 练习模式； ANSWER 查看答案模式； 空 预览模式
+      TaskModel: "", // TEST 考试模式； PRACTICE 练习模式； ANSWER 查看答案模式； 空 预览模式
       category: "",
       FatherTreeData: null,
       themeColor: "",
@@ -164,7 +164,7 @@ export default {
         id: _this.chapterId,
       };
       getContent(MethodName, data)
-        .then((res) => {
+        .then(res => {
           _this.loading = false;
           this.category = res.category;
           this.themeColor = res.book_theme_color;
@@ -192,7 +192,7 @@ export default {
         });
     },
     getAnswer() {
-      //this.answer;
+      // this.answer;
     },
     // 跳转编辑页面
     handleEdit() {