Merge branch 'lhd'

src/views/book/courseware/preview/components/image_text/ImageTextPreview.vue

@@ -64,10 +64,11 @@
         :fontSize="fontSize"
         :sentenceTheme="sentenceTheme"
         :data="data.word_time"
-        :activeIndex="mageazineDetailIndex"
+        :activeIndex="sentIndex"
         @closeWord="closeMagazineSentence"
         @changeTheme="changeTheme"
         :mp3Url="mp3_url"
+        :multilingualTextList="showLang && multilingualTextList[getLang()] ? multilingualTextList[getLang()] : []"
       ></magazine-sentence>
     </el-dialog>
   </div>
@@ -99,8 +100,16 @@ export default {
       inputIndex: null,
       fontSize: 20,
       sentenceTheme: 0,
+      multilingualTextList: {},
     };
   },
+  watch: {
+    'data.image_list': {
+      handler(val) {
+        this.initData();
+      },
+    },
+  },
   created() {
     this.initData();
   },
@@ -120,6 +129,12 @@ export default {
           this.answer.answer_list.push(obj);
         });
       }
+      if (this.showLang) {
+        this.data.multilingual.forEach((item) => {
+          let trans_arr = item.translation.split('\n');
+          this.$set(this.multilingualTextList, item.type, trans_arr);
+        });
+      }
 
       this.data.image_list.forEach((item) => {
         GetFileURLMap({ file_id_list: [item.file_id] }).then(({ url_map }) => {

src/views/book/courseware/preview/components/image_text/components/MagazineSentence.vue

@@ -41,6 +41,9 @@
           {{ itemC.wordsName || itemC.onebest }}
         </div>
       </template>
+      <div class="NPC-notes-note" v-if="multilingualTextList[sentenceActive]">
+        {{ multilingualTextList[sentenceActive] }}
+      </div>
     </div>
     <div class="sentence-bottom">
       <div class="fontsize-box" :style="{ background: themeList[sentenceTheme].bottomBg }">
@@ -110,7 +113,7 @@
 export default {
   //import引入的组件需要注入到对象中才能使用
   components: {},
-  props: ['fontSize', 'sentenceTheme', 'data', 'activeIndex', 'mp3Url'],
+  props: ['fontSize', 'sentenceTheme', 'data', 'activeIndex', 'mp3Url', 'multilingualTextList'],
   data() {
     //这里存放数据
     return {
@@ -422,5 +425,11 @@ export default {
       }
     }
   }
+
+  .NPC-notes-note {
+    width: 100%;
+    padding: 5px 0;
+    word-break: break-word;
+  }
 }
 </style>

src/views/book/courseware/preview/components/notes/NotesPreview.vue

@@ -8,6 +8,9 @@
         <div class="topTitle">
           <div class="NPC-top-left">
             <span class="NPC-topTitle-text" v-html="data.title_con"></span>
+            <span class="NPC-topTitle-text" v-if="showLang">
+              {{ titleTrans[getLang()] }}
+            </span>
           </div>
           <div class="NPC-top-right" @click="handleChangeTab">
             <span class="NPC-top-right-text">{{ wordShow ? '收起' : '展开' }}</span>
@@ -21,6 +24,15 @@
               <div class="NPC-notes-con">
                 <span class="NPC-notes-con-number" v-html="item.number"></span>
                 <span class="NPC-notes-con-text" v-html="item.con"></span>
+                <span class="multilingual" v-if="showLang">
+                  {{
+                    multilingualTextList[getLang()] &&
+                    multilingualTextList[getLang()][index] &&
+                    multilingualTextList[getLang()][index][0]
+                      ? multilingualTextList[getLang()][index][0]
+                      : ''
+                  }}
+                </span>
               </div>
               <div class="NPC-notes-trans" v-html="item.interpret"></div>
               <div v-if="item.note" class="NPC-notes-note" v-html="item.note"></div>
@@ -29,6 +41,15 @@
                   <img :src="imgItem.id" class="NPC-notes-img" />
                 </div>
               </div>
+              <div class="NPC-notes-note" v-if="showLang">
+                {{
+                  multilingualTextList[getLang()] &&
+                  multilingualTextList[getLang()][index] &&
+                  multilingualTextList[getLang()][index][1]
+                    ? multilingualTextList[getLang()][index][1]
+                    : ''
+                }}
+              </div>
             </div>
           </div>
         </el-collapse-transition>
@@ -51,14 +72,17 @@ export default {
     return {
       data: this.notesData ? this.notesData : getNotesData(),
       wordShow: true,
+      multilingualTextList: {}, // 多语言对应的切割后的翻译
+      titleTrans: {},
     };
   },
   computed: {},
   watch: {
-    data: {
+    'data.option.length': {
       handler(val) {
         if (val) {
           // this.wordShow = isEnable(this.data.property.is_word_show);
+          this.handleData();
         }
       },
       deep: true,
@@ -70,6 +94,25 @@ export default {
     handleChangeTab() {
       this.wordShow = !this.wordShow;
     },
+    handleData() {
+      if (this.showLang) {
+        this.data.multilingual.forEach((item) => {
+          let trans_arr = item.translation.split('\n');
+          this.$set(this.titleTrans, item.type, trans_arr[0] ? trans_arr[0] : '');
+          let chunkSize = 2;
+          let chunkedArr = trans_arr.splice(1).reduce((acc, curr, index) => {
+            // 当索引是chunkSize的倍数时，开始一个新的子数组
+            if (index % chunkSize === 0) {
+              acc.push([curr]); // 开始新的子数组并添加当前元素
+            } else {
+              acc[acc.length - 1].push(curr); // 将当前元素添加到最后一个子数组中
+            }
+            return acc;
+          }, []);
+          this.$set(this.multilingualTextList, item.type, chunkedArr);
+        });
+      }
+    },
   },
 };
 </script>
@@ -173,8 +216,8 @@ export default {
             }
 
             &.NPC-notes-con-text {
-              flex: 1;
-              margin-left: 5px;
+              // flex: 1;
+              margin: 0 5px;
             }
           }
         }