对话课文播放对话音频时加背景，便于区分角色

src/views/book/courseware/preview/components/dialogue_article/NormalModelChs.vue

@@ -76,7 +76,18 @@
               : '',
           ]"
         >
-          <div :class="['article-content', isHasRemark ? 'hasRemark' : '']">
+          <div
+            :class="['article-content', isHasRemark ? 'hasRemark' : '']"
+            :style="{
+              backgroundColor:
+                item.timeList.length > 0 &&
+                curTime >= item.timeList[0].bg + 0.01 &&
+                curTime <= item.timeList[item.timeList.length - 1].ed - 0.01 &&
+                attrib
+                  ? attrib.assist_color
+                  : '',
+            }"
+          >
             <template v-if="item.type === 'notice'">
               <p :class="['notice']">
                 {{ convertText(item.notice) }}

src/views/book/courseware/preview/components/dialogue_article/PhraseModelChs.vue

@@ -66,7 +66,19 @@
           :key="'detail' + index"
           :class="['NNPE-detail', item.isTitle ? 'NNPE-detail-title' : '']"
         >
-          <div :class="['article-content', isHasRemark ? 'hasRemark' : '']">
+          <div
+            :class="['article-content', isHasRemark ? 'hasRemark' : '']"
+            :style="{
+              backgroundColor:
+                item.timeList &&
+                item.timeList.length > 0 &&
+                curTime >= item.timeList[0].bg + 0.01 &&
+                curTime <= item.timeList[item.timeList.length - 1].ed - 0.01 &&
+                attrib
+                  ? attrib.assist_color
+                  : '',
+            }"
+          >
             <template v-if="item.type === 'notice'">
               <p :class="['notice']">
                 {{ convertText(item.notice) }}
@@ -818,7 +830,7 @@ export default {
 
     handleWav() {},
     getCurTime(curTime) {
-      this.curTime = curTime;
+      this.curTime = curTime * 1000;
     },
     handleData() {
       let resArr = [];
@@ -889,11 +901,20 @@ export default {
             if (wItem.pinyin) dhaspinyin = true;
           });
         });
+        let curSentencesLeg = dItem.sentences.length;
+        let startLeg = dIndex === 0 ? 0 : curQue.detail[dIndex - 1].endLeg;
+        let endLeg = startLeg + curSentencesLeg;
+        dItem.endLeg = endLeg;
+        let timeList = [];
+        if (curQue.wordTime && curQue.wordTime.length > 0 && dItem.type === 'text') {
+          timeList = curQue.wordTime.slice(startLeg, endLeg);
+        }
         let enwords =
           dItem.sentencesEn && dItem.sentencesEn.length > 0 ? dItem.sentencesEn.join(' ').replace(/\\'/g, '’') : '';
         let paraObj = {
           wordsList: paraArr,
           enwords,
+          timeList,
           roleDetail,
           remarkDetail,
           dhaspinyin,

src/views/book/courseware/preview/components/dialogue_article/WordModelChs.vue

@@ -65,7 +65,19 @@
           :key="'detail' + index"
           :class="['NNPE-detail', item.isTitle ? 'NNPE-detail-title' : '']"
         >
-          <div class="article-content">
+          <div
+            class="article-content"
+            :style="{
+              backgroundColor:
+                item.timeList &&
+                item.timeList.length > 0 &&
+                curTime >= item.timeList[0].bg + 0.01 &&
+                curTime <= item.timeList[item.timeList.length - 1].ed - 0.01 &&
+                attrib
+                  ? attrib.assist_color
+                  : '',
+            }"
+          >
             <template v-if="item.type === 'notice'">
               <p :class="['notice']">
                 {{ convertText(item.notice) }}