修改问题-句子模版保存答案-测试

src/components/Adult/preview/DialogueArticleViewChs/AnswerModel.vue

@@ -842,7 +842,6 @@ export default {
         }
       });
       this.resArr = resArr;
-      console.log(resArr);
       // 循环文章图片
       if (curQue.img_list) {
         curQue.img_list.forEach((item) => {

src/components/Adult/preview/DialogueArticleViewChs/DialogueAnswerViewChs.vue

@@ -200,7 +200,6 @@ export default {
         let bool = false;
         let userErrorNumberTotal = 0;
         let Bookanswer = _this.curQue.Bookanswer;
-        console.log(Bookanswer);
         if (Bookanswer && Bookanswer.length > 0) {
           userErrorNumberTotal = _this.countUserErrorNumber(Bookanswer[index]);
           if (_this.judgeAnswer == "standardAnswer") {

src/components/Adult/preview/Picture.vue

@@ -667,25 +667,27 @@ export default {
       } else {
         this.curQue.Bookanswer[0][key] = this.curQue.Bookanswer[0][key].trim();
       }
+      this.$forceUpdate();
     },
     changeSingle(value) {
       let _this = this;
       let correct = _this.curQue.correct[0].single[0];
       if (correct || correct == 0) {
         if (value == correct) {
-          this.$set(
-            this.curQue.Bookanswer[0].single[0],
+          _this.$set(
+            _this.curQue.Bookanswer[0].single[0],
             "userAnswerJudge",
             "[JUDGE##T##JUDGE]"
           );
         } else {
-          this.$set(
-            this.curQue.Bookanswer[0].single[0],
+          _this.$set(
+            _this.curQue.Bookanswer[0].single[0],
             "userAnswerJudge",
             "[JUDGE##F##JUDGE]"
           );
         }
       }
+      _this.$forceUpdate();
     },
     changeCheckBox() {
       let _this = this;
@@ -695,19 +697,20 @@ export default {
       let correctStr = correct.sort().toString();
       if (correct && correct.length > 0) {
         if (valueStr == correctStr) {
-          this.$set(
-            this.curQue.Bookanswer[0].checkBox[0],
+          _this.$set(
+            _this.curQue.Bookanswer[0].checkBox[0],
             "userAnswerJudge",
             "[JUDGE##T##JUDGE]"
           );
         } else {
-          this.$set(
-            this.curQue.Bookanswer[0].checkBox[0],
+          _this.$set(
+            _this.curQue.Bookanswer[0].checkBox[0],
             "userAnswerJudge",
             "[JUDGE##F##JUDGE]"
           );
         }
       }
+      _this.$forceUpdate();
     },
     playmicrophone(url, type) {
       if (url) {
@@ -756,6 +759,7 @@ export default {
           }
         }
       }
+      _this.$forceUpdate();
     },
     handleWav(list, tmIndex) {
       tmIndex = tmIndex ? tmIndex : 0;

src/components/Adult/preview/SelectTone.vue

@@ -198,6 +198,7 @@ export default {
           }
         }
       }
+      _this.$forceUpdate();
     },
     handleChangeTime(time, edTime) {
       let _this = this;

src/components/Adult/preview/SelectYinjie.vue

@@ -220,6 +220,7 @@ export default {
           }
         }
       }
+      _this.$forceUpdate();
     },
     handleClear(index) {
       let _this = this;
@@ -232,6 +233,7 @@ export default {
         "userAnswerJudge",
         userAnswerJudge
       );
+      _this.$forceUpdate();
     },
     getCurTime(curTime) {
       this.curTime = curTime * 1000;

src/components/Adult/preview/SentenceInput.vue

@@ -152,6 +152,12 @@
                 <template v-if="conent.chs.indexOf('__') > -1">
                   <!-- {{items.detail.resArr[conIndex].inputNumber}} -->
                   <EditDiv
+                    :id="
+                      'sentence_' +
+                      Math.random().toString(36).substr(2) +
+                      '_' +
+                      indexs
+                    "
                     class="input chs"
                     v-model="
                       curQue.Bookanswer[indexs].answerList[

src/components/Adult/preview/SentenceModule.vue

@@ -55,13 +55,11 @@
           :style="{ width: curQue.img_size + 'px' }"
         ></el-image>
       </div>
-      {{ curQue.sortType }}
       <div
         v-if="judgeAnswer == 'standardAnswer'"
         :class="['container', curQue.sortType == 'row' ? 'ul-flex' : '']"
       >
         <div :class="['sent-option li-flex sent-option-standardAnswer']">
-          {{ curQue.option.length }}
           <div
             :class="[
               'sent-option-items',
@@ -169,7 +167,7 @@
                       : '',
                   ]"
                   v-for="(sdItem, sdIndex) in items.detail"
-                  :key="'sent-option-items' + index + indexs + sdIndex"
+                  :key="'sent-option-items' + indexs + sdIndex"
                 >
                   <div class="sent-que-box">
                     <div
@@ -177,7 +175,7 @@
                       v-for="(sddItem, sddIndex) in sdItem.detail"
                       :key="
                         'sent-option-items' +
-                        index +
+                        
                         indexs +
                         sdIndex +
                         sddIndex
@@ -232,12 +230,7 @@
                           class="promax-box"
                           :TaskModel="TaskModel"
                           :tmIndex="sdIndex"
-                          :answerRecordList="
-                            curQue.Bookanswer[index][indexs].recordList[sdIndex]
-                          "
-                          :index="index"
-                          :indexs="indexs"
-                          @handleWav="handleWav"
+                          answerRecordList="[]"
                         />
                       </div>
                     </div>
@@ -1483,6 +1476,9 @@ export default {
       &-row {
         flex: 1;
       }
+      &-standardAnswer {
+        flex-flow: wrap;
+      }
     }
     .sent-option-items {
       width: 100%;

src/components/Adult/preview/components/JudgeTemp.vue

@@ -10,16 +10,32 @@
     :style="{ width: judgeWidth + 'px' }"
   >
     <a
-      :class="['right-btn', Bookanswer.judge == 'true' ? 'active' : '']"
+      :class="[
+        'right-btn',
+        !Isexample && TaskModel != 'ANSWER' ? 'right-btn-hover' : '',
+        judgeAnswerClass('true'),
+      ]"
       @click="changeOption('true')"
     >
-      <img src="../../../../assets/newImage/common/right-btn.png" />
     </a>
     <a
-      :class="['error-btn', Bookanswer.judge == 'false' ? 'active' : '']"
+      :class="[
+        'error-btn',
+        !Isexample && TaskModel != 'ANSWER' ? 'error-btn-hover' : '',
+        judgeAnswerClass('false'),
+      ]"
       @click="changeOption('false')"
     >
-      <img src="../../../../assets/newImage/common/error-btn.png" />
+    </a>
+    <a
+      v-if="judge_isNo"
+      :class="[
+        'unso-btn',
+        !Isexample && TaskModel != 'ANSWER' ? 'unso-btn-hover' : '',
+        judgeAnswerClass('unso'),
+      ]"
+      @click="changeOption('unso')"
+    >
     </a>
   </div>
 </template>
@@ -27,7 +43,15 @@
 <script>
 export default {
   components: {},
-  props: ["Bookanswer", "judge_isNo", "isRecord", "Isexample"],
+  props: [
+    "Bookanswer",
+    "judge_isNo",
+    "isRecord",
+    "Isexample",
+    "TaskModel",
+    "judgeCorrectAnswer",
+    "judgeAnswer",
+  ],
   data() {
     return {};
   },
@@ -40,24 +64,92 @@ export default {
       } else {
         if (!_this.judge_isNo) {
           value = 80;
+        } else {
+          value = 116;
         }
       }
       return value;
     },
+    judgeAnswerClass() {
+      return function (type) {
+        let _this = this;
+        let classname = "";
+        let answer = _this.Bookanswer.judge.correct;
+        let correct = _this.judgeCorrectAnswer;
+        if (_this.judgeAnswer == "standardAnswer") {
+          if (correct == type) {
+            classname = "userRight_" + type;
+          }
+        } else if (
+          _this.judgeAnswer == "studentAnswer" ||
+          _this.judgeAnswer == "userAnswer"
+        ) {
+          if (answer == type) {
+            if (!_this.Isexample) {
+              if (correct) {
+                if (answer == correct) {
+                  classname = "userRight_" + type;
+                } else {
+                  classname = "userError_" + type;
+                }
+              } else {
+                classname = "active_" + type;
+              }
+            } else {
+              classname = "userExample";
+            }
+          }
+        } else {
+          if (!_this.Isexample) {
+            if (answer == type) {
+              classname = "active";
+            }
+          } else {
+            if (correct && correct == type) {
+              classname = "answerExample";
+            }
+          }
+        }
+
+        return classname;
+      };
+    },
   },
   watch: {},
   //方法集合
   methods: {
     changeOption(type) {
       // debugger;
-      if (!this.Isexample) {
-        let _this = this;
-        if (_this.Bookanswer.judge == type) {
-          this.$set(_this.Bookanswer, "judge", "");
+      if (!this.Isexample && this.TaskModel != "ANSWER") {
+        this.sentenceAnswer(type);
+      }
+    },
+    //句子拆分组件判断
+    sentenceAnswer(type) {
+      let _this = this;
+      let correct = _this.judgeCorrectAnswer;
+      if (_this.Bookanswer.judge.correct == type) {
+        this.$set(_this.Bookanswer.judge, "correct", "");
+      } else {
+        this.$set(_this.Bookanswer.judge, "correct", type);
+      }
+      let answer = _this.Bookanswer.judge.correct;
+      if (correct) {
+        if (correct == answer) {
+          this.$set(
+            _this.Bookanswer.judge,
+            "userAnswerJudge",
+            "[JUDGE##T##JUDGE]"
+          );
         } else {
-          this.$set(_this.Bookanswer, "judge", type);
+          this.$set(
+            _this.Bookanswer.judge,
+            "userAnswerJudge",
+            "[JUDGE##F##JUDGE]"
+          );
         }
       }
+      this.$forceUpdate();
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
@@ -83,27 +175,78 @@ export default {
   a {
     width: 32px;
     height: 32px;
+    background: #fff url("../../../../assets/newImage/common/right-btn.png")
+      center no-repeat;
+    background-size: 24px;
     border-radius: 8px;
     border: 1px solid rgba(0, 0, 0, 0.1);
     display: flex;
     justify-content: center;
     align-items: center;
-    > img {
-      width: 24px;
-      height: 24px;
-    }
-    &:hover,
+    &.right-btn-hover:hover,
     &.active {
       background-color: #e5fff0;
       border-color: #00c850;
     }
-  }
-  a.error-btn {
-    margin-left: 4px;
-    &:hover,
-    &.active {
-      background-color: #ffe5e5;
-      border-color: #de4444;
+    &.error-btn {
+      background: #fff url("../../../../assets/newImage/common/error-btn.png")
+        center no-repeat;
+      background-size: 24px;
+      margin-left: 4px;
+      &.error-btn-hover:hover,
+      &.active {
+        background-color: #ffe5e5;
+        border-color: #de4444;
+      }
+    }
+    &.unso-btn {
+      background: #fff url("../../../../assets/newImage/common/unso-btn.png")
+        center no-repeat;
+      background-size: 18px;
+      margin-left: 4px;
+      &.unso-btn-hover:hover,
+      &.active {
+        background-color: #f1f1f1;
+        border-color: #333333;
+      }
+    }
+    &.answerExample {
+      background-color: rgba(0, 0, 0, 0.1);
+    }
+    &.userExample {
+      background-color: rgba(0, 0, 0, 0.1);
+    }
+
+    &.userRight_true {
+      background-color: rgba(44, 167, 103, 0.1);
+      border: 1px solid #2ca767;
+    }
+    &.userError_true {
+      border: 1px solid #ed342d;
+      background: rgba(237, 52, 45, 0.1)
+        url("../../../../assets/newImage/common/judge-dui.png") center no-repeat;
+      background-size: 24px;
+    }
+    &.userRight_unso {
+      border: 1px solid #2ca767;
+      background: rgba(44, 167, 103, 0.1)
+        url("../../../../assets/newImage/common/unso-btn-active.png") center
+        no-repeat;
+      background-size: 18px;
+    }
+    &.userError_unso {
+      background-color: rgba(237, 52, 45, 0.1);
+      border: 1px solid #ed342d;
+    }
+    &.userRight_false {
+      border: 1px solid #2ca767;
+      background: rgba(44, 167, 103, 0.1)
+        url("../../../../assets/newImage/common/judge-cuo.png") center no-repeat;
+      background-size: 24px;
+    }
+    &.userError_false {
+      background-color: rgba(237, 52, 45, 0.1);
+      border: 1px solid #ed342d;
     }
   }
 }

src/components/Adult/preview/components/OneSentenceTemp.vue

@@ -670,10 +670,7 @@ export default {
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
-  mounted() {
-    // console.log(this.detail);
-    console.log(this.Bookanswer);
-  },
+  mounted() {},
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
   beforeUpdate() {}, //生命周期 - 更新之前
@@ -767,6 +764,12 @@ export default {
     &-example {
       color: #ff3f3f;
     }
+    &.userRight {
+      color: #2ca767;
+    }
+    &.userError {
+      color: #ed342d;
+    }
   }
 }
 .NPC-pinyin {

src/components/Adult/preview/components/OptionTemp.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :class="['OptionComponents']">
+  <div :class="['OptionComponents', 'OptionComponents-' + judgeAnswer]">
     <ul v-if="option && items">
       <li
         v-for="(item, index) in option"
@@ -9,31 +9,88 @@
             ? 'option-left-right'
             : 'option' +
               (type == 'radio' ? items.radioNumber : items.checkboxNumber),
-          Bookanswer.radio === index || Bookanswer.checkbox.indexOf(index) != -1
-            ? 'active'
-            : '',
-          items.Isexample ? 'example' : '',
+          !items.Isexample && TaskModel != 'ANSWER' ? 'li-hover' : '',
+          singleAnswerClass(index),
+          checkBoxAnswerClass(index),
         ]"
       >
-        <template v-if="type == 'checkbox'">
-          <el-checkbox-group
-            v-model="Bookanswer.checkbox"
-            :class="
-              item.detail && item.detail.pyNumber[0] > 0 ? 'radio-hasPy' : ''
-            "
-            :disabled="TaskModel == 'ANSWER' || items.Isexample"
-          >
-            <el-checkbox
+        <template v-if="judgeAnswer == 'standardAnswer'">
+          <template v-if="type == 'checkbox'">
+            <el-checkbox-group
+              v-model="correctAnswer.checkbox"
+              :class="
+                item.detail &&
+                item.detail.pyNumber &&
+                item.detail.pyNumber[0] > 0
+                  ? 'radio-hasPy'
+                  : ''
+              "
+              :disabled="TaskModel == 'ANSWER' || items.Isexample"
+            >
+              <el-checkbox
+                :label="index"
+                :style="{
+                  'margin-right': 0,
+                  display: 'flex',
+                  'align-items': !row ? 'center' : 'center',
+                }"
+              >
+                <span
+                  class="option_number"
+                  :class="[
+                    item.hasCn ? 'option_number_hasCn' : '',
+                    item.detail.sentence ? '' : 'option_number_no',
+                  ]"
+                  v-if="item.number"
+                  >{{ item.number }}</span
+                >
+                <template v-if="item.img_list && item.img_list.length > 0">
+                  <div
+                    v-for="(itemss, indexss) in item.img_list"
+                    :key="indexss"
+                  >
+                    <img :src="itemss.id" style="width: 32px; height: 32px" />
+                  </div>
+                </template>
+                <template v-else>
+                  <div class="detail_word">
+                    <SentenceTemp
+                      :detail="item.detail"
+                      :pyPosition="curQue.pyPosition"
+                      :TaskModel="TaskModel"
+                      :pyColor="curQue.pyColor"
+                      :isInput="false"
+                      sentType="option"
+                    />
+                  </div>
+                </template>
+              </el-checkbox>
+            </el-checkbox-group>
+          </template>
+          <template v-else>
+            <el-radio
+              v-model="correctAnswer.radio"
               :label="index"
-              :style="{
-                'margin-right': 0,
-                display: 'flex',
-                'align-items': !row ? 'center' : 'flex-start',
-              }"
+              style="margin-right: 0; display: flex; align-items: center"
+              :class="[
+                item.detail &&
+                item.detail.pyNumber &&
+                item.detail.pyNumber[0] > 0
+                  ? 'radio-hasPy'
+                  : '',
+              ]"
+              :disabled="true"
+              @input="changeSingle"
             >
-              <span class="option_number" v-if="item.number">{{
-                item.number
-              }}</span>
+              <span
+                class="option_number"
+                :class="[
+                  item.hasCn ? 'option_number_hasCn' : '',
+                  item.detail.sentence ? '' : 'option_number_no',
+                ]"
+                v-if="item.number"
+                >{{ item.number }}</span
+              >
               <template v-if="item.img_list && item.img_list.length > 0">
                 <div v-for="(itemss, indexss) in item.img_list" :key="indexss">
                   <img :src="itemss.id" style="width: 32px; height: 32px" />
@@ -51,40 +108,106 @@
                   />
                 </div>
               </template>
-            </el-checkbox>
-          </el-checkbox-group>
+            </el-radio>
+          </template>
         </template>
         <template v-else>
-          <el-radio
-            v-model="Bookanswer.radio"
-            :label="index"
-            style="margin-right: 0; display: flex; align-items: flex-start"
-            :class="
-              item.detail && item.detail.pyNumber[0] > 0 ? 'radio-hasPy' : ''
-            "
-            :disabled="TaskModel == 'ANSWER' || items.Isexample"
-          >
-            <span class="option_number" v-if="item.number">{{
-              item.number
-            }}</span>
-            <template v-if="item.img_list && item.img_list.length > 0">
-              <div v-for="(itemss, indexss) in item.img_list" :key="indexss">
-                <img :src="itemss.id" style="width: 32px; height: 32px" />
-              </div>
-            </template>
-            <template v-else>
-              <div class="detail_word">
-                <SentenceTemp
-                  :detail="item.detail"
-                  :pyPosition="curQue.pyPosition"
-                  :TaskModel="TaskModel"
-                  :pyColor="curQue.pyColor"
-                  :isInput="false"
-                  sentType="option"
-                />
-              </div>
-            </template>
-          </el-radio>
+          <template v-if="type == 'checkbox'">
+            <el-checkbox-group
+              v-model="Bookanswer.checkbox.correct"
+              :class="
+                item.detail &&
+                item.detail.pyNumber &&
+                item.detail.pyNumber[0] > 0
+                  ? 'radio-hasPy'
+                  : ''
+              "
+              :disabled="TaskModel == 'ANSWER' || items.Isexample"
+              @change="changeCheckBox"
+            >
+              <el-checkbox
+                :label="index"
+                :style="{
+                  'margin-right': 0,
+                  display: 'flex',
+                  'align-items': !row ? 'center' : 'center',
+                }"
+              >
+                <span
+                  class="option_number"
+                  :class="[
+                    item.hasCn ? 'option_number_hasCn' : '',
+                    item.detail.sentence ? '' : 'option_number_no',
+                  ]"
+                  v-if="item.number"
+                  >{{ item.number }}</span
+                >
+                <template v-if="item.img_list && item.img_list.length > 0">
+                  <div
+                    v-for="(itemss, indexss) in item.img_list"
+                    :key="indexss"
+                  >
+                    <img :src="itemss.id" style="width: 32px; height: 32px" />
+                  </div>
+                </template>
+                <template v-else>
+                  <div class="detail_word">
+                    <SentenceTemp
+                      :detail="item.detail"
+                      :pyPosition="curQue.pyPosition"
+                      :TaskModel="TaskModel"
+                      :pyColor="curQue.pyColor"
+                      :isInput="false"
+                      sentType="option"
+                    />
+                  </div>
+                </template>
+              </el-checkbox>
+            </el-checkbox-group>
+          </template>
+          <template v-else>
+            <el-radio
+              v-model="Bookanswer.radio.correct"
+              :label="index"
+              style="margin-right: 0; display: flex; align-items: center"
+              :class="[
+                item.detail &&
+                item.detail.pyNumber &&
+                item.detail.pyNumber[0] > 0
+                  ? 'radio-hasPy'
+                  : '',
+              ]"
+              :disabled="TaskModel == 'ANSWER' || items.Isexample"
+              @input="changeSingle"
+            >
+              <span
+                class="option_number"
+                :class="[
+                  item.hasCn ? 'option_number_hasCn' : '',
+                  item.detail.sentence ? '' : 'option_number_no',
+                ]"
+                v-if="item.number"
+                >{{ item.number }}</span
+              >
+              <template v-if="item.img_list && item.img_list.length > 0">
+                <div v-for="(itemss, indexss) in item.img_list" :key="indexss">
+                  <img :src="itemss.id" style="width: 32px; height: 32px" />
+                </div>
+              </template>
+              <template v-else>
+                <div class="detail_word">
+                  <SentenceTemp
+                    :detail="item.detail"
+                    :pyPosition="curQue.pyPosition"
+                    :TaskModel="TaskModel"
+                    :pyColor="curQue.pyColor"
+                    :isInput="false"
+                    sentType="option"
+                  />
+                </div>
+              </template>
+            </el-radio>
+          </template>
         </template>
       </li>
     </ul>
