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

src/views/exercise_questions/create/components/exercises/AnswerQuestion.vue

@@ -76,7 +76,23 @@ export default {
       data: JSON.parse(JSON.stringify(answerQuestionData)),
     };
   },
-  methods: {},
+  methods: {
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+        this.data.reference_answer = arr[1] ? arr[1] : '';
+      }
+    },
+  },
 };
 </script>
 

src/views/exercise_questions/create/components/exercises/ChineseQuestion.vue

@@ -4,13 +4,10 @@
       <div class="stem">
         <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
 
-        <el-input
+        <RichText
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
       </div>
 
@@ -34,7 +31,7 @@
             <el-input v-model="item.content" :placeholder="'输入汉字或词汇'" @blur="handleChineseStrokes(item, i)" />
             <el-input
               v-model="item.pinyin"
-              :placeholder="data.property.learn_type === 'dictation' ? '拼音间用空格隔开' : '输入拼音'"
+              :placeholder="'拼音间用空格隔开'"
               @blur="handleSplitPy(item)"
               @change="changePinyin(item)"
             />
@@ -93,7 +90,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -158,6 +155,7 @@ import UploadAudio from '../common/UploadAudio.vue';
 import SoundRecord from '../common/SoundRecord.vue';
 import { GetStaticResources } from '@/api/app';
 import { changeOptionType, handleInputNumber } from '@/views/exercise_questions/data/common';
+import { getRandomNumber } from '@/utils/index';
 
 import {
   chineseData,
@@ -323,6 +321,36 @@ export default {
         item.audio_file_id = '';
       }
     },
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+        this.data.option_list = [];
+        arr.slice(1).map((content, index) => {
+          let content_item = content.split('&&');
+          this.data.option_list.push({
+            content: content_item[0] ? content_item[0] : '',
+            mark: getRandomNumber(),
+            audio_file_id: '',
+            pinyin: content_item[1] ? content_item[1] : '',
+            pinyin_item_list: [],
+            definition: content_item[2] ? content_item[2] : '',
+            collocation: content_item[3] ? content_item[3] : '',
+            hz_strokes_list: [],
+          });
+          this.handleSplitPy(this.data.option_list[index]);
+          this.handleChineseStrokes(this.data.option_list[index], index);
+        });
+      }
+    },
   },
 };
 </script>

src/views/exercise_questions/create/components/exercises/ChooseToneQuestion.vue

@@ -4,13 +4,10 @@
       <div class="stem">
         <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
 
-        <el-input
+        <RichText
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
       </div>
 
@@ -73,7 +70,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -319,6 +316,21 @@ export default {
         item.audio_file_id = '';
       }
     },
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+        this.data.option_list = arr.slice(1).map((content) => getOption(content));
+      }
+    },
   },
 };
 </script>

src/views/exercise_questions/create/components/exercises/EssayQuestion.vue

@@ -2,15 +2,12 @@
   <QuestionBase>
     <template #content>
       <div class="stem">
-        <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
+        <RichText v-model="data.stem" placeholder="输入题干" />
 
         <el-input
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
         <el-input
           v-if="isEnable(data.property.is_enable_reference_answer)"
@@ -37,7 +34,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -94,7 +91,23 @@ export default {
       data: JSON.parse(JSON.stringify(essayQuestionData)),
     };
   },
-  methods: {},
+  methods: {
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+        this.data.reference_answer = arr[1] ? arr[1] : '';
+      }
+    },
+  },
 };
 </script>
 

src/views/exercise_questions/create/components/exercises/RepeatQuestion.vue

@@ -5,13 +5,10 @@
       <div class="stem">
         <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
 
-        <el-input
+        <RichText
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
       </div>
 
