Skip to content

X
xzksxt
Commit 684af648 by yangyang
Options

试题调整

parent 7c34dec1
Showing with 563 additions and 308 deletions
src/components/student/answer.vue
......@@ -8,25 +8,23 @@
<div class="item" style="display: flex;justify-content: space-between">
<div style="display: flex;justify-content: flex-start">
<img class="jinhuiClass" src="@/assets/img/jinhui.png" alt="" />
<p class="titleClass" >{{examData.type}}-{{examData.source}}</p>
<!-- <p >"啊刑侦百科”-线上学习系统</p>-->
<p class="titleClass">{{ examData.type }}-{{ examData.source }}</p>
<!-- <p >"啊刑侦百科”-线上学习系统</p>-->
</div>
<div class="itemTwo" >
<div class="itemTwo">
<div style="display: flex; align-items: center; margin-left: auto;">
<router-link
:to="{
<router-link :to="{
path: '/scoreTable',
query: {
cid: this.$route.query.cid,
cname:this.$route.query.cname,
role:this.$route.query.role
cname: this.$route.query.cname,
role: this.$route.query.role
}
}" class="router1" target="_blank">个人统计
</router-link>
</div>
<div style="display: flex; align-items: center; margin-left: auto;">
<router-link
:to="{ path: '/videoList' }" class="router1" target="_blank">视频学习
<router-link :to="{ path: '/videoList' }" class="router1" target="_blank">视频学习
</router-link>
</div>
</div>
......@@ -37,211 +35,218 @@
<transition name="slider-fade">
<div class="right">
<div class="title">
<p>{{title}}({{optionValue}})</p>
<p>{{ title }}({{ optionValue }})</p>
<i class="iconfont icon-right auto-right"></i>
<span style="color: black;font-weight: bold">全卷共1题 <i class="iconfont icon-time"></i><!--倒计时：<b>{{time}}</b>分钟--></span>
<div style="color: black;font-weight: bold">({{userInfo.name}})</div>
<span style="color: black;font-weight: bold">全卷共5题 <i
class="iconfont icon-time"></i>倒计时：<b>{{time}}</b></span>
<div style="color: black;font-weight: bold">({{ userInfo.name }})</div>
</div>
<ul style="display: flex;margin-left: 30px">
<li v-for="item in reduceAnswer.img" style="overflow: visible;display: flex">
<img :src="item" alt=""
@click="magnifyPhoto(item)"
<img :src="item" alt="" @click="magnifyPhoto(item)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: -5px">
</li>
</ul>
<div class="content">
<p class="topic">{{showQuestion}}</p>
<div v-if=" optionValue == '单选题'">
<el-radio-group v-model="radio[index]" @change="getChangeLabel" >
<!-- <div style="display: flex">-->
<el-radio :label="1" :disabled='radioFlag'
:class="[isradio ? (this.reduceAnswer.rightAnswer==='A' ? 'checkboxTrueStyle' : 'radioFlaseStyle'):'noStyle']">
{{showAnswer.answerA}}
<p class="topic">{{ showQuestion }}</p>
<div v-if="optionValue == '单选题'">
<el-radio-group v-model="radio[index]" @change="getChangeLabel">
<!-- <div style="display: flex">-->
<el-radio :label="1" :disabled='radioFlagOne'
:class="[isradio ? (this.reduceAnswer.rightAnswer === 'A' ? 'checkboxTrueStyle' : 'radioFlaseStyle') : 'noStyle']">
{{ showAnswer.answerA }}
</el-radio>
<ul v-if="showAnswer.Aimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Aimg" alt=""
@click="magnifyPhoto(showAnswer.Aimg)"
<img :src="showAnswer.Aimg" alt="" @click="magnifyPhoto(showAnswer.Aimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-radio :label="2" :disabled='radioFlag'
:class="[isradio ? (this.reduceAnswer.rightAnswer==='B' ? 'checkboxTrueStyle' : 'radioFlaseStyle'):'noStyle']">
{{showAnswer.answerB}}
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-radio :label="2" :disabled='radioFlagOne'
:class="[isradio ? (this.reduceAnswer.rightAnswer === 'B' ? 'checkboxTrueStyle' : 'radioFlaseStyle') : 'noStyle']">
{{ showAnswer.answerB }}
</el-radio>
<ul v-if="showAnswer.Bimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Bimg" alt=""
@click="magnifyPhoto(showAnswer.Bimg)"
<img :src="showAnswer.Bimg" alt="" @click="magnifyPhoto(showAnswer.Bimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-radio :label="3" :disabled='radioFlag'
:class="[isradio ? (this.reduceAnswer.rightAnswer==='C' ? 'checkboxTrueStyle' : 'radioFlaseStyle'):'noStyle']">
{{showAnswer.answerC}}
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-radio :label="3" :disabled='radioFlagOne'
:class="[isradio ? (this.reduceAnswer.rightAnswer === 'C' ? 'checkboxTrueStyle' : 'radioFlaseStyle') : 'noStyle']">
{{ showAnswer.answerC }}
</el-radio>
<ul v-if="showAnswer.Cimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Cimg" alt=""
@click="magnifyPhoto(showAnswer.Cimg)"
<img :src="showAnswer.Cimg" alt="" @click="magnifyPhoto(showAnswer.Cimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-radio :label="4" :disabled='radioFlag'
:class="[isradio ? (this.reduceAnswer.rightAnswer==='D' ? 'checkboxTrueStyle' : 'radioFlaseStyle'):'noStyle']">
{{showAnswer.answerD}}
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-radio :label="4" :disabled='radioFlagOne'
:class="[isradio ? (this.reduceAnswer.rightAnswer === 'D' ? 'checkboxTrueStyle' : 'radioFlaseStyle') : 'noStyle']">
{{ showAnswer.answerD }}
</el-radio>
<ul v-if="showAnswer.Dimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Dimg" alt=""
@click="magnifyPhoto(showAnswer.Dimg)"
<img :src="showAnswer.Dimg" alt="" @click="magnifyPhoto(showAnswer.Dimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- </div>-->
</el-radio-group>
<div class="analysis" id="topic1Right" style="display: none">
<ul>
<li class="first "> <el-tag type="success">正确答案：</el-tag><span class="right">{{reduceAnswer.rightAnswer}}</span></li>
<li class="first "> <el-tag type="success">正确答案：</el-tag><span
class="right">{{ reduceAnswer.rightAnswer }}</span></li>
<li class="second"><el-tag>题目解析：</el-tag>
<div class="li2right">{{(reduceAnswer.analysis == null || reduceAnswer.analysis == '') ? '无': reduceAnswer.analysis}}</div>
<!-- <div class="li2right">{{reduceAnswer.analysis == null || reduceAnswer.analysis=='null' ? '强强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我们努力去外面人了吗；了米女方老大是哪里发你来撒文风给了你手里的你发了什么劳动法；饿了么人类；魔法师空间是你的看法不射控大部分考生蓝风铃看到看见菲尼克斯的缴纳罚款楼上的你发了看到了妇女四点零分': reduceAnswer.analysis}}</div>-->
<div class="li2right">{{ (reduceAnswer.analysis == null || reduceAnswer.analysis == '') ? '无' :
reduceAnswer.analysis }}</div>
<!-- <div class="li2right">{{reduceAnswer.analysis == null || reduceAnswer.analysis=='null' ? '强强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我强强强强强强强强强强强强强刘乾坤万年两年前为了来思考每年的法律手段你疯了目前我们努力去外面人了吗；了米女方老大是哪里发你来撒文风给了你手里的你发了什么劳动法；饿了么人类；魔法师空间是你的看法不射控大部分考生蓝风铃看到看见菲尼克斯的缴纳罚款楼上的你发了看到了妇女四点零分': reduceAnswer.analysis}}</div>-->
</li>
</ul>
</div>
</div>
<div v-if=" optionValue == '多选题'" >
<el-checkbox-group v-model="checkList" @change="handleCheckboxChange" >
<!-- <div style="display: flex">-->
<el-checkbox :label="1" :disabled='radioFlag'
:class=" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('A') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'">
{{showAnswer.answerA}}
<div v-if="optionValue == '多选题'">
<el-checkbox-group v-model="checkList" @change="handleCheckboxChange">
<!-- <div style="display: flex">-->
<el-checkbox :label="1" :disabled='radioFlagMore'
:class="ischeckBox ? (this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('A') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle') : 'noStyle'">
{{ showAnswer.answerA }}
</el-checkbox>
<ul v-if="showAnswer.Aimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Aimg" alt=""
@click="magnifyPhoto(showAnswer.Aimg)"
<img :src="showAnswer.Aimg" alt="" @click="magnifyPhoto(showAnswer.Aimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-checkbox :label="2" :disabled='radioFlag'
:class=" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('B') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'">
{{showAnswer.answerB}}
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-checkbox :label="2" :disabled='radioFlagMore'
:class="ischeckBox ? (this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('B') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle') : 'noStyle'">
{{ showAnswer.answerB }}
</el-checkbox>
<ul v-if="showAnswer.Bimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Bimg" alt=""
@click="magnifyPhoto(showAnswer.Bimg)"
<img :src="showAnswer.Bimg" alt="" @click="magnifyPhoto(showAnswer.Bimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- <div style="display:flex;">-->
<el-checkbox :label="3" :disabled='radioFlag'
:class=" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('C') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'">
{{showAnswer.answerC}}
<!-- </div>-->
<!-- <div style="display:flex;">-->
<el-checkbox :label="3" :disabled='radioFlagMore'
:class="ischeckBox ? (this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('C') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle') : 'noStyle'">
{{ showAnswer.answerC }}
</el-checkbox>
<ul v-if="showAnswer.Cimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Cimg" alt=""
@click="magnifyPhoto(showAnswer.Cimg)"
<img :src="showAnswer.Cimg" alt="" @click="magnifyPhoto(showAnswer.Cimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-checkbox :label="4" :disabled='radioFlag'
:class=" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('D') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'">
{{showAnswer.answerD}}
<!-- </div>-->
<!-- <div style="display: flex">-->
<el-checkbox :label="4" :disabled='radioFlagMore'
:class="ischeckBox ? (this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('D') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle') : 'noStyle'">
{{ showAnswer.answerD }}
</el-checkbox>
<ul v-if="showAnswer.Dimg" style="display: flex;margin-left: 30px">
<li style="overflow: visible;display: flex">
<img :src="showAnswer.Dimg" alt=""
@click="magnifyPhoto(showAnswer.Dimg)"
<img :src="showAnswer.Dimg" alt="" @click="magnifyPhoto(showAnswer.Dimg)"
style="width: 300px; height:300px; margin-left: 10px;margin-top: 5px">
</li>
</ul>
<!-- </div>-->
<!-- </div>-->
</el-checkbox-group>
<el-button class="submitAnswerClass" type="primary" plain v-show="isOptionSelected" @click="submitAnswer" >提交</el-button>
<el-button class="submitAnswerClass" type="primary" plain v-show="isOptionSelected"
@click="submitAnswer">提交</el-button>
<div class="analysis" id="topic1Right" style="display: none">
<div class="analysis" id="topic2Right" style="display: none">
<ul>
<li class="first">
<el-tag type="success">正确答案：</el-tag>
<span class="right">{{reduceAnswer.rightAnswer}}</span></li>
<span class="right">{{ reduceAnswer.rightAnswer }}</span>
</li>
<li class="second">
<el-tag>题目解析：</el-tag>
<div class="li2right">{{(reduceAnswer.analysis == null || reduceAnswer.analysis == '') ? '无': reduceAnswer.analysis}}</div>
<div class="li2right">{{ (reduceAnswer.analysis == null || reduceAnswer.analysis == '') ? '无' :
reduceAnswer.analysis }}</div>
</li>
</ul>
</div>
</div>
<div class="judge" v-if=" optionValue == '判断题'">
<div class="judge" v-if="optionValue == '判断题'">
<el-radio-group v-model="judgeAnswer[index]" @change="getJudgeLabel">
<el-radio :label="1" :disabled='radioFlag' :class="[isradio ? (this.reduceAnswer.answer==='T' ? 'checkboxTrueStyle' : 'radioFlaseStyle'):'noStyle']">正确</el-radio>
<el-radio :label="2" :disabled='radioFlag' :class="[isradio ? (this.reduceAnswer.answer==='F' ? 'checkboxTrueStyle' : 'radioFlaseStyle'):'noStyle']">错误</el-radio>
<el-radio :label="1" :disabled='radioFlagPd'
:class="[isradio ? (this.reduceAnswer.answer === 'T' ? 'checkboxTrueStyle' : 'radioFlaseStyle') : 'noStyle']">正确</el-radio>
<el-radio :label="2" :disabled='radioFlagPd'
:class="[isradio ? (this.reduceAnswer.answer === 'F' ? 'checkboxTrueStyle' : 'radioFlaseStyle') : 'noStyle']">错误</el-radio>
</el-radio-group>
<div class="analysis" id="topic3Right" style="display: none">
<ul>
<li class="first">
<el-tag type="success">正确答案：</el-tag>
<span class="right">{{pdtanswer}}</span></li>
<span class="right">{{ reduceAnswer.answer === 'T' ? '正确' : '错误' }}</span>
</li>
<li class="second">
<el-tag>题目解析：</el-tag>
<div class="li2right">{{(reduceAnswer.analysis == null || reduceAnswer.analysis == '')? '无': reduceAnswer.analysis}}</div>
<div class="li2right">{{ (reduceAnswer.analysis == null || reduceAnswer.analysis == '') ? '无' :
reduceAnswer.analysis }}</div>
</li>
</ul>
</div>
</div>
</div>
<div class="operation">
<ul class="end">
<li @click="previous()"><i class="iconfont icon-previous"></i><span>上一题</span></li>
<li @click="commit()"><i class="iconfont icon-previous"></i><span>结束考试</span>
</li>
<li @click="next()"><span>下一题</span></li>
</ul>
</div>
</div>
</transition>
</div>
</div>
<el-image
style=" position: absolute;display: none"
:preview-src-list="[dialogImageUrl]"
ref="elImage"
>
<el-image style=" position: absolute;display: none" :preview-src-list="[dialogImageUrl]" ref="elImage">
</el-image>
</div>
</template>
<script>
import {mapState} from 'vuex'
import { mapState } from 'vuex'
export default {
data() {
return {
pdtanswer:'',
dialogImageUrl:"",//放大的图片
isradio:false, //默认为false 。。点击后改为true
ischeckBox:false, //默认为false 。。点击后改为true
dialogImageUrl: "",//放大的图片
isradio: false, //默认为false 。。点击后改为true
ischeckBox: false, //默认为false 。。点击后改为true
startTime: null, //考试开始时间
endTime: null, //考试结束时间
time: null, //考试持续时间
reduceAnswer:[], //vue官方不支持3层以上数据嵌套,如嵌套则会数据渲染出现问题,此变量直接接收3层嵌套时的数据。
time: '5', //考试持续时间
reduceAnswer: [], //vue官方不支持3层以上数据嵌套,如嵌套则会数据渲染出现问题,此变量直接接收3层嵌套时的数据。
answerScore: 0, //答题总分数
bg_flag: false, //已答标识符,已答改变背景色
radioFlag: false, //已答标识符,已答改变背景色
radioFlag: false, //已答标识符,已答改变背景色 (判断)
radioFlagOne: false, //已答标识符,已答改变背景色(单选)
radioFlagMore: false, //已答标识符,已答改变背景色(多选)
radioFlagPd: false, //已答标识符,已答改变背景色(判断)
isFillClick: false, //选择题是否点击标识符
slider_flag: true, //左侧显示隐藏标识符
flag: false, //个人信息显示隐藏标识符
currentType: 1, //当前题型类型 1--选择题 2--填空题 3--判断题
radio: [], //保存考生所有选择题的选项
title: "请选择正确的选项",
optionValue:"",//题干类型
optionValue: "",//题干类型
index: 0, //全局index
userInfo: { //用户信息
name: null,
......@@ -262,21 +267,30 @@ export default {
part: null, //填空题的空格数量
fillAnswer: [[]], //二维数组保存所有填空题答案
judgeAnswer: [], //保存所有判断题答案
topic1Answer: [], //学生选择题作答编号,
topic1Answer: [], //学生选择题作答编号（单选）,
topic2Answer: [], //学生选择题作答编号(多选),
rightAnswer: '',
roleflag: false,
isOptionSelected:false,// 提交按钮
checkList:[]
isOptionSelected: false,// 提交按钮
checkList: [],
end: ''
}
},
created() {
this.getUrlParams()
this.getExamData()
this.showTime()
//获取当前时间
var date = new Date();
var now = date.getTime();
var fiveMinutesInMillis = 5 * 60 * 1000; // 五分钟的毫秒数
//设置截止时间
var endDate = new Date(now + fiveMinutesInMillis);
this.end = endDate.getTime();
this.countTime()
},
watch: {
optionValue(newValue) {
console.log(this.optionValue )
console.log(this.optionValue)
},
},
......@@ -288,19 +302,19 @@ export default {
},
getTime(date) { //日期格式化
let year = date.getFullYear()
let month= date.getMonth()+ 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
let day=date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
let hours=date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
let minutes=date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
let seconds=date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
// 拼接
return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
},
getUrlParams() { //从路由上获取参数
this.userInfo.name = this.$route.query.cname
this.userInfo.id = this.$route.query.cid
let role = this.$route.query.role
if(role == "0"){
if (role == "0") {
this.roleflag = true;
}
},
......@@ -312,53 +326,59 @@ export default {
this.startTime = this.getTime(date)
let examCode = this.$route.query.examCode //获取路由传递过来的试卷编号
this.$axios(`/api/exam/${examCode}`).then(res => { //通过examCode请求试卷详细信息
this.examData = {...res.data.data} //获取考试详情
this.examData = { ...res.data.data } //获取考试详情
this.index = 0
this.time = this.examData.totalScore //获取分钟数
//this.time = this.examData.totalScore //获取分钟数
let paperId = this.examData.paperId
this.$axios(`/api/paper/${paperId}`).then(res => { //通过paperId获取试题题目信息
this.topic = {...res.data}
let reduceAnswer = this.getRandomData(this.topic[1], this.topic[2], this.topic[3]) //获取随机一道题
console.log(reduceAnswer)
this.topic = { ...res.data }
let reduceAnswer;
//let reduceAnswer = this.getRandomData(this.topic[1], this.topic[2], this.topic[3]) //获取第一道题
if (this.topic[1].length > 0) {
reduceAnswer = this.topic[1][0];
}
if (this.topic[3].length > 0) {
reduceAnswer = this.topic[3][0];
}
console.log('题' + reduceAnswer)
this.reduceAnswer = reduceAnswer
if (reduceAnswer.oneOrMore=='1'){
if (reduceAnswer.oneOrMore == '1') {
this.optionValue = "单选题"
this.showAnswer ={
answerA:reduceAnswer.answerA,
Aimg:reduceAnswer.aimg,
answerB:reduceAnswer.answerB,
Bimg:reduceAnswer.bimg,
answerC:reduceAnswer.answerC,
Cimg:reduceAnswer.cimg,
answerD:reduceAnswer.answerD,
Dimg:reduceAnswer.dimg,
}
}else if (reduceAnswer.oneOrMore=='2'){
this.currentType = 1
this.showAnswer = {
answerA: reduceAnswer.answerA,
Aimg: reduceAnswer.aimg,
answerB: reduceAnswer.answerB,
Bimg: reduceAnswer.bimg,
answerC: reduceAnswer.answerC,
Cimg: reduceAnswer.cimg,
answerD: reduceAnswer.answerD,
Dimg: reduceAnswer.dimg,
}
} else if (reduceAnswer.oneOrMore == '2') {
this.optionValue = "多选题"
this.showAnswer ={
answerA:reduceAnswer.answerA,
Aimg:reduceAnswer.aimg,
answerB:reduceAnswer.answerB,
Bimg:reduceAnswer.bimg,
answerC:reduceAnswer.answerC,
Cimg:reduceAnswer.cimg,
answerD:reduceAnswer.answerD,
Dimg:reduceAnswer.dimg,
}
}else if (!reduceAnswer.oneOrMore) {
this.currentType = 1
this.showAnswer = {
answerA: reduceAnswer.answerA,
Aimg: reduceAnswer.aimg,
answerB: reduceAnswer.answerB,
Bimg: reduceAnswer.bimg,
answerC: reduceAnswer.answerC,
Cimg: reduceAnswer.cimg,
answerD: reduceAnswer.answerD,
Dimg: reduceAnswer.dimg,
}
} else if (!reduceAnswer.oneOrMore) {
reduceAnswer.oneOrMore = '3'
this.currentType = 3
this.optionValue = '判断题'
if (reduceAnswer.answer =='T'){
this.pdtanswer = "正确"
}else {
this.pdtanswer = "错误"
}
}
this.showQuestion = reduceAnswer.question
})
})
},
/* getExamData() { //获取当前试卷所有信息
/* getExamData() { //获取当前试卷所有信息
let date = new Date()
this.startTime = this.getTime(date)
let examCode = this.$route.query.examCode //获取路由传递过来的试卷编号
......@@ -400,8 +420,100 @@ export default {
})
})
},*/
change(index) { //选择题
let Data = this.topic[1]
let reduceAnswer = this.topic[1][this.index]
this.reduceAnswer = reduceAnswer
this.isFillClick = true
this.currentType = 1
let len = this.topic[1].length
if (this.index < len) {
if (this.index < 0) {
this.index = this.topic[1].length - 1
this.change(this.index)
}
if (Data[this.index].oneOrMore == 1) {
this.optionValue = '单选题';
var topic1Right = document.getElementById("topic1Right");// 答案以=及解析
if (topic1Right != null && topic1Right != undefined) {
if (this.topic1Answer[this.index] != undefined) {
topic1Right.style.display = "block";
this.radioFlagOne = true
this.isradio = true
} else {
topic1Right.style.display = "none";
this.radioFlagOne = false
this.isradio = false
}
}
} else if (Data[this.index].oneOrMore == 2) {
this.optionValue = '多选题';
var topic2Right = document.getElementById("topic2Right");// 答案以=及解析
if(topic2Right != null && topic2Right != undefined){
if (this.topic2Answer[this.index] != undefined) {
topic2Right.style.display = "block";
this.radioFlagMore = true
this.ischeckBox = true
this.checkList = this.topic2Answer[this.index];
} else {
topic2Right.style.display = "none";
this.radioFlagMore = false
this.ischeckBox = false
this.checkList = [];
}
}
}
console.log(`总长度${len}`)
console.log(`当前index:${index}`)
this.title = "请选择正确的选项"
// console.log(Data)
this.showQuestion = Data[this.index].question //获取题目信息
this.showAnswer = Data[this.index]
this.number = this.index + 1
} else if (this.index >= len) {
this.index = 0
this.change(this.index)
}
},
judge(index) { //判断题
debugger
let reduceAnswer = this.topic[3][this.index]
this.reduceAnswer = reduceAnswer
let len = this.topic[3].length
this.currentType = 3
this.index = index
var topic3Right = document.getElementById("topic3Right");// 答案以=及解析
if (topic3Right != null && topic3Right != undefined) {
if (this.judgeAnswer[this.index] != undefined) {
topic3Right.style.display = "block";
this.radioFlagPd = true
this.isradio = true
} else {
topic3Right.style.display = "none";
this.radioFlagPd = false
this.isradio = false
}
}
if (this.index < len) {
if (this.index < 0) {
this.index = this.topic[3].length - 1
this.judge(this.index)
} else {
console.log(`总长度${len}`)
console.log(`当前index:${this.index}`)
this.title = "请作出正确判断"
let Data = this.topic[3]
this.showQuestion = Data[index].question //获取题目信息
this.optionValue = '判断题'
this.number = this.index + 1
}
} else if (this.index >= len) {
this.index = 0
this.judge(this.index)
}
},
//获取随机题
getRandomData(multiQuestionRes ,fillQuestionsRes , judgeQuestionRes ) {
getRandomData(multiQuestionRes, fillQuestionsRes, judgeQuestionRes) {
let availableLists = [];
if (multiQuestionRes.length > 0) {
......@@ -429,28 +541,27 @@ export default {
},
//多选题点击显示提交按钮
handleCheckboxChange(val) {
debugger
console.log('多选中的值为：', val);
this.radio[this.index] = val //当前选择的序号
if(val) {
if (val) {
//点击提交禁止选择
this.isOptionSelected = true;
/* //点击提交禁止选择
this.radioFlag= true*/
}
/* 保存学生答题选项 */
// this.topic1Answer[this.index] = val
},
//多选点击提交的时候再触发
submitAnswer(){
submitAnswer() {
//答案和解析
var topic1Right = document.getElementById("topic1Right");
topic1Right.style.display = "block";
var topic2Right = document.getElementById("topic2Right");
topic2Right.style.display = "block";
//提交的按钮
this.isOptionSelected = false
//点击提交禁止选择
this.radioFlag = true
this.radioFlagMore = true
this.ischeckBox = true
this.commit()
//保存学生答题选项
this.topic2Answer[this.index] = this.checkList
//this.commit()
// console.log(this.topic1Answer[this.index])
// this.radio[this.index] = this.topic1Answer[this.index]
// const dasd = this.radio[this.index]
......@@ -468,35 +579,61 @@ export default {
getChangeLabel(val) {
this.radio[this.index] = val //当前选择的序号
console.log(val)
if(val) {
if (val) {
var topic1Right = document.getElementById("topic1Right");
topic1Right.style.display = "block";
this.radioFlag = true
this.radioFlagOne = true
this.isradio = true
}
/* 保存学生答题选项 */
this.topic1Answer[this.index] = val
this.commit()
//this.commit()
},
//获取判断题作答选项
getJudgeLabel(val) {
this.judgeAnswer[this.index] = val
if(val) {
if (val) {
var topic3Right = document.getElementById("topic3Right");
topic3Right.style.display = "block";
this.radioFlag = true
this.radioFlagPd = true
this.isradio = true
}
this.commit()
//this.commit()
},
previous() { //上一题
debugger
this.index--
switch (this.currentType) {
case 1:
this.change(this.index)
break
case 3:
this.judge(this.index)
break
}
},
next() { //下一题
this.index++
switch (this.currentType) {
case 1:
this.change(this.index)
break
case 3:
this.judge(this.index)
break
}
},
commit() { //答案提交计算分数
/* 计算选择题总分 */
let finalScore = 0 //分数
if (this.optionValue=="单选题"){
if (this.optionValue == "单选题"||this.optionValue == "") {
// 单选分数计算
let topic1Answer = this.topic1Answer
topic1Answer.forEach((element,index) => { //循环每道选择题根据选项计算分数
topic1Answer.forEach((element, index) => { //循环每道选择题根据选项计算分数
let right = null
if(element != null) {
switch(element) { //选项1,2,3,4 转换为 "A","B","C","D"
if (element != null) {
switch (element) { //选项1,2,3,4 转换为 "A","B","C","D"
case 1:
right = "A"
break
......@@ -509,17 +646,20 @@ export default {
case 4:
right = "D"
}
if(right == this.reduceAnswer.rightAnswer) { // 当前选项与正确答案对比
finalScore = this.reduceAnswer.score // 计算总分数
if (right == this.topic[1][index].rightAnswer) { // 当前选项与正确答案对比
finalScore += this.topic[1][index].score // 计算总分数
}
this.isradio = true
}
})
} else if (this.optionValue == "多选题") {
// 多选分数计算
let topic2Answer = this.topic2Answer
topic2Answer.forEach((element, index) => { //循环每道选择题根据选项计算分数
//正确答案
const arr = this.reduceAnswer.rightAnswer.split(", ");
const arr = this.topic[1][index].rightAnswer.split(", ");
//选中的
const letterArray = this.checkList.map(number => String.fromCharCode(64 + parseInt(number, 10)).toUpperCase());
const letterArray = element.map(number => String.fromCharCode(64 + parseInt(number, 10)).toUpperCase());
console.log(arr)
console.log(letterArray)
// 对两个数组进行排序，并将其转换为字符串
......@@ -529,29 +669,43 @@ export default {
console.log(str2)
if (str1 === str2) {
console.log("回答正确")
finalScore = this.reduceAnswer.score
finalScore += this.topic[1][index].score
}
}else if (this.optionValue=="判断题"){
this.isradio = true
})
} else if (this.optionValue == "判断题") {
let pitch = this.judgeAnswer[this.index]
console.log("当前选中的 = "+ pitch)
if (pitch=='1'){
pitch = "T"
}else {
pitch = "F"
// let pitch = this.judgeAnswer[this.index]
// console.log("当前选中的 = "+ pitch)
// if (pitch=='1'){
// pitch = "T"
// }else {
// pitch = "F"
// }
// console.log(pitch)
// if (pitch === this.reduceAnswer.answer){
// finalScore = this.reduceAnswer.score
// }
let topic3Answer = this.judgeAnswer
topic3Answer.forEach((element, index) => {
let right = null
switch (element) {
case 1:
right = "T"
break
case 2:
right = "F"
}
console.log(pitch)
if (pitch === this.reduceAnswer.answer){
finalScore = this.reduceAnswer.score
if (right == this.topic[3][index].answer) { // 当前选项与正确答案对比
finalScore += this.topic[3][index].score // 计算总分数
}
})
}
console.log(`目前总分${finalScore}`)
if(this.time != 0) {
if (this.time != 0) {
console.log("交卷")
let date = new Date()
this.endTime = this.getTime(date)
let answerDate = this.endTime.substr(0,10)
let answerDate = this.endTime.substr(0, 10)
this.$axios({
url: '/api/score',
method: 'post',
......@@ -563,36 +717,50 @@ export default {
answerDate: answerDate, //答题日期
}
}).then(res => {
if(res.data.code == 200) {
console.log("关闭当前页面")
if (res.data.code == 200) {
this.$router.push({
path: '/studentScore', query: {
score: finalScore,
startTime: this.startTime,
endTime: this.endTime,
cid: this.$route.query.cid,
cname: this.$route.query.cname,
role: this.$route.query.role
}
})
console.log("出总分数")
}
}).catch(() => {
console.log("继续答题")
})
}
},
showTime() { //倒计时
setInterval(() => {
this.time -= 1
if(this.time == 10) {
this.$message({
showClose: true,
type: 'error',
message: '考生注意,考试时间还剩10分钟！！！'
})
if(this.time == 0) {
countTime() {//倒计时
//获取当前时间
var date = new Date();
var now = date.getTime();
//设置截止时间
//时间差
var leftTime = this.end - now;
//定义变量 d,h,m,s保存倒计时的时间
if (leftTime >= 0) {
let m = Math.floor(leftTime / 1000 / 60 % 60);
let s = Math.floor(leftTime / 1000 % 60);
this.time = m + '分' + s + '秒'
//递归每秒调用countTime方法，显示动态时间效果
setTimeout(this.countTime, 1000);
}else{
console.log("考试时间已到,强制交卷。")
this.commit();
}
}
},1000 * 60)
},
},
computed:mapState(["isPractice"])
computed: mapState(["isPractice"])
}
</script>
<style lang="less">
.titleClass{
.titleClass {
font-family: 'youshe';
color: white;
font-size: 40px;
......@@ -602,49 +770,55 @@ export default {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* 在 756px 或以下的屏幕上应用这些样式 */
@media (max-width: 756px) {
.itemTwo{
}
/* 在 756px 或以下的屏幕上应用这些样式 */
@media (max-width: 756px) {
.itemTwo {
display: flex;
flex-direction: column;
margin-top: -10px;
margin-bottom: -15px;
}
.titleClass{
.titleClass {
width: 70vw;
}
}
}
/* 在 756px 以上的屏幕上应用这些样式 */
@media (min-width: 757px) {
.itemTwo{
/* 在 756px 以上的屏幕上应用这些样式 */
@media (min-width: 757px) {
.itemTwo {
display: flex;
}
}
.jinhuiClass{
}
.jinhuiClass {
height: 80px;
margin-top: -15px;
margin-bottom: -15px;
margin-left: -10px;
}
@font-face {
}
@font-face {
font-family: "youshe";
src: url("../../assets/fonts/YouSheBiaoTiHei-2.ttf");
}
/*放大的图片*/
.el-image-viewer__img{
}
/*放大的图片*/
.el-image-viewer__img {
height: 500px;
}
.submitAnswerClass{
}
.submitAnswerClass {
/*background-color: red;*/
margin-top: 15px;
}
.noStyle{
}
}
//对号
.checkboxTrueStyle::before{
.noStyle {}
//对号
.checkboxTrueStyle::before {
content: "";
position: absolute;
top: -14px;
......@@ -656,9 +830,10 @@ export default {
border-right: 5px solid #2776df;
transform: rotate(45deg);
z-index: 2;
}
//多选题错号
.checkboxFlaseStyle::before{
}
//多选题错号
.checkboxFlaseStyle::before {
content: "×";
position: absolute;
top: -3px;
......@@ -671,9 +846,10 @@ export default {
-1px 1px 0 #f50808,
1px 1px 0 #f50808;
z-index: 2;
}
//判断题错号
.radioFlaseStyle::before{
}
//判断题错号
.radioFlaseStyle::before {
content: "×";
position: absolute;
top: -19px;
......@@ -686,14 +862,17 @@ export default {
-1px 1px 0 #f50808,
1px 1px 0 #f50808;
z-index: 2;
}
}
.iconfont.icon-time {
.iconfont.icon-time {
color: #2776df;
margin: 0px 6px 0px 20px;
}
.analysis {
margin-top: 20px;
//正确选项后边的字体
.right {
color: black;
......@@ -704,23 +883,26 @@ export default {
border-radius: 4px;
margin-left: 20px;
}
ul li:nth-child(2) {
margin: 90px 0px;
display: flex;
}
/*最后一个li标签*/
/* ul li:nth-child(3) {
/* ul li:nth-child(3) {
padding: 10px;
background-color: #fff;
border-radius: 4px;
}*/
.first{
.el-tag{
.first {
.el-tag {
background-color: #2776df;
color:white;
color: white;
}
}
.second{
.second {
align-items: center;
/*align-items: flex-end;*/
/*position: absolute;*/
......@@ -728,13 +910,14 @@ export default {
margin-right: 10px;
margin-top: 30px;
.el-tag{
.el-tag {
background-color: #2776df;
color:white;
color: white;
}
//题目解析后边的样式
.li2right{
.li2right {
margin-left: 25px;
margin-right: 20px;
letter-spacing: 5px;
......@@ -745,8 +928,10 @@ export default {
/*border: 1px solid #2776df;*/
color: black;
font-weight: bold;
max-height: 250px; /* 设置固定高度，根据需要调整 */
overflow: auto; /* 添加滚动条 */
max-height: 250px;
/* 设置固定高度，根据需要调整 */
overflow: auto;
/* 添加滚动条 */
}
}
......@@ -758,6 +943,7 @@ export default {
bottom: 0px;
font-family: 'SimSun', sans-serif;
}
.mark {
position: absolute;
width: 4px;
......@@ -768,31 +954,39 @@ export default {
top: 0px;
left: 22px;
}
.border {
position: relative;
border: 1px solid #FF90AA !important;
}
.bg {
background-color: #5188b8 !important;
}
.fill .el-input {
display: inline-flex;
width: 150px;
margin-left: 20px;
.el-input__inner {
border: 1px solid transparent;
border-bottom: 1px solid #eee;
padding-left: 20px;
}
}
/* slider过渡效果 */
.slider-fade-enter-active {
transition: all .3s ease;
}
.slider-fade-leave-active {
transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}
.slider-fade-enter, .slider-fade-leave-to {
.slider-fade-enter,
.slider-fade-leave-to {
transform: translateX(-100px);
opacity: 0;
}
......@@ -802,20 +996,22 @@ export default {
flex-direction: column;
justify-content: center;
align-items: center;
background-color: rgb(39, 118, 223);
border-radius: 50%;
/*width: 50px;*/
height: 50px;
color: #fff;
color: red;
}
.operation .end li {
cursor: pointer;
margin: 0 100px;
color: #fff;
color: red;
border: 2px solid red;
border-radius: 10px;
}
.operation {
background-color: #2776df;
border-radius: 4px;
padding: 10px 0px;
margin-right: 10px;
......@@ -824,13 +1020,16 @@ export default {
position: absolute;
bottom: 0px;
}
.operation .end {
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-size: 22px;
font-size: 25px;
}
.content .number {
display: inline-flex;
justify-content: center;
......@@ -841,9 +1040,11 @@ export default {
border-radius: 4px;
margin-right: 4px;
}
.content {
padding: 0px 20px;
}
//题干的样式
.content .topic {
padding: 20px 0px;
......@@ -855,6 +1056,7 @@ export default {
line-height: 1.5;
letter-spacing: 5px;
}
.right .content {
margin: 10px;
margin-left: 0px;
......@@ -862,9 +1064,10 @@ export default {
font-size: 24px;
/*font-family: cursive;*/
font-family: 'SimSun', sans-serif;
letter-spacing:1px;//字间距
letter-spacing: 1px; //字间距
}
//判断题的选项
.content .el-radio-group label {
color: black;
......@@ -874,11 +1077,11 @@ export default {
line-height: 2;
}
.el-radio{
.el-radio__label{
.el-radio {
.el-radio__label {
font-size: 25px;
font-family: 'SimSun', sans-serif;
white-space:normal;
white-space: normal;
line-height: 25px;
}
......@@ -886,21 +1089,22 @@ export default {
.content .el-radio-group {
display: flex;
flex-direction:column;
flex-direction: column;
}
.el-radio__input{
.el-radio__input {
vertical-align: baseline;
}
/*前边的小圆圈*/
.el-radio__input.is-disabled.is-checked .el-radio__inner{
background-color:black;
.el-radio__input.is-disabled.is-checked .el-radio__inner {
background-color: black;
border: 1px solid black;
margin-right: 10px;
}
}
/*选项*/
.el-radio__input.is-checked + .el-radio__label {
/*选项*/
.el-radio__input.is-checked+.el-radio__label {
color: white;
background-color: rgb(39, 118, 223);
/*right: 50px;*/
......@@ -909,7 +1113,8 @@ export default {
border-width: 0px;
box-sizing: border-box;
padding: 2px;
}
}
/*title的样式*/
.right .title p {
color: black;
......@@ -917,20 +1122,24 @@ export default {
margin-left: 20px;
font-size: 25px;
font-family: 'SimSun', sans-serif;
letter-spacing:2px
letter-spacing: 2px
}
.flexarea {
display: flex;
padding-top: 90px;
}
.flexarea .right {
flex: 1;
}
.auto-right {
margin-left: auto;
color: #fff;
margin-right: 10px;
}
.right .title {
margin-right: 10px;
/*padding-right: 30px;*/
......@@ -943,9 +1152,11 @@ export default {
font-family: 'SimSun', sans-serif;
}
.clearfix {
clear: both;
}
.l-bottom .final {
cursor: pointer;
display: inline-block;
......@@ -962,15 +1173,18 @@ export default {
font-family: 'SimSun', sans-serif;
}
#answer .left .item {
padding: 0px;
font-size: 24px;
font-family: 'SimSun', sans-serif;
}
.l-bottom {
border-radius: 4px;
}
.l-bottom .item p {
margin-bottom: 15px;
margin-top: 10px;
......@@ -978,15 +1192,18 @@ export default {
margin-left: 10px;
letter-spacing: 2px;
}
.l-bottom .item li {
width: 15%;
margin-left: 5px;
margin-bottom: 10px;
}
.l-bottom .item {
display: flex;
flex-direction: column;
}
.l-bottom .item ul {
width: 100%;
margin-bottom: -8px;
......@@ -994,6 +1211,7 @@ export default {
justify-content: space-around;
flex-wrap: wrap;
}
.l-bottom .item ul li a {
position: relative;
justify-content: center;
......@@ -1010,6 +1228,7 @@ export default {
font-family: 'SimSun', sans-serif;
}
.left .l-top {
display: flex;
justify-content: space-around;
......@@ -1018,23 +1237,28 @@ export default {
border-radius: 4px;
margin-bottom: 10px;
}
.left {
width: 260px;
height: 100%;
margin: 10px 10px 0px 10px;
}
.left .l-top li:nth-child(2) a {
border: 1px solid #eee;
}
.left .l-top li:nth-child(3) a {
background: url('../../assets/img/dtbj.png')center top / cover no-repeat;
background-color: #b6bccdd1 !important;
border: none;
}
.left .l-top li:nth-child(4) a {
position: relative;
border: 1px solid #eee;
}
.left .l-top li:nth-child(4) a::before {
width: 4px;
height: 4px;
......@@ -1045,6 +1269,7 @@ export default {
top: 0px;
left: 16px;
}
.left .l-top li {
display: flex;
justify-content: center;
......@@ -1052,6 +1277,7 @@ export default {
flex-direction: column;
color: #fff;
}
.left .l-top li a {
display: inline-block;
padding: 10px;
......@@ -1059,6 +1285,7 @@ export default {
background-color: #fff;
border: 1px solid #FF90AA;
}
#answer .top {
/*background-color: rgb(39, 118, 223);*/
/*background-color: #dc4b4b;*/
......@@ -1067,15 +1294,18 @@ export default {
position: fixed;
width: 100%;
}
#answer .item {
display: flex;
padding-bottom: 20px;
padding-top: 20px;
font-size: 23px;
}
#answer .top .item li:nth-child(1) {
margin-right: 10px;
}
//名称
#answer .top .item li:nth-child(3) {
position: relative;
......@@ -1085,27 +1315,32 @@ export default {
align-items: center;
color: white;
}
//个人统计
#answer .top .item li:nth-child(4) {
#answer .top .item li:nth-child(4) {
font-weight: bold;
display: flex;
align-items: center;
}
//视频
#answer .top .item li:nth-child(5){
}
//视频
#answer .top .item li:nth-child(5) {
display: flex;
align-items: center;
justify-content: center;
margin-left: 10px;
}
}
#answer {
position:relative;
position: relative;
padding-bottom: 30px;
}
.icon20 {
font-size: 20px;
font-weight: bold;
}
.item .msg {
padding: 10px 15px;
border-radius: 4px;
......@@ -1113,22 +1348,27 @@ export default {
right: -30px;
color: #6c757d;
position: absolute;
border: 1px solid rgba(0,0,0,.15);
border: 1px solid rgba(0, 0, 0, .15);
background-color: #fff;
}
.item .msg p {
font-size: 20px;
width: 200px;
text-align: left;
}
.router1 {
color: white;
font-weight: bold;
margin-right: 5px;
border: 2px solid white;
border-radius: 10px;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
//背景
.bg {
position: fixed;
......@@ -1138,49 +1378,59 @@ export default {
height: 100%;
background: url('../../assets/img/beij2.jpg')center top / cover no-repeat;
background-size: 100% 100%;
max-height: 100%; /* 设置固定高度，根据需要调整 */
overflow: auto; /* 添加滚动条 */
max-height: 100%;
/* 设置固定高度，根据需要调整 */
overflow: auto;
/* 添加滚动条 */
}
/*多选的*/
.el-checkbox__input .el-checkbox__inner {
.el-checkbox__input .el-checkbox__inner {
width: 16px;
height: 16px;
border-radius: 100%;
border: 1px solid black;
/*background-color: #fff;*/
}
//多选选中的样式
.el-checkbox__label{
}
//多选选中的样式
.el-checkbox__label {
color: black;
font-weight: bold;
font-size: 25px !important;
font-family: 'SimSun', sans-serif;
white-space:normal;
white-space: normal;
line-height: 25px !important;
}
.content .el-checkbox-group{
}
.content .el-checkbox-group {
display: flex;
flex-direction:column;
}
.content .el-checkbox-group label {
flex-direction: column;
}
.content .el-checkbox-group label {
color: #fff;
margin: 10px 0px;
}
.el-checkbox__input{
}
.el-checkbox__input {
vertical-align: baseline;
}
.el-checkbox__input.is-checked .el-checkbox__inner{
background-color:black;
}
.el-checkbox__input.is-checked .el-checkbox__inner {
background-color: black;
/*border-color:#E4E7ED;*/
margin-right: 10px;
}
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner{
background-color:black;
}
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
background-color: black;
/*border-color:white;*/
margin-right: 10px;
}
//多选点击后未选中的样式
.el-checkbox__input.is-checked+.el-checkbox__label{
}
//多选点击后未选中的样式
.el-checkbox__input.is-checked+.el-checkbox__label {
color: black;
font-weight: bold;
background-color: rgb(39, 118, 223);
......@@ -1191,29 +1441,33 @@ export default {
box-sizing: border-box;
padding: 2px;
}
//判断和单选选中后选项的样式
.el-radio__input.is-disabled+span.el-radio__label{
}
//判断和单选选中后选项的样式
.el-radio__input.is-disabled+span.el-radio__label {
color: black;
font-weight: bold;
}
//多选提交后选项的样式
.el-checkbox__input.is-disabled+span.el-checkbox__label{
.el-checkbox__input.is-disabled+span.el-checkbox__label {
color: black;
font-weight: bold;
}
//选项前边的小圆圈未选中
.el-radio__inner {
border: 1px solid black;
}
//选项前边的小圆圈选中 单选和判断
.el-radio__input.is-disabled .el-radio__inner{
.el-radio__input.is-disabled .el-radio__inner {
border: 1px solid black;
background: black ;
}
//多选前面的圆点
.el-checkbox__input.is-disabled .el-checkbox__inner{
background: black;
}
//多选前面的圆点
.el-checkbox__input.is-disabled .el-checkbox__inner {
border: 1px solid black;
background: black;
}
</style>
}</style>
src/components/student/answerScore.vue
......@@ -17,7 +17,7 @@
<ul class="time">
<li class="start"><span>开始时间</span> <span>{{startTime}}</span></li>
<li class="end"><span>结束时间</span> <span>{{endTime}}</span></li>
<div class="final" @click="over()">结束考试</div>
<!-- <div class="final" @click="over()">结束考试</div> -->
</ul>
</div>
</div>
......@@ -146,8 +146,9 @@ export default {
flex-direction: column;
.name {
font-size: 26px;
color: #fff;
color: red;
font-weight: 500;
font-family:'youshe';
}
.description {
font-size: 14px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment