From 870e0b3c8361cfa8af3facf67b08f1f5be66252a Mon Sep 17 00:00:00 2001 From: user1 <10901603+no-distractions1@user.noreply.gitee.com> Date: 星期四, 13 六月 2024 10:13:49 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout --- src/components/examinations/index.vue | 134 ++++++++++++++++++++++++++++++-------------- 1 files changed, 90 insertions(+), 44 deletions(-) diff --git a/src/components/examinations/index.vue b/src/components/examinations/index.vue index e1dc40a..23b1a5f 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" @@ -124,7 +124,9 @@ :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" @@ -402,17 +404,17 @@ </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 > @@ -421,14 +423,11 @@ </template> <script> -import { getPublicImage } from "@/assets/js/middleGround/tool"; export default { name: "examination-option", - // props: ["cardList"], props: { cardList: { type: Array, - default:[] }, primaryColor: { type: String, @@ -440,14 +439,38 @@ page: { type: Number, }, + isReal:{ + type:Boolean, + default:true + } }, data() { return { type: "option", loading: false, + cardData:[], + loading:true, + }; }, - mounted() {}, + watch:{ + cardList:{ + handler(newVal) { + console.log('11',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: { // 鏁扮粍杞负瀛楃涓叉柟娉� arrayToString(data) { @@ -481,24 +504,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; } } - // for (let index = 0; index < this.questionList.length; index++) { - // const item = this.questionList[index]; - // item.userAnswer = ""; - // item.isComplete = false - // } }, 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; @@ -511,7 +529,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++) { @@ -556,37 +574,61 @@ } } } - this.$props.cardList = list; - console.log(this.$props.cardList); + this.cardData = list; + console.log(this.cardData); + }, + getParentWithClass(element, className) { + while (element.parentElement) { + element = element.parentElement; + if (element.classList.contains(className)) { + return element; + } + } }, // 淇濆瓨鎸夐挳 saveAnswer() { - console.log(this.cardList); - const oldAnswerData = localStorage.getItem("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 cindex = 0; cindex < item.infoList.length; cindex++) { - const citem = item.infoList[cindex]; - asnwerList.push({ - id: citem.id, - userAnswer: citem.userAnswer, - }); + const element = (this.container ? this.container : document + ).querySelector(".examination"); + if (element) { + const pageNum = this.getParentWithClass( + element, + "page-box" + ).getAttribute("page"); + const oldAnswerData = localStorage.getItem( + this.config.activeBook.name + "oldAnswerData" + ); + let oldData = oldAnswerData ? JSON.parse(oldAnswerData) : {}; + const asnwerList = []; + 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({ + id: citem.id, + userAnswer: citem.userAnswer, + }); + } } + 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 + } + localStorage.setItem(this.config.activeBook.name + "oldAnswerData", JSON.stringify(oldData)); } - if(oldData[this.chapter]) { - oldData[this.chapter][this.page] = asnwerList - } else { - oldData[this.chapter] = {} - oldData[this.chapter][this.page] = asnwerList - } - console.log(oldData); - localStorage.setItem("oldAnswerData", JSON.stringify(oldData)); + + // if(oldData[this.chapter]) { + // oldData[this.chapter][this.page] = asnwerList + // } else { + // oldData[this.chapter] = {} + // oldData[this.chapter][this.page] = asnwerList + // } + // console.log(oldData); + }, }, }; - </script> <style lang="less" scoped> @@ -603,7 +645,7 @@ list-style: none; } } -.btn-box { +.examinations-btn-box { height: 30px; width: 78px; padding: 4px 10px; @@ -1100,4 +1142,8 @@ margin-top: 10px; } } +.radio-img { + width: 200px; + object-fit: contain; +} </style> -- Gitblit v1.9.1