@@ -71,7 +68,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -166,7 +163,7 @@ export default {
   methods: {
     /**
      * 智能识别
-     * @param {string} text 识别数据
+     * @param {String} text 识别数据
      */
     recognition(text) {
       let arr = text

src/views/exercise_questions/create/components/exercises/ReplaceAnswerQuestion.vue

@@ -5,13 +5,10 @@
       <div class="stem">
         <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
 
-        <el-input
+        <RichText
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
       </div>
 
@@ -41,7 +38,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -124,7 +121,25 @@ export default {
 
       if (arr.length > 0) {
         this.data.stem = arr[0];
-        this.data.option_list = arr.slice(1).map((content) => getOption(content));
+        let option_list = arr.slice(1);
+        this.data.option_list = [];
+        this.data.property.row_count = option_list.length;
+        let column_count = 0;
+        option_list.forEach((item) => {
+          let item_arr = item.split(' ');
+          if (item_arr.length > column_count) {
+            column_count = item_arr.length;
+          }
+        });
+        this.data.property.column_count = column_count;
+        for (let i = 0; i < option_list.length; i++) {
+          let table_item = [];
+          let item_arr = option_list[i].split(' ');
+          for (let j = 0; j < column_count; j++) {
+            table_item.push({ content: item_arr[j] ? item_arr[j] : '', mark: getRandomNumber() });
+          }
+          this.data.option_list.push(table_item);
+        }
       }
     },
     addOption() {

src/views/exercise_questions/create/components/exercises/SortQuestion.vue

@@ -5,13 +5,10 @@
       <div class="stem">
         <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
 
-        <el-input
+        <RichText
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
       </div>
 
@@ -48,7 +45,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -121,6 +118,21 @@ export default {
     addOption() {
       this.data.option_list.push(getOption());
     },
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+        this.data.option_list = arr.slice(1).map((content) => getOption(content));
+      }
+    },
   },
 };
 </script>

src/views/exercise_questions/create/components/exercises/TalkPictureQuestion.vue

@@ -4,13 +4,10 @@
       <div class="stem">
         <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
 
-        <el-input
+        <RichText
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
       </div>
 
@@ -60,7 +57,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -173,6 +170,20 @@ export default {
       this.data.option_list[this.data.option_list.length - 1].picture_file_id = file_id;
       this.$set(this.pic_list, file_id, file_url);
     },
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+      }
+    },
   },
 };
 </script>

src/views/exercise_questions/create/components/exercises/WordCardQuestion.vue

@@ -4,13 +4,10 @@
       <div class="stem">
         <RichText v-model="data.stem" :font-size="18" placeholder="输入题干" />
 
-        <el-input
+        <RichText
           v-show="isEnable(data.property.is_enable_description)"
           v-model="data.description"
-          rows="3"
-          resize="none"
-          type="textarea"
-          placeholder="输入描述"
+          placeholder="输入提示"
         />
       </div>
 
@@ -104,7 +101,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="描述">
+        <el-form-item label="提示">
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
@@ -348,6 +345,20 @@ export default {
         item.audio_file_id = '';
       }
     },
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+      }
+    },
   },
 };
 </script>

src/views/exercise_questions/create/components/exercises/WritePictureQuestion.vue

@@ -179,6 +179,23 @@ export default {
       this.data.option_list[this.data.option_list.length - 1].picture_file_id = file_id;
       this.$set(this.pic_list, file_id, file_url);
     },
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+        this.data.description = arr[2] ? arr[2] : '';
+        this.data.article = arr[1] ? arr[1] : '';
+        this.data.sample_text = arr[3] ? arr[3] : '';
+      }
+    },
   },
 };
 </script>

src/views/exercise_questions/create/components/exercises/WriteQuestion.vue

@@ -106,7 +106,25 @@ export default {
       data: JSON.parse(JSON.stringify(writeData)),
     };
   },
-  methods: {},
+  methods: {
+    /**
+     * 智能识别
+     * @param {String} text 识别数据
+     */
+    recognition(text) {
+      let arr = text
+        .split(/[\r\n]/)
+        .map((item) => item.trim())
+        .filter((item) => item);
+
+      if (arr.length > 0) {
+        this.data.stem = arr[0];
+        this.data.description = arr[2] ? arr[2] : '';
+        this.data.article = arr[1] ? arr[1] : '';
+        this.data.sample_text = arr[3] ? arr[3] : '';
+      }
+    },
+  },
 };
 </script>
 