@@ -110,17 +233,163 @@ export default {
     "type",
     "curQue",
     "items",
+    "judgeAnswer",
+    "correctAnswer",
   ],
   data() {
     //这里存放数据
     return {};
   },
   //计算属性 类似于data概念
-  computed: {},
+  computed: {
+    singleAnswerClass() {
+      return function (index) {
+        let _this = this;
+        let classname = "";
+        if (_this.type == "radio") {
+          let answer = _this.Bookanswer.radio.correct;
+          let correct = _this.correctAnswer.radio;
+          if (_this.judgeAnswer == "standardAnswer") {
+            if ((correct || correct === 0) && index === correct) {
+              classname = "userRight";
+            }
+          } else if (
+            _this.judgeAnswer == "studentAnswer" ||
+            _this.judgeAnswer == "userAnswer"
+          ) {
+            if (!_this.items.Isexample) {
+              if (correct || correct === 0) {
+                if (answer === correct) {
+                  if (correct === index) {
+                    classname = "userRight";
+                  }
+                } else {
+                  if (answer === index) {
+                    classname = "userError";
+                  }
+                }
+              }
+            } else {
+              if (correct === index) {
+                classname = "example";
+              }
+            }
+          } else {
+            if (!_this.items.Isexample) {
+              if (answer === index) {
+                classname = "active";
+              }
+            } else {
+              if (correct === index) {
+                classname = "example";
+              }
+            }
+          }
+        }
+        return classname;
+      };
+    },
+    checkBoxAnswerClass() {
+      return function (index) {
+        let _this = this;
+        let classname = "";
+        if (_this.type == "checkbox") {
+          let answer = _this.Bookanswer.checkbox.correct;
+          let correct = _this.correctAnswer.checkbox;
+          if (_this.judgeAnswer == "standardAnswer") {
+            if (correct && correct.length > 0) {
+              if (correct.indexOf(index) > -1) {
+                classname = "userRight";
+              }
+            }
+          } else if (
+            _this.judgeAnswer == "studentAnswer" ||
+            _this.judgeAnswer == "userAnswer"
+          ) {
+            if (!_this.items.Isexample) {
+              if (correct && correct.length > 0) {
+                if (correct.indexOf(index) > -1 && answer.indexOf(index) > -1) {
+                  classname = "userRight";
+                } else if (
+                  answer.indexOf(index) > -1 &&
+                  correct.indexOf(index) < 0
+                ) {
+                  classname = "userError";
+                }
+              }
+            } else {
+              if (correct.indexOf(index) > -1) {
+                classname = "example";
+              }
+            }
+          } else {
+            if (!_this.items.Isexample) {
+              if (answer.indexOf(index) > -1) {
+                classname = "active";
+              }
+            } else {
+              if (
+                correct &&
+                correct.length > 0 &&
+                correct.indexOf(index) > -1
+              ) {
+                classname = "example";
+              }
+            }
+          }
+        }
+        return classname;
+      };
+    },
+  },
   //监控data中数据变化
   watch: {},
   //方法集合
