汉字练习答案回显

src/views/exercise_questions/preview/ChinesePreview.vue

@@ -1,6 +1,6 @@
 <!-- eslint-disable vue/no-v-html -->
 <template>
-  <div class="chinese-preview" v-if="show_preview">
+  <div v-if="show_preview" class="chinese-preview">
     <div class="stem">
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
@@ -216,26 +216,35 @@ export default {
       immediate: true,
     },
     data: {
-      handler(val, oldVal) {
+      handler(val) {
         if (!val || this.data.type !== 'chinese') return;
         this.handleData();
       },
       deep: true,
       immediate: true,
     },
+    isJudgingRightWrong: {
+      handler(val) {
+        if (!val) return;
+        this.handleData();
+      },
+      immediate: true,
+    },
   },
   created() {
-    // console.log(this.data);
     // this.handleData();
   },
   mounted() {},
   methods: {
     // 初始化数据
     handleData() {
+      if (!this.isJudgingRightWrong) {
+        this.answer.answer_list = [];
+      }
       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) => {
+      option_list.forEach((item, index) => {
         let arr = [];
         if (this.data.property.learn_type === 'dictation') {
           item.pinyin_arr = [];
@@ -247,14 +256,20 @@ export default {
             arr.push(null);
             item.pinyin_arr.push(obj);
           });
-          item.imgArr = arr;
-          // this.answer_list.write_model[this.hz_data[index]] = arr;
+          if (this.isJudgingRightWrong) {
+            item.imgArr = this.answer.answer_list[index].strokes_content_list;
+          } else {
+            item.imgArr = arr;
+          }
         } else if (item.content.trim()) {
           for (let i = 0; i < this.writer_number; i++) {
             arr.push(null);
           }
-          item.imgArr = arr;
-          // this.answer_list.write_model[item.content] = arr;
+          if (this.isJudgingRightWrong) {
+            item.imgArr = this.answer.answer_list[index].strokes_content_list;
+          } else {
+            item.imgArr = arr;
+          }
         }
         let obj = {
           mark: item.mark,
@@ -294,7 +309,7 @@ export default {
       this.current_hz_data = imgUrl;
     },
     // 删除记录
-    deleteWriteRecord(rowIndex, colIndex, current_hz) {
+    deleteWriteRecord(rowIndex, colIndex) {
       this.$set(this.option_list[rowIndex].imgArr, colIndex, JSON.stringify({}));
       this.changeCurQue(null, colIndex, this.active_mark);
       this.current_hz_data = null;

src/views/exercise_questions/preview/SortPreview.vue

@@ -104,7 +104,7 @@ export default {
       handler(val) {
         if (!val) return;
 
-        this.move_list = this.answer.answer_list.map((item, i) => {
+        this.move_list = this.answer.answer_list.map((item) => {
           return {
             ...this.data.option_list.find((items) => items.mark === item),
           };
@@ -117,7 +117,7 @@ export default {
       handler(val) {
         if (!val) return;
         this.disrupted = false;
-        this.move_list = this.shuffle(val.slice()).map((item, i) => ({
+        this.move_list = this.shuffle(val.slice()).map((item) => ({
           ...item,
         }));
       },

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

@@ -18,13 +18,13 @@
           :width="width"
           class="vueEsign"
         />
-        <a class="clean-btn" @click="resetHuahua" v-if="!disabled">
+        <a v-if="!disabled" class="clean-btn" @click="resetHuahua">
           <SvgIcon icon-class="reset" class="reset-btn" />
         </a>
       </div>
       <ul class="nav-list">
         <li :class="currenHzData && currenHzData.history ? '' : 'disabled'" @click="play()">播放</li>
-        <li @click="handleWriteImg" :class="disabled ? 'disabled' : ''">保存</li>
+        <li :class="disabled ? 'disabled' : ''" @click="handleWriteImg">保存</li>
       </ul>
     </div>
   </div>
@@ -116,7 +116,7 @@ export default {
           this.$message.warning('请等待播放完成');
           return;
         }
-        this.$refs.esign.reset();
+        if (this.$refs.esign) this.$refs.esign.reset();
         this.hasPlay = true;
         let c = document.getElementById('esign');
         let cxt = document.getElementById('esign').getContext('2d');