551 lines
16 KiB
Vue
551 lines
16 KiB
Vue
<template>
|
||
<view>
|
||
<cu-custom bgColor="bg-gradual-blueness" :isBack="false">
|
||
<block slot="backText">返回</block>
|
||
<block slot="content">课程考试</block>
|
||
</cu-custom>
|
||
<view class="container">
|
||
<view class="top">
|
||
<view class="suject">
|
||
<text>考试科目：{{ info.EXAMNAME }}</text>
|
||
</view>
|
||
<view class="questions">
|
||
<text>当前试题{{ current + 1 }}/{{ options.length }}</text>
|
||
</view>
|
||
<view class="time">
|
||
<text>考试剩余时间：</text>
|
||
<!-- -->
|
||
<uni-countdown :minute="info.ANSWERSHEETTIME" @timeup="fnCountDownFinish" color="#fff" splitorColor="#fff"/>
|
||
</view>
|
||
</view>
|
||
<view class="topic">
|
||
<view class="title">
|
||
<text>
|
||
{{ current + 1 }}.{{ options[current].QUESTIONDRY }}
|
||
</text>
|
||
<text v-show="options[current].QUESTIONTYPE === '1'">
|
||
(单选)
|
||
</text>
|
||
<text v-show="options[current].QUESTIONTYPE === '2'">
|
||
(多选)
|
||
</text>
|
||
<text v-show="options[current].QUESTIONTYPE === '3'">
|
||
(判断)
|
||
</text>
|
||
<text v-show="options[current].QUESTIONTYPE === '4'">
|
||
(填空)
|
||
</text>
|
||
</view>
|
||
<view
|
||
class="options"
|
||
v-show="options[current].QUESTIONTYPE === '1'"
|
||
>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('radio', 'A')"
|
||
:class="{ active: options[current].checked === 'A' }"
|
||
>
|
||
<text class="option">A</text>
|
||
<text class="text">{{ options[current].OPTIONA }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('radio', 'B')"
|
||
:class="{ active: options[current].checked === 'B' }"
|
||
>
|
||
<text class="option">B</text>
|
||
<text class="text">{{ options[current].OPTIONB }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('radio', 'C')"
|
||
:class="{ active: options[current].checked === 'C' }"
|
||
>
|
||
<text class="option">C</text>
|
||
<text class="text">{{ options[current].OPTIONC }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('radio', 'D')"
|
||
:class="{ active: options[current].checked === 'D' }"
|
||
>
|
||
<text class="option">D</text>
|
||
<text class="text">{{ options[current].OPTIOND }}</text>
|
||
</view>
|
||
</view>
|
||
<view
|
||
class="options"
|
||
v-show="options[current].QUESTIONTYPE === '2'"
|
||
>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('multiple', 'A')"
|
||
:class="{
|
||
active:
|
||
options[current].checked &&
|
||
options[current].checked.indexOf('A') !== -1,
|
||
}"
|
||
>
|
||
<text class="option">A</text>
|
||
<text class="text">{{ options[current].OPTIONA }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('multiple', 'B')"
|
||
:class="{
|
||
active:
|
||
options[current].checked &&
|
||
options[current].checked.indexOf('B') !== -1,
|
||
}"
|
||
>
|
||
<text class="option">B</text>
|
||
<text class="text">{{ options[current].OPTIONB }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('multiple', 'C')"
|
||
:class="{
|
||
active:
|
||
options[current].checked &&
|
||
options[current].checked.indexOf('C') !== -1,
|
||
}"
|
||
>
|
||
<text class="option">C</text>
|
||
<text class="text">{{ options[current].OPTIONC }}</text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('multiple', 'D')"
|
||
:class="{
|
||
active:
|
||
options[current].checked &&
|
||
options[current].checked.indexOf('D') !== -1,
|
||
}"
|
||
>
|
||
<text class="option">D</text>
|
||
<text class="text">{{ options[current].OPTIOND }}</text>
|
||
</view>
|
||
</view>
|
||
<view
|
||
class="options"
|
||
v-show="options[current].QUESTIONTYPE === '3'"
|
||
>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('judge', 'A')"
|
||
:class="{ active: options[current].checked === 'A' }"
|
||
>
|
||
<text class="option">{{ options[current].OPTIONA }}</text>
|
||
<text class="text"></text>
|
||
</view>
|
||
<view
|
||
class="item"
|
||
@click="fnChooseTopic('judge', 'B')"
|
||
:class="{ active: options[current].checked === 'B' }"
|
||
>
|
||
<text class="option">{{ options[current].OPTIONB }}</text>
|
||
<text class="text"></text>
|
||
</view>
|
||
</view>
|
||
<view
|
||
class="options"
|
||
v-show="options[current].QUESTIONTYPE === '4'"
|
||
>
|
||
<view class="item">
|
||
<textarea
|
||
maxlength="255"
|
||
v-model="options[current].checked"
|
||
placeholder="请输入内容"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="footer">
|
||
<button
|
||
class="cu-btn"
|
||
:style="{ width: '45%' }"
|
||
v-show="current !== 0"
|
||
@click="fnPreviousQuestion"
|
||
>
|
||
上一题
|
||
</button>
|
||
<button
|
||
class="cu-btn bg-blue"
|
||
:style="{ width: current === 0 ? '100%' : '45%' }"
|
||
v-show="current !== options.length - 1"
|
||
@click="fnNextQuestion"
|
||
>
|
||
下一题
|
||
</button>
|
||
<button
|
||
class="cu-btn bg-blue"
|
||
:style="{ width: '45%' }"
|
||
v-show="current === options.length - 1"
|
||
@click="fnHandInThePaper"
|
||
>
|
||
交卷
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {basePath, loginUser} from "@/common/tool";
|
||
export default {
|
||
data() {
|
||
return {
|
||
info: {
|
||
ANSWERSHEETTIME:1
|
||
},
|
||
options: [{}],
|
||
current: 0,
|
||
STAGEEXAMPAPERINPUT_ID: '',
|
||
STAGEEXAMPAPER_ID: '',
|
||
CLASS_ID: '',
|
||
POST_ID: '',
|
||
STUDENT_ID: '',
|
||
NUMBEROFEXAMS: '',
|
||
entrySite: '',
|
||
}
|
||
},
|
||
// onBackPress(event) {
|
||
// if (event.from === "backbutton") {
|
||
// uni.showToast({
|
||
// title:'正在答题中',
|
||
// icon:'none'
|
||
// })
|
||
// return true;
|
||
// }
|
||
// return false;
|
||
// },
|
||
onLoad(options) {
|
||
this.STAGEEXAMPAPERINPUT_ID = options.STAGEEXAMPAPERINPUT_ID;
|
||
this.STAGEEXAMPAPER_ID = options.STAGEEXAMPAPER_ID;
|
||
this.CLASS_ID = options.CLASS_ID;
|
||
this.POST_ID = options.POST_ID;
|
||
this.STUDENT_ID = options.STUDENT_ID;
|
||
this.NUMBEROFEXAMS = options.NUMBEROFEXAMS;
|
||
this.entrySite = options.entrySite;
|
||
this.fnGetData();
|
||
},
|
||
methods: {
|
||
fnGetData() {
|
||
uni.showLoading({
|
||
title: '请稍候'
|
||
})
|
||
let url = ''
|
||
let params = {}
|
||
if(this.entrySite === "strengththen"){
|
||
url = '/app/stageexam/getStrengthenExam'
|
||
params = {
|
||
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 {
|
||
url = '/app/stageexam/getExam'
|
||
params = {
|
||
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,
|
||
}
|
||
}
|
||
uni.request({
|
||
url: basePath + url,
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: params,
|
||
success: (res) => {
|
||
uni.hideLoading(); //结束加载中动画
|
||
var resData = res.data;
|
||
if (resData.result === 'success') {
|
||
this.options = resData.inputQue;
|
||
this.info = resData.pd;
|
||
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;
|
||
}
|
||
console.log(this.options[this.current].checked)
|
||
}
|
||
},
|
||
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;
|
||
this.fnSubmit();
|
||
},
|
||
fnCountDownFinish(){
|
||
uni.showToast({
|
||
title: '考试时间已结束',
|
||
icon:'none'
|
||
})
|
||
for (let i = 0; i < this.options.length; i++) {
|
||
if (!this.options[i].checked) {
|
||
this.options[i].checked = "";
|
||
}
|
||
}
|
||
this.fnSubmit();
|
||
},
|
||
fnSubmit(){
|
||
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, "");
|
||
}
|
||
}
|
||
uni.request({
|
||
url: basePath + '/app/stageexam/submit',
|
||
method: 'POST',
|
||
dataType: 'json',
|
||
header: {
|
||
'Content-type': 'application/x-www-form-urlencoded'
|
||
},
|
||
data: {
|
||
USERNAME: loginUser.NAME,
|
||
USER_ID: loginUser.USER_ID,
|
||
STAGEEXAMPAPERINPUT_ID:this.STAGEEXAMPAPERINPUT_ID,
|
||
STUDENT_ID:this.STUDENT_ID,
|
||
CLASS_ID:this.CLASS_ID,
|
||
NUMBEROFEXAMS:this.NUMBEROFEXAMS,
|
||
entrySite:this.entrySite,
|
||
PASSSCORE: this.info.PASSSCORE,
|
||
EXAMSCORE: this.info.EXAMSCORE,
|
||
EXAMTIMEBEGIN: this.info.EXAMTIMEBEGIN,
|
||
options: JSON.stringify(this.options),
|
||
},
|
||
success: (res) => {
|
||
uni.hideLoading(); //结束加载中动画
|
||
var resData = res.data;
|
||
if (resData.result === 'success') {
|
||
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">
|
||
.container {
|
||
width: 100%;
|
||
background: #fff;
|
||
padding: 20upx;
|
||
box-sizing: border-box;
|
||
min-height: 100vh;
|
||
|
||
.top {
|
||
background: url("/static/study/bgimg1.png");
|
||
background-size: 100% 100%;
|
||
border-radius: 20upx;
|
||
padding: 40upx;
|
||
text-align: center;
|
||
|
||
.suject {
|
||
color: #fff;
|
||
font-weight: bold;
|
||
font-size: 32upx;
|
||
}
|
||
|
||
.questions {
|
||
color: #eeecec;
|
||
font-size: 30upx;
|
||
padding-top: 20upx;
|
||
}
|
||
|
||
.time {
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: #eeecec;
|
||
font-size: 28upx;
|
||
padding-top: 20upx;
|
||
|
||
.van-count-down {
|
||
color: #eeecec;
|
||
font-size: 28upx;
|
||
line-height: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.topic {
|
||
margin-top: 20upx;
|
||
margin-bottom: 80upx;
|
||
padding: 20upx;
|
||
box-sizing: border-box;
|
||
|
||
.title {
|
||
font-size: 32upx;
|
||
font-weight: 600;
|
||
|
||
.question-type {
|
||
border-radius: 40upx;
|
||
padding: 4upx 14upx;
|
||
border: 1upx solid #3c9cff;
|
||
font-size: 24upx;
|
||
color: #3c9cff;
|
||
}
|
||
}
|
||
|
||
.options {
|
||
margin-top: 40upx;
|
||
|
||
.item {
|
||
position: relative;
|
||
margin-top: 40upx;
|
||
color: #696868;
|
||
|
||
&.active {
|
||
color: #3c9cff;
|
||
|
||
.option {
|
||
background-color: #3c9cff;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
.option {
|
||
background-color: #eee;
|
||
border-radius: 80upx;
|
||
width: 65upx;
|
||
height: 65upx;
|
||
line-height: 65upx;
|
||
text-align: center;
|
||
font-size: 30upx;
|
||
display: inline-block;
|
||
}
|
||
|
||
.text {
|
||
margin-left: 30upx;
|
||
height: 60upx;
|
||
line-height: 60upx;
|
||
}
|
||
|
||
uni-textarea{
|
||
width: 100%;
|
||
border: 1px solid #ccc;
|
||
padding: 10upx;
|
||
border-radius: 10upx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.footer {
|
||
display: flex;
|
||
position: fixed;
|
||
bottom: 0;
|
||
justify-content: space-between;
|
||
width: 100%;
|
||
left: 0;
|
||
padding: 20upx;
|
||
box-sizing: border-box;
|
||
background: #fff;
|
||
|
||
button {
|
||
border-radius: 10upx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|