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

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

@@ -26,7 +26,12 @@
       <div class="content">
         <label class="title-little">题目：</label>
         <ul>
-          <li v-for="(item, i) in data.option_list" :key="i" v-loading="loading_list[i].loadings" class="content-item">
+          <li
+            v-for="(item, i) in data.option_list"
+            :key="i"
+            v-loading="loading_list[i] ? loading_list[i].loadings : false"
+            class="content-item"
+          >
             <span
               v-if="data.property.learn_type === 'dictation'"
               class="question-number"
@@ -57,9 +62,12 @@
             />
             <div v-else-if="data.other.audio_generation_method === 'auto'" class="auto-matically">
               <AudioPlay v-if="item.audio_file_id" :file-id="item.audio_file_id" theme-color="gray" />
-              <span v-loading="loading_list[i].loading" class="auto-btn" @click="handleMatically(item, i)">{{
-                item.audio_file_id ? '已生成' : '自动生成'
-              }}</span>
+              <span
+                v-loading="loading_list[i] ? loading_list[i].loading : false"
+                class="auto-btn"
+                @click="handleMatically(item, i)"
+                >{{ item.audio_file_id ? '已生成' : '自动生成' }}</span
+              >
             </div>
             <SoundRecord v-else :wav-blob.sync="item.audio_file_id" />
             <el-input
@@ -212,6 +220,34 @@ export default {
       ],
     };
   },
+  watch: {
+    'data.option_list.length': {
+      handler(val) {
+        this.loading_list = [];
+        for (let i = 0; i < val; i++) {
+          let obj = {
+            loading: false,
+            loadings: false,
+          };
+          this.loading_list.push(obj);
+        }
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  mounted() {
+    // if (this.data.option_list.length > 3) {
+    //   let length = this.data.option_list.length - 3;
+    //   for (let i = 0; i < length; i++) {
+    //     let obj = {
+    //       loading: false,
+    //       loadings: false,
+    //     };
+    //     this.loading_list.push(obj);
+    //   }
+    // }
+  },
   methods: {
     addOption() {
       this.data.option_list.push(getOption());

src/views/exercise_questions/preview/ChinesePreview.vue

@@ -10,7 +10,9 @@
     <!-- 笔画学习 -->
     <div :class="['words-box', 'words-box-' + data.property.learn_type]">
       <div v-for="(item, index) in option_list" :key="index" :class="['words-item']">
-        <template v-if="item.content && item.content.trim() && item.hz_strokes_list[0].strokes">
+        <template
+          v-if="item.content && item.content.trim() && item.hz_strokes_list[0] && item.hz_strokes_list[0].strokes"
+        >
           <div
             v-if="data.property.learn_type !== 'dictation'"
             class="words-top"
@@ -230,6 +232,7 @@ export default {
   methods: {
     // 初始化数据
     handleData() {
+      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;
       option_list.forEach((item) => {

src/views/exercise_questions/preview/components/common/Strockplayredline.vue

@@ -5,7 +5,7 @@
     </div>
     <div class="character-target-box">
       <SvgIcon icon-class="hanzi-writer-bg" class="character-target-bg" />
-      <div :id="targetDiv" class="character-target-div"></div>
+      <div :id="targetDiv" class="character-target-div" :ref="targetDiv"></div>
     </div>
   </div>
 </template>
@@ -63,6 +63,12 @@ export default {
   methods: {
     initHanziwrite() {
       let _this = this;
+      if (this.$refs[this.targetDiv]) {
+        let svg_arr = this.$refs[this.targetDiv].querySelectorAll('svg');
+        svg_arr.forEach((item) => {
+          item.remove();
+        });
+      }
       this.writer = HanziWriter.default.create(this.targetDiv, this.bookText, {
         charDataLoader(char, onComplete) {
           onComplete(_this.bookStrokes);