优化拼音效果细节

src/components/PinyinText.vue

@@ -17,17 +17,14 @@
             }"
             @click="correctPinyin(item, i, j, k)"
           >
-            <ruby
-              v-for="(word, w) in item.text.split('')"
-              :key="w"
-              :style="{ 'ruby-position': pinyinPosition === 'top' ? 'over' : 'under' }"
-              class="py-char"
-              >{{ word
-              }}<rt
+            <ruby class="py-char" :style="{ 'ruby-position': pinyinPosition === 'top' ? 'over' : 'under' }">
+              {{ item.text }}
+              <rt
                 class="pinyin"
                 :class="{ active: visible && word_index == k && paragraph_index === i && sentence_index === j }"
-                >{{ item.pinyin.split(' ')[w] }}</rt
               >
+                {{ item.pinyin }}
+              </rt>
             </ruby>
           </span>
         </div>
@@ -107,7 +104,7 @@ export default {
       column-gap: 4px;
 
       .pinyin-text {
-        font-size: 24px;
+        font-size: 16px;
 
         .py-char {
           ruby-align: center;
@@ -117,6 +114,7 @@ export default {
           margin-bottom: 4px;
           font-family: 'League';
           font-size: 12px;
+          font-weight: lighter;
           color: $font-color;
         }
       }

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

@@ -95,17 +95,11 @@ export default {
       ],
       activeTextStyle: {
         fontFamily: 'Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, sans-serif, alabo',
-        fontSize: '24px',
+        fontSize: '16px',
         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,
@@ -223,7 +217,7 @@ export default {
 
     .content-text {
       margin-top: -12px;
-      font-size: 28px;
+      font-size: 16px;
     }
 
     .tips {

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

@@ -72,7 +72,11 @@ export default {
     'data.property': {
       handler(val) {
         let text = this.data.content.replace(/<[^>]+>/g, '');
-        if (isEnable(val.view_pinyin) && text) {
+        if (!isEnable(val.view_pinyin)) {
+          this.data.paragraph_list = [];
+          return;
+        }
+        if (isEnable(val.view_pinyin) && text && this.data.paragraph_list.length <= 0) {
           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;

src/views/book/courseware/create/components/common/ModuleMixin.js

@@ -157,7 +157,7 @@ const mixin = {
       } else if (i >= 0 && j >= 0) {
         data = this.data[attr][i][j];
       }
-      if (text === '') {
+      if (text === '' || data.paragraph_list.length > 0) {
         data.pinyin_proofread_word_list = [];
         return;
       }