Quellcode durchsuchen

图文融合兼容未上传音频未打点情况

natasha vor 1 Monat
Ursprung
Commit
564ca10f4e

+ 2 - 1
src/views/book/courseware/preview/components/image_text/ImageTextPreview.vue

@@ -104,6 +104,7 @@
         :font-size="fontSize"
         :sentence-theme="sentenceTheme"
         :data="data.word_time"
+        :text-list="data.text_list"
         :active-index="sentIndex"
         :mp3-url="mp3_url"
         :multilingual-text-list="showLang && multilingualTextList[getLang()] ? multilingualTextList[getLang()] : []"
@@ -252,7 +253,7 @@ export default {
     },
     // 切换画刊里面的卡片
     handleChangePosition(index) {
-      if (this.$refs.audioLine.audio.playing) {
+      if (this.$refs.audioLine && this.$refs.audioLine.audio.playing) {
         this.$refs.audioLine.PlayAudio();
       }
       this.sentIndex = index;

+ 28 - 6
src/views/book/courseware/preview/components/image_text/components/MagazineSentence.vue

@@ -1,13 +1,14 @@
 <template>
   <div class="sentence-box" :style="{ background: themeList[sentenceTheme].bg }">
     <div class="sentence-top">
-      <a class="play-btn" :style="{ background: themeList[sentenceTheme].playBtnBg }" @click="handlePlay">
+      <a class="play-btn" :style="{ background: themeList[sentenceTheme].playBtnBg }" @click="handlePlay" v-if="mp3Url">
         <svg-icon v-if="isPlay" icon-class="pause" size="24" />
         <svg-icon v-else icon-class="play" size="24" />
       </a>
+      <a v-else></a>
       <div class="sentence-right" :style="{ color: themeList[sentenceTheme].rightBtnColor }">
         <a class="btn" @click="handlePage('-')"><svg-icon icon-class="arrow-left-s-line" size="24" /></a>
-        <span>{{ sentenceActive + 1 + '/' + data.length }}</span>
+        <span>{{ sentenceActive + 1 + '/' + (data.length ? data.length : textList.length) }}</span>
         <a class="btn" @click="handlePage('+')"><svg-icon icon-class="arrow-right-s-line" size="24" /></a>
         <i class="el-icon-close" @click="closeWord"></i>
       </div>
@@ -210,10 +211,21 @@
             </template>
           </div>
         </template>
-        <div v-if="multilingualTextList[sentenceActive]" class="NPC-notes-note">
-          {{ multilingualTextList[sentenceActive] }}
-        </div>
       </template>
+      <template v-else-if="textList && textList[sentenceActive] && textList[sentenceActive].text">
+        <span
+          :class="['content-item']"
+          :style="{
+            color: themeList[sentenceTheme].sentenceColor,
+            fontSize: fontSize + 'px',
+            lineHeight: fontSize + 8 + 'px',
+          }"
+          >{{ textList[sentenceActive].text }}</span
+        >
+      </template>
+      <div v-if="multilingualTextList[sentenceActive]" class="NPC-notes-note">
+        {{ multilingualTextList[sentenceActive] }}
+      </div>
     </div>
     <div class="sentence-bottom">
       <div class="fontsize-box" :style="{ background: themeList[sentenceTheme].bottomBg }">
@@ -283,7 +295,17 @@
 export default {
   // import引入的组件需要注入到对象中才能使用
   components: {},
-  props: ['fontSize', 'sentenceTheme', 'data', 'activeIndex', 'mp3Url', 'multilingualTextList', 'property', 'attrib'],
+  props: [
+    'fontSize',
+    'sentenceTheme',
+    'data',
+    'activeIndex',
+    'mp3Url',
+    'multilingualTextList',
+    'property',
+    'attrib',
+    'textList',
+  ],
   data() {
     // 这里存放数据
     return {