From f4bfea700a57d71a9c30315387a77650af13858c Mon Sep 17 00:00:00 2001
From: user1 <10901603+no-distractions1@user.noreply.gitee.com>
Date: 星期五, 14 六月 2024 18:10:22 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout

---
 src/components/examinations/index.vue |  173 ++++++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 128 insertions(+), 45 deletions(-)

diff --git a/src/components/examinations/index.vue b/src/components/examinations/index.vue
index 6b36a86..5986ef3 100644
--- a/src/components/examinations/index.vue
+++ b/src/components/examinations/index.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="examination" v-loading="!cardList.length">
+  <div class="examination" v-loading="loading">
     <div
-      v-for="(item, nindex) in cardList"
+      v-for="(item, nindex) in cardData"
       :key="nindex"
       class="border-box"
       v-show="item.infoList.length"
@@ -68,7 +68,10 @@
                   v-for="(itemText, indexText) in value.stem"
                   :key="indexText"
                 >
-                  <span v-if="typeof itemText == 'string'">{{ itemText }}</span>
+                  <span
+                    v-if="typeof itemText == 'string'"
+                    v-html="itemText"
+                  ></span>
                   <!-- &nbsp; -->
                   <el-input
                     v-else
@@ -88,6 +91,7 @@
                 v-cloak
               ></p>
             </div>
+            <img :src="value.isCollect ? isHeart : heart" alt="" class="collect-png" @click="handleCollect(nindex,index)" >
             <!-- 鏀惰棌 -->
           </div>
           <div class="questionContent">
@@ -124,7 +128,14 @@
                     :src="getPublicImage(content.img, 115)"
                     v-show="content.img"
                     :preview-src-list="[getPublicImage(content.img)]"
+                    v-if="isReal"
                   ></el-image>
+                  <img
+                    :src="content.img"
+                    alt=""
+                    v-if="!isReal"
+                    class="radio-img"
+                  />
                 </p>
                 <p
                   class="optionContent"
@@ -211,7 +222,6 @@
             "
           ></TEditorVue> -->
             <el-input
-              @input="textChange($event,nindex,value.id)"
               :disabled="value.isComplete"
               style="width: 94%; margin: 0 auto"
               v-else-if="value.questionType == 'shortAnswer'"
@@ -279,6 +289,46 @@
                           disabled-void-color="#949494"
                         />
                       </p>
+                      <!-- 姝g‘閿欒鍥炬爣 -->
+                      <span class="mr-10">
+                        <svg
+                        v-if="value.isRight"
+                        t="1716986419862"
+                        class="icon"
+                        viewBox="0 0 1820 1024"
+                        version="1.1"
+                        xmlns="http://www.w3.org/2000/svg"
+                        p-id="18767"
+                        xmlns:xlink="http://www.w3.org/1999/xlink"
+                        width="40"
+                        height="20"
+                      >
+                        <path
+                          d="M1439.374222 216.007111s-169.472 56.490667-367.179852 282.443852C888.604444 703.222519 846.241185 787.949037 775.632593 900.93037 768.568889 893.866667 662.651259 689.095111 380.207407 540.814222l148.290371-141.226666s134.162963 91.790222 225.953185 261.262222c0 0 233.016889-360.116148 684.923259-536.642371v91.799704z m0 0"
+                          fill="#1AFA29"
+                          p-id="18768"
+                        ></path>
+                      </svg>
+                      <svg
+                        v-if="value.isRight == false"
+                        t="1716987085767"
+                        class="icon"
+                        viewBox="0 0 1024 1024"
+                        version="1.1"
+                        xmlns="http://www.w3.org/2000/svg"
+                        p-id="25745"
+                        xmlns:xlink="http://www.w3.org/1999/xlink"
+                        width="20"
+                        height="20"
+                      >
+                        <path
+                          d="M116.579135 38.64349531L38.703935 103.74399781c138.82075969 102.96027281 268.24660875 221.31426938 381.68489719 339.96758156C246.29374906 618.40145938 109.95003031 790.19602344 38.10817906 859.25288281l148.35573469 123.62658094c52.61360812-108.17625656 167.23381594-272.86683656 320.56281844-445.01635875 153.50744156 173.21056312 268.36844625 338.43166313 321.38977781 447.49243969 0 0 144.5682225-152.96636906 157.47435281-129.29729625-55.80632344-62.49011156-191.37776625-244.16501625-374.17990593-430.27403438 104.68422375-107.1132975 222.15274031-213.10127719 347.60304468-306.24740437L925.17746562 56.03842156C782.85412063 126.51895625 647.69328031 231.09093594 526.07845437 342.39755 403.34886594 226.82662719 264.46095125 116.16373719 116.579135 38.64349531L116.579135 38.64349531zM116.579135 38.64349531"
+                          fill="#d81e06"
+                          p-id="25746"
+                        ></path>
+                      </svg>
+                      </span>
+
                       <div class="headerConent sitgBox">
                         <p v-if="!value.isUnfold">
                           <span class="analysisColor">灞曞紑瑙f瀽</span
