Ver Fonte

连线后字词和图片下的背景框保持深灰

dusenyao há 11 meses atrás
pai
commit
34a97ca140
1 ficheiros alterados com 10 adições e 3 exclusões
  1. 10 3
      src/views/exercise_questions/preview/MatchingPreview.vue

+ 10 - 3
src/views/exercise_questions/preview/MatchingPreview.vue

@@ -27,7 +27,7 @@
         <div
           v-for="({ content, mark }, j) in item"
           :key="mark"
-          :class="['item-wrapper', `item-${mark}`, computedAnswerClass(mark)]"
+          :class="['item-wrapper', `item-${mark}`, computedAnswerClass(mark), computedActiveClass(mark)]"
           :style="{ cursor: disabled ? 'default' : 'pointer' }"
           @mousedown="mousedown($event, i, j, mark)"
           @mouseup="mouseup($event, i, j, mark)"
@@ -512,7 +512,13 @@ export default {
       });
       return fMark;
     },
-
+    // 计算激活状态 class
+    computedActiveClass(mark) {
+      const find = this.answer.answer_list.find((item) => {
+        if (item.some((li) => li === mark)) return true;
+      });
+      return find ? 'active' : '';
+    },
     /**
      * 计算答题对错选项class
      * @param {string} mark 选项标识
@@ -603,7 +609,8 @@ export default {
           margin-right: 52px;
         }
 
-        &.focus {
+        &.focus,
+        &.active {
           background-color: #dcdbdd;
         }