排序题 正确答案

src/views/exercise_questions/data/essayQuestion.js

@@ -1,6 +1,6 @@
 import { stemTypeList, questionNumberTypeList, scoreTypeList, switchOption } from './common';
 
-// 朗读题数据模板
+// 问答题数据模板
 export const essayQuestionData = {
   type: 'essay_question', // 题型
   stem: '', // 题干

src/views/exercise_questions/preview/ChinesePreview.vue

@@ -74,13 +74,13 @@
             <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' : '']"
-                @click="freeWrite(items, index, indexs, item.mark)"
+                @click="freeWrite(items ? JSON.parse(items) : null, index, indexs, item.mark)"
               >
                 <SvgIcon icon-class="hanzi-writer-bg" class="character-target-bg" />
                 <img
-                  v-if="!play_status && items && items.strokes_image"
+                  v-if="!play_status && items && JSON.parse(items).strokes_image"
                   class="hanzi-writer-img"
-                  :src="items.strokes_image"
+                  :src="JSON.parse(items).strokes_image"
                   alt=""
                 />
               </div>
@@ -96,12 +96,15 @@
           <div class="words-dic-box">
             <div v-for="(itemc, indexc) in item.imgArr" :key="indexc" class="words-dic-item">
               <span class="pinyin">{{ item.pinyin_arr[indexc].pinyin_item }}</span>
-              <div :class="['strockplay-newWord']" @click="freeWrite(itemc, index, indexc, item.mark)">
+              <div
+                :class="['strockplay-newWord']"
+                @click="freeWrite(itemc ? JSON.parse(itemc) : itemc, index, indexc, item.mark)"
+              >
                 <SvgIcon icon-class="hanzi-writer-bg" class="character-target-bg" />
                 <img
-                  v-if="!play_status && itemc && itemc.strokes_image"
+                  v-if="!play_status && itemc && JSON.parse(itemc).strokes_image"
                   class="hanzi-writer-img"
-                  :src="itemc.strokes_image"
+                  :src="JSON.parse(itemc).strokes_image"
                   alt=""
                 />
               </div>
@@ -148,7 +151,6 @@ export default {
       hanzi_color: '#404040', // 描红汉字底色
       writer_number_yuan: 19,
       writer_number: null, // 书写个数
-      answer_list: [], // 用户答题数据
       if_free_show: false,
       free_img: [],
       active_index: null,
@@ -226,7 +228,6 @@ export default {
   methods: {
     // 初始化数据
     handleData() {
-      this.answer_list = [];
       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) => {
@@ -254,7 +255,9 @@ export default {
           mark: item.mark,
           strokes_content_list: arr,
         };
-        this.answer_list.push(obj);
+        if (!this.isJudgingRightWrong) {
+          this.answer.answer_list.push(obj);
+        }
       });
       this.option_list = option_list;
       this.show_preview = true;
@@ -268,7 +271,7 @@ export default {
       this.if_free_show = false;
     },
     closeIfFreeShow(data, rowIndex, colIndex, mark) {
-      this.option_list[rowIndex].imgArr[colIndex] = data;
+      this.option_list[rowIndex].imgArr[colIndex] = JSON.stringify(data);
       this.if_free_show = false;
       this.freeWrite(data, rowIndex, colIndex, mark);
       this.$forceUpdate();
@@ -287,7 +290,7 @@ export default {
     },
     // 删除记录
     deleteWriteRecord(rowIndex, colIndex, current_hz) {
-      this.$set(this.option_list[rowIndex].imgArr, colIndex, {});
+      this.$set(this.option_list[rowIndex].imgArr, colIndex, JSON.stringify({}));
       this.changeCurQue(null, colIndex, this.active_mark);
       this.current_hz_data = null;
       this.active_mark = '';
@@ -296,12 +299,12 @@ export default {
     changeCurQue(answer, colIndex, mark) {
       if (answer) {
         let write_model = [];
-        this.answer_list.forEach((itema) => {
+        this.answer.answer_list.forEach((itema) => {
           if (itema.mark === mark) {
             write_model = itema.strokes_content_list;
           }
         });
-        write_model[colIndex] = answer;
+        write_model[colIndex] = JSON.stringify(answer);
       }
     },
   },

src/views/exercise_questions/preview/SortPreview.vue

@@ -23,7 +23,7 @@
           :key="indexNode"
           :class="[
             'drag-item',
-            { error: !itemNode.correct && isJudgingRightWrong },
+            { error: itemNode.mark !== data.option_list[indexNode].mark && isJudgingRightWrong },
             click_index_list.indexOf(indexNode) > -1 ? 'drag-item-active' : '',
           ]"
           @click="handleClickItem(indexNode)"
@@ -44,6 +44,32 @@
         </div>
       </transition-group>
     </draggable>
+    <template v-if="isJudgingRightWrong">
+      <h4 class="right-title">正确答案：</h4>
+      <draggable
+        v-model="move_list"
+        animation="300"
+        :options="{
+          group: { name: 'itxst', pull: 'clone' },
+        }"
+        :sort="false"
+        :class="['content-box', 'content-box-' + data.property.layout_type]"
+      >
+        <transition-group>
+          <div
+            v-for="(itemNode, indexNode) in data.option_list"
+            :key="indexNode"
+            :class="[
+              'drag-item',
+              { error: itemNode.mark !== data.option_list[indexNode].mark && isJudgingRightWrong },
+              click_index_list.indexOf(indexNode) > -1 ? 'drag-item-active' : '',
+            ]"
+          >
+            <span class="drag-content" v-html="sanitizeHTML(itemNode.content)"></span>
+          </div>
+        </transition-group>
+      </draggable>
+    </template>
   </div>
 </template>
 
@@ -66,7 +92,7 @@ export default {
   watch: {
     move_list: {
       handler(val) {
-        if (!val) return;
+        if (!val || this.isJudgingRightWrong) return;
         this.answer.answer_list = val.map(({ mark }) => {
           return mark;
         });
@@ -80,7 +106,6 @@ export default {
         this.move_list = this.answer.answer_list.map((item, i) => {
           return {
             ...this.data.option_list.find((items) => items.mark === item),
-            correct: item.mark === this.data.option_list[i].mark,
           };
         });
       },
@@ -89,11 +114,10 @@ export default {
     'data.option_list': {
       handler(val) {
         if (!val) return;
+        this.disrupted = false;
         this.move_list = this.shuffle(val.slice()).map((item, i) => ({
           ...item,
-          correct: item.mark === this.data.option_list[i].mark,
         }));
-        this.disrupted = true;
       },
       deep: true,
       immediate: true,
@@ -114,6 +138,7 @@ export default {
         const j = Math.floor(Math.random() * (i + 1));
         [arr[i], arr[j]] = [arr[j], arr[i]];
       }
+      this.disrupted = true;
       return arr;
     },
     onStart() {
@@ -122,7 +147,7 @@ export default {
     // 拖拽结束事件
     onEnd() {
       this.drag = false;
-      this.changeuserAnswerJudge();
+      // this.changeuserAnswerJudge();
       this.$forceUpdate();
     },
     // 判断对错
@@ -160,6 +185,7 @@ export default {
       display: flex;
       column-gap: 16px;
       align-items: center;
+      max-width: 800px;
       margin-bottom: 8px;
       cursor: move;
 
@@ -218,5 +244,13 @@ export default {
       }
     }
   }
+
+  .right-title {
+    margin: 24px 0;
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 24px;
+    color: #000;
+  }
 }
 </style>

src/views/exercise_questions/preview/WritePreview.vue

@@ -12,7 +12,7 @@
       v-html="sanitizeHTML(data.description)"
     ></div>
     <el-input
-      v-model="answer.user_answer.text"
+      v-model="answer.answer_list[0].text"
       rows="3"
       type="textarea"
       placeholder="请输入内容"
@@ -27,7 +27,7 @@
         :fille-number="999"
         file-type-name="文件"
         :upload-type="'*'"
-        :file-id-list="answer.user_answer.accessory_file_id"
+        :file-id-list="answer.answer_list[0].accessory_file_id_list"
         upload-title="上传附件："
         @upload="handleUpload"
         @deleteFile="handleDelete"
@@ -65,10 +65,10 @@ export default {
     isJudgingRightWrong: {
       handler(val) {
         if (!val) {
-          this.answer.user_answer = {
+          this.answer.answer_list.push({
             text: '', // 用户文章
-            accessory_file_id: [], // 上传文件列表
-          };
+            accessory_file_id_list: [], // 上传文件列表
+          });
         }
       },
       immediate: true,
@@ -85,11 +85,14 @@ export default {
   methods: {
     // 文件上传成功
     handleUpload(fileId) {
-      this.answer.user_answer.accessory_file_id.push(fileId);
+      this.answer.answer_list[0].accessory_file_id_list.push(fileId);
     },
     // 删除文件
     handleDelete(fileId) {
-      this.answer.user_answer.accessory_file_id.splice(this.answer.user_answer.accessory_file_id.indexOf(fileId), 1);
+      this.answer.answer_list[0].accessory_file_id_list.splice(
+        this.answer.answer_list[0].accessory_file_id_list.indexOf(fileId),
+        1,
+      );
     },
     handleInput(value) {
       if (value.length >= this.data.property.word_num) {