-  methods: {},
+  methods: {
+    changeSingle(value) {
+      let _this = this;
+      let correct = _this.correctAnswer.radio;
+      if (correct || correct === 0) {
+        if (value == correct) {
+          _this.$set(
+            _this.Bookanswer.radio,
+            "userAnswerJudge",
+            "[JUDGE##T##JUDGE]"
+          );
+        } else {
+          _this.$set(
+            _this.Bookanswer.radio,
+            "userAnswerJudge",
+            "[JUDGE##F##JUDGE]"
+          );
+        }
+      }
+      _this.$forceUpdate();
+    },
+    changeCheckBox() {
+      let _this = this;
+      let value = _this.Bookanswer.checkbox.correct;
+      let valueStr = value.sort().toString();
+      let correct = _this.correctAnswer.checkbox;
+      let correctStr = correct.sort().toString();
+      if (correct && correct.length > 0) {
+        if (valueStr == correctStr) {
+          _this.$set(
+            _this.Bookanswer.checkbox,
+            "userAnswerJudge",
+            "[JUDGE##T##JUDGE]"
+          );
+        } else {
+          _this.$set(
+            _this.Bookanswer.checkbox,
+            "userAnswerJudge",
+            "[JUDGE##F##JUDGE]"
+          );
+        }
+      }
+      _this.$forceUpdate();
+    },
+  },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
@@ -158,14 +427,17 @@ ul {
     padding: 1px 16px 1px 0;
     border-radius: 4px;
     box-sizing: border-box;
-    &:hover {
+    &.li-hover:hover {
       background: #ececec;
     }
     &.active {
       // background: #fff;
-    //   background: rgba(157, 202, 255, 0.15);
+      //   background: rgba(157, 202, 255, 0.15);
       border-radius: 4px;
     }
+    &.example {
+      background: #ececec;
+    }
     &.option1 {
       width: 100%;
       margin-bottom: 8px;
@@ -188,6 +460,16 @@ ul {
     &.option-left-right {
       padding: 1px 16px;
     }
+    &.userRight {
+      background: rgba(44, 167, 103, 0.1);
+      border: 1px solid #2ca767;
+      border-radius: 4px;
+    }
+    &.userError {
+      background: rgba(237, 52, 45, 0.1);
+      border: 1px solid #ed342d;
+      border-radius: 4px;
+    }
     .el-radio {
       width: 100%;
     }
@@ -284,6 +566,9 @@ ul {
     height: 16px;
     margin-top: 12px;
   }
+  .el-checkbox__inner {
+    margin-top: 4px;
+  }
   .radio-hasPy {
     .el-radio__inner {
       margin-top: 24px;

src/components/Adult/preview/components/SentenceTemp.vue

@@ -88,6 +88,12 @@
                   <template v-if="isInput">
                     <!-- [optionIndex][optionItemIndex] -->
                     <EditDiv
+                      :id="
+                        'sentenceTemp_' +
+                        Math.random().toString(36).substr(2) +
+                        '_' +
+                        index
+                      "
                       class="answer-input"
                       :class="[Isexample ? 'answer-input-example' : '']"
                       v-model="Bookanswer.completeInput[pItem.hengIndex]"
@@ -288,6 +294,12 @@
                 <template v-if="isInput">
                   <!-- [optionIndex][optionItemIndex] -->
                   <EditDiv
+                    :id="
+                      'sentenceTemp_' +
+                      Math.random().toString(36).substr(2) +
+                      '_' +
+                      index
+                    "
                     class="answer-input"
                     :class="[Isexample ? 'answer-input-example' : '']"
                     v-model="Bookanswer.completeInput[pItem.hengIndex]"

src/components/Adult/preview/components/ShortInputTemp.vue

@@ -1,30 +1,49 @@
 <!--  -->
 <template>
-  <div class="short-input-temp">
+  <div class="short-input-temp" :class="['short-input-temp-' + judgeAnswer]">
     <div
       :class="['short-option', index > 0 ? 'short-option-margin' : '']"
       v-for="(item, index) in doubleInput"
       :key="'short-input-temp' + index"
     >
       <span class="short-notice" v-if="item.notice">{{ item.notice }}</span>
-      <EditDiv
-        :class="[
-          'answer-input',
-          Bookanswer.Isexample ? 'answer-input-example' : '',
-          is_short_auto ? 'answer-input-auto' : '',
-        ]"
-        v-model="Bookanswer.doubleInput[index].correct"
-        :canEdit="Bookanswer.Isexample || TaskModel == 'ANSWER' ? false : true"
-      />
-      <!-- <input
-        placeholder="输入"
-        :class="[
-          'answer-input',
-          Bookanswer.Isexample ? 'answer-input-example' : '',
-        ]"
-        v-model="Bookanswer.doubleInput[index].correct"
-        :readonly="Bookanswer.Isexample || TaskModel == 'ANSWER' ? true : false"
-      /> -->
+      <template v-if="judgeAnswer == 'standardAnswer'">
+        <EditDiv
+          :id="'sentence_' + Math.random().toString(36).substr(2) + '_' + index"
+          :class="[
+            'answer-input',
+            is_short_auto ? 'answer-input-auto' : '',
+            'userRight',
+          ]"
+          v-model="item.correct"
+          :canEdit="false"
+          textAlign="center"
+        />
+      </template>
+      <template v-else>
+        <EditDiv
+          :id="'sentence_' + Math.random().toString(36).substr(2) + '_' + index"
+          :class="[
+            'answer-input',
+            is_short_auto ? 'answer-input-auto' : '',
+            Bookanswer.Isexample ? 'answer-input-example' : '',
+            item.correct &&
+            item.correct == Bookanswer.doubleInput[index].correct
+              ? 'userRight'
+              : item.correct &&
+                item.correct != Bookanswer.doubleInput[index].correct
+              ? 'userError'
+              : '',
+          ]"
+          v-model="Bookanswer.doubleInput[index].correct"
+          :canEdit="
+            Bookanswer.Isexample || TaskModel == 'ANSWER' ? false : true
+          "
+          textAlign="center"
+          @saveBlankTF="saveBlankTF"
+          :hengIndex="index"
+        />
+      </template>
     </div>
   </div>
 </template>
@@ -35,14 +54,41 @@ export default {
   components: {
     EditDiv,
   },
-  props: ["doubleInput", "Bookanswer", "TaskModel", "is_short_auto"],
+  props: [
+    "doubleInput",
+    "Bookanswer",
+    "TaskModel",
+    "is_short_auto",
+    "judgeAnswer",
+  ],
   data() {
     return {};
   },
   computed: {},
   watch: {},
   //方法集合
-  methods: {},
+  methods: {
+    saveBlankTF(value, hengIndex) {
+      let _this = this;
+      let correct = _this.doubleInput[hengIndex].correct;
+      let answer = _this.Bookanswer.doubleInput[hengIndex].correct;
+      if (correct || correct == "0") {
+        if (correct == answer) {
+          _this.$set(
+            _this.Bookanswer.doubleInput[hengIndex],
+            "userAnswerJudge",
+            "[JUDGE##T##JUDGE]"
+          );
+        } else {
+          _this.$set(
+            _this.Bookanswer.doubleInput[hengIndex],
+            "userAnswerJudge",
+            "[JUDGE##F##JUDGE]"
+          );
+        }
+      }
+    },
+  },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
@@ -105,5 +151,20 @@ export default {
       flex: 1;
     }
   }
+  &-userAnswer,
+  &-standardAnswer,
+  &-studentAnswer {
+    .answer-input {
+      &.userRight {
+        color: #2ca767;
+      }
+      &.userError {
+        color: #ed342d;
+      }
+      &-example.userRight {
+        color: rgba(0, 0, 0, 0.5);
+      }
+    }
+  }
 }
 </style>