@@ -324,7 +374,7 @@
                     ></p>
                   </div>
                   <!-- 瑙f瀽 -->
-                  <div class="referBox">
+                  <div class="referBox" v-if="value.analysisCon">
                     <span>瑙f瀽锛�</span>
                     <p
                       v-if="value.analysisCon"
@@ -403,17 +453,19 @@
       </ul>
     </div>
     <div class="bottom-btn" v-if="!loading">
-      <el-button class="btn-box" @click="saveAnswer">淇濆瓨</el-button>
+      <el-button class="examinations-btn-box" @click="saveAnswer"
+        >淇濆瓨</el-button
+      >
       <el-button
         @click="handleQuestion"
-        class="btn-box"
+        class="examinations-btn-box"
         :style="{ borderColor: primaryColor }"
         >鎻愪氦</el-button
       >
-      <el-button @click="redo" class="btn-box">閲嶅仛</el-button>
+      <el-button @click="redo" class="examinations-btn-box">閲嶅仛</el-button>
       <el-button
         @click="openAnswers"
-        class="btn-box"
+        class="examinations-btn-box"
         :style="{ borderColor: primaryColor }"
         >鏌ョ湅绛旀</el-button
       >
@@ -422,12 +474,12 @@
 </template>
 
 <script>
+import { Message } from 'element-ui';
 export default {
   name: "examination-option",
   props: {
     cardList: {
       type: Array,
-      default: [],
     },
     primaryColor: {
       type: String,
@@ -439,19 +491,37 @@
     page: {
       type: Number,
     },
+    isReal: {
+      type: Boolean,
+      default: true,
+    },
   },
   data() {
     return {
       type: "option",
       loading: false,
+      cardData: [],
+      loading: true,
+      heart:require("@/assets/images/heart.png"),
+      isHeart:require("@/assets/images/heart-check.png"),
     };
   },
-  inject:['changeQuestionData'],
-  mounted() {},
-  computed:{
-    cardLists() {
-      return this.props.cardList
-    }
+  watch: {
+    cardList: {
+      handler(newVal) {
+        this.cardData = this.cardList;
+        if (newVal && newVal.length) {
+          this.loading = false;
+        }
+      },
+      immediate: true,
+      deep: true,
+    },
+  },
+  mounted() {
+    // this.cardData = this.cardList
+    // console.log('this.cardList',this.cardList);
+    // console.log('this.cardData',this.cardData);
   },
   methods: {
     // 鏁扮粍杞负瀛楃涓叉柟娉�
@@ -486,20 +556,19 @@
       }
     },
     redo() {
-      for (let index = 0; index < this.cardList.length; index++) {
-        const item = this.cardList[index];
+      for (let index = 0; index < this.cardData.length; index++) {
+        const item = this.cardData[index];
         for (let cindex = 0; cindex < item.infoList.length; cindex++) {
           const citem = item.infoList[cindex];
           citem.userAnswer = "";
           citem.isComplete = false;
         }
       }
-      console.log('閲嶅仛',this.cardList);
     },
     openAnswers() {
       this.$data.loading = true;
-      for (let index = 0; index < this.cardList.length; index++) {
-        const item = this.cardList[index];
+      for (let index = 0; index < this.cardData.length; index++) {
+        const item = this.cardData[index];
         for (let cindex = 0; cindex < item.infoList.length; cindex++) {
           const citem = item.infoList[cindex];
           citem.isComplete = true;
@@ -512,7 +581,7 @@
     },
     // 鎵规敼棰樼洰  (缁冧範,鎴戠殑鍋氶,鎴戠殑鏀惰棌妯″紡涓�)
     handleQuestion() {
-      const list = this.$props.cardList;
+      const list = this.cardData;
       for (let index = 0; index < list.length; index++) {
         const item = list[index];
         for (let cindex = 0; cindex < item.infoList.length; cindex++) {
@@ -557,8 +626,8 @@
           }
         }
       }
-      this.$props.cardList = list;
-      console.log(this.$props.cardList);
+      this.cardData = list;
+      console.log(this.cardData);
     },
     getParentWithClass(element, className) {
       while (element.parentElement) {
@@ -569,21 +638,19 @@
       }
     },
     // 淇濆瓨鎸夐挳
-    saveAnswer() {
-      const element = document.getElementsByClassName("examination")[0];
-      if (element) {
+    saveAnswer(e) {
+      if (e.srcElement) {
         const pageNum = this.getParentWithClass(
-          element,
+          e.srcElement,
           "page-box"
         ).getAttribute("page");
-        console.log(this.config.activeBook.name, pageNum);
         const oldAnswerData = localStorage.getItem(
           this.config.activeBook.name + "oldAnswerData"
         );
         let oldData = oldAnswerData ? JSON.parse(oldAnswerData) : {};
         const asnwerList = [];
-        for (let index = 0; index < this.$props.cardList.length; index++) {
-          const item = this.$props.cardList[index];
+        for (let index = 0; index < this.cardData.length; index++) {
+          const item = this.cardData[index];
           for (let cindex = 0; cindex < item.infoList.length; cindex++) {
             const citem = item.infoList[cindex];
             asnwerList.push({
@@ -592,12 +659,20 @@
             });
           }
         }
-        if(oldData[pageNum]) {
-          oldData[pageNum].push(asnwerList)
+        if (oldData[pageNum]) {
+          oldData[pageNum] = oldData[pageNum].filter(
+            (citem) =>
+              asnwerList.findIndex((ditem) => ditem.id == citem.id) == -1
+          );
+          oldData[pageNum].push(...asnwerList);
         } else {
-          oldData[pageNum] = asnwerList
+          oldData[pageNum] = asnwerList;
         }
-        localStorage.setItem(this.config.activeBook.name + "oldAnswerData", JSON.stringify(oldData));
+        localStorage.setItem(
+          this.config.activeBook.name + "oldAnswerData",
+          JSON.stringify(oldData)
+        );
+        Message.success('淇濆瓨鎴愬姛')
       }
 
       // if(oldData[this.chapter]) {
@@ -607,12 +682,10 @@
       //   oldData[this.chapter][this.page] = asnwerList
       // }
       // console.log(oldData);
-      
     },
-    textChange(value,a,b) {
-      console.log('杈撳叆',value,a,b);
-      console.log(this.cardList);
-      this.changeQuestionData(9,this.cardList)
+    handleCollect(infoNum,num) {
+      console.log(this.cardData[infoNum].infoList[num]      );
+      this.cardData[infoNum].infoList[num].isCollect = !this.cardData[infoNum].infoList[num].isCollect
     }
   },
 };
@@ -620,19 +693,19 @@
 
 <style lang="less" scoped>
 .catalogName {
-  // color: #00aeef;
-  // color: #ff6c00;
   text-indent: 1em !important;
   font-size: 16px;
 }
 .examination {
-  margin-top: 20px;
   min-height: 100px;
   ul {
     list-style: none;
   }
+  p {
+    margin: 0;
+  }
 }
-.btn-box {
+.examinations-btn-box {
   height: 30px;
   width: 78px;
   padding: 4px 10px;
@@ -838,6 +911,7 @@
       height: 100%;
       display: flex;
       justify-content: space-between;
+      align-items: center;
       flex-wrap: wrap;
       .headerConent {
         height: 100%;
@@ -874,7 +948,7 @@
         .error {
           display: flex;
           text-align: left;
-          width: 180px;
+          width: 170px;
           color: #ee1818;
           span {
             height: min-content;
@@ -1129,4 +1203,13 @@
     margin-top: 10px;
   }
 }
+.radio-img {
+  width: 200px;
+  object-fit: contain;
+}
+.collect-png {
+  cursor: pointer;
+  width: 18px;
+  object-fit: contain;
+}
 </style>

--
Gitblit v1.9.1