src/views/exercise_questions/data/answerQuestion.js

@@ -1,4 +1,4 @@
-import { questionNumberTypeList, scoreTypeList, switchOption } from './common';
+import { stemTypeList, questionNumberTypeList, scoreTypeList, switchOption } from './common';
 
 // 口语表达数据模板
 export const answerQuestionData = {
@@ -11,6 +11,7 @@ export const answerQuestionData = {
   }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
     is_enable_reference_answer: switchOption[0].value, // 是否开启参考答案
     score: 1, // 分值

src/views/exercise_questions/data/chinese.js

@@ -1,4 +1,4 @@
-import { scoreTypeList, questionNumberTypeList, optionTypeList } from './common';
+import { stemTypeList, scoreTypeList, questionNumberTypeList, optionTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 
 export function getOption(content = '') {
@@ -47,8 +47,9 @@ export const chineseData = {
   file_id_list: [],
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
-    is_enable_description: 'false', // 描述
+    is_enable_description: switchOption[0].value, // 描述
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型
     learn_type: learnTypeList[0].value,

src/views/exercise_questions/data/chooseTone.js

@@ -1,4 +1,4 @@
-import { questionNumberTypeList, scoreTypeList, optionTypeList } from './common';
+import { stemTypeList, questionNumberTypeList, scoreTypeList, optionTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 
 export function getOption(content = '') {
@@ -49,8 +49,9 @@ export const ChooseToneData = {
   answer: { score: 1, score_type: scoreTypeList[0].value, answer_list: [] }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
-    is_enable_description: 'false', // 描述
+    is_enable_description: switchOption[0].value, // 描述
     answer_mode: toneTypeList[0].value, // 音调类型
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型

src/views/exercise_questions/data/essayQuestion.js

@@ -1,4 +1,4 @@
-import { questionNumberTypeList, scoreTypeList, switchOption } from './common';
+import { stemTypeList, questionNumberTypeList, scoreTypeList, switchOption } from './common';
 
 // 问答题数据模板
 export const essayQuestionData = {
@@ -13,6 +13,7 @@ export const essayQuestionData = {
   }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
     is_enable_description: switchOption[0].value, // 描述
     is_enable_reference_answer: switchOption[0].value, // 是否开启参考答案

src/views/exercise_questions/data/repeat.js

@@ -1,4 +1,4 @@
-import { optionTypeList, scoreTypeList, questionNumberTypeList } from './common';
+import { optionTypeList, stemTypeList, scoreTypeList, questionNumberTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 
 export function getOption(content = '') {
@@ -35,8 +35,9 @@ export const repeatData = {
   answer: { score: 1, score_type: scoreTypeList[0].value }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
-    is_enable_description: 'false', // 描述
+    is_enable_description: switchOption[0].value, // 描述
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型
   },

src/views/exercise_questions/data/replaceAnswer.js

@@ -1,4 +1,4 @@
-import { scoreTypeList, questionNumberTypeList } from './common';
+import { stemTypeList, scoreTypeList, questionNumberTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 
 export function getOption(content = '') {
@@ -20,8 +20,9 @@ export const replaceAnswerData = {
   answer: { score: 1, score_type: scoreTypeList[0].value }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
-    is_enable_description: 'false', // 描述
+    is_enable_description: switchOption[0].value, // 描述
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型
     row_count: 4,

src/views/exercise_questions/data/sort.js

@@ -1,4 +1,4 @@
-import { scoreTypeList, questionNumberTypeList, switchOption } from './common';
+import { stemTypeList, scoreTypeList, questionNumberTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 
 export function getOption(content = '') {
@@ -21,8 +21,9 @@ export function getSortDataTemplate() {
     answer: { answer_list, score: 1, score_type: scoreTypeList[0].value }, // 答案
     // 题型属性
     property: {
+      stem_type: stemTypeList[1].value, // 题干类型
       question_number: '1', // 题号
-      is_enable_description: switchOption[1].value, // 描述
+      is_enable_description: switchOption[0].value, // 描述
       score: 1, // 分值
       score_type: scoreTypeList[0].value, // 分值类型
       layout_type: sortTypeList[0].value,

src/views/exercise_questions/data/talkPicture.js

@@ -1,4 +1,4 @@
-import { scoreTypeList, questionNumberTypeList, switchOption } from './common';
+import { stemTypeList, scoreTypeList, questionNumberTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 export function getOption() {
   return { picture_info: '', reference_answer: '', picture_file_id: '', mark: getRandomNumber() };
@@ -13,9 +13,10 @@ export const talkPictrueData = {
   answer: { score: 1, score_type: scoreTypeList[0].value }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
     score: 1, // 分值
-    is_enable_description: switchOption[1].value, // 描述
+    is_enable_description: switchOption[0].value, // 描述
     is_enable_voice_answer: switchOption[0].value, // 语音作答
     is_enable_reference_answer: switchOption[0].value, // 参考答案
     score_type: scoreTypeList[0].value, // 分值类型

src/views/exercise_questions/data/wordCard.js

@@ -1,4 +1,4 @@
-import { scoreTypeList, questionNumberTypeList, optionTypeList } from './common';
+import { stemTypeList, scoreTypeList, questionNumberTypeList, optionTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 
 export function getOption(content = '') {
@@ -42,8 +42,9 @@ export const wordCardData = {
   file_id_list: [],
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
-    is_enable_description: 'false', // 描述
+    is_enable_description: switchOption[0].value, // 描述
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型
   },

src/views/exercise_questions/data/write.js

@@ -1,4 +1,4 @@
-import { optionTypeList, scoreTypeList, questionNumberTypeList } from './common';
+import { optionTypeList, stemTypeList, scoreTypeList, questionNumberTypeList, switchOption } from './common';
 // 数据模板
 export const writeData = {
   type: 'write', // 题型
@@ -11,8 +11,9 @@ export const writeData = {
   answer: { score: 1, score_type: scoreTypeList[0].value }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
-    is_enable_description: 'false', // 描述
+    is_enable_description: switchOption[0].value, // 描述
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型
     word_num: 50, // 字数

src/views/exercise_questions/data/writePicture.js

@@ -1,4 +1,4 @@
-import { scoreTypeList, questionNumberTypeList, switchOption } from './common';
+import { stemTypeList, scoreTypeList, questionNumberTypeList, switchOption } from './common';
 import { getRandomNumber } from '@/utils/index';
 export function getOption() {
   return {
@@ -19,9 +19,10 @@ export const writePictrueData = {
   answer: { score: 1, score_type: scoreTypeList[0].value }, // 答案
   // 题型属性
   property: {
+    stem_type: stemTypeList[1].value, // 题干类型
     question_number: '1', // 题号
     score: 1, // 分值
-    is_enable_description: switchOption[1].value, // 描述
+    is_enable_description: switchOption[0].value, // 描述
     score_type: scoreTypeList[0].value, // 分值类型
     word_num: 50, // 字数
     is_enable_sample_text: 'true', // 范文开启

src/views/exercise_questions/preview/AnswerQuestionPreview.vue

@@ -8,7 +8,7 @@
     <SoundRecordPreview :wav-blob.sync="answer.answer_list[0].audio_file_id" :disabled="disabled" position="center" />
     <div v-if="isEnable(data.property.is_enable_reference_answer) && isShowRightAnswer" class="reference-box">
       <h5 class="reference-title">参考答案</h5>
-      <span class="reference-answer" v-html="sanitizeHTML(data.reference_answer)"></span>
+      <span class="reference-answer rich-text" v-html="sanitizeHTML(data.reference_answer)"></span>
     </div>
   </div>
 </template>

src/views/exercise_questions/preview/ChinesePreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
 
     <!-- 笔画学习 -->
     <div :class="['words-box', 'words-box-' + data.property.learn_type]">
@@ -45,20 +49,21 @@
               />
             </template>
 
-            <div v-for="itemI in writer_number" :key="itemI + data.property.learn_type + index" style="display: flex">
+            <div
+              v-for="(itemI, indexI) in miao_arr[index]"
+              :key="indexI + data.property.learn_type + index"
+              style="display: flex"
+            >
               <Strockred
-                v-for="(items, indexs) in item.hz_strokes_list"
-                :key="indexs"
                 :book-text="item.content"
                 :hanzi-color="hanzi_color"
                 :reset="true"
                 :target-div="'write-praT' + item.content + itemI + Math.random().toString(36).substring(2, 10)"
-                :book-strokes="items.strokes"
+                :book-strokes="itemI.strokes"
                 :class="[
                   'strock-chinese',
-                  ((item.hz_strokes_list.length * (itemI + 1) + indexs - 1) % writer_number_yuan !== 0 &&
-                    itemI !== writer_number) ||
-                  (itemI === writer_number && indexs !== item.hz_strokes_list.length - 1)
+                  'strock-chinese' + ((indexI + itemI.length + 1) % writer_number_yuan),
+                  (indexI + itemI.length + 1) % writer_number_yuan !== 0 && indexI !== miao_arr[index].length - 1
                     ? 'border-right-none'
                     : '',
                 ]"
@@ -79,7 +84,10 @@
             </template>
             <div v-for="(items, indexs) in item.imgArr" :key="indexs" class="con-box">
               <div
-                :class="['strockplay-newWord', (indexs + 1) % writer_number_yuan !== 0 ? 'border-left-none' : '']"
+                :class="[
+                  'strockplay-newWord',
+                  (indexs + item.hz_strokes_list.length) % writer_number_yuan !== 0 ? 'border-left-none' : '',
+                ]"
                 @click="freeWrite(items ? JSON.parse(items) : null, index, indexs, item.mark)"
               >
                 <SvgIcon icon-class="hanzi-writer-bg" class="character-target-bg" />
@@ -156,7 +164,7 @@ export default {
     return {
       computeOptionMethods,
       hanzi_color: '#404040', // 描红汉字底色
-      writer_number_yuan: 19,
+      writer_number_yuan: 15,
       writer_number: null, // 书写个数
       if_free_show: false,
       free_img: [],
@@ -207,6 +215,7 @@ export default {
       active_mark: '',
       option_list: [],
       show_preview: false,
+      miao_arr: [],
     };
   },
   watch: {
@@ -248,8 +257,11 @@ export default {
       this.show_preview = false;
       this.writer_number = this.data.property.tian_number ? Number(this.data.property.tian_number) : 8;
       let option_list = JSON.parse(JSON.stringify(this.data)).option_list;
+
+      this.miao_arr = [];
       option_list.forEach((item, index) => {
         let arr = [];
+        this.miao_arr.push([]);
         if (this.data.property.learn_type === 'dictation') {
           item.pinyin_arr = [];
           let pinyin_arr = item.pinyin.trim().split(' ');
@@ -267,7 +279,13 @@ export default {
           }
         } else if (item.content.trim()) {
           for (let i = 0; i < this.writer_number; i++) {
-            item.hz_strokes_list.forEach(() => {
+            item.hz_strokes_list.forEach((items) => {
+              if (this.data.property.learn_type === 'paint') {
+                this.miao_arr[index].push({
+                  strokes: items.strokes,
+                  length: item.hz_strokes_list.length,
+                });
+              }
               arr.push(null);
             });
           }
@@ -287,11 +305,13 @@ export default {
       });
       this.option_list = option_list;
       this.show_preview = true;
-      if (document.getElementsByClassName('preview-content').length > 0) {
-        this.writer_number_yuan = Math.floor(
-          (document.getElementsByClassName('preview-content')[0].clientWidth - 128) / 64,
-        );
-      }
+      setTimeout(() => {
+        if (document.getElementsByClassName('chinese-preview').length > 0) {
+          this.writer_number_yuan = Math.floor(
+            (document.getElementsByClassName('chinese-preview')[0].clientWidth - 128) / 64,
+          );
+        }
+      }, 10);
     },
     changePraShow() {
       this.if_free_show = false;

src/views/exercise_questions/preview/ChooseTonePreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
     <div class="option-list">
       <li v-for="(item, i) in data.option_list" :key="i" :class="['option-item']">
         <span>{{ computeOptionMethods[data.option_number_show_mode](i) }} </span>

src/views/exercise_questions/preview/EssayQuestionPreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
 
     <el-input
       v-model="answer.answer_list[0].text"
@@ -31,7 +35,7 @@
     />
     <div v-if="isEnable(data.property.is_enable_reference_answer) && isShowRightAnswer" class="reference-box">
       <h5 class="reference-title">参考答案</h5>
-      <span class="reference-answer" v-html="sanitizeHTML(data.reference_answer)"></span>
+      <span class="reference-answer rich-text" v-html="sanitizeHTML(data.reference_answer)"></span>
     </div>
   </div>
 </template>

src/views/exercise_questions/preview/RepeatPreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
     <div class="option-list">
       <li v-for="(item, i) in answer.answer_list" :key="i" :class="['option-item']">
         <span>{{ computeOptionMethods[data.option_number_show_mode](i) }} </span>
@@ -15,7 +19,7 @@
         />
         <div
           v-if="sanitizeHTML(data.option_list[i].content)"
-          class="option-content"
+          class="option-content rich-text"
           v-html="sanitizeHTML(data.option_list[i].content)"
         ></div>
         <div class="sound-box">

src/views/exercise_questions/preview/ReplaceAnswerPreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
     <div class="option-list">
       <div v-for="(item, i) in option_list" :key="i" :class="['option-item']">
         <template v-if="item.length > 1">

src/views/exercise_questions/preview/SortPreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
     <draggable
       v-model="move_list"
       animation="300"
@@ -34,7 +38,7 @@
             :size="20"
             icon-class="draggable"
           /> -->
-          <span class="drag-content" v-html="sanitizeHTML(itemNode.content)"></span>
+          <span class="drag-content rich-text" v-html="sanitizeHTML(itemNode.content)"></span>
           <!-- <SvgIcon
             v-if="data.property.layout_type === 'horizontal'"
             class="drag-icon"
@@ -65,7 +69,7 @@
               click_index_list.indexOf(indexNode) > -1 ? 'drag-item-active' : '',
             ]"
           >
-            <span class="drag-content" v-html="sanitizeHTML(itemNode.content)"></span>
+            <span class="drag-content rich-text" v-html="sanitizeHTML(itemNode.content)"></span>
           </div>
         </transition-group>
       </draggable>

src/views/exercise_questions/preview/TalkPictruePreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
     <div class="content">
       <div v-for="(item, index) in data.option_list" :key="index" class="content-item">
         <el-image
@@ -14,7 +18,7 @@
           :src="pic_list[item.picture_file_id]"
           fit="contain"
         />
-        <p class="pic-info" v-html="sanitizeHTML(item.picture_info)"></p>
+        <p class="pic-info rich-text" v-html="sanitizeHTML(item.picture_info)"></p>
         <!-- 语音作答 -->
         <div v-if="isEnable(data.property.is_enable_voice_answer) && answer.answer_list[index]" class="sound-box">
           <SoundRecordPreview
@@ -26,7 +30,7 @@
 
         <div v-if="isEnable(data.property.is_enable_reference_answer) && isShowRightAnswer" class="reference-box">
           <h5 class="reference-title">参考答案</h5>
-          <span class="reference-answer" v-html="sanitizeHTML(item.reference_answer)"></span>
+          <span class="reference-answer rich-text" v-html="sanitizeHTML(item.reference_answer)"></span>
         </div>
       </div>
     </div>
@@ -117,7 +121,8 @@ export default {
 
     .pic-info {
       margin: 0;
-      font-size: 12px;
+
+      //font-size: 12px;
       font-weight: 400;
       line-height: 20px;
       color: #000;

src/views/exercise_questions/preview/WordCardPreview.vue

@@ -5,7 +5,11 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
+    <div
+      v-if="isEnable(data.property.is_enable_description)"
+      class="description rich-text"
+      v-html="sanitizeHTML(data.description)"
+    ></div>
 
     <!-- 笔画学习 -->
     <div :class="['words-box']">

src/views/exercise_questions/preview/WritePictruePreview.vue

@@ -5,10 +5,10 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div class="article-content" v-html="sanitizeHTML(data.article)"></div>
+    <div class="article-content rich-text" v-html="sanitizeHTML(data.article)"></div>
     <div
       v-if="isEnable(data.property.is_enable_description)"
-      class="description"
+      class="description rich-text"
       v-html="sanitizeHTML(data.description)"
     ></div>
     <div class="content">
@@ -21,8 +21,8 @@
           :class="[active_index !== index ? 'not-active' : '']"
           @click="active_index = index"
         />
-        <h3 class="pic-title" v-html="sanitizeHTML(item.picture_title)"></h3>
-        <p class="pic-info" v-html="sanitizeHTML(item.picture_info)"></p>
+        <h3 class="pic-title rich-text" v-html="sanitizeHTML(item.picture_title)"></h3>
+        <p class="pic-info rich-text" v-html="sanitizeHTML(item.picture_info)"></p>
       </div>
     </div>
 
@@ -61,7 +61,7 @@
           >{{ show_sample_text ? '隐藏范文' : '查看范文' }}</span
         ></el-divider
       >
-      <div v-if="show_sample_text" class="article-content" v-html="sanitizeHTML(data.sample_text)"></div>
+      <div v-if="show_sample_text" class="article-content rich-text" v-html="sanitizeHTML(data.sample_text)"></div>
     </template>
   </div>
 </template>

src/views/exercise_questions/preview/WritePreview.vue

@@ -5,10 +5,10 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div class="article-content" v-html="sanitizeHTML(data.article)"></div>
+    <div class="article-content rich-text" v-html="sanitizeHTML(data.article)"></div>
     <div
       v-if="isEnable(data.property.is_enable_description)"
-      class="description"
+      class="description rich-text"
       v-html="sanitizeHTML(data.description)"
     ></div>
     <el-input
@@ -18,8 +18,8 @@
       placeholder="请输入内容"
       :maxlength="data.property.word_num"
       show-word-limit
-      @input="handleInput"
       :readonly="disabled"
+      @input="handleInput"
     />
 
     <template v-if="isEnable(data.property.is_enable_upload_accessory)">
@@ -30,9 +30,9 @@
         :upload-type="'*'"
         :file-id-list="answer.answer_list[0].accessory_file_id_list"
         upload-title="上传附件："
+        :disabled="disabled"
         @upload="handleUpload"
         @deleteFile="handleDelete"
-        :disabled="disabled"
       />
     </template>
     <template v-if="isEnable(data.property.is_enable_sample_text) && isShowRightAnswer">
@@ -43,7 +43,7 @@
           >{{ show_sample_text ? '隐藏范文' : '查看范文' }}</span
         ></el-divider
       >
-      <div v-if="show_sample_text" class="article-content" v-html="sanitizeHTML(data.sample_text)"></div>
+      <div v-if="show_sample_text" class="article-content rich-text" v-html="sanitizeHTML(data.sample_text)"></div>
     </template>
   </div>
 </template>