| | |
| | | <div class="examination" v-loading="loading"> |
| | | <div |
| | | v-for="(item, nindex) in cardData" |
| | | :key="nindex" |
| | | :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> |
| | | <span v-if="nindex == 2">三、</span> |
| | | <span v-if="nindex == 3">四、</span> |
| | | <span v-if="nindex == 4">五、</span> |
| | | <span>{{ item.catalogName }}</span> |
| | | <span class="catalogName-box"> |
| | | <span v-if="nindex == 0">一、</span> |
| | | <span v-if="nindex == 1">二、</span> |
| | | <span v-if="nindex == 2">三、</span> |
| | | <span v-if="nindex == 3">四、</span> |
| | | <span v-if="nindex == 4">五、</span> |
| | | <span v-html="item.catalogName"></span> |
| | | </span> |
| | | <img |
| | | :src="item.isCollect ? isHeart : heart" |
| | | alt="" |
| | | class="collect-png" |
| | | @click="setCollect(nindex, index)" |
| | | v-if="!hideCollect && item.type == 'material'" |
| | | /> |
| | | </p> |
| | | <el-image |
| | | v-if="item.catalogImage" |
| | | :src="item.catalogImage" |
| | | :preview-src-list="[item.catalogImage]" |
| | | class="catalogImage" |
| | | ></el-image> |
| | | <ul> |
| | | <li |
| | | v-for="(value, index) in item.infoList" |
| | | :key="value.id" |
| | | :key="index + 'value'" |
| | | :id="'listItem-' + value.id" |
| | | > |
| | | <!-- 标题 --> |
| | |
| | | <span |
| | | class="questionNum" |
| | | :style="{ |
| | | marginTop: value.questionType == 'completion' ? '12px' : '0', |
| | | marginTop: |
| | | value.questionType == 'completion' || |
| | | value.questionType == 'mathField' |
| | | ? '12px' |
| | | : '0', |
| | | }" |
| | | >{{ index + 1 }}. |
| | | </span> |
| | | <!-- 听力进度条 --> |
| | | <!-- <answerAudioPlayer :audioUrl="value.src" v-show="item.name == '听力题'" /> --> |
| | | <!-- 题干 --> |
| | | <!-- 仅文字 --> |
| | | <p |
| | | class="titleText" |
| | | class="titleText text-fl" |
| | | v-if=" |
| | | value.stemStyle == 'Txt' && value.questionType != 'completion' |
| | | value.stemStyle == 'Txt' && |
| | | value.questionType != 'completion' && |
| | | value.questionType != 'dropdown' && |
| | | value.questionType != 'mathField' |
| | | " |
| | | :id="value.id" |
| | | > |
| | | {{ value.stem.stemTxt }} |
| | | </p> |
| | | v-html="value.stem.stemTxt" |
| | | ></p> |
| | | <!-- 仅图片 --> |
| | | <el-image |
| | | class="stemImg" |
| | |
| | | class="stemTxtAndImage titleText" |
| | | v-else-if="value.stemStyle == 'TxtAndImage'" |
| | | > |
| | | <span> {{ value.stem.stemTxt }}</span> |
| | | <span v-html="value.stem.stemTxt"> </span> |
| | | <el-image |
| | | :src="getPublicImage(value.stem.stemImage, 150)" |
| | | :preview-src-list="[getPublicImage(value.stem.stemImage)]" |
| | |
| | | ></el-image> |
| | | </p> |
| | | <!-- 填空题题干 --> |
| | | <p class="titleText" v-if="value.questionType == 'completion'"> |
| | | <p |
| | | class="titleText" |
| | | v-if=" |
| | | value.questionType == 'completion' || |
| | | value.questionType == 'mathField' |
| | | " |
| | | > |
| | | <span |
| | | v-for="(itemText, indexText) in value.stem" |
| | | :key="indexText" |
| | | :key="indexText + 'questionType'" |
| | | > |
| | | <span |
| | | v-if="typeof itemText == 'string'" |
| | | v-html="itemText" |
| | | class="input-txt" |
| | | ></span> |
| | | <!-- --> |
| | | <input |
| | | v-else |
| | | v-if=" |
| | | typeof itemText != 'string' && |
| | | value.questionType == 'completion' |
| | | " |
| | | type="text" |
| | | class="input" |
| | | v-model.trim="value.userAnswer[itemText.num]" |
| | | :disabled="value.isComplete" |
| | | :style="{ backgroundColor: inputBc }" |
| | | /> |
| | | <!-- --> |
| | | <math-field |
| | | v-if=" |
| | | typeof itemText != 'string' && |
| | | value.questionType == 'mathField' |
| | | " |
| | | class="mathField" |
| | | :menuItems="[]" |
| | | @input="onChangeInput($event, nindex, index, itemText.num)" |
| | | > |
| | | {{ value.userAnswer[itemText.num] }} |
| | | </math-field> |
| | | </span> |
| | | </p> |
| | | <!-- 富文本 --> |
| | |
| | | v-html="value.stem.stemTxt" |
| | | v-cloak |
| | | ></p> |
| | | <!-- 下拉选择题 --> |
| | | <p class="titleText" v-if="value.questionType == 'dropdown'"> |
| | | <span |
| | | v-for="(itemText, indexText) in value.stem" |
| | | :key="indexText + 'questionType'" |
| | | > |
| | | <span |
| | | v-if="typeof itemText == 'string'" |
| | | v-html="itemText" |
| | | class="input-txt" |
| | | ></span> |
| | | <select |
| | | v-else |
| | | v-model="value.userAnswer" |
| | | :disabled="value.isComplete" |
| | | > |
| | | <option |
| | | v-for="(citem, cindex) in value.option" |
| | | :key="cindex + 'dropdown'" |
| | | :label="citem" |
| | | :value="citem" |
| | | ></option> |
| | | </select> |
| | | </span> |
| | | </p> |
| | | </div> |
| | | <img |
| | | :src="value.isCollect ? isHeart : heart" |
| | | alt="" |
| | | class="collect-png" |
| | | @click="setCollect(nindex, index)" |
| | | v-if="!(hideCollect && value.questionType == 'shortAnswer')" |
| | | v-if="!hideCollect && item.type != 'material'" |
| | | /> |
| | | <!-- 收藏 --> |
| | | </div> |
| | |
| | | v-model="value.userAnswer" |
| | | > |
| | | <el-radio |
| | | v-for="content in value.option" |
| | | :key="content.value" |
| | | v-for="(content, contentIndex) in value.option" |
| | | :key="contentIndex + 'contentIndex'" |
| | | :label="content.value" |
| | | :class=" |
| | | value.optionStyle == 'Image' || |
| | |
| | | :src="getPublicImage(content.img, 115)" |
| | | v-show="content.img" |
| | | :preview-src-list="[getPublicImage(content.img)]" |
| | | v-if="isReal" |
| | | v-if="sourceType == 'bits'" |
| | | ></el-image> |
| | | <img |
| | | :src="content.img" |
| | | alt="" |
| | | v-if="!isReal" |
| | | class="radio-img" |
| | | /> |
| | | <img :src="content.img" alt="" v-else class="radio-img" /> |
| | | </p> |
| | | <p |
| | | class="optionContent" |
| | |
| | | v-else-if="value.questionType == 'multipleChoice'" |
| | | > |
| | | <el-checkbox |
| | | v-for="content in value.option" |
| | | :key="content.value" |
| | | v-for="(content, contentCindex) in value.option" |
| | | :key="contentCindex + 'contentCindex'" |
| | | :label="content.value" |
| | | :name="content.text" |
| | | :class=" |
| | |
| | | </el-checkbox> |
| | | </el-checkbox-group> |
| | | <!-- 简答 翻译 --> |
| | | <!-- <TEditorVue |
| | | v-else-if="value.questionType == 'shortAnswer'" |
| | | :value="value.userAnswer" |
| | | :disabled="value.isComplete" |
| | | @getContent=" |
| | | (val) => { |
| | | value.userAnswer = val.trim(); |
| | | inputChange(); |
| | | } |
| | | " |
| | | ></TEditorVue> --> |
| | | <TEditorVue |
| | | v-else-if="value.questionType == 'formula'" |
| | | :value="value.userAnswer" |
| | | :disabled="value.isComplete" |
| | | @getContent=" |
| | | (val) => { |
| | | value.userAnswer = val; |
| | | } |
| | | " |
| | | /> |
| | | <el-input |
| | | :disabled="value.isComplete" |
| | | style="width: 94%; margin: 0 auto" |
| | |
| | | type != 'mock' && |
| | | (value.questionType == 'shortAnswer' || |
| | | value.questionType == 'multipleChoice' || |
| | | value.questionType == 'completion') |
| | | value.questionType == 'completion' || |
| | | value.questionType == 'mathField') |
| | | " |
| | | > |
| | | <el-button @click="checkPares(value)" style="margin-top: 10px" |
| | |
| | | <div class="analysis" v-if="value.isComplete"> |
| | | <el-collapse |
| | | v-model="value.isUnfold" |
| | | @change="handleChange(value)" |
| | | accordion |
| | | v-if="value.questionType != 'shortAnswer'" |
| | | v-if=" |
| | | value.questionType != 'shortAnswer' && |
| | | value.questionType != 'formula' |
| | | " |
| | | > |
| | | <el-collapse-item :name="value.id" class="objective"> |
| | | <template #title> |
| | |
| | | ></div> |
| | | <div v-else>暂无数据</div> |
| | | </el-collapse-item> |
| | | <!-- 主观题 --> |
| | | </el-collapse> |
| | | <!-- 主观题 --> |
| | | <el-collapse v-else v-model="value.isUnfold" accordion> |
| | | <el-collapse-item :name="value.id" class="objective"> |
| | | <template #title> |
| | |
| | | </template> |
| | | <div class="referBox"> |
| | | <span>参考答案:</span> |
| | | <p |
| | | v-html="arrayToString(value.answer)" |
| | | <span |
| | | v-html="value.answer" |
| | | class="ti-2" |
| | | :class="[ |
| | | 'subjectiveBox', |
| | | value.isUnfold ? 'showText' : 'hideText', |
| | | ]" |
| | | ></p> |
| | | ></span> |
| | | </div> |
| | | <!-- 解析 --> |
| | | <div class="referBox" v-if="value.analysisCon"> |
| | | <span>解析:</span> |
| | | <p |
| | | v-if="value.analysisCon" |
| | | v-html="value.analysisCon" |
| | | :class=" |
| | | [ |
| | |
| | | ].join(' ') |
| | | " |
| | | ></p> |
| | | <p v-else class="ti-2">暂无数据</p> |
| | | </div> |
| | | </el-collapse-item> |
| | | </el-collapse> |
| | |
| | | >保存</el-button |
| | | > |
| | | <el-button |
| | | @click="handleQuestion" |
| | | @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="openAnswers" |
| | | @click=" |
| | | (e) => { |
| | | openAnswers(); |
| | | saveAnswer(e); |
| | | } |
| | | " |
| | | class="examinations-btn-box" |
| | | :style="{ borderColor: primaryColor }" |
| | | >查看答案</el-button |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { MathfieldElement } from "mathlive"; |
| | | import { Message } from "element-ui"; |
| | | import TEditorVue from "../teditor/index.vue"; |
| | | export default { |
| | | name: "examination-option", |
| | | components: { TEditorVue }, |
| | | props: { |
| | | cardList: { |
| | | type: Array, |
| | |
| | | }, |
| | | page: { |
| | | type: Number, |
| | | }, |
| | | isReal: { |
| | | type: Boolean, |
| | | default: true, |
| | | }, |
| | | inputBc: { |
| | | type: String, |
| | |
| | | }, |
| | | mounted() { |
| | | this.getCollectIdList(); |
| | | this.getErrorList() |
| | | this.getErrorList(); |
| | | }, |
| | | methods: { |
| | | // 获取不受保护的图片 |
| | | getPublicImage(md5, width, height) { |
| | | if (!md5) return; |
| | | if (md5.includes("http")) { |
| | | if (width) { |
| | | return md5 + `?width=${width}`; |
| | | } else { |
| | | return md5; |
| | | } |
| | | } |
| | | let src = null; |
| | | if (md5) { |
| | | src = process.env.VUE_APP_API_URL + `/file/GetPreViewImage?md5=${md5}`; |
| | | } |
| | | if (width) src += `&width=${width}`; |
| | | if (height) src += `&height=${height}`; |
| | | return src; |
| | | }, |
| | | // 数组转为字符串方法 |
| | | arrayToString(data) { |
| | | // 检查是否为数组 |
| | |
| | | const item = this.cardData[index]; |
| | | for (let cindex = 0; cindex < item.infoList.length; cindex++) { |
| | | const citem = item.infoList[cindex]; |
| | | citem.userAnswer = ""; |
| | | if (typeof citem.userAnswer == "string") { |
| | | citem.userAnswer = ""; |
| | | } else { |
| | | if (citem.questionType == "multipleChoice") { |
| | | citem.userAnswer = []; |
| | | } else { |
| | | // 填空题 |
| | | for (let dindex = 0; dindex < citem.userAnswer.length; dindex++) { |
| | | citem.userAnswer[dindex] = ""; |
| | | } |
| | | } |
| | | } |
| | | citem.isComplete = false; |
| | | } |
| | | } |
| | |
| | | }, |
| | | // 批改题目 (练习,我的做题,我的收藏模式下) |
| | | handleQuestion() { |
| | | let errorId = [] |
| | | let errorId = []; |
| | | const list = this.cardData; |
| | | for (let index = 0; index < list.length; index++) { |
| | | const item = list[index]; |
| | |
| | | } |
| | | } else if ( |
| | | citem.questionType == "singleChoice" || |
| | | citem.questionType == "judge" |
| | | citem.questionType == "judge" || |
| | | citem.questionType == "dropdown" |
| | | ) { |
| | | if (citem.id == "63825") console.log("i", item); |
| | | citem.isRight = citem.answer == citem.userAnswer; |
| | | } else if (citem.questionType == "shortAnswer") { |
| | | // 简答 翻译 |
| | | citem.isRight = null; |
| | | } else if (citem.questionType == "completion") { |
| | | } else if ( |
| | | citem.questionType == "completion" || |
| | | citem.questionType == "mathField" |
| | | ) { |
| | | // 填空 |
| | | if (typeof citem.answer == "string") { |
| | | citem.isRight = citem.answer == citem.userAnswer[0]; |
| | |
| | | } |
| | | } |
| | | } |
| | | if(citem.isRight == false) { |
| | | errorId.push(citem.id) |
| | | if (citem.isRight == false) { |
| | | errorId.push(citem.id); |
| | | } |
| | | } |
| | | } |
| | | this.cardData = list; |
| | | let oldErrodId = this.allError.find(item => item.type == this.sourceType).errorList |
| | | 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) |
| | | 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 |
| | | if (citem.type == this.sourceType) citem.errorList = oldErrodId; |
| | | } |
| | | this.MG.identity |
| | | .setUserKey({ |
| | | setKeyRequests: [ |
| | | { |
| | | domain: 'errorData', |
| | | domain: "errorData", |
| | | key: this.config.activeBook.bookId, |
| | | value: JSON.stringify(this.allError) |
| | | } |
| | | ] |
| | | value: JSON.stringify(this.allError), |
| | | }, |
| | | ], |
| | | }) |
| | | .then((res) => { |
| | | console.log('错题已保存',this.allError) |
| | | }) |
| | | console.log("错题已保存", this.allError); |
| | | }); |
| | | }, |
| | | getParentWithClass(element, className) { |
| | | while (element.parentElement) { |
| | |
| | | }, |
| | | // 题目收藏按钮,收藏和取消同一接口,取消数组减去该项id |
| | | setCollect(num, number) { |
| | | const item = this.cardData[num].infoList[number]; |
| | | let item = null; |
| | | if (number) { |
| | | item = this.cardData[num].infoList[number]; |
| | | } else { |
| | | item = this.cardData[num]; |
| | | } |
| | | item.isCollect = !item.isCollect; |
| | | console.log(111, item); |
| | | if (this.cardData.length == 0) { |
| | | this.collectList.push(item.id); |
| | | } else { |
| | |
| | | const item = this.allCollect[index]; |
| | | if (item.type == this.sourceType) item.collectList = this.collectList; |
| | | } |
| | | // console.log(this.allCollect, this.collectList, list); |
| | | console.log("点击收藏按钮", this.allCollect); |
| | | this.MG.identity |
| | | .setUserKey({ |
| | | setKeyRequests: [ |
| | |
| | | }, |
| | | // 获取收藏id列表 |
| | | getCollectIdList() { |
| | | const token = localStorage.getItem("token"); |
| | | if (!token) return false; |
| | | this.MG.identity |
| | | .getUserKey({ |
| | | domain: "collectData", |
| | |
| | | .then((res) => { |
| | | try { |
| | | const collect = JSON.parse(res[0].value); |
| | | console.log("全部收藏id", collect); |
| | | if (collect.length) { |
| | | this.collectList = collect.find( |
| | | (citem) => citem.type == this.sourceType |
| | |
| | | }, |
| | | // 获取错题id列表 |
| | | getErrorList() { |
| | | const token = localStorage.getItem("token"); |
| | | if (!token) return false; |
| | | this.MG.identity |
| | | .getUserKey({ |
| | | domain: "errorData", |
| | |
| | | ).errorList; |
| | | } |
| | | } catch (error) {} |
| | | }); |
| | | }) |
| | | .catch(() => {}); |
| | | }, |
| | | onChangeInput(e, index, cindex, num) { |
| | | this.cardData[index].infoList[cindex].userAnswer[num] = e.target.value; |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="less"> |
| | | .titleText img { |
| | | max-width: 80%; |
| | | min-width: 220px; |
| | | } |
| | | </style> |
| | | |
| | | <style lang="less" scoped> |
| | | .catalogName { |
| | | display: flex; |
| | | text-indent: 1em !important; |
| | | font-size: 16px; |
| | | .catalogName-box { |
| | | display: inline-block; |
| | | width: 94%; |
| | | } |
| | | } |
| | | .catalogImage { |
| | | width: 50%; |
| | | } |
| | | .examination { |
| | | min-height: 100px; |
| | | ul { |
| | | list-style: none; |
| | | } |
| | | |
| | | p { |
| | | margin: 0; |
| | | } |
| | | math { |
| | | } |
| | | } |
| | | |
| | | .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; |
| | |
| | | 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; |
| | |
| | | color: #333; |
| | | font-weight: bold; |
| | | } |
| | | .text-fl { |
| | | display: flex; |
| | | align-items: center; |
| | | flex-wrap: wrap; |
| | | } |
| | | .titleText { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | align-items: center; |
| | | text-align: left; |
| | | // padding: 0 10px 10px 0px; |
| | | min-width: 90%; |
| | | font-size: 16px; |
| | | line-height: 32px; |
| | | color: #000; |
| | | .input-txt { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | align-items: center; |
| | | } |
| | | span { |
| | | display: inline-block; |
| | | font-size: 16px; |
| | | // line-height: 26px; |
| | | color: #000; |
| | | font-weight: 400; |
| | | margin-top: 6px; |
| | | } |
| | | select { |
| | | outline: none; |
| | | min-width: 100px; |
| | | } |
| | | input { |
| | | width: 140px; |
| | | height: 24px; |
| | | border: 0; |
| | | outline: none; |
| | | border-bottom: 1px solid #15c0f2; |
| | | border-bottom: 1px solid #000; |
| | | } |
| | | |
| | | /deep/ .el-textarea.is-disabled .el-textarea__inner { |
| | | background-color: #fff; |
| | | } |
| | | |
| | | /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; |
| | | } |
| | | .mathField { |
| | | min-width: 200px; |
| | | max-width: 518px; |
| | | } |
| | | } |
| | | |
| | | /** 选项 */ |
| | | .option { |
| | | .el-radio, |
| | |
| | | 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; |
| | |
| | | color: #000; |
| | | } |
| | | } |
| | | |
| | | .analysis { |
| | | margin: 20px 0; |
| | | width: 94%; |
| | | // margin-left: 12px; |
| | | } |
| | | |
| | | .el-collapse { |
| | | width: 100%; |
| | | } |
| | | |
| | | /** 解析 */ |
| | | .objective { |
| | | /deep/ .el-collapse-item__header { |
| | |
| | | padding: 0 20px; |
| | | font-size: 16px; |
| | | background-color: #f4f4f4; |
| | | |
| | | .headerBox { |
| | | width: 100%; |
| | | height: 100%; |
| | |
| | | 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; |
| | |
| | | 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: 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; |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | /deep/ .el-collapse-item__header:focus:not(:hover) { |
| | | color: #333; |
| | | } |
| | | |
| | | /deep/ .el-collapse-item__content { |
| | | width: 93%; |
| | | padding: 0 20px; |
| | |
| | | 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; |
| | |
| | | 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; |
| | |
| | | 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; |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | // 选项 |
| | | .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, |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | .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%; |
| | |
| | | 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; |
| | |
| | | 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; |
| | |
| | | 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> |