From e81c27ae4f00a107b1bf67062c9f008686a8e19f Mon Sep 17 00:00:00 2001 From: 闫增涛 <1829501689@qq.com> Date: 星期六, 12 十月 2024 13:06:03 +0800 Subject: [PATCH] 数学 --- src/components/examinations/index.vue | 759 +++++++++++++++++++++++++++++++++++---------------------- 1 files changed, 464 insertions(+), 295 deletions(-) diff --git a/src/components/examinations/index.vue b/src/components/examinations/index.vue index 6b36a86..ded0303 100644 --- a/src/components/examinations/index.vue +++ b/src/components/examinations/index.vue @@ -1,11 +1,6 @@ <template> - <div class="examination" v-loading="!cardList.length"> - <div - v-for="(item, nindex) in cardList" - :key="nindex" - class="border-box" - v-show="item.infoList.length" - > + <div class="examination" v-loading="loading"> + <div v-for="(item, nindex) in cardData" :key="nindex + 'item'" class="border-box" v-show="item.infoList.length"> <p class="catalogName" :style="{ color: primaryColor }"> <span v-if="nindex == 0">涓�銆�</span> <span v-if="nindex == 1">浜屻��</span> @@ -15,187 +10,105 @@ <span>{{ item.catalogName }}</span> </p> <ul> - <li - v-for="(value, index) in item.infoList" - :key="value.id" - :id="'listItem-' + value.id" - > + <li v-for="(value, index) in item.infoList" :key="index + 'value'" :id="'listItem-' + value.id"> <!-- 鏍囬 --> <div class="questionTitle"> <div class="titleContent"> - <span - class="questionNum" - :style="{ - marginTop: value.questionType == 'completion' ? '12px' : '0', - }" - >{{ index + 1 }}. + <span class="questionNum" :style="{ + marginTop: value.questionType == 'completion' ? '12px' : '0', + }">{{ index + 1 }}. </span> <!-- 鍚姏杩涘害鏉� --> <!-- <answerAudioPlayer :audioUrl="value.src" v-show="item.name == '鍚姏棰�'" /> --> <!-- 棰樺共 --> <!-- 浠呮枃瀛� --> - <p - class="titleText" - v-if=" - value.stemStyle == 'Txt' && value.questionType != 'completion' - " - :id="value.id" - > - {{ value.stem.stemTxt }} + <p class="titleText" v-if=" + value.stemStyle == 'Txt' && value.questionType != 'completion' + " :id="value.id"> + <span v-html="value.stem.stemTxt"></span> + <!-- {{ value.stem.stemTxt }} --> </p> <!-- 浠呭浘鐗� --> - <el-image - class="stemImg" - v-else-if="value.stemStyle == 'Image'" + <el-image class="stemImg" v-else-if="value.stemStyle == 'Image'" :src="getPublicImage(value.stem.stemImage, 150)" - :preview-src-list="[getPublicImage(value.stem.stemImage)]" - ></el-image> + :preview-src-list="[getPublicImage(value.stem.stemImage)]"></el-image> <!-- 鏂囧瓧鍔犲浘鐗� --> - <p - class="stemTxtAndImage titleText" - v-else-if="value.stemStyle == 'TxtAndImage'" - > - <span> {{ value.stem.stemTxt }}</span> - <el-image - :src="getPublicImage(value.stem.stemImage, 150)" - :preview-src-list="[getPublicImage(value.stem.stemImage)]" - style="margin-left: 10px" - ></el-image> + <p class="stemTxtAndImage titleText" v-else-if="value.stemStyle == 'TxtAndImage'"> + <span v-html="value.stem.stemTxt"> <!-- {{ value.stem.stemTxt }} --> </span> + <el-image :src="getPublicImage(value.stem.stemImage, 150)" + :preview-src-list="[getPublicImage(value.stem.stemImage)]" style="margin-left: 10px"></el-image> </p> <!-- 濉┖棰橀骞� --> <p class="titleText" v-if="value.questionType == 'completion'"> - <span - v-for="(itemText, indexText) in value.stem" - :key="indexText" - > - <span v-if="typeof itemText == 'string'">{{ itemText }}</span> + <span v-for="(itemText, indexText) in value.stem" :key="indexText + 'questionType'"> + <span v-if="typeof itemText == 'string'" v-html="itemText"></span> <!-- --> - <el-input - v-else - type="text" - class="input" - v-model.trim="value.userAnswer[itemText.num]" - :disabled="value.isComplete" - /> + <input v-else type="text" class="input" v-model.trim="value.userAnswer[itemText.num]" + :disabled="value.isComplete" :style="{ backgroundColor: inputBc }" /> <!-- --> </span> </p> <!-- 瀵屾枃鏈� --> - <p - class="titleText titleTextArea" - v-else-if="value.stemStyle == 'RichText'" - v-html="value.stem.stemTxt" - v-cloak - ></p> + <p class="titleText titleTextArea" v-else-if="value.stemStyle == 'RichText'" v-html="value.stem.stemTxt" + v-cloak></p> </div> + <img :src="value.isCollect ? isHeart : heart" alt="" class="collect-png" @click="setCollect(nindex, index)" + v-if="!(hideCollect && value.questionType == 'shortAnswer')" /> <!-- 鏀惰棌 --> </div> <div class="questionContent"> <!-- 鍗曢�� --> - <el-radio-group - :disabled="value.isComplete" - class="option" - v-if=" - value.questionType == 'singleChoice' || - value.questionType == 'judge' - " - v-model="value.userAnswer" - > - <el-radio - v-for="content in value.option" - :key="content.value" - :label="content.value" - :class=" - value.optionStyle == 'Image' || - value.optionStyle == 'TxtAndImage' || - value.optionStyle == 'RichText' - ? 'optionImg' - : 'optionTxt' - " - > + <el-radio-group :disabled="value.isComplete" class="option" v-if=" + value.questionType == 'singleChoice' || + value.questionType == 'judge' + " v-model="value.userAnswer"> + <el-radio v-for="(content,contentIndex) in value.option" :key="contentIndex + 'contentIndex'" :label="content.value" :class="value.optionStyle == 'Image' || + value.optionStyle == 'TxtAndImage' || + value.optionStyle == 'RichText' + ? 'optionImg' + : 'optionTxt' + "> <p class="optionContent" v-if="value.optionStyle == 'Txt'"> {{ content.value }}銆亄{ content.txt }} </p> - <p - class="optionContent" - v-else-if="value.optionStyle == 'Image'" - > - {{ content.value }}銆�<el-image - :src="getPublicImage(content.img, 115)" - v-show="content.img" - :preview-src-list="[getPublicImage(content.img)]" - ></el-image> + <p class="optionContent" v-else-if="value.optionStyle == 'Image'"> + {{ content.value }}銆�<el-image :src="getPublicImage(content.img, 115)" v-show="content.img" + :preview-src-list="[getPublicImage(content.img)]" v-if="sourceType == 'bits'"></el-image> + <img :src="content.img" alt="" v-else class="radio-img" /> </p> - <p - class="optionContent" - v-else-if="value.optionStyle == 'TxtAndImage'" - > - <span> {{ content.value }}銆�</span - ><span>{{ content.txt }}</span> - <el-image - :src="getPublicImage(content.img, 115)" - v-show="content.img" - :preview-src-list="[getPublicImage(content.img)]" - ></el-image> + <p class="optionContent" v-else-if="value.optionStyle == 'TxtAndImage'"> + <span> {{ content.value }}銆�</span><span>{{ content.txt }}</span> + <el-image :src="getPublicImage(content.img, 115)" v-show="content.img" + :preview-src-list="[getPublicImage(content.img)]"></el-image> </p> - <p - class="optionContent titleTextArea" - v-else-if="value.optionStyle == 'RichText'" - v-html="`<span>${content.value}</span>` + '銆�' + content.txt" - id="mathjax" - ></p> + <p class="optionContent titleTextArea" v-else-if="value.optionStyle == 'RichText'" + v-html="`<span>${content.value}</span>` + '銆�' + content.txt" id="mathjax"></p> </el-radio> </el-radio-group> <!-- 澶氶�� --> - <el-checkbox-group - :disabled="value.isComplete" - v-model="value.userAnswer" - class="option" - v-else-if="value.questionType == 'multipleChoice'" - > - <el-checkbox - v-for="content in value.option" - :key="content.value" - :label="content.value" - :name="content.text" - :class=" - value.optionStyle == 'Image' || + <el-checkbox-group :disabled="value.isComplete" v-model="value.userAnswer" class="option" + v-else-if="value.questionType == 'multipleChoice'"> + <el-checkbox v-for="(content,contentCindex) in value.option" :key="contentCindex + 'contentCindex'" :label="content.value" + :name="content.text" :class="value.optionStyle == 'Image' || value.optionStyle == 'TxtAndImage' || value.optionStyle == 'RichText' - ? 'optionImg' - : 'optionTxt' - " - > + ? 'optionImg' + : 'optionTxt' + "> <p class="optionContent" v-if="value.optionStyle == 'Txt'"> {{ content.value }}銆亄{ content.txt }} </p> - <p - class="optionContent" - v-else-if="value.optionStyle == 'Image'" - > - {{ content.value }}銆�<el-image - :src="getPublicImage(content.img, 115)" - :preview-src-list="[getPublicImage(content.img)]" - v-show="content.img" - ></el-image> + <p class="optionContent" v-else-if="value.optionStyle == 'Image'"> + {{ content.value }}銆�<el-image :src="getPublicImage(content.img, 115)" + :preview-src-list="[getPublicImage(content.img)]" v-show="content.img"></el-image> </p> - <p - class="optionContent" - v-else-if="value.optionStyle == 'TxtAndImage'" - > - <span> {{ content.value }}銆�</span - ><span>{{ content.txt }}</span> - <el-image - :src="getPublicImage(content.img, 115)" - :preview-src-list="[getPublicImage(content.img)]" - v-show="content.img" - ></el-image> + <p class="optionContent" v-else-if="value.optionStyle == 'TxtAndImage'"> + <span> {{ content.value }}銆�</span><span>{{ content.txt }}</span> + <el-image :src="getPublicImage(content.img, 115)" :preview-src-list="[getPublicImage(content.img)]" + v-show="content.img"></el-image> </p> - <p - class="optionContent titleTextArea" - v-else-if="value.optionStyle == 'RichText'" - v-html="content.value + '銆�' + content.txt" - ></p> + <p class="optionContent titleTextArea" v-else-if="value.optionStyle == 'RichText'" + v-html="content.value + '銆�' + content.txt"></p> </el-checkbox> </el-checkbox-group> <!-- 绠�绛� 缈昏瘧 --> @@ -210,92 +123,74 @@ } " ></TEditorVue> --> - <el-input - @input="textChange($event,nindex,value.id)" - :disabled="value.isComplete" - style="width: 94%; margin: 0 auto" - v-else-if="value.questionType == 'shortAnswer'" - type="textarea" - :rows="6" - placeholder="璇疯緭鍏ュ唴瀹�" - v-model="value.userAnswer" - /> - <div - v-if=" - type != 'option' && - type != 'mock' && - (value.questionType == 'shortAnswer' || - value.questionType == 'multipleChoice' || - value.questionType == 'completion') - " - > - <el-button @click="checkPares(value)" style="margin-top: 10px" - >鏌ョ湅瑙f瀽</el-button - > + <el-input :disabled="value.isComplete" style="width: 94%; margin: 0 auto" + v-else-if="value.questionType == 'shortAnswer'" type="textarea" :rows="6" placeholder="璇疯緭鍏ュ唴瀹�" + v-model="value.userAnswer" /> + <div v-if=" + type != 'option' && + type != 'mock' && + (value.questionType == 'shortAnswer' || + value.questionType == 'multipleChoice' || + value.questionType == 'completion') + "> + <el-button @click="checkPares(value)" style="margin-top: 10px">鏌ョ湅瑙f瀽</el-button> </div> <!-- 鎻愪氦鍚庤В鏋� --> <div class="analysis" v-if="value.isComplete"> - <el-collapse - v-model="value.isUnfold" - @change="handleChange(value)" - accordion - v-if="value.questionType != 'shortAnswer'" - > + <el-collapse v-model="value.isUnfold" @change="handleChange(value)" accordion + v-if="value.questionType != 'shortAnswer'"> <el-collapse-item :name="value.id" class="objective"> <template #title> <div class="headerBox"> <div class="headerConent"> <p class="correct" :title="arrayToString(value.answer)"> <span>姝g‘绛旀锛�</span> - <span - v-html="arrayToString(value.answer)" - class="correctBox" - ></span> + <span v-html="arrayToString(value.answer)" class="correctBox"></span> </p> - <p - :class=" - value.isRight - ? 'correct textOverFlow' - : 'error textOverFlow' - " - :title="arrayToString(value.userAnswer)" - style="margin-left: 20px" - > + <p :class="value.isRight + ? 'correct textOverFlow' + : 'error textOverFlow' + " :title="arrayToString(value.userAnswer)" style="margin-left: 20px"> <span>鎮ㄧ殑绛旀锛�</span> - <span - class="errorBox" - v-if="isHaveAnswer(value.userAnswer)" - >{{ arrayToString(value.userAnswer) }}</span - > + <span class="errorBox" v-if="isHaveAnswer(value.userAnswer)">{{ + arrayToString(value.userAnswer) }}</span> </p> </div> <p class="difficulty" v-if="value.difficulty"> <span style="color: #333">闅惧害绛夌骇锛�</span> - <el-rate - v-model="value.difficulty" - :max="3" - size="large" - disabled - disabled-void-color="#949494" - /> + <el-rate v-model="value.difficulty" :max="3" size="large" disabled + 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 - ><el-image /> + <span class="analysisColor">灞曞紑瑙f瀽</span><el-image /> </p> <p v-else> - <span class="analysisColor">鏀惰捣瑙f瀽</span - ><el-image /> + <span class="analysisColor">鏀惰捣瑙f瀽</span><el-image /> </p> </div> </div> </template> <!-- 瑙f瀽 --> - <div - v-if="value.analysisCon" - v-html="value.analysisCon" - ></div> + <div v-if="value.analysisCon" v-html="value.analysisCon"></div> <div v-else>鏆傛棤鏁版嵁</div> </el-collapse-item> <!-- 涓昏棰� --> @@ -314,29 +209,20 @@ </template> <div class="referBox"> <span>鍙傝�冪瓟妗堬細</span> - <p - v-html="arrayToString(value.answer)" - class="ti-2" - :class="[ - 'subjectiveBox', - value.isUnfold ? 'showText' : 'hideText', - ]" - ></p> + <span v-html="value.answer" class="ti-2" :class="[ + 'subjectiveBox', + value.isUnfold ? 'showText' : 'hideText', + ]"></span> </div> <!-- 瑙f瀽 --> - <div class="referBox"> + <div class="referBox" v-if="value.analysisCon"> <span>瑙f瀽锛�</span> - <p - v-if="value.analysisCon" - v-html="value.analysisCon" - :class=" - [ - 'subjectiveBox', - 'ti-2', - value.isUnfold ? 'yincang' : '', - ].join(' ') - " - ></p> + <p v-if="value.analysisCon" v-html="value.analysisCon" :class="[ + 'subjectiveBox', + 'ti-2', + value.isUnfold ? 'yincang' : '', + ].join(' ') + "></p> <p v-else class="ti-2">鏆傛棤鏁版嵁</p> </div> </el-collapse-item> @@ -403,31 +289,29 @@ </ul> </div> <div class="bottom-btn" v-if="!loading"> - <el-button class="btn-box" @click="saveAnswer">淇濆瓨</el-button> - <el-button - @click="handleQuestion" - class="btn-box" - :style="{ borderColor: primaryColor }" - >鎻愪氦</el-button - > - <el-button @click="redo" class="btn-box">閲嶅仛</el-button> - <el-button - @click="openAnswers" - class="btn-box" - :style="{ borderColor: primaryColor }" - >鏌ョ湅绛旀</el-button - > + <el-button class="examinations-btn-box" @click="saveAnswer">淇濆瓨</el-button> + <el-button @click="(e) => { + handleQuestion(); + saveAnswer(e); + } + " class="examinations-btn-box" :style="{ borderColor: primaryColor }">鎻愪氦</el-button> + <el-button @click="redo" class="examinations-btn-box">閲嶅仛</el-button> + <el-button @click="(e) => { + openAnswers(); + saveAnswer(e); + } + " class="examinations-btn-box" :style="{ borderColor: primaryColor }">鏌ョ湅绛旀</el-button> </div> </div> </template> <script> +import { Message } from "element-ui"; export default { name: "examination-option", props: { cardList: { type: Array, - default: [], }, primaryColor: { type: String, @@ -439,19 +323,67 @@ page: { type: Number, }, + inputBc: { + type: String, + default: "#fff", + }, + hideCollect: { + type: Boolean, + default: false, + }, + sourceType: { + type: String, + default: "bits", + }, }, data() { return { type: "option", loading: false, + cardData: [], + loading: true, + heart: require("@/assets/images/heart.png"), + isHeart: require("@/assets/images/heart-check.png"), + collectList: [], + allCollect: [ + { + type: "bits", + collectList: [], + }, + { + type: "json", + collectList: [], + }, + ], + errorList: [], + allError: [ + { + type: "bits", + errorList: [], + }, + { + type: "json", + errorList: [], + }, + ], }; }, - inject:['changeQuestionData'], - mounted() {}, - computed:{ - cardLists() { - return this.props.cardList - } + watch: { + cardList: { + handler(newVal) { + // console.log('鏂板��',newVal); + this.cardData = this.cardList; + if (newVal && newVal.length) { + this.loading = false; + } + }, + immediate: true, + deep: true, + }, + }, + mounted() { + this.getCollectIdList(); + this.getErrorList(); }, methods: { // 鏁扮粍杞负瀛楃涓叉柟娉� @@ -486,20 +418,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 +443,8 @@ }, // 鎵规敼棰樼洰 (缁冧範,鎴戠殑鍋氶,鎴戠殑鏀惰棌妯″紡涓�) handleQuestion() { - const list = this.$props.cardList; + let errorId = []; + 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++) { @@ -555,10 +487,38 @@ } } } + if (citem.isRight == false) { + errorId.push(citem.id); + } } } - this.$props.cardList = list; - console.log(this.$props.cardList); + this.cardData = list; + let oldErrodId = this.allError.find( + (item) => item.type == this.sourceType + ).errorList; + for (let index = 0; index < errorId.length; index++) { + const item = errorId[index]; + if (oldErrodId.indexOf(item) == -1) { + oldErrodId.push(item); + } + } + for (let cindex = 0; cindex < this.allError.length; cindex++) { + const citem = this.allError[cindex]; + if (citem.type == this.sourceType) citem.errorList = oldErrodId; + } + this.MG.identity + .setUserKey({ + setKeyRequests: [ + { + domain: "errorData", + key: this.config.activeBook.bookId, + value: JSON.stringify(this.allError), + }, + ], + }) + .then((res) => { + console.log("閿欓宸蹭繚瀛�", this.allError); + }); }, getParentWithClass(element, className) { while (element.parentElement) { @@ -569,21 +529,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 +550,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,69 +573,174 @@ // 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) { + this.cardData[infoNum].infoList[num].isCollect = + !this.cardData[infoNum].infoList[num].isCollect; + }, + // 棰樼洰鏀惰棌鎸夐挳,鏀惰棌鍜屽彇娑堝悓涓�鎺ュ彛锛屽彇娑堟暟缁勫噺鍘昏椤筰d + setCollect(num, number) { + const item = this.cardData[num].infoList[number]; + item.isCollect = !item.isCollect; + if (this.cardData.length == 0) { + this.collectList.push(item.id); + } else { + const isShow = this.collectList.findIndex((citem) => citem == item.id); + if (isShow == -1) { + this.collectList.push(item.id); + } else { + this.collectList = this.collectList.filter( + (citem) => citem != item.id + ); + } + } + const list = this.collectList; + for (let index = 0; index < this.allCollect.length; index++) { + const item = this.allCollect[index]; + if (item.type == this.sourceType) item.collectList = this.collectList; + } + // console.log(this.allCollect, this.collectList, list); + this.MG.identity + .setUserKey({ + setKeyRequests: [ + { + domain: "collectData", + key: this.config.activeBook.bookId, + value: JSON.stringify(this.allCollect), + }, + ], + }) + .then((res) => { + console.log("鏀惰棌/鍙栨秷鎴愬姛"); + }); + }, + // 鑾峰彇鏀惰棌id鍒楄〃 + getCollectIdList() { + const token = localStorage.getItem("token"); + if (!token) return false; + this.MG.identity + .getUserKey({ + domain: "collectData", + keys: [this.config.activeBook.bookId], + }) + .then((res) => { + try { + const collect = JSON.parse(res[0].value); + if (collect.length) { + this.collectList = collect.find( + (citem) => citem.type == this.sourceType + ).collectList; + this.allCollect[0].collectList = collect.find( + (citem) => citem.type == "bits" + ).collectList; + this.allCollect[1].collectList = collect.find( + (citem) => citem.type == "json" + ).collectList; + } + } catch (error) { + console.log("鏆傛棤鏁版嵁"); + } + }) + .catch((res) => { + console.log("绛旈鍣ㄨ姹傞鐩敹钘廼d鎶ラ敊"); + }); + }, + // 鑾峰彇閿欓id鍒楄〃 + getErrorList() { + const token = localStorage.getItem("token"); + if (!token) return false; + this.MG.identity + .getUserKey({ + domain: "errorData", + keys: [this.config.activeBook.bookId], + }) + .then((res) => { + try { + const error = JSON.parse(res[0].value); + if (error.length) { + this.errorList = error.find( + (citem) => citem.type == this.sourceType + ).errorList; + this.allError[0].errorList = error.find( + (citem) => citem.type == "bits" + ).errorList; + this.allError[1].errorList = error.find( + (citem) => citem.type == "json" + ).errorList; + } + } catch (error) { } + console.log('閿欓鍒楄〃', this.allError) + }) + .catch(() => { }); + }, }, }; </script> <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; } + .border-box { padding-top: 20px; // border: 2px solid #e9e9e9; } + .ti-2 { text-indent: 2em !important; } + .questionContent { // display: flex; // justify-content: center; text-indent: 0em !important; margin-left: 20px; + /deep/ .el-textarea__inner:focus { border-color: #15c0f2; } } + .input { /deep/ .el-input__inner { height: 26px; } } + p { margin-top: 0em; text-indent: 0em !important; line-height: 1.5em; font-size: 16px; } + .colorBox { margin: 0 10px 0 23px; width: 4px; height: 19px; background-color: #ff6c00; } + .textOverFlow { overflow: hidden; text-overflow: ellipsis; @@ -681,51 +752,63 @@ height: 775px; padding-bottom: 20px; } + .question::-webkit-scrollbar { width: 3px; } + /*婊氬姩鏉℃粦鍧�*/ .question::-webkit-scrollbar-thumb { border-radius: 20px; -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); background-color: #333; } + /*婊氬姩鏉¤建閬�*/ .question::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0); border-radius: 20px; background: #d9d9d9; } + .paperMargin { margin-top: 30px; + ul li { padding: 20px 41px 0px 46px; } + li:last-child { padding-bottom: 20px; } } + .paperQuestion { padding-left: 12px; display: flex; align-items: center; font-size: 16px; + .questionText { font-size: 16px; color: #000; } + span { color: #c2c2c2; } } + /** 棰樺共 */ .questionTitle { display: flex; justify-content: center; + .titleContent { width: 95%; display: flex; align-items: flex-start; + .questionNum { text-indent: 0 !important; margin-right: 5px; @@ -736,6 +819,7 @@ color: #333; font-weight: bold; } + .titleText { text-align: left; // padding: 0 10px 10px 0px; @@ -743,6 +827,7 @@ font-size: 16px; line-height: 32px; color: #000; + span { display: inline-block; font-size: 16px; @@ -751,46 +836,46 @@ font-weight: 400; margin-top: 6px; } - .el-input { + + input { width: 140px; height: 24px; - border-top: 0; + border: 0; + outline: none; + border-bottom: 1px solid #15c0f2; } + /deep/ .el-textarea.is-disabled .el-textarea__inner { background-color: #fff; } - /deep/.el-input__wrapper { - border-top: 0 !important; - } - /deep/ .el-input__inner { - border-top: 0 !important; - border-left: 0 !important ; - border-right: 0 !important ; - border-bottom: 1px solid #15c0f2 !important; - border-radius: 0 !important; - } + /deep/ .el-input.is-disabled .el-input__inner { background-color: #fff; } + /dee/ p { display: flex; align-items: center; } } + ::v-deep { .el-input__wrapper { border-top: 0 !important; } } } + .collect { cursor: pointer; width: 21px; height: 21px; } } + /** 閫夐」 */ .option { + .el-radio, .el-checkbox { // min-height: 32px; @@ -802,13 +887,16 @@ margin-bottom: 6px; white-space: pre-wrap !important; color: #000; + /deep/ .el-checkbox__label { line-height: 1.5; } } + /deep/ .el-radio__inner { border-color: #a5a3a3; } + .optionContent { margin: 0; display: flex; @@ -817,14 +905,17 @@ color: #000; } } + .analysis { margin: 20px 0; width: 94%; // margin-left: 12px; } + .el-collapse { width: 100%; } + /** 瑙f瀽 */ .objective { /deep/ .el-collapse-item__header { @@ -833,34 +924,42 @@ padding: 0 20px; font-size: 16px; background-color: #f4f4f4; + .headerBox { width: 100%; height: 100%; display: flex; justify-content: space-between; + align-items: center; flex-wrap: wrap; + .headerConent { height: 100%; display: flex; align-items: center; flex-wrap: wrap; + p { margin-bottom: 0; } + .el-image { width: 9px; height: 9px; } + .correct { color: #1fbc1f; width: 180px; text-align: left; display: flex; + span:nth-child(1) { display: inline-block; width: 82px; } } + .correctBox { width: 100px; height: min-content; @@ -868,23 +967,28 @@ text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; - -webkit-line-clamp: 1; /* 杩欓噷鏄秴鍑哄嚑琛岀渷鐣� */ + -webkit-line-clamp: 1; + /* 杩欓噷鏄秴鍑哄嚑琛岀渷鐣� */ overflow: hidden; } + .error { display: flex; text-align: left; - width: 180px; + width: 170px; color: #ee1818; + span { height: min-content; } + .errorBox { width: 100px; // height: 48px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; + ::v-deep { img { max-height: 48px; @@ -903,9 +1007,11 @@ } } } + /deep/ .el-collapse-item__header:focus:not(:hover) { color: #333; } + /deep/ .el-collapse-item__content { width: 93%; padding: 0 20px; @@ -913,16 +1019,20 @@ font-size: 16px; color: #333; } + /deep/ .el-collapse-item__arrow { display: none; } + .subjectiveItem { background-color: #f4f4f4; padding: 10px 20px; + p { text-indent: 0em; } } + .subjective { /deep/ .el-collapse-item__header { height: 80px; @@ -934,16 +1044,19 @@ flex-direction: column; justify-content: flex-start; } + .subjectiveTitle { width: 80px; height: 20px; line-height: 20px; } + .subjectiveRefer { display: flex; align-items: flex-start; text-align: left; } + .subjectiveAnswer { width: 540px; height: 20px; @@ -952,31 +1065,39 @@ text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; - -webkit-line-clamp: 1; /* 杩欓噷鏄秴鍑哄嚑琛岀渷鐣� */ + -webkit-line-clamp: 1; + /* 杩欓噷鏄秴鍑哄嚑琛岀渷鐣� */ overflow: hidden; line-height: 20px; } + .analysisDetailBox { overflow: hidden; max-height: 100px; transition: 1s; + &.open { max-height: 500px; } + &.close { max-height: 20px; } + .referBox { display: flex; margin-bottom: 10px; + span { width: 80px; color: #999; } + p { flex: 1; overflow: hidden; } + span, p { text-indent: 0em; @@ -986,30 +1107,37 @@ } } } + // 閫夐」 .optionImg { height: min-content; margin-bottom: 6px; + /deep/ img { margin-left: 10px; object-fit: contain; vertical-align: middle; } } + .optionTxt { height: 32px; } + // 棰樺共浠呭浘鐗� .stemImg { margin: 0 10px 10px 10px; } + // 鏂囧瓧鍔犲浘鐗� .stemTxtAndImage { display: flex; align-items: flex-start; } + .titleTextArea { ::v-deep { + img, .el-image__inner { max-width: 150px !important; @@ -1018,19 +1146,23 @@ } } } + .questionAnalysis { width: 100%; height: 48px; display: flex; justify-content: space-between; + .analysisAnswer { width: 74%; display: flex; } + .referAnswer { display: inline-block; width: 60px; } + .answerContent { height: 48px; width: 80%; @@ -1039,64 +1171,80 @@ text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; - -webkit-line-clamp: 1; /* 杩欓噷鏄秴鍑哄嚑琛岀渷鐣� */ + -webkit-line-clamp: 1; + /* 杩欓噷鏄秴鍑哄嚑琛岀渷鐣� */ overflow: hidden; } + .el-image { width: 9px; height: 9px; } } + .analysisColor { cursor: pointer; color: #949494; margin-right: 4px; } + .difficulty { display: flex; align-items: center; } + .cartoon { animation: spread 1s linear forwards; } + .downCartoon { animation: downSpred 1s linear forwards; } + .showText { animation: showText 1s linear forwards; } + .hideText { animation: hideText 2s linear forwards; } + @keyframes spread { from { max-height: 20px; } + to { max-height: 500px; + p { flex: 1; overflow: hidden; } } } + @keyframes downSpred { from { max-height: 500px; } + to { max-height: 20px; } } + @keyframes showText { 100% { height: auto; } } + @keyframes hideText { 0% { height: auto; } + 100% { height: 20px; overflow: hidden; @@ -1104,15 +1252,18 @@ white-space: nowrap; } } + .yincang { animation: yincang 1s linear forwards; } + @keyframes yincang { from { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + to { overflow: auto; text-overflow: initial; @@ -1125,8 +1276,26 @@ display: flex; justify-content: center; flex-wrap: wrap; + .el-button { margin-top: 10px; } } + +.radio-img { + width: 200px; + object-fit: contain; +} + +.collect-png { + cursor: pointer; + width: 18px; + object-fit: contain; +} + +/deep/ .examination-math { + display: flex; + align-items: center; + flex-wrap: wrap; +} </style> -- Gitblit v1.9.1