477 lines
13 KiB
Vue
477 lines
13 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="top">
|
||
<view class="time">
|
||
<text style="margin-right: 14rpx" class="iconfont"></text>
|
||
<text>倒计时：</text>
|
||
<u-count-down :time="info.ANSWERSHEETTIME * 60 * 1000" format="mm 分 ss 秒" auto-start millisecond @finish="fnCountDownFinish" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="topic">
|
||
<view class="title">
|
||
<text>
|
||
<text class="tag_title">
|
||
{{ handleCalcQuestType(options[current].QUESTIONTYPE) }}
|
||
</text>
|
||
{{ current + 1 }}.{{ options[current].QUESTIONDRY }}
|
||
</text>
|
||
</view>
|
||
<view v-show="options[current].QUESTIONTYPE === '1'" class="options">
|
||
<view class="item" :class="{ 'active': options[current].checked === 'A' }" @click="fnChooseTopic('radio', 'A')">
|
||
<text class="option">A</text>
|
||
<text class="text">{{ options[current].OPTIONA }}</text>
|
||
</view>
|
||
<view class="item" :class="{ 'active': options[current].checked === 'B' }" @click="fnChooseTopic('radio', 'B')">
|
||
<text class="option">B</text>
|
||
<text class="text">{{ options[current].OPTIONB }}</text>
|
||
</view>
|
||
<view class="item" :class="{ 'active': options[current].checked === 'C' }" @click="fnChooseTopic('radio', 'C')">
|
||
<text class="option">C</text>
|
||
<text class="text">{{ options[current].OPTIONC }}</text>
|
||
</view>
|
||
<view class="item" :class="{ 'active': options[current].checked === 'D' }" @click="fnChooseTopic('radio', 'D')">
|
||
<text class="option">D</text>
|
||
<text class="text">{{ options[current].OPTIOND }}</text>
|
||
</view>
|
||
</view>
|
||
<view v-show="options[current].QUESTIONTYPE === '2'" class="options">
|
||
<view
|
||
class="item"
|
||
:class="{
|
||
'active': options[current].checked && options[current].checked.indexOf('A') !== -1
|
||
}"
|
||
@click="fnChooseTopic('multiple', 'A')"
|
||
>
|
||
<text class="option">A</text>
|
||
<text class="text">{{ options[current].OPTIONA }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
:class="{
|
||
'active': options[current].checked && options[current].checked.indexOf('B') !== -1
|
||
}"
|
||
@click="fnChooseTopic('multiple', 'B')"
|
||
>
|
||
<text class="option">B</text>
|
||
<text class="text">{{ options[current].OPTIONB }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
:class="{
|
||
'active': options[current].checked && options[current].checked.indexOf('C') !== -1
|
||
}"
|
||
@click="fnChooseTopic('multiple', 'C')"
|
||
>
|
||
<text class="option">C</text>
|
||
<text class="text">{{ options[current].OPTIONC }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
:class="{
|
||
'active': options[current].checked && options[current].checked.indexOf('D') !== -1
|
||
}"
|
||
@click="fnChooseTopic('multiple', 'D')"
|
||
>
|
||
<text class="option">D</text>
|
||
<text class="text">{{ options[current].OPTIOND }}</text>
|
||
</view>
|
||
</view>
|
||
<view v-show="options[current].QUESTIONTYPE === '3'" class="options">
|
||
<view class="item" :class="{ 'active': options[current].checked === 'A' }" @click="fnChooseTopic('judge', 'A')">
|
||
<text class="option">{{ options[current].OPTIONA }}</text>
|
||
<text class="text"></text>
|
||
</view>
|
||
<view class="item" :class="{ 'active': options[current].checked === 'B' }" @click="fnChooseTopic('judge', 'B')">
|
||
<text class="option">{{ options[current].OPTIONB }}</text>
|
||
<text class="text"></text>
|
||
</view>
|
||
</view>
|
||
<view v-show="options[current].QUESTIONTYPE === '4'" class="options">
|
||
<view class="item">
|
||
<u-textarea v-model="options[current].checked" auto-height count />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="footer">
|
||
<u-button v-show="current !== 0" :style="{ width: '45%' }" text="上一题" @click="fnPreviousQuestion" />
|
||
<u-button v-show="current !== options.length - 1" type="primary" :style="{ width: current === 0 ? '100%' : '45%' }" text="下一题" @click="fnNextQuestion" />
|
||
<u-button v-show="current === options.length - 1" type="primary" :style="{ width: '45%' }" text="交卷" @click="fnHandInThePaper" />
|
||
</view>
|
||
|
||
<u-toast ref="uToast" />
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getExamExercises,
|
||
// getStrengthenExam,
|
||
setTestPaperSubmission,
|
||
} from '@/api';
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
// STAGEEXAMPAPERINPUT_ID: '',
|
||
// STAGEEXAMPAPER_ID: '',
|
||
// CLASS_ID: '',
|
||
// POST_ID: '',
|
||
// STUDENT_ID: '',
|
||
// NUMBEROFEXAMS: '',
|
||
routeQuery: {},
|
||
entrySite: '',
|
||
info: {},
|
||
options: [{}],
|
||
current: 0,
|
||
questionTypeMap: {
|
||
1: '单选',
|
||
2: '多选',
|
||
3: '判断',
|
||
4: '填空'
|
||
}
|
||
}
|
||
},
|
||
onLoad(query) {
|
||
this.routeQuery = query
|
||
// this.STAGEEXAMPAPER_ID = query.STAGEEXAMPAPER_ID;
|
||
// this.entrySite = query.entrySite;
|
||
this.fnGetData()
|
||
},
|
||
onBackPress(event) {
|
||
if (event.from === 'backbutton') {
|
||
uni.$u.toast('考试过程中不允许退出')
|
||
return true
|
||
}
|
||
return false
|
||
},
|
||
computed: {
|
||
userInfo() {
|
||
return this.$store.getters.getUserInfo
|
||
}
|
||
},
|
||
methods: {
|
||
async fnGetData() {
|
||
const { stageexampaperinputId, classId, postId, studentId, numberofexams } = this.routeQuery
|
||
const resData = await getExamExercises({
|
||
STAGEEXAMPAPERINPUT_ID: stageexampaperinputId,
|
||
// STAGEEXAMPAPER_ID: this.STAGEEXAMPAPER_ID,
|
||
CLASS_ID: classId,
|
||
POST_ID: postId,
|
||
STUDENT_ID: studentId,
|
||
NUMBEROFEXAMS: numberofexams
|
||
})
|
||
// if (this.entrySite === "strengththen") {
|
||
// resData = await getStrengthenExam({
|
||
// STRENGTHEN_STAGEEXAMPAPER_INPUT_ID: this.STAGEEXAMPAPERINPUT_ID,
|
||
// CLASS_ID: this.CLASS_ID,
|
||
// POST_ID: this.POST_ID,
|
||
// STUDENT_ID: this.STUDENT_ID,
|
||
// NUMBEROFEXAMS: this.NUMBEROFEXAMS,
|
||
// });
|
||
// } else {
|
||
// resData = await getExamExercises({
|
||
// STAGEEXAMPAPERINPUT_ID: this.STAGEEXAMPAPERINPUT_ID,
|
||
// STAGEEXAMPAPER_ID: this.STAGEEXAMPAPER_ID,
|
||
// CLASS_ID: this.CLASS_ID,
|
||
// POST_ID: this.POST_ID,
|
||
// STUDENT_ID: this.STUDENT_ID,
|
||
// NUMBEROFEXAMS: this.NUMBEROFEXAMS,
|
||
// });
|
||
// }
|
||
|
||
// this.info = resData.pd;
|
||
this.info = { ...this.info, ANSWERSHEETTIME: 30 }
|
||
this.options = [
|
||
{
|
||
QUESTIONDRY: '题干题干题干题干题干1 ( ) .',
|
||
QUESTIONTYPE: '1',
|
||
OPTIONA: '这是选项A',
|
||
OPTIONB: '这是选项B',
|
||
OPTIONC: '这是选项C',
|
||
OPTIOND: '这是选项D'
|
||
},
|
||
{
|
||
QUESTIONDRY: '题干题干题干题干题干2 ()',
|
||
QUESTIONTYPE: '2',
|
||
OPTIONA: '这是选项A',
|
||
OPTIONB: '这是选项B',
|
||
OPTIONC: '这是选项C',
|
||
OPTIOND: '这是选项D'
|
||
},
|
||
{
|
||
QUESTIONDRY: '未带安全头盔可正常进入堆场进行工业,以上说法是否正确?',
|
||
QUESTIONTYPE: '3',
|
||
OPTIONA: '对',
|
||
OPTIONB: '错'
|
||
},
|
||
{
|
||
QUESTIONDRY: '当进入施工现场后, 应立刻对_____设施做全面检查?',
|
||
QUESTIONTYPE: '4',
|
||
OPTIONA: '对',
|
||
OPTIONB: '错'
|
||
}
|
||
]
|
||
// if (resData.NUMBEROFEXAMS > 0) {
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: `您还可以考试${resData.NUMBEROFEXAMS}次！`,
|
||
// showCancel: false,
|
||
// });
|
||
// } else if (resData.NUMBEROFEXAMS === "-9999") {
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: `加强学习考试开始，限时60分钟，请注意答题时间！`,
|
||
// showCancel: false,
|
||
// });
|
||
// } else {
|
||
// uni.showModal({
|
||
// title: "温馨提示",
|
||
// content: `您无考试次数！`,
|
||
// showCancel: false,
|
||
// success: (res) => {
|
||
// if (res.confirm) {
|
||
// uni.navigateBack();
|
||
// }
|
||
// },
|
||
// });
|
||
// }
|
||
},
|
||
fnChooseTopic(type, checked) {
|
||
if (!this.options[this.current].checked) {
|
||
this.$set(this.options[this.current], 'checked', '')
|
||
}
|
||
if (type === 'judge' || type === 'radio') {
|
||
if (this.options[this.current].checked === checked) {
|
||
this.options[this.current].checked = ''
|
||
} else {
|
||
this.options[this.current].checked = checked
|
||
}
|
||
}
|
||
if (type === 'multiple') {
|
||
if (this.options[this.current].checked) {
|
||
const checkedArr = this.options[this.current].checked.split(',')
|
||
if (checkedArr.indexOf(checked) !== -1) {
|
||
checkedArr.splice(checkedArr.indexOf(checked), 1)
|
||
this.options[this.current].checked = checkedArr.join(',')
|
||
} else {
|
||
checkedArr.push(checked)
|
||
checkedArr.sort()
|
||
this.options[this.current].checked = checkedArr.join(',')
|
||
}
|
||
} else {
|
||
this.options[this.current].checked = checked
|
||
}
|
||
}
|
||
},
|
||
handleCalcQuestType(type) {
|
||
return `(${this.questionTypeMap[type]})`
|
||
},
|
||
fnIsFinish() {
|
||
if (!this.options[this.current].checked) {
|
||
uni.showModal({
|
||
title: '温馨提示',
|
||
content: '请对本题进行作答。',
|
||
showCancel: false
|
||
})
|
||
return false
|
||
}
|
||
return true
|
||
},
|
||
/**
|
||
* 下一题按钮点击事件
|
||
*/
|
||
fnNextQuestion() {
|
||
if (!this.fnIsFinish()) return
|
||
this.current++
|
||
},
|
||
/**
|
||
* 上一题按钮点击事件
|
||
*/
|
||
fnPreviousQuestion() {
|
||
this.current--
|
||
},
|
||
/**
|
||
* 交卷按钮点击事件
|
||
*/
|
||
fnHandInThePaper() {
|
||
if (!this.fnIsFinish()) return
|
||
uni.showModal({
|
||
title: '温馨提示',
|
||
content: `题目已全部做完，确认交卷吗？`,
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.fnSubmit()
|
||
}
|
||
}
|
||
})
|
||
},
|
||
fnCountDownFinish() {
|
||
uni.$u.toast('考试时间已结束')
|
||
for (let i = 0; i < this.options.length; i++) {
|
||
if (!this.options[i].checked) {
|
||
this.options[i].checked = ''
|
||
}
|
||
}
|
||
this.fnSubmit()
|
||
},
|
||
async fnSubmit() {
|
||
// uni.navigateBack({ delta: 2 })
|
||
for (let i = 0; i < this.options.length; i++) {
|
||
if (this.options[i].QUESTIONTYPE === "2") {
|
||
this.options[i].checked = this.options[i].checked.replace(/,/g, "");
|
||
}
|
||
}
|
||
const resData = await setTestPaperSubmission({
|
||
USERNAME: this.userInfo.NAME,
|
||
entrySite: this.entrySite,
|
||
STAGEEXAMPAPERINPUT_ID: this.STAGEEXAMPAPERINPUT_ID,
|
||
CLASS_ID: this.CLASS_ID,
|
||
STUDENT_ID: this.STUDENT_ID,
|
||
NUMBEROFEXAMS: this.NUMBEROFEXAMS,
|
||
PASSSCORE: this.info.PASSSCORE,
|
||
EXAMSCORE: this.info.EXAMSCORE,
|
||
EXAMTIMEBEGIN: this.info.EXAMTIMEBEGIN,
|
||
options: JSON.stringify(this.options),
|
||
});
|
||
if (resData.examResult === "0") {
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: `您的成绩为${resData.examScore}分，很遗憾您没有通过本次考试，请再接再厉！`,
|
||
showCancel: false,
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
if (this.entrySite === "video_study")
|
||
uni.navigateBack({ delta: 3 });
|
||
else uni.navigateBack();
|
||
}
|
||
},
|
||
});
|
||
} else {
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: `您的成绩为${resData.examScore}分，恭喜您通过本次考试，请继续保持！`,
|
||
showCancel: false,
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
if (this.entrySite === "video_study")
|
||
uni.navigateBack({ delta: 3 });
|
||
else if (this.entrySite === "strengththen")
|
||
uni.navigateBack({ delta: 2 });
|
||
else uni.navigateBack();
|
||
}
|
||
},
|
||
});
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
@import '/static/fonts/iconfont_timer.css';
|
||
|
||
.content {
|
||
.top {
|
||
padding: 17rpx;
|
||
.time {
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: flex-start;
|
||
align-items: center;
|
||
color: #363636;
|
||
font-size: 28rpx;
|
||
|
||
::v-deep {
|
||
.u-count-down__text {
|
||
display: inline;
|
||
color: #363636;
|
||
font-size: 28rpx;
|
||
line-height: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.topic {
|
||
margin: 20rpx;
|
||
padding: 20rpx 20rpx 150rpx;
|
||
box-sizing: border-box;
|
||
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
|
||
.question-type {
|
||
border-radius: 40rpx;
|
||
padding: 4rpx 14rpx;
|
||
border: 1rpx solid #3c9cff;
|
||
font-size: 24rpx;
|
||
color: #3c9cff;
|
||
}
|
||
|
||
.tag_title {
|
||
font-size: 28rpx;
|
||
background-color: #b3b3b3;
|
||
color: #fff;
|
||
border-radius: 8rpx;
|
||
padding: 2rpx 10rpx;
|
||
margin-right: 10rpx;
|
||
}
|
||
}
|
||
|
||
.options {
|
||
margin-top: 40rpx;
|
||
|
||
.item {
|
||
position: relative;
|
||
margin-top: 40rpx;
|
||
color: #696868;
|
||
|
||
&.active {
|
||
color: #3c9cff;
|
||
|
||
.option {
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
.option {
|
||
background-color: #eee;
|
||
border-radius: 80rpx;
|
||
width: 65rpx;
|
||
height: 65rpx;
|
||
line-height: 65rpx;
|
||
text-align: center;
|
||
font-size: 30rpx;
|
||
display: inline-block;
|
||
}
|
||
|
||
.text {
|
||
margin-left: 30rpx;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.footer {
|
||
display: flex;
|
||
position: fixed;
|
||
bottom: 0;
|
||
justify-content: space-between;
|
||
width: 100%;
|
||
left: 0;
|
||
padding: 20rpx;
|
||
box-sizing: border-box;
|
||
background: #fff;
|
||
|
||
button {
|
||
border-radius: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|