语境字体

src/views/book/courseware/create/components/question/dialogue_article/ArticleSetting.vue

@@ -153,6 +153,12 @@
           <el-option v-for="{ value, label } in speedRatioList" :key="value" :label="label" :value="value" />
         </el-select>
       </el-form-item>
+
+      <el-form-item label="语境字体">
+        <el-select v-model="property.noitce_family">
+          <el-option v-for="{ value, name } in fontFamilyList" :key="value" :label="name" :value="value" />
+        </el-select>
+      </el-form-item>
       <el-form-item label="语境字号">
         <el-input v-model="property.notice_size"><template slot="append">px</template></el-input>
       </el-form-item>
@@ -199,6 +205,40 @@ export default {
       voice_type_list: [],
       emotion_list: [],
       speedRatioList,
+      fontFamilyList: [
+        {
+          value: '',
+          name: '请选择',
+        },
+        {
+          value: '楷体, 微软雅黑',
+          name: '楷体',
+        },
+        {
+          value: '黑体, 微软雅黑',
+          name: '黑体',
+        },
+        {
+          value: '宋体, 微软雅黑',
+          name: '宋体',
+        },
+        {
+          value: 'arial,helvetica,sans-serif',
+          name: 'Arial',
+        },
+        {
+          value: 'times new roman,times,serif',
+          name: 'Times New Roman',
+        },
+        {
+          value: 'League',
+          name: '拼音',
+        },
+        // {
+        //   value: 'Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, sans-serif, alabo',
+        //   name: '系统字体',
+        // },
+      ],
     };
   },
   computed: {

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

@@ -127,7 +127,8 @@ export function getArticleProperty() {
     speed_ratio: '', // 语速
     ...commonComponentProperty,
     notice_size: '14',
-    notice_color:'#000'
+    notice_color: '#000',
+    noitce_family:''
   };
 }
 

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

@@ -94,6 +94,7 @@
                 :style="{
                   fontSize: curQue.property.notice_size ? curQue.property.notice_size + 'px' : '',
                   color: curQue.property.notice_color ? curQue.property.notice_color : '',
+                  fontFamily: curQue.property.noitce_family ? curQue.property.noitce_family : '',
                 }"
                 v-if="item.noticeWordList.length === 0"
               >
@@ -104,6 +105,7 @@
                 :style="{
                   fontSize: curQue.property.notice_size ? curQue.property.notice_size + 'px' : '',
                   color: curQue.property.notice_color ? curQue.property.notice_color : '',
+                  fontFamily: curQue.property.noitce_family ? curQue.property.noitce_family : '',
                 }"
                 v-else
               >
@@ -1079,6 +1081,7 @@ export default {
           notice: dItem.notice,
           noticeWordList: dItem.noticeWordList,
           notice_size: dItem.notice_size,
+          noitce_family: dItem.noitce_family,
           notice_color: dItem.notice_color,
           file_url_open: dItem.file_url_open,
         };

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

@@ -85,6 +85,7 @@
                 :style="{
                   fontSize: curQue.property.notice_size ? curQue.property.notice_size + 'px' : '',
                   color: curQue.property.notice_color ? curQue.property.notice_color : '',
+                  fontFamily: curQue.property.noitce_family ? curQue.property.noitce_family : '',
                 }"
                 v-if="item.noticeWordList.length === 0"
               >
@@ -95,6 +96,7 @@
                 :style="{
                   fontSize: curQue.property.notice_size ? curQue.property.notice_size + 'px' : '',
                   color: curQue.property.notice_color ? curQue.property.notice_color : '',
+                  fontFamily: curQue.property.noitce_family ? curQue.property.noitce_family : '',
                 }"
                 v-else
               >
@@ -956,6 +958,7 @@ export default {
           notice: dItem.notice,
           noticeWordList: dItem.noticeWordList,
           notice_size: dItem.notice_size,
+          noitce_family: dItem.noitce_family,
           notice_color: dItem.notice_color,
           file_url_open: dItem.file_url_open,
         };

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

@@ -80,6 +80,7 @@
           :style="{
             fontSize: curQue.property.notice_size ? curQue.property.notice_size + 'px' : '',
             color: curQue.property.notice_color ? curQue.property.notice_color : '',
+            fontFamily: curQue.property.noitce_family ? curQue.property.noitce_family : '',
           }"
         >
           {{ convertText(curQue.notice) }}
@@ -1108,6 +1109,7 @@ export default {
             notice: dItem.notice,
             noticeWordList: dItem.noticeWordList,
             notice_size: dItem.notice_size,
+            noitce_family: dItem.noitce_family,
             notice_color: dItem.notice_color,
             file_url_open: dItem.file_url_open,
           };

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

@@ -84,6 +84,7 @@
                 :style="{
                   fontSize: curQue.property.notice_size ? curQue.property.notice_size + 'px' : '',
                   color: curQue.property.notice_color ? curQue.property.notice_color : '',
+                  fontFamily: curQue.property.noitce_family ? curQue.property.noitce_family : '',
                 }"
                 v-if="item.noticeWordList.length === 0"
               >
@@ -94,6 +95,7 @@
                 :style="{
                   fontSize: curQue.property.notice_size ? curQue.property.notice_size + 'px' : '',
                   color: curQue.property.notice_color ? curQue.property.notice_color : '',
+                  fontFamily: curQue.property.noitce_family ? curQue.property.noitce_family : '',
                 }"
                 v-else
               >
@@ -848,6 +850,7 @@ export default {
           notice: dItem.notice,
           noticeWordList: dItem.noticeWordList,
           notice_size: dItem.notice_size,
+          noitce_family: dItem.noitce_family,
           notice_color: dItem.notice_color,
           file_url_open: dItem.file_url_open,
         };