Merge branch 'master' of http://60.205.254.193:3000/GCLS/eep_page

src/components/PinyinText.vue

@@ -7,17 +7,19 @@
         class="pinyin-sentence"
         :style="{ 'align-items': pinyinPosition === 'top' ? 'flex-end' : 'flex-start' }"
       >
-        <div v-for="(text, k) in sentence" :key="k" class="pinyin-text">
-          <span v-if="pinyinPosition === 'top'" class="pinyin">
-            {{ text.pinyin.replace(/\s+/g, '') }}
+        <div v-for="(item, k) in sentence" :key="k" class="pinyin-text">
+          <span v-if="pinyinPosition === 'top'" class="pinyin" :class="{ active: visible && word_index == k }">
+            {{ item.pinyin.replace(/\s+/g, '') }}
           </span>
           <span
-            :style="{ cursor: isPreview ? '' : 'pointer' }"
-            :title="isPreview ? '' : '点击校对拼音'"
-            @click="correctPinyin(text.text, i, j, k)"
-            >{{ text.text }}</span
+            :class="{ active: visible && word_index == k }"
+            :title="isPreview ? '' : '点击校对'"
+            :style="{ ...item.activeTextStyle, cursor: isPreview ? '' : 'pointer' }"
+            @click="correctPinyin(item, i, j, k)"
           >
-          <span v-if="pinyinPosition === 'bottom'" class="pinyin">{{ text.pinyin.replace(/\s+/g, '') }}</span>
+            {{ item.text }}
+          </span>
+          <span v-if="pinyinPosition === 'bottom'" class="pinyin">{{ item.pinyin.replace(/\s+/g, '') }}</span>
         </div>
       </div>
     </div>
