|
|
|
@ -0,0 +1,695 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="tz-exam-header">
|
|
|
|
|
<div class="tz-exam-header-line">
|
|
|
|
|
<div>
|
|
|
|
|
<b-img class="tz-logo" src="/static/image/logo_white.png" />
|
|
|
|
|
<b-img src="/static/image/exam_title.png" />
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="exam-header-title">
|
|
|
|
|
<div>
|
|
|
|
|
{{ competition.name}}--金融实操赛项
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-content">
|
|
|
|
|
<div class="tz-exam-left-panel">
|
|
|
|
|
<div class="tz-exam-box">
|
|
|
|
|
<div class="tz-exam-box-title2">{{userInfo.school +' '+ userInfo.name}}</div>
|
|
|
|
|
<div class="tz-exam-box-content">
|
|
|
|
|
<b-img src="/static/image/tx80x80.png" /> 考试日期: {{ new Date(memberInfo.examStartTime).Format('yyyy-MM-dd hh:mm:ss') }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-box-content">
|
|
|
|
|
<div>交卷日期: {{new Date(memberInfo.examEndTime).Format('yyyy-MM-dd hh:mm:ss')}}</div>
|
|
|
|
|
<div>用时: {{(memberInfo.examCostTime/60000).toFixed()}} 分钟</div>
|
|
|
|
|
<div>
|
|
|
|
|
得分: {{memberInfo.examScore}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-box">
|
|
|
|
|
<div class="tz-exam-box-title">
|
|
|
|
|
<b-img src="/static/image/icon_answer2_25x25.png" />
|
|
|
|
|
单选题
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-box-content">
|
|
|
|
|
<span v-for="(item,$index) in singleQuestion" :key="$index" :class="getStatus(item.id)" @click="anchor(item.id)" > {{ item.id }} </span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-box">
|
|
|
|
|
<div class="tz-exam-box-title">
|
|
|
|
|
<b-img src="/static/image/icon_answer3_25x25.png" />
|
|
|
|
|
多选题
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-box-content">
|
|
|
|
|
<span v-for="(item,$index) in multiQuestion" :key="$index" :class="getStatus(item.id)" @click="anchor(item.id)" > {{ item.id }} </span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-box">
|
|
|
|
|
<div class="tz-exam-box-title">
|
|
|
|
|
<b-img src="/static/image/icon_answer4_25x25.png" />
|
|
|
|
|
判断题
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-exam-box-content">
|
|
|
|
|
<span v-for="(item,$index) in judgeQuestion" :key="$index" :class="getStatus(item.id)" @click="anchor(item.id)" > {{ item.id }} </span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="tz-exam-box-tips">
|
|
|
|
|
<span class="done">已答</span><span class="notAnwser">未答</span><span class="sign">标记</span>
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="exam-question-content">
|
|
|
|
|
<div class="exam-tab">
|
|
|
|
|
<div :class=" tabId == 0?'exam-tab-selected':'' " @click="changeTab(0)" >单选题</div>
|
|
|
|
|
<div :class=" tabId == 1?'exam-tab-selected':'' " @click="changeTab(1)">多选题</div>
|
|
|
|
|
<div :class=" tabId == 2?'exam-tab-selected ':'' " @click="changeTab(2)" >判断题</div>
|
|
|
|
|
<div :class=" tabId == 3?'exam-tab-selected ':'' " @click="changeTab(3)">案例题</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="exam-tab-content">
|
|
|
|
|
<div>
|
|
|
|
|
<a name="single" />
|
|
|
|
|
单选题(共<span>{{singleInfo.size}}</span>题,每题<span>{{singleInfo.score}}</span>分,共<span>{{singleInfo.sumScore}}</span>分)
|
|
|
|
|
</div>
|
|
|
|
|
<div v-for="cq in singleQuestion" :key="cq.id">
|
|
|
|
|
<a :name="cq.id" />
|
|
|
|
|
<div class="question-stem">
|
|
|
|
|
{{cq.id}}.{{cq.item.stem}}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left" >我的选项: {{getMyAnswer(cq.item.id,0)}}</div>
|
|
|
|
|
<div v-if="cq.item.questionType == 1">
|
|
|
|
|
<div v-for="item in cq.item.answerList" :key="item.id" class="question">
|
|
|
|
|
<b-radio disabled v-model="cq.item.answerId" :value="item.id" @change="checkStatus(cq.id)" ></b-radio> <span> {{ idToName(item.id)}}.</span>{{item.title}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left">
|
|
|
|
|
解析: {{ cq.item.analysis}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<a name="multi" />
|
|
|
|
|
多选题(共<span>{{multiInfo.size}}</span>题,每题<span>{{multiInfo.score}}</span>分,共<span>{{ multiInfo.sumScore}}</span>分)
|
|
|
|
|
</div>
|
|
|
|
|
<div v-for="cq in multiQuestion" :key="cq.id">
|
|
|
|
|
<a :name="cq.id" />
|
|
|
|
|
<div v-if="!!cq.item" class="question-stem" >
|
|
|
|
|
{{cq.id}}.{{cq.item.stem}}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left">我的选项: {{getMyAnswer(cq.item.id,0)}}</div>
|
|
|
|
|
<div v-if="!!cq.item&&cq.item.questionType == 2">
|
|
|
|
|
<div v-for="item in cq.item.answerList" :key="item.id" class="question">
|
|
|
|
|
<b-check disabled v-model="cq.item.answerId" :value="item.id" @change="checkStatus(cq.id)" ></b-check> <span> {{ idToName(item.id)}}.</span>{{item.title}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left">
|
|
|
|
|
解析: {{ cq.item.analysis}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<a name="judge" />
|
|
|
|
|
判断题(共<span>{{judgeInfo.size}}</span>题,每题<span>{{judgeInfo.score}}</span>分,共<span>{{judgeInfo.sumScore}}</span>分)
|
|
|
|
|
</div>
|
|
|
|
|
<div v-for="cq in judgeQuestion" :key="cq.id">
|
|
|
|
|
<a :name="cq.id" />
|
|
|
|
|
<div v-if="!!cq.item" class="question-stem" >
|
|
|
|
|
{{cq.id}}.{{cq.item.stem}}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left">我的选项: {{getMyAnswer(cq.item.id,0)}}</div>
|
|
|
|
|
<div v-if="!!cq.item&&cq.item.questionType == 3">
|
|
|
|
|
<div v-for="item in cq.item.answerList" :key="item.id" class="question">
|
|
|
|
|
<b-radio disabled v-model="cq.item.answerId" :value="item.id" @change="checkStatus(cq.id)" ></b-radio> <span> {{ idToName(item.id)}}.</span>{{item.title}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left">
|
|
|
|
|
解析: {{ cq.item.analysis}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
<a name="anli" />
|
|
|
|
|
案例题(共<span>{{anliInfo.size}}</span>题,每题<span>{{anliInfo.score}}</span>分,共<span>{{anliInfo.sumScore}}</span>分)
|
|
|
|
|
</div>
|
|
|
|
|
<div v-for="cq in anliQuestion" :key="cq.id">
|
|
|
|
|
<a :name="cq.id" />
|
|
|
|
|
<div class="anli_title">案例名称:</div>
|
|
|
|
|
<div class="anli_sub_title" v-if="!!cq.item">
|
|
|
|
|
{{cq.item.stem}}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="anli_title">案例介绍:</div>
|
|
|
|
|
<div class="anli_sub_title" v-html="cq.item.content"></div>
|
|
|
|
|
<hr class="tz-line-dash" />
|
|
|
|
|
<div v-for="subcq in cq.item.children" :key="subcq.id">
|
|
|
|
|
<div class="question-stem">
|
|
|
|
|
{{subcq.id}}.{{subcq.stem}}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left">我的选项: {{getMyAnswer(cq.item.id,subcq.id)}}</div>
|
|
|
|
|
<div v-if="subcq.questionType == 1 || subcq.questionType ==3 ">
|
|
|
|
|
<div v-for="subitem in subcq.answerList" :key="subitem.id" class="question">
|
|
|
|
|
<b-radio disabled v-model="subcq.answerId" :name="cq.id+'_'+subcq.id+''" :value="subitem.id" ></b-radio> <span> {{ idToName(subitem.id)}}.</span>{{subitem.title}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div v-if="subcq.questionType == 2">
|
|
|
|
|
<div v-for="subitem in subcq.answerList" :key="subitem.id" class="question">
|
|
|
|
|
<b-check disabled v-model="subcq.answerId" :name="cq.id+'_'+subcq.id+''" :value="subitem.id" ></b-check> <span> {{ idToName(subitem.id)}}.</span>{{subitem.title}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tz-text-left">
|
|
|
|
|
解析: {{ subcq.analysis}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<tz-footer />
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import CutDown from './cutdown.vue'
|
|
|
|
|
import Footer from '@/components/footer.vue'
|
|
|
|
|
import ConfirmDialog from '@/views/dialog/confirmdialog.vue'
|
|
|
|
|
import * as examApi from '@/api/competition'
|
|
|
|
|
import * as memberApi from '@/api/member'
|
|
|
|
|
import { getInfo } from '@/utils/auth'
|
|
|
|
|
export default {
|
|
|
|
|
data(){
|
|
|
|
|
return {
|
|
|
|
|
singleInfo: {
|
|
|
|
|
size: 0,
|
|
|
|
|
score: 0,
|
|
|
|
|
sumScore: 0
|
|
|
|
|
},
|
|
|
|
|
multiInfo: {
|
|
|
|
|
size: 0,
|
|
|
|
|
score: 0,
|
|
|
|
|
sumScore: 0
|
|
|
|
|
},
|
|
|
|
|
judgeInfo: {
|
|
|
|
|
size: 0,
|
|
|
|
|
score: 0,
|
|
|
|
|
sumScore: 0
|
|
|
|
|
},
|
|
|
|
|
anliInfo: {
|
|
|
|
|
size: 0,
|
|
|
|
|
score: 0,
|
|
|
|
|
sumScore: 0
|
|
|
|
|
},
|
|
|
|
|
singleQuestion: [],
|
|
|
|
|
multiQuestion: [],
|
|
|
|
|
judgeQuestion: [],
|
|
|
|
|
anliQuestion:[],
|
|
|
|
|
doneList:[],
|
|
|
|
|
markList:[],
|
|
|
|
|
current: 1,
|
|
|
|
|
pre: 1,
|
|
|
|
|
currentQ: null,
|
|
|
|
|
userInfo: null,
|
|
|
|
|
tabId: 0,
|
|
|
|
|
compId: 0,
|
|
|
|
|
stageId: 0,
|
|
|
|
|
confirm: false,
|
|
|
|
|
dlgVisiable: true,
|
|
|
|
|
competition: null,
|
|
|
|
|
memberInfo: {},
|
|
|
|
|
examInfo: {
|
|
|
|
|
startTime: null,
|
|
|
|
|
endTime: null,
|
|
|
|
|
doneList:[],
|
|
|
|
|
markList:[],
|
|
|
|
|
current: 1,
|
|
|
|
|
},
|
|
|
|
|
myAnwserlist: []
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods:{
|
|
|
|
|
getStatus(id){
|
|
|
|
|
let c = "";
|
|
|
|
|
if(id == this.current){
|
|
|
|
|
c = "current "
|
|
|
|
|
}
|
|
|
|
|
if(this.markList.indexOf(id)>=0){
|
|
|
|
|
return c +" sign"
|
|
|
|
|
}
|
|
|
|
|
if(this.doneList.indexOf(id)>=0){
|
|
|
|
|
return c+ " done"
|
|
|
|
|
}
|
|
|
|
|
return c +" notAnwser";
|
|
|
|
|
},
|
|
|
|
|
changeTab(id){
|
|
|
|
|
this.tabId = id
|
|
|
|
|
if(id == 0){
|
|
|
|
|
location.href="#single"
|
|
|
|
|
}else if(id == 1){
|
|
|
|
|
location.href="#multi"
|
|
|
|
|
}else if(id == 2){
|
|
|
|
|
location.href = "#judge"
|
|
|
|
|
}else if(id == 3){
|
|
|
|
|
location.href = "#anli"
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
idToName(index){
|
|
|
|
|
return String.fromCharCode(64+index)
|
|
|
|
|
},
|
|
|
|
|
anchor(id){
|
|
|
|
|
location.href="#"+id
|
|
|
|
|
},
|
|
|
|
|
handle(){
|
|
|
|
|
let qList = this.getQList(this.singleQuestion)
|
|
|
|
|
qList= qList.concat(this.getQList(this.multiQuestion))
|
|
|
|
|
qList=qList.concat(this.getQList(this.judgeQuestion))
|
|
|
|
|
qList=qList.concat(this.getQList(this.anliQuestion))
|
|
|
|
|
examApi.submit(this.compId,this.stageId,qList).then(res=>{
|
|
|
|
|
console.log(res)
|
|
|
|
|
if(res.code == 200){
|
|
|
|
|
alert("考试得分"+res.data.score)
|
|
|
|
|
}else{
|
|
|
|
|
alert(res.msg)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
checkStatus(id){
|
|
|
|
|
if(id!=this.current){
|
|
|
|
|
this.doneList.push(this.pre)
|
|
|
|
|
this.current = id
|
|
|
|
|
this.pre = id
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mark(id){
|
|
|
|
|
if(this.markList.indexOf(id)<0){
|
|
|
|
|
this.markList.push(id)
|
|
|
|
|
}else{
|
|
|
|
|
let index = this.markList.indexOf(id)
|
|
|
|
|
this.markList.splice(index,1)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
getQList(obj){
|
|
|
|
|
let list = []
|
|
|
|
|
obj.forEach(i=>{
|
|
|
|
|
if(i.item.type == 0 ){
|
|
|
|
|
let ids = []
|
|
|
|
|
if( i.item.answerId instanceof Array){
|
|
|
|
|
ids = i.item.answerId
|
|
|
|
|
}else{
|
|
|
|
|
ids.push(i.item.answerId)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
list.push({
|
|
|
|
|
id: i.item.id,
|
|
|
|
|
subId: 0,
|
|
|
|
|
ids: ids
|
|
|
|
|
})
|
|
|
|
|
}else if(i.item.type == 1){
|
|
|
|
|
i.item.children.forEach( q=>{
|
|
|
|
|
let ids = []
|
|
|
|
|
if( q.answerId instanceof Array){
|
|
|
|
|
ids = q.answerId
|
|
|
|
|
}else{
|
|
|
|
|
ids.push(q.answerId)
|
|
|
|
|
}
|
|
|
|
|
list.push({
|
|
|
|
|
id: i.item.id,
|
|
|
|
|
subId: q.id,
|
|
|
|
|
ids: ids
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
return list
|
|
|
|
|
},
|
|
|
|
|
loadQuestion(){
|
|
|
|
|
examApi.listQuestion2(this.compId,this.stageId).then(res=>{
|
|
|
|
|
if(res instanceof Array){
|
|
|
|
|
|
|
|
|
|
let singleList = res.filter( item => item.questionType == 1 &&item.type == 0)
|
|
|
|
|
let multiList = res.filter(item =>item.questionType == 2&&item.type == 0)
|
|
|
|
|
let judeList = res.filter(item =>item.questionType == 3&&item.type == 0)
|
|
|
|
|
let anliList = res.filter(item => item.type == 1)
|
|
|
|
|
|
|
|
|
|
for(var i= 0;i<singleList.length;i++){
|
|
|
|
|
let item = singleList[i]
|
|
|
|
|
if(item.answerId.length>0){
|
|
|
|
|
item.answerId = item.answerId[0]
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.singleQuestion.push({id: (i+1), item: item})
|
|
|
|
|
}
|
|
|
|
|
this.currentQ = this.singleQuestion[0]
|
|
|
|
|
|
|
|
|
|
let startIndex =this.singleQuestion.length+1
|
|
|
|
|
for(var i = 0; i<multiList.length; i++){
|
|
|
|
|
let item = multiList[i]
|
|
|
|
|
this.multiQuestion.push({id: (startIndex+i), item: item})
|
|
|
|
|
}
|
|
|
|
|
startIndex =this.singleQuestion.length+ this.multiQuestion.length +1
|
|
|
|
|
for(var i = 0; i< judeList.length ;i++){
|
|
|
|
|
let item = judeList[i]
|
|
|
|
|
if(item.answerId.length>0){
|
|
|
|
|
item.answerId = item.answerId[0]
|
|
|
|
|
}
|
|
|
|
|
this.judgeQuestion.push({id:(startIndex + i ), item: item})
|
|
|
|
|
}
|
|
|
|
|
startIndex = this.singleQuestion.length+ this.multiQuestion.length + this.judgeQuestion.length + 1
|
|
|
|
|
for(var i = 0;i<anliList.length;i++){
|
|
|
|
|
let item = anliList[i]
|
|
|
|
|
item.children.forEach( child =>{
|
|
|
|
|
if((child.questionType == 1 || child.questionType == 3)&&child.answerId.length>0){
|
|
|
|
|
child.answerId = child.answerId[0]
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
this.anliQuestion.push({id: (startIndex + i ) ,item: item})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
this.dlgVisiable = false
|
|
|
|
|
this.initQuestionInfo()
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
startExam(){
|
|
|
|
|
examApi.startExam({ compId:this.compId,stageId: this.stageId}).then(res=>{
|
|
|
|
|
if(res.code == 200){
|
|
|
|
|
this.examInfo.startTime = res.data.startTime
|
|
|
|
|
this.examInfo.endTime = res.data.endTime
|
|
|
|
|
this.loadQuestion()
|
|
|
|
|
}else{
|
|
|
|
|
alert(res.msg)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
getMyAnswer(id,subId){
|
|
|
|
|
|
|
|
|
|
if(this.myAnwserlist){
|
|
|
|
|
|
|
|
|
|
let answer = this.myAnwserlist.filter(item=>{
|
|
|
|
|
return item.id == id &&item.subId == subId
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
if(answer){
|
|
|
|
|
let rs = ''
|
|
|
|
|
console.log(answer)
|
|
|
|
|
for(var i =0;i<answer[0].ids.length;i++){
|
|
|
|
|
rs += this.idToName(answer[0].ids[i])
|
|
|
|
|
}
|
|
|
|
|
return rs
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return ''
|
|
|
|
|
},
|
|
|
|
|
initQuestionInfo(){
|
|
|
|
|
this.singleInfo.size = this.singleQuestion.length
|
|
|
|
|
this.judgeInfo.size = this.judgeQuestion.length
|
|
|
|
|
this.multiInfo.size = this.multiQuestion.length
|
|
|
|
|
this.anliInfo.size = this.anliQuestion.length
|
|
|
|
|
this.singleInfo.sumScore = this.sumScore(this.singleQuestion)
|
|
|
|
|
this.singleInfo.score = this.singleInfo.sumScore/this.singleInfo.size
|
|
|
|
|
this.judgeInfo.sumScore = this.sumScore(this.judgeQuestion)
|
|
|
|
|
this.judgeInfo.score = this.judgeInfo.sumScore/this.judgeInfo.size
|
|
|
|
|
this.multiInfo.sumScore = this.sumScore(this.multiQuestion)
|
|
|
|
|
this.multiInfo.score = this.multiInfo.sumScore/this.multiInfo.size
|
|
|
|
|
this.anliInfo.sumScore = this.sumAnliScore(this.anliQuestion)
|
|
|
|
|
this.anliInfo.score = this.anliInfo.sumScore/this.anliInfo.size
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
sumScore(qList){
|
|
|
|
|
let score = 0
|
|
|
|
|
if(qList instanceof Array){
|
|
|
|
|
qList.forEach(q=>{
|
|
|
|
|
score +=q.item.score
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
return score
|
|
|
|
|
},
|
|
|
|
|
sumAnliScore(qList){
|
|
|
|
|
let score = 0
|
|
|
|
|
if(qList instanceof Array){
|
|
|
|
|
qList.forEach(q=>{
|
|
|
|
|
q.item.children.forEach(cq=>{
|
|
|
|
|
score += cq.score
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
return score
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
created(){
|
|
|
|
|
if(this.$route.query){
|
|
|
|
|
this.compId = this.$route.query.id
|
|
|
|
|
this.stageId = this.$route.query.stageId
|
|
|
|
|
examApi.get({compId: this.compId}).then(res=>{
|
|
|
|
|
if(res.code == 200){
|
|
|
|
|
this.competition = res.data
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
memberApi.getMemberInfo(this.compId,this.stageId).then(res=>{
|
|
|
|
|
if(res.code == 200 ){
|
|
|
|
|
this.memberInfo = res.data
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
memberApi.getPaper(this.compId,this.stageId).then(res=>{
|
|
|
|
|
|
|
|
|
|
if(res.code == 200){
|
|
|
|
|
this.myAnwserlist = res.data.qlist
|
|
|
|
|
this.loadQuestion()
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
this.userInfo = getInfo()
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
watch:{
|
|
|
|
|
confirm(val){
|
|
|
|
|
if(val){
|
|
|
|
|
this.startExam()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
components:{
|
|
|
|
|
"cutDown": CutDown,
|
|
|
|
|
"tz-footer": Footer,
|
|
|
|
|
'tz-dialog': ConfirmDialog
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
<style scoped>
|
|
|
|
|
.tz-line-dash{
|
|
|
|
|
border: none;
|
|
|
|
|
border-top: 1px dotted #ccc;
|
|
|
|
|
}
|
|
|
|
|
.tz-text-left{
|
|
|
|
|
text-align: left;
|
|
|
|
|
}
|
|
|
|
|
.anli_title{
|
|
|
|
|
text-align: left;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
color: black;
|
|
|
|
|
margin-bottom: 1rem;
|
|
|
|
|
}
|
|
|
|
|
.anli_sub_title{
|
|
|
|
|
color: #536073;
|
|
|
|
|
text-align: left;
|
|
|
|
|
margin-bottom: 1rem;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-header{
|
|
|
|
|
background-image: url('/static/image/answer_topbg_1990x140.jpg');
|
|
|
|
|
background-size: cover;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
min-height: 8.75rem;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-header-line{
|
|
|
|
|
min-width: 75rem;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-top: 1rem;
|
|
|
|
|
height: 20%;
|
|
|
|
|
}
|
|
|
|
|
.tz-logo{
|
|
|
|
|
width: 2rem;
|
|
|
|
|
margin-right: .5rem;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-left-panel{
|
|
|
|
|
width: 30%;
|
|
|
|
|
}
|
|
|
|
|
.exam-header-title{
|
|
|
|
|
display: flex;
|
|
|
|
|
min-width: 75rem;
|
|
|
|
|
margin-top: 1rem;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
background-color: #0264d2;
|
|
|
|
|
color: white;
|
|
|
|
|
/* height: calc(80% - 2rem); */
|
|
|
|
|
border-top-left-radius: 1.5rem;
|
|
|
|
|
border-top-right-radius: 1.5rem;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
.exam-header-title div:nth-child(1){
|
|
|
|
|
width: 90%;
|
|
|
|
|
}
|
|
|
|
|
.exam-button{
|
|
|
|
|
background-color: #ff6600;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
color: white;
|
|
|
|
|
padding: 0.1rem 1rem 0.1rem 1rem;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-content{
|
|
|
|
|
display: flex;
|
|
|
|
|
max-width: 75rem;
|
|
|
|
|
margin:auto;
|
|
|
|
|
margin-bottom: 1rem;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box{
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-title{
|
|
|
|
|
width: 60%;
|
|
|
|
|
margin:auto;
|
|
|
|
|
background-color: #0172e7;
|
|
|
|
|
margin-top:2rem;
|
|
|
|
|
color: white;
|
|
|
|
|
padding: .5rem;
|
|
|
|
|
border-radius: 10px 10px 0 0 ;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-title img{
|
|
|
|
|
margin-right: 1rem;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-title::before{
|
|
|
|
|
background-image: url('/static/image/circle.png');
|
|
|
|
|
content: "";
|
|
|
|
|
width: 2rem;
|
|
|
|
|
height: 2rem;
|
|
|
|
|
position: absolute;
|
|
|
|
|
margin-left: -1.5rem;
|
|
|
|
|
background-size: cover;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-title2{
|
|
|
|
|
width: 60%;
|
|
|
|
|
margin:auto;
|
|
|
|
|
margin-top:2rem;
|
|
|
|
|
color: white;
|
|
|
|
|
padding: .5rem;
|
|
|
|
|
border-radius: 10px 10px 0 0 ;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
background-color: #ee4c50;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-title2::after{
|
|
|
|
|
background-image: url('/static/image/icon_answer1_27x27.png');
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-content{
|
|
|
|
|
width: 100%;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
background-color: white;
|
|
|
|
|
padding: 1rem 0 1rem 0;
|
|
|
|
|
border: 1px solid #e0e0e0;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
padding: 1rem;
|
|
|
|
|
align-items: center;
|
|
|
|
|
/* justify-content: space-around; */
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-content>div{
|
|
|
|
|
display: block;
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-content span{
|
|
|
|
|
background-color: #eaedf6;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
color: black;
|
|
|
|
|
padding: .5rem;
|
|
|
|
|
margin-top: 0.5rem;
|
|
|
|
|
margin-right: .5rem;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-tips{
|
|
|
|
|
text-align: left;
|
|
|
|
|
}
|
|
|
|
|
.tz-exam-box-tips span{
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
padding: .5rem;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
margin-right: .5rem;
|
|
|
|
|
margin-top: 1rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.done {
|
|
|
|
|
background-color: #e1e4ec !important;
|
|
|
|
|
color: black !important;
|
|
|
|
|
}
|
|
|
|
|
.notAnwser{
|
|
|
|
|
background-color: #e64d50 !important;
|
|
|
|
|
color: white !important;
|
|
|
|
|
}
|
|
|
|
|
.sign{
|
|
|
|
|
background-color: #0260ca !important;
|
|
|
|
|
color: white !important;
|
|
|
|
|
}
|
|
|
|
|
.current{
|
|
|
|
|
border: 1px solid black;
|
|
|
|
|
}
|
|
|
|
|
.exam-question-content{
|
|
|
|
|
width: 69%;
|
|
|
|
|
margin-top: 1rem;
|
|
|
|
|
margin-left: 1rem;
|
|
|
|
|
}
|
|
|
|
|
.exam-tab {
|
|
|
|
|
display: flex;
|
|
|
|
|
}
|
|
|
|
|
.exam-tab div {
|
|
|
|
|
background-color: #f6f6f7;
|
|
|
|
|
color: #3d2fc4;
|
|
|
|
|
padding: .5rem 1rem .5rem 1rem;
|
|
|
|
|
border: 1px solid #dbdbdb;
|
|
|
|
|
border-bottom: none;
|
|
|
|
|
margin-right: 1rem;
|
|
|
|
|
border-top-left-radius: 3px;
|
|
|
|
|
border-top-right-radius: 3px;
|
|
|
|
|
}
|
|
|
|
|
.exam-tab div:hover {
|
|
|
|
|
background-color: #0264d2;
|
|
|
|
|
color: white;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
.exam-tab-selected {
|
|
|
|
|
background-color: #0264d2 !important;
|
|
|
|
|
color: white !important;
|
|
|
|
|
font-weight: bold !important;
|
|
|
|
|
}
|
|
|
|
|
.exam-tab-content {
|
|
|
|
|
border: 1px solid #e7e7e7;
|
|
|
|
|
background-color: white;
|
|
|
|
|
padding: 1rem;
|
|
|
|
|
overflow-y: scroll;
|
|
|
|
|
max-height: 700px;
|
|
|
|
|
}
|
|
|
|
|
.question{
|
|
|
|
|
display: flex;
|
|
|
|
|
margin-left: 1rem;
|
|
|
|
|
margin-top: 1rem;
|
|
|
|
|
color: #666666;
|
|
|
|
|
}
|
|
|
|
|
.question span{
|
|
|
|
|
margin-left: .5rem;
|
|
|
|
|
margin-right: .5rem;
|
|
|
|
|
}
|
|
|
|
|
.question-stem{
|
|
|
|
|
text-align: left;
|
|
|
|
|
margin-top: 1rem;
|
|
|
|
|
color: #476083;
|
|
|
|
|
}
|
|
|
|
|
</style>
|