@@ -50,7 +52,7 @@ export default {
     return {
       paragraph_list: [],
       visible: false,
-      selectContent: '',
+      selectContent: {},
       paragraph_index: 0,
       sentence_index: 0,
       word_index: 0,
@@ -58,25 +60,19 @@ export default {
   },
   methods: {
     // 校对拼音
-    correctPinyin(text, i, j, k) {
+    correctPinyin(item, i, j, k) {
       if (this.isPreview) return; // 如果是预览模式，不操作
-      if (text) {
+      if (item) {
         this.visible = true;
-        this.selectContent = text;
+        this.selectContent = item;
         this.paragraph_index = i;
         this.sentence_index = j;
         this.word_index = k;
       }
     },
     // 回填校对后的拼音
-    fillTonePinyin(tonePinyin) {
-      this.$emit('fillCorrectPinyin', {
-        selectContent: this.selectContent,
-        tonePinyin,
-        i: this.paragraph_index,
-        j: this.sentence_index,
-        k: this.word_index,
-      });
+    fillTonePinyin(dataContent) {
+      this.$emit('fillCorrectPinyin', dataContent, this.paragraph_index, this.sentence_index, this.word_index);
     },
   },
 };
@@ -105,5 +101,9 @@ export default {
       }
     }
   }
+
+  .active {
+    color: rgb(242, 85, 90);
+  }
 }
 </style>

src/icons/svg/toolbar/bold.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1755588434931" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1927" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M341.333333 469.333333h192a106.666667 106.666667 0 1 0 0-213.333333H341.333333v213.333333z m426.666667 192a192.042667 192.042667 0 0 1-192 192H256V170.666667h277.333333a192 192 0 0 1 138.922667 324.522666A191.957333 191.957333 0 0 1 768 661.333333zM341.333333 554.666667v213.333333h234.666667a106.666667 106.666667 0 0 0 0-213.333333H341.333333z" p-id="1928"></path></svg>

src/icons/svg/toolbar/fontcolor.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1755588470789" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2086" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M650.496 597.333333H373.504l-68.266667 170.666667H213.333333l256-640h85.333334l256 640h-91.904l-68.266667-170.666667z m-34.133333-85.333333L512 251.093333 407.637333 512h208.725334zM128 853.333333h768v85.333334H128v-85.333334z" p-id="2087"></path></svg>

src/icons/svg/toolbar/strikethrough.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1755588423826" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1766" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M731.904 597.333333c9.813333 22.016 14.762667 46.506667 14.762667 73.386667 0 57.258667-22.357333 102.058667-67.029334 134.272C634.88 837.205333 573.141333 853.333333 494.336 853.333333c-69.973333 0-139.221333-16.256-207.786667-48.810666V708.266667c64.853333 37.418667 131.2 56.149333 199.082667 56.149333 108.842667 0 163.413333-31.232 163.797333-93.738667a94.293333 94.293333 0 0 0-27.648-68.394666l-5.12-4.992H128v-85.333334h768v85.333334h-164.096V597.333333z m-173.994667-128H325.504a174.378667 174.378667 0 0 1-20.522667-22.272C286.549333 423.253333 277.333333 394.496 277.333333 360.618667c0-52.736 19.882667-97.578667 59.605334-134.528C376.746667 189.141333 438.229333 170.666667 521.472 170.666667c62.762667 0 122.837333 13.994667 180.138667 41.984v91.818666c-51.2-29.312-107.306667-43.946667-168.362667-43.946666-105.813333 0-158.677333 33.365333-158.677333 100.096 0 17.92 9.301333 33.536 27.904 46.890666 18.602667 13.354667 41.557333 23.978667 68.821333 32 26.453333 7.68 55.338667 17.664 86.613333 29.824z" p-id="1767"></path></svg>

src/icons/svg/toolbar/underline.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1755588411087" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1605" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M341.333333 128v384a170.666667 170.666667 0 1 0 341.333334 0V128h85.333333v384a256 256 0 1 1-512 0V128h85.333333zM170.666667 853.333333h682.666666v85.333334H170.666667v-85.333334z" p-id="1606"></path></svg>

src/views/book/courseware/create/components/base/common/CorrectPinyin.vue

@@ -1,14 +1,39 @@
 <template>
   <el-dialog
     :visible="visible"
-    width="260px"
+    width="400px"
     top="38vh"
     :show-close="false"
     :close-on-click-modal="false"
     @close="dialogClose"
   >
-    <span class="tone-pinyin">{{ tonePinyin }}</span>
-    <span class="content-text">{{ selectContent }}</span>
+    <div ref="toolbarMenu" class="toolbar">
+      <el-select v-model="dataContent.activeTextStyle.fontFamily" placeholder="请选择">
+        <el-option v-for="item in fontFamilyOptions" :key="item.value" :label="item.label" :value="item.value" />
+      </el-select>
+      <el-select v-model="dataContent.activeTextStyle.fontSize" placeholder="请选择">
+        <el-option v-for="item in fontSizeOptions" :key="item.value" :label="item.label" :value="item.value" />
+      </el-select>
+      <span class="picker-area">
+        <el-color-picker
+          ref="colorPicker"
+          v-model="dataContent.activeTextStyle.color"
+          @click="dataContent.activeTextStyle.color = dataContent.activeTextStyle.color"
+        />
+        <SvgIcon icon-class="fontcolor" title="字体颜色" size="18" />
+      </span>
+      <span>
+        <SvgIcon icon-class="underline" title="下划线" size="18" @click="setActiveTextStyle('underline')" />
+      </span>
+      <span>
+        <SvgIcon icon-class="bold" title="加粗" size="20" @click="setActiveTextStyle('bold')" />
+      </span>
+      <span>
+        <SvgIcon icon-class="strikethrough" title="删除线" size="20" @click="setActiveTextStyle('line-through')" />
+      </span>
+    </div>
+    <span class="tone-pinyin">{{ dataContent.pinyin }}</span>
+    <span class="content-text" :style="dataContent.activeTextStyle">{{ dataContent.text }}</span>
     <el-input v-model="numberPinyin" autocomplete="off" placeholder="请输入正确的拼音" @blur="convertTonePinyin" />
     <span class="tips">一到四声分别用数字1-4表示，轻声用0表示,拼音间用空格隔开。</span>
     <template slot="footer">
@@ -28,20 +53,85 @@ export default {
       required: true,
     },
     selectContent: {
-      type: String,
+      type: Object,
       required: true,
     },
   },
+
   data() {
     return {
-      tonePinyin: '',
       numberPinyin: '',
+      fontFamilyOptions: [
+        {
+          value: '楷体',
+          label: '中文',
+        },
+        {
+          value: 'Sans-GBNPC',
+          label: '拼音',
+        },
+        {
+          value: 'robot',
+          label: '英文',
+        },
+        {
+          value: 'Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, sans-serif, alabo',
+          label: '系统字体',
+        },
+      ],
+      fontSizeOptions: [
+        { value: '12px', label: '12px' },
+        { value: '14px', label: '14px' },
+        { value: '16px', label: '16px' },
+        { value: '18px', label: '18px' },
+        { value: '20px', label: '20px' },
+        { value: '22px', label: '22px' },
+        { value: '24px', label: '24px' },
+        { value: '26px', label: '26px' },
+        { value: '28px', label: '28px' },
+        { value: '30px', label: '30px' },
+      ],
+      activeTextStyle: {
+        fontFamily: 'Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, sans-serif, alabo',
+        fontSize: '24px',
+        color: 'black',
+        textDecoration: '',
+        fontWeight: '',
+      },
+      toolbarIconList: [
+        { icon: 'fontcolor', title: '字体颜色', handle: '', size: '18' },
+        { icon: 'underline', title: '下划线', handle: 'openMindMap', size: '18' },
+        { icon: 'bold', title: '加粗', handle: '', size: '20' },
+        { icon: 'strikethrough', title: '删除线', handle: 'openBaseFileList', type: '1', size: '20' },
+      ],
+      pickerStyle: {
+        top: 0,
+        left: 0,
+      },
+      dataContent: { activeTextStyle: {} },
     };
   },
+  watch: {
+    visible: {
+      handler(val) {
+        if (!val) return;
+        this.dataContent = _.cloneDeep(this.selectContent);
+        let style = this.dataContent.activeTextStyle || {};
+        for (const key in this.activeTextStyle) {
+          if (style[key] === undefined || style[key] === null || style[key] === '') {
+            this.$set(style, key, this.activeTextStyle[key]);
+          }
+        }
+        this.$set(this.dataContent, 'activeTextStyle', style);
+        // console.info(this.dataContent);
+      },
+      deep: true,
+    },
+  },
   methods: {
     // 将数字拼音转换为声调拼音
     convertTonePinyin() {
-      this.tonePinyin = this.numberPinyin
+      this.dataContent.pinyin = this.numberPinyin
         .trim()
         .split(/\s+/)
         .map((item) => {
@@ -55,15 +145,27 @@ export default {
     },
     dialogClose() {
       this.$emit('update:visible', false);
-      this.tonePinyin = '';
       this.numberPinyin = '';
     },
     confirm() {
       this.$emit('update:visible', false);
-      this.$emit('fillTonePinyin', this.tonePinyin);
-      this.tonePinyin = '';
+      this.$emit('fillTonePinyin', this.dataContent);
       this.numberPinyin = '';
     },
+    // 设置样式
+    setActiveTextStyle(type) {
+      let style = this.dataContent.activeTextStyle;
+      if (type === 'line-through') {
+        style.textDecoration = style.textDecoration === 'line-through' ? '' : 'line-through';
+        this.$set(this.dataContent.activeTextStyle, 'textDecoration', style.textDecoration);
+      } else if (type === 'bold') {
+        style.fontWeight = style.fontWeight === 'bold' ? '' : 'bold';
+        this.$set(this.dataContent.activeTextStyle, 'fontWeight', style.fontWeight);
+      } else if (type === 'underline') {
+        style.textDecoration = style.textDecoration === 'underline' ? '' : 'underline';
+        this.$set(this.dataContent.activeTextStyle, 'textDecoration', style.textDecoration);
+      }
+    },
   },
 };
 </script>
@@ -74,6 +176,37 @@ export default {
     padding: 0;
   }
 
+  .toolbar {
+    display: flex;
+    column-gap: 10px;
+    align-items: center;
+    cursor: pointer;
+
+    .picker-area {
+      position: relative;
+
+      :deep .el-color-picker {
+        position: absolute;
+
+        &__trigger {
+          border: none;
+        }
+
+        &__color {
+          border: none !important;
+
+          &-inner {
+            background-color: rgba(0, 0, 0, 0%) !important;
+          }
+        }
+
+        &__icon {
+          display: none !important;
+        }
+      }
+    }
+  }
+
   :deep &__body {
     display: flex;
     flex-direction: column;

src/views/book/courseware/create/components/base/rich_text/RichText.vue

@@ -15,6 +15,7 @@
           @compareAnnotationAndSave="compareAnnotationAndSave"
         />
         <el-button class="btn" @click="openMultilingual">多语言</el-button>
+        <el-divider v-if="isEnable(data.property.view_pinyin)" content-position="left">拼音效果</el-divider>
         <MultilingualFill
           :visible.sync="multilingualVisible"
           :text="data.content"
@@ -61,8 +62,8 @@ export default {
   data() {
     return {
       isEnable,
-      data: getRichTextData(),
-      selectContent: '',
+      data: {},
+      selectContent: {},
       richId: '',
       isViewExplanatoryNoteDialog: false,
       oldRichData: {},
@@ -86,6 +87,9 @@ export default {
       deep: true,
     },
   },
+  created() {
+    this.data = getRichTextData();
+  },
   methods: {
     showSetting() {
       this.richId = this.$refs.rich.id;
@@ -102,22 +106,42 @@ export default {
       this.data.paragraph_list_parameter.text = text.replace(/<[^>]+>/g, '');
       this.data.paragraph_list_parameter.is_first_sentence_first_hz_pinyin_first_char_upper_case =
         this.data.property.is_first_sentence_first_hz_pinyin_first_char_upper_case;
-      CrateParsedTextInfo_Pinyin(this.data.paragraph_list_parameter).then(({ parsed_text }) => {
-        if (parsed_text) {
-          this.data.paragraph_list = parsed_text.paragraph_list;
+      CrateParsedTextInfo_Pinyin(this.data.paragraph_list_parameter).then((res) => {
+        if (res.parsed_text) {
+          const mergedData = res.parsed_text.paragraph_list.map((outerArr, i) =>
+            outerArr.map((innerArr, j) =>
+              innerArr.map((newItem, k) => {
+                // 从 originalData 中找到对应的项
+                const originalItem = this.data.paragraph_list[i]?.[j]?.[k];
+
+                // 如果 originalItem 有 activeTextStyle，就合并到 newItem
+                if (originalItem?.activeTextStyle) {
+                  return {
+                    ...newItem,
+                    activeTextStyle: originalItem.activeTextStyle,
+                  };
+                }
+                // 否则直接返回 newItem
+                return newItem;
+              }),
+            ),
+          );
+          this.data.paragraph_list = mergedData; // 取出合并后的数组
         }
       });
     },
     // 填充校对后的拼音
-    fillCorrectPinyin({ selectContent, tonePinyin, i, j, k }) {
+    fillCorrectPinyin(selectContent, i, j, k) {
+      // console.info('保存之后：', selectContent);
       this.data.paragraph_list_parameter.pinyin_proofread_word_list.push({
         paragraph_index: i,
         sentence_index: j,
         word_index: k,
-        word: selectContent,
-        pinyin: tonePinyin,
+        word: selectContent.text,
+        pinyin: selectContent.pinyin,
       });
-      this.data.paragraph_list[i][j][k].pinyin = tonePinyin;
+      if (selectContent.pinyin) this.data.paragraph_list[i][j][k].pinyin = selectContent.pinyin;
+      this.data.paragraph_list[i][j][k].activeTextStyle = selectContent.activeTextStyle;
     },
     // 思维导图
     handlerMindMap() {
@@ -148,7 +172,6 @@ export default {
     },
     // 点击弹窗确认-保存
     confirmExplanatoryNote(text) {
-      console.log(text);
       this.isViewExplanatoryNoteDialog = false;
       try {
         let ele = this.findComponentWithRefAndMethod(this.$children, 'richArea', 'setExplanatoryNote');

src/views/book/courseware/create/components/question/table/Table.vue

@@ -100,6 +100,15 @@
         :translations="data.multilingual"
         @SubmitTranslation="handleMultilingualTranslation"
       />
+      <el-divider v-if="isEnable(data.property.view_pinyin)" content-position="left">拼音效果</el-divider>
+      <PinyinText
+        v-if="isEnable(data.property.view_pinyin)"
+        :id="'table_pinyin_text'"
+        ref="PinyinText"
+        :paragraph-list="data.paragraph_list"
+        :pinyin-position="data.property.pinyin_position"
+        @fillCorrectPinyin="fillCorrectPinyin"
+      />
     </template>
   </ModuleBase>
 </template>
@@ -107,8 +116,10 @@
 <script>
 import { isEnable } from '@/views/book/courseware/data/common';
 import ModuleMixin from '../../common/ModuleMixin';
+import { CrateParsedTextInfo_Pinyin } from '@/api/book';
 
 import { getRandomNumber } from '@/utils';
+import PinyinText from '@/components/PinyinText.vue';
 
 import {
   getTableData,
@@ -120,7 +131,9 @@ import {
 
 export default {
   name: 'Table',
-  components: {},
+  components: {
+    PinyinText,
+  },
   mixins: [ModuleMixin],
   data() {
     return {
@@ -129,6 +142,8 @@ export default {
       tableTypeList,
       fontFamilyList,
       multilingualText: '',
+      isViewExplanatoryNoteDialog: false,
+      oldRichData: {},
     };
   },
   watch: {
@@ -173,10 +188,28 @@ export default {
         });
       },
     },
+    'data.property.view_pinyin': {
+      handler(val) {
+        let text = '';
+        this.data.option_list.forEach((item) => {
+          item.forEach((items) => {
+            text += items.content.replace(/<[^>]+>/g, '') + '\n';
+          });
+        });
+        if (isEnable(val) && text) {
+          this.data.paragraph_list_parameter.text = text;
+          this.data.paragraph_list_parameter.is_first_sentence_first_hz_pinyin_first_char_upper_case =
+            val.is_first_sentence_first_hz_pinyin_first_char_upper_case;
+          this.crateParsedTextInfoPinyin(text);
+        }
+      },
+      deep: true,
+    },
   },
   methods: {
     // 识别文本
     identifyText() {
+      let text = '';
       this.data.has_identify = 'true';
       this.data.option_list.forEach((item, index) => {
         item.forEach((items, indexs) => {
@@ -208,8 +241,12 @@ export default {
                 // .replace(/<span class="rich-fill".*?>(.*?)<\/span>|([_]{3,})/gi, '###$1$2###');
               });
           }
+          text += items.content.replace(/<[^>]+>/g, '') + '\n';
         });
       });
+      if (isEnable(this.data.property.view_pinyin)) {
+        this.crateParsedTextInfoPinyin(text);
+      }
     },
     // 分割富文本
     splitRichText(str) {
@@ -247,6 +284,32 @@ export default {
       }
       return arr;
     },
+    // 获取拼音解析文本
+    crateParsedTextInfoPinyin(text) {
+      if (text === '') {
+        this.data.paragraph_list_parameter.pinyin_proofread_word_list = [];
+        return;
+      }
+      this.data.paragraph_list_parameter.text = text.replace(/<[^>]+>/g, '');
+      this.data.paragraph_list_parameter.is_first_sentence_first_hz_pinyin_first_char_upper_case =
+        this.data.property.is_first_sentence_first_hz_pinyin_first_char_upper_case;
+      CrateParsedTextInfo_Pinyin(this.data.paragraph_list_parameter).then((res) => {
+        if (res.parsed_text) {
+          this.data.paragraph_list = res.parsed_text.paragraph_list;
+        }
+      });
+    },
+    // 填充校对后的拼音
+    fillCorrectPinyin(selectContent, tonePinyin, i, j, k) {
+      this.data.paragraph_list_parameter.pinyin_proofread_word_list.push({
+        paragraph_index: i,
+        sentence_index: j,
+        word_index: k,
+        word: selectContent,
+        pinyin: tonePinyin,
+      });
+      this.data.paragraph_list[i][j][k].pinyin = tonePinyin;
+    },
     // 思维导图数据
     handleMindMap() {
       let node_list = [];

src/views/book/courseware/create/components/question/table/TableSetting.vue

@@ -33,6 +33,29 @@
       <el-form-item label="装饰颜色">
         <el-color-picker v-model="property.decoration_color" />
       </el-form-item>
+      <el-form-item label="拼音">
+        <el-switch v-model="property.view_pinyin" active-value="true" inactive-value="false" />
+      </el-form-item>
+      <el-form-item label="拼音位置">
+        <el-radio
+          v-for="{ value, label } in pinyinPositionList"
+          :key="value"
+          v-model="property.pinyin_position"
+          :label="value"
+          :disabled="!isEnable(property.view_pinyin)"
+        >
+          {{ label }}
+        </el-radio>
+      </el-form-item>
+      <el-form-item label="">
+        <el-checkbox
+          v-model="property.is_first_sentence_first_hz_pinyin_first_char_upper_case"
+          :disabled="!isEnable(property.view_pinyin)"
+          true-label="true"
+          false-label="false"
+          >句首大写</el-checkbox
+        >
+      </el-form-item>
     </el-form>
   </div>
 </template>
@@ -41,6 +64,7 @@
 import SettingMixin from '@/views/book/courseware/create/components/common/SettingMixin';
 
 import { getTableProperty, switchOption, alignTypeList } from '@/views/book/courseware/data/table';
+import { isEnable, pinyinPositionList } from '@/views/book/courseware/data/common';
 
 export default {
   name: 'TableSetting',
@@ -50,6 +74,8 @@ export default {
       property: getTableProperty(),
       switchOption,
       alignTypeList,
+      pinyinPositionList,
+      isEnable,
     };
   },
   methods: {},

src/views/book/courseware/data/table.js

@@ -3,6 +3,7 @@ import {
   serialNumberTypeList,
   serialNumberPositionList,
   switchOption,
+  pinyinPositionList,
 } from '@/views/book/courseware/data/common';
 import { getRandomNumber } from '@/utils';
 export { switchOption };
@@ -38,6 +39,10 @@ export function getTableProperty() {
     first_column_color: '', // 首列颜色
     border_color: '#e6e6e6', // 边框颜色
     decoration_color: '#e7b576', // 装饰颜色
+
+    view_pinyin: 'false', // 显示拼音
+    pinyin_position: pinyinPositionList[0].value, // top bottom
+    is_first_sentence_first_hz_pinyin_first_char_upper_case: 'true', // 句首大写
   };
 }
 
@@ -85,7 +90,13 @@ export function getTableData() {
       }
     ], // 列宽
     property: getTableProperty(),
-    has_identify:'false', // 是否已识别
+    has_identify: 'false', // 是否已识别
+    paragraph_list: [],
+    paragraph_list_parameter: {
+      text: '',
+      is_first_sentence_first_hz_pinyin_first_char_upper_case: 'true',
+      pinyin_proofread_word_list: [],
+    },
     mind_map: {
       node_list: [{ name: '表格' }],
     },

src/views/book/courseware/preview/components/new_word/NewWordPreview.vue

@@ -111,15 +111,14 @@
                         <span
                           class="NPC-word-tab-common"
                           :style="{ width: data.col_width[0].value + 'px' }"
-                          v-if="showLang"
-                        >
-                          {{
+                          v-if="
+                            showLang &&
                             multilingualTextList[getLang()] &&
                             multilingualTextList[getLang()][index] &&
                             multilingualTextList[getLang()][index][0]
-                              ? multilingualTextList[getLang()][index][0]
-                              : ''
-                          }}
+                          "
+                        >
+                          {{ multilingualTextList[getLang()][index][0] }}
                         </span>
                       </div>
                       <span :style="{ width: data.col_width[2].value + 'px' }">
@@ -128,26 +127,30 @@
                           :class="[/[\u4E00-\u9FA5\uF900-\uFA2D]/.test(sItem.cixing) ? 'hasCn' : '']"
                           v-html="sItem.cixing"
                         ></p>
-                        <span class="NPC-word-tab-common" v-if="showLang">
-                          {{
+                        <span
+                          class="NPC-word-tab-common"
+                          v-if="
+                            showLang &&
                             multilingualTextList[getLang()] &&
                             multilingualTextList[getLang()][index] &&
                             multilingualTextList[getLang()][index][1]
-                              ? multilingualTextList[getLang()][index][1]
-                              : ''
-                          }}
+                          "
+                        >
+                          {{ multilingualTextList[getLang()][index][1] }}
                         </span>
                       </span>
                       <span :style="{ width: data.col_width[3].value + 'px' }">
                         <p class="NPC-word-tab-common NPC-word-tab-def" v-html="sItem.def_str"></p>
-                        <span class="NPC-word-tab-common" v-if="showLang">
-                          {{
+                        <span
+                          class="NPC-word-tab-common"
+                          v-if="
+                            showLang &&
                             multilingualTextList[getLang()] &&
                             multilingualTextList[getLang()][index] &&
                             multilingualTextList[getLang()][index][2]
-                              ? multilingualTextList[getLang()][index][2]
-                              : ''
-                          }}
+                          "
+                        >
+                          {{ multilingualTextList[getLang()][index][2] }}
                         </span>
                       </span>
                     </template>
@@ -164,15 +167,14 @@
                         <span
                           class="NPC-word-tab-common"
                           :style="{ width: data.col_width[0].value + 'px' }"
-                          v-if="showLang"
-                        >
-                          {{
+                          v-if="
+                            showLang &&
                             multilingualTextList[getLang()] &&
                             multilingualTextList[getLang()][index] &&
                             multilingualTextList[getLang()][index][0]
-                              ? multilingualTextList[getLang()][index][0]
-                              : ''
-                          }}
+                          "
+                        >
+                          {{ multilingualTextList[getLang()][index][0] }}
                         </span>
                       </span>
                       <span
@@ -189,26 +191,30 @@
                           v-html="sItem.cixing"
                         ></p>
 
-                        <span class="NPC-word-tab-common" v-if="showLang">
-                          {{
+                        <span
+                          class="NPC-word-tab-common"
+                          v-if="
+                            showLang &&
                             multilingualTextList[getLang()] &&
                             multilingualTextList[getLang()][index] &&
                             multilingualTextList[getLang()][index][1]
-                              ? multilingualTextList[getLang()][index][1]
-                              : ''
-                          }}
+                          "
+                        >
+                          {{ multilingualTextList[getLang()][index][1] }}
                         </span>
                       </span>
                       <span :style="{ width: data.col_width[3].value + 'px' }">
                         <p class="NPC-word-tab-common NPC-word-tab-def" v-html="sItem.def_str"></p>
-                        <span class="NPC-word-tab-common" v-if="showLang">
-                          {{
+                        <span
+                          class="NPC-word-tab-common"
+                          v-if="
+                            showLang &&
                             multilingualTextList[getLang()] &&
                             multilingualTextList[getLang()][index] &&
                             multilingualTextList[getLang()][index][2]
-                              ? multilingualTextList[getLang()][index][2]
-                              : ''
-                          }}
+                          "
+                        >
+                          {{ multilingualTextList[getLang()][index][2] }}
                         </span>
                       </span>
                     </template>