775 lines
24 KiB
Vue
775 lines
24 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<div v-if="!isEnd">
|
|||
|
|
<Navbar title="考试" :showBack="false" />
|
|||
|
|
<div class="content">
|
|||
|
|
<div class="top-wrapper">
|
|||
|
|
<div class="time">
|
|||
|
|
<div>计时器：</div>
|
|||
|
|
<div>
|
|||
|
|
<u-count-down
|
|||
|
|
class="count-down"
|
|||
|
|
ref="countDown"
|
|||
|
|
:autoStart="false"
|
|||
|
|
:time="time"
|
|||
|
|
@change="changeCountDown"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div>
|
|||
|
|
<span style="color: #1989fa">{{ currentIndex + 1 }}/{{ questionList.length }}</span>
|
|||
|
|
题
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="center-wrapper">
|
|||
|
|
<div class="answer-wrapper">
|
|||
|
|
<div
|
|||
|
|
class="item-wrapper"
|
|||
|
|
v-for="(item, index) in questionList"
|
|||
|
|
:key="index"
|
|||
|
|
v-show="item.isShow"
|
|||
|
|
@click="handleQuestionNumber(item, index)"
|
|||
|
|
>
|
|||
|
|
<div class="answer-item" :class="{ isActive: currentIndex == index, isAnswer: item.selectAnswer != '' }">
|
|||
|
|
{{ index + 1 }}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="unfold" @click="handleUnfold">
|
|||
|
|
{{ this.isRotating ? '收起' : '展开' }}
|
|||
|
|
<u-icon v-if="!this.isRotating" name="arrow-down-fill" size="10" />
|
|||
|
|
<u-icon v-else name="arrow-up-fill" size="10" />
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- 题目内容 -->
|
|||
|
|
<div class="question-wrapper">
|
|||
|
|
<div
|
|||
|
|
class="question-list"
|
|||
|
|
v-for="(item, index) in questionList"
|
|||
|
|
:key="item.id"
|
|||
|
|
v-show="index == currentIndex"
|
|||
|
|
>
|
|||
|
|
<div class="question-type">
|
|||
|
|
<div class="line"></div>
|
|||
|
|
<div class="type">
|
|||
|
|
<div v-if="item.questionType == 1">单选题（{{ opt.singleScore || 0 }}分）</div>
|
|||
|
|
<div v-else-if="item.questionType == 2">多选题（{{ opt.multipleScore || 0 }}分）</div>
|
|||
|
|
<div v-else-if="item.questionType == 3">判断题（{{ opt.judgeScore || 0 }}分）</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="question-title">{{ index + 1 }}. {{ item.content }}</div>
|
|||
|
|
<div class="question-img-list">
|
|||
|
|
<div class="img" v-for="(img, imgIndex) in item.questionPictureVoList">
|
|||
|
|
<u-image
|
|||
|
|
:key="imgIndex"
|
|||
|
|
:src="img.url"
|
|||
|
|
:showLoading="true"
|
|||
|
|
width="60px"
|
|||
|
|
height="60px"
|
|||
|
|
@click="handleImg(img.url)"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="question-item">
|
|||
|
|
<div v-if="item.questionType == 1 || item.questionType == 3">
|
|||
|
|
<!-- 单选题 -->
|
|||
|
|
<u-radio-group v-model="item.radioValue" placement="column">
|
|||
|
|
<u-radio
|
|||
|
|
:customStyle="{ marginBottom: '8px' }"
|
|||
|
|
v-for="(question, index) in item.questionAnswerVoList"
|
|||
|
|
:key="index"
|
|||
|
|
:label="question.options + '. ' + question.answerOptions"
|
|||
|
|
:name="question.options + '. ' + question.answerOptions"
|
|||
|
|
:disabled="question.disabled"
|
|||
|
|
@change="radioChange(question, item)"
|
|||
|
|
>
|
|||
|
|
<div class="radio-item">
|
|||
|
|
<div class="radio-name">{{ question.options + '. ' + question.answerOptions }}</div>
|
|||
|
|
<div class="question-img-list">
|
|||
|
|
<div class="img" v-for="(img, imgIndex) in question.questionPictureVoList">
|
|||
|
|
<u-image
|
|||
|
|
:key="imgIndex"
|
|||
|
|
:src="img.url"
|
|||
|
|
:showLoading="true"
|
|||
|
|
width="60px"
|
|||
|
|
height="60px"
|
|||
|
|
@click="handleImg(img.url)"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</u-radio>
|
|||
|
|
</u-radio-group>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div v-if="item.questionType == 2">
|
|||
|
|
<!-- 多选题 -->
|
|||
|
|
<u-checkbox-group v-model="item.checkboxValue" placement="column">
|
|||
|
|
<div v-for="(question, index) in item.questionAnswerVoList">
|
|||
|
|
<u-checkbox
|
|||
|
|
:customStyle="{ marginBottom: '8px' }"
|
|||
|
|
:key="index"
|
|||
|
|
:label="question.options + '. ' + question.answerOptions"
|
|||
|
|
:name="question.options + '. ' + question.answerOptions"
|
|||
|
|
:disabled="question.disabled"
|
|||
|
|
@change="radioChange(question, item)"
|
|||
|
|
></u-checkbox>
|
|||
|
|
<div class="radio-item">
|
|||
|
|
<div class="question-img-list" style="margin: 10px">
|
|||
|
|
<div class="img" v-for="(img, imgIndex) in question.questionPictureVoList">
|
|||
|
|
<u-image
|
|||
|
|
:key="imgIndex"
|
|||
|
|
:src="img.url"
|
|||
|
|
:showLoading="true"
|
|||
|
|
width="60px"
|
|||
|
|
height="60px"
|
|||
|
|
@click="handleImg(img.url)"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</u-checkbox-group>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- 按钮 -->
|
|||
|
|
<div class="box"></div>
|
|||
|
|
<div class="bottom-wrapper">
|
|||
|
|
<u-button
|
|||
|
|
class="btn"
|
|||
|
|
type="primary"
|
|||
|
|
size="small"
|
|||
|
|
shape="circle"
|
|||
|
|
@click="handlePrev"
|
|||
|
|
:disabled="currentIndex == 0"
|
|||
|
|
>
|
|||
|
|
上一题
|
|||
|
|
</u-button>
|
|||
|
|
<u-button
|
|||
|
|
class="btn"
|
|||
|
|
type="primary"
|
|||
|
|
size="small"
|
|||
|
|
shape="circle"
|
|||
|
|
@click="handleNext"
|
|||
|
|
:disabled="currentIndex == questionList.length - 1 || currentIndex == questionList.length"
|
|||
|
|
>
|
|||
|
|
下一题
|
|||
|
|
</u-button>
|
|||
|
|
<u-button class="btn" type="primary" size="small" shape="circle" @click="handleSubmit">交 卷</u-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<u-toast ref="uToast"></u-toast>
|
|||
|
|
<u-modal
|
|||
|
|
:show="showModal"
|
|||
|
|
title="提示"
|
|||
|
|
:content="content"
|
|||
|
|
showCancelButton
|
|||
|
|
@confirm="confirm"
|
|||
|
|
@cancel="showModal = false"
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div v-else>
|
|||
|
|
<endOfExamination :states="endOfExamination" :isStudyTask="opt.isStudyTask" :isTrain="opt.isTrain" />
|
|||
|
|
</div>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import config from '@/config'
|
|||
|
|
import endOfExamination from './endOfExamination.vue'
|
|||
|
|
import { getExamQuestion, submitAnswer, getQuestion, updateAnswer } from '@/api/educationTraining'
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
components: { endOfExamination },
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
isAddLoading: false,
|
|||
|
|
userId: uni.getStorageSync('userInfo').userId,
|
|||
|
|
opt: {},
|
|||
|
|
currentIndex: 0, // 当前题目索引
|
|||
|
|
questionList: [], // 试题列表
|
|||
|
|
endOfExamination: false, // 是否结束考试
|
|||
|
|
correctNum: 0, // 正确题数
|
|||
|
|
errorNum: 0, // 错误题数
|
|||
|
|
totalScore: 0, // 总得分
|
|||
|
|
timeCount: '00:00:00',
|
|||
|
|
timer: null, // 计时器id
|
|||
|
|
showModal: false,
|
|||
|
|
showModal2: false,
|
|||
|
|
showModal: false,
|
|||
|
|
content: '是否确认提交?',
|
|||
|
|
// 时间
|
|||
|
|
time: 0,
|
|||
|
|
// 答题时间
|
|||
|
|
answerTime: 0,
|
|||
|
|
// 试题列表
|
|||
|
|
// 答题卡
|
|||
|
|
answerSheet: [],
|
|||
|
|
// 是否展开
|
|||
|
|
isRotating: false,
|
|||
|
|
// 答题结束
|
|||
|
|
isEnd: false,
|
|||
|
|
// 考后结算
|
|||
|
|
endOfExamination: {
|
|||
|
|
totalScore: 0, // 总分
|
|||
|
|
score: 0, // 分数
|
|||
|
|
isPass: '', // 是否及格
|
|||
|
|
examType: '', // 考试类型
|
|||
|
|
submitTime: '', // 交卷时间
|
|||
|
|
answerSheet: [], // 答题卡
|
|||
|
|
correctNum: 0, // 正确题数
|
|||
|
|
errorNum: 0, // 错误题数
|
|||
|
|
examTime: '', // 考试用时
|
|||
|
|
totalNum: 0 // 总题数
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(opt) {
|
|||
|
|
this.opt = JSON.parse(opt.params)
|
|||
|
|
this.time = Number(this.opt.examTime) * 60 * 1000
|
|||
|
|
console.log('🚀 ~ onLoad ~ opt:', this.opt)
|
|||
|
|
this.getQuestionList()
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
// this.getList()
|
|||
|
|
},
|
|||
|
|
// 未正常提交, 离开页面自动提交
|
|||
|
|
onUnload() {
|
|||
|
|
if (!this.isEnd) {
|
|||
|
|
this.handleConfirmSubmit()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
// 获取题目列表
|
|||
|
|
async getQuestionList() {
|
|||
|
|
this.questionList = []
|
|||
|
|
let res = {}
|
|||
|
|
if (this.opt.isStudyTask) {
|
|||
|
|
res = await getQuestion({ examId: this.opt.id })
|
|||
|
|
} else {
|
|||
|
|
const params = {
|
|||
|
|
examPaperId: this.opt.examPaperId,
|
|||
|
|
type: 1,
|
|||
|
|
practiceType: 3
|
|||
|
|
}
|
|||
|
|
res = await getExamQuestion(params)
|
|||
|
|
}
|
|||
|
|
console.log('🚀 ~ 题目列表 ~ res:', res)
|
|||
|
|
this.questionList = res.data
|
|||
|
|
this.questionList.sort((a, b) => a.questionType - b.questionType)
|
|||
|
|
this.questionList.forEach(item => {
|
|||
|
|
if (item.questionPictureVoList && item.questionPictureVoList.length > 0) {
|
|||
|
|
item.questionPictureVoList.forEach(img => {
|
|||
|
|
img.url = config.fileUrl2 + img.pictureUrl.replace(/\\/g, '/')
|
|||
|
|
// img.url = 'https://cdn.uviewui.com/uview/swiper/1.jpg'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
//
|
|||
|
|
if (item.questionAnswerVoList && item.questionAnswerVoList.length > 0) {
|
|||
|
|
// 添加一个 radiovalue 字段，用于记录用户选择的答案
|
|||
|
|
if (item.questionType == 1 || item.questionType == 3) {
|
|||
|
|
item.radioValue = ''
|
|||
|
|
} else if (item.questionType == 2) {
|
|||
|
|
item.checkboxValue = []
|
|||
|
|
}
|
|||
|
|
item.selectAnswer = ''
|
|||
|
|
item.questionAnswerVoList.forEach(answer => {
|
|||
|
|
if (answer.questionPictureVoList && answer.questionPictureVoList.length > 0) {
|
|||
|
|
// 图片路径拼接
|
|||
|
|
answer.questionPictureVoList.forEach(opt => {
|
|||
|
|
opt.url = config.fileUrl2 + opt.pictureUrl.replace(/\\/g, '/')
|
|||
|
|
// opt.url = 'https://cdn.uviewui.com/uview/swiper/1.jpg'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
console.log('🚀 ~ getQuestionList ~ this.题目列表:', this.questionList)
|
|||
|
|
this.getList()
|
|||
|
|
},
|
|||
|
|
// 获取列表
|
|||
|
|
getList() {
|
|||
|
|
this.questionList.forEach((item, index) => {
|
|||
|
|
this.$set(item, 'isShow', index < 7)
|
|||
|
|
this.$set(item, 'isActive', false)
|
|||
|
|
this.$set(item, 'isShortAnswerValue', '')
|
|||
|
|
if (item.options) {
|
|||
|
|
item.options.forEach(option => {
|
|||
|
|
this.$set(option, 'isActive', false)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
console.log('🚀 ~ this.questionList.forEach ~ this.questionList:', this.questionList)
|
|||
|
|
this.$refs.countDown.start()
|
|||
|
|
},
|
|||
|
|
radioChange(question, item) {
|
|||
|
|
// console.log('🚀 ~ radioChange ~ item:', item)
|
|||
|
|
console.log('🚀 ~ radioChange ~ question:', question)
|
|||
|
|
setTimeout(() => {
|
|||
|
|
this.handleOption(item)
|
|||
|
|
}, 200)
|
|||
|
|
},
|
|||
|
|
// 上一题
|
|||
|
|
handlePrev() {
|
|||
|
|
if (this.currentIndex > 0) {
|
|||
|
|
this.currentIndex--
|
|||
|
|
if (this.currentIndex <= 6) {
|
|||
|
|
this.isRotating = false
|
|||
|
|
this.questionList.forEach((item, index) => {
|
|||
|
|
if (index > 6) {
|
|||
|
|
this.$set(item, 'isShow', false)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 下一题
|
|||
|
|
handleNext() {
|
|||
|
|
if (this.currentIndex < this.questionList.length - 1) {
|
|||
|
|
this.currentIndex++
|
|||
|
|
if (this.currentIndex > 6) {
|
|||
|
|
this.handleUnfold2()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 点击预览
|
|||
|
|
handleImg(img) {
|
|||
|
|
uni.previewImage({
|
|||
|
|
urls: [img]
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 选择选项
|
|||
|
|
handleOption(item) {
|
|||
|
|
console.log('🚀 ~ handleOption ~ item:', item)
|
|||
|
|
if (item.questionType == 1 || item.questionType == 3) {
|
|||
|
|
console.log('🚀 ~ handleOption ~ 确认选择-单选:', item)
|
|||
|
|
item.selectAnswer = String(item.radioValue.split('')[0].charCodeAt() - 65)
|
|||
|
|
item.correctAnswer1 = String.fromCharCode(65 + Number(item.correctAnswer))
|
|||
|
|
item.chooseAnswer1 = String.fromCharCode(65 + Number(item.selectAnswer))
|
|||
|
|
} else if (item.questionType == 2) {
|
|||
|
|
console.log('🚀 ~ handleOption ~ 确认选择-多选:', item)
|
|||
|
|
let selectAnswer = item.checkboxValue.map(item => item.split('')[0].charCodeAt() - 65)
|
|||
|
|
console.log('🚀 ~ handleOption ~ selectAnswer:', selectAnswer)
|
|||
|
|
selectAnswer.sort((a, b) => a - b)
|
|||
|
|
item.selectAnswer = selectAnswer.join(',')
|
|||
|
|
console.log('🚀 ~ handleOption ~ item.selectAnswer:', item.selectAnswer)
|
|||
|
|
item.correctAnswer1 = item.correctAnswer
|
|||
|
|
.split(',')
|
|||
|
|
.map(item => String.fromCharCode(65 + Number(item)))
|
|||
|
|
.join(',')
|
|||
|
|
item.chooseAnswer1 = selectAnswer.map(item => String.fromCharCode(65 + Number(item))).join(',')
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
changeCountDown(time) {
|
|||
|
|
// console.log('🚀 ~ changeCountDown ~ time:', time)
|
|||
|
|
this.answerTime =
|
|||
|
|
this.time - (time.days * 24 * 60 * 60 + time.hours * 60 * 60 + time.minutes * 60 + time.seconds) * 1000
|
|||
|
|
if (this.answerTime == this.time) {
|
|||
|
|
// 提示: 时间结束, 自动提交
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
message: '考试时间结束, 系统将自动提交',
|
|||
|
|
duration: 1000
|
|||
|
|
})
|
|||
|
|
this.handleConfirmSubmit()
|
|||
|
|
setTimeout(() => {
|
|||
|
|
this.isEnd = true
|
|||
|
|
}, 1000)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 展开
|
|||
|
|
handleUnfold() {
|
|||
|
|
this.questionList.forEach((item, index) => {
|
|||
|
|
if (index > 6) {
|
|||
|
|
this.$set(item, 'isShow', !item.isShow)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
this.isRotating = !this.isRotating
|
|||
|
|
},
|
|||
|
|
handleUnfold2() {
|
|||
|
|
this.questionList.forEach((item, index) => {
|
|||
|
|
if (index > 6) {
|
|||
|
|
this.$set(item, 'isShow', true)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
this.isRotating = true
|
|||
|
|
},
|
|||
|
|
// 点击题号
|
|||
|
|
handleQuestionNumber(item, index) {
|
|||
|
|
console.log('🚀 ~ handleQuestionNumber ~ item:', item)
|
|||
|
|
this.currentIndex = index
|
|||
|
|
},
|
|||
|
|
confirm() {
|
|||
|
|
if (this.isAddLoading) {
|
|||
|
|
// 提示
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
message: '正在提交中...',
|
|||
|
|
duration: 1000
|
|||
|
|
})
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.isAddLoading = true
|
|||
|
|
this.handleConfirmSubmit()
|
|||
|
|
},
|
|||
|
|
// 提交试卷
|
|||
|
|
handleSubmit() {
|
|||
|
|
if (this.questionList.some(item => item.selectAnswer == '')) {
|
|||
|
|
this.showModal = true
|
|||
|
|
this.content = '您还有题目未答, 是否确认提交?'
|
|||
|
|
} else {
|
|||
|
|
this.content = '是否确认提交?'
|
|||
|
|
this.showModal = true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 格式化时间
|
|||
|
|
formatTime(seconds) {
|
|||
|
|
const minutes = Math.floor(seconds / 60)
|
|||
|
|
const remainingSeconds = seconds % 60
|
|||
|
|
const formattedMinutes = String(minutes).padStart(2, '0')
|
|||
|
|
const formattedSeconds = String(remainingSeconds).padStart(2, '0')
|
|||
|
|
return `${formattedMinutes}:${formattedSeconds}`
|
|||
|
|
},
|
|||
|
|
async handleConfirmSubmit() {
|
|||
|
|
try {
|
|||
|
|
uni.showLoading({
|
|||
|
|
title: '提交中...',
|
|||
|
|
mask: true
|
|||
|
|
})
|
|||
|
|
console.log('🚀 ~ handleSubmit ~ 提交:')
|
|||
|
|
// 提交试卷
|
|||
|
|
this.$refs.countDown.pause()
|
|||
|
|
|
|||
|
|
// 计算使用时间
|
|||
|
|
this.endOfExamination.examTime = this.formatTime(this.answerTime / 1000)
|
|||
|
|
|
|||
|
|
// 获取当前时间
|
|||
|
|
const date = new Date()
|
|||
|
|
this.endOfExamination.submitTime = this.formatDate(date)
|
|||
|
|
|
|||
|
|
// 计算正确题数, 错误题数, 每题得分, 总分
|
|||
|
|
this.questionList.forEach(item => {
|
|||
|
|
if (item.selectAnswer == item.correctAnswer) {
|
|||
|
|
this.correctNum++
|
|||
|
|
if (item.questionType == 1) {
|
|||
|
|
item.scorePerQuestion = this.opt.singleScore
|
|||
|
|
} else if (item.questionType == 2) {
|
|||
|
|
item.scorePerQuestion = this.opt.multipleScore
|
|||
|
|
} else if (item.questionType == 3) {
|
|||
|
|
item.scorePerQuestion = this.opt.judgeScore
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this.errorNum++
|
|||
|
|
item.scorePerQuestion = '0'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (item.scorePerQuestion) {
|
|||
|
|
this.totalScore += Number(item.scorePerQuestion)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
this.endOfExamination.score = this.totalScore // 总得分
|
|||
|
|
|
|||
|
|
this.endOfExamination.totalScore = this.opt.totalScore // 总分
|
|||
|
|
|
|||
|
|
// 考试类型
|
|||
|
|
this.endOfExamination.examType = this.opt.name
|
|||
|
|
|
|||
|
|
// 计算答对题数
|
|||
|
|
this.endOfExamination.correctNum = this.correctNum
|
|||
|
|
|
|||
|
|
// 计算答错题数
|
|||
|
|
this.endOfExamination.errorNum = this.errorNum
|
|||
|
|
|
|||
|
|
// 生成答题卡
|
|||
|
|
this.endOfExamination.answerSheet = this.generateAnswerSheet()
|
|||
|
|
|
|||
|
|
// 是否及格
|
|||
|
|
// this.endOfExamination.isPass = this.endOfExamination.score >= this.passScore ? '及格' : '不及格'
|
|||
|
|
this.endOfExamination.isPass = this.endOfExamination.score >= this.opt.passScore ? '及格' : '不及格'
|
|||
|
|
|
|||
|
|
console.log('🚀 ~ handleConfirmSubmit ~ this.endOfExamination:', this.endOfExamination)
|
|||
|
|
|
|||
|
|
// 交卷
|
|||
|
|
let scoringRete = 0
|
|||
|
|
scoringRete = ((this.correctNum / (this.correctNum + this.errorNum)) * 100).toFixed(2)
|
|||
|
|
if (scoringRete == 'NaN' || scoringRete == 'Infinity' || scoringRete == '0.00') {
|
|||
|
|
scoringRete = 0
|
|||
|
|
}
|
|||
|
|
if (this.opt.isStudyTask) {
|
|||
|
|
const params = {
|
|||
|
|
taskId: this.opt.taskId,
|
|||
|
|
type: this.opt.type,
|
|||
|
|
userId: this.userId,
|
|||
|
|
examPaperId: this.opt.id,
|
|||
|
|
id: this.opt.id,
|
|||
|
|
scoringRete,
|
|||
|
|
answerTime: this.answerTime / 1000,
|
|||
|
|
score: this.totalScore,
|
|||
|
|
selectAnswerList: this.questionList
|
|||
|
|
}
|
|||
|
|
console.log('🚀 ~ handleEnd ~ params:', params)
|
|||
|
|
const res = await updateAnswer(params)
|
|||
|
|
console.log('🚀 ~ handleEnd ~ res:', res)
|
|||
|
|
if (res.code == 200) {
|
|||
|
|
this.isEnd = true
|
|||
|
|
uni.hideLoading()
|
|||
|
|
}
|
|||
|
|
this.isAddLoading = false
|
|||
|
|
} else {
|
|||
|
|
const params = {
|
|||
|
|
taskId: this.opt.taskId,
|
|||
|
|
type: this.opt.type,
|
|||
|
|
userId: this.userId,
|
|||
|
|
examPaperId: this.opt.examPaperId,
|
|||
|
|
id: this.opt.examPaperId,
|
|||
|
|
score: this.totalScore,
|
|||
|
|
scoreRate: scoringRete,
|
|||
|
|
answerTime: this.answerTime / 1000,
|
|||
|
|
answerList: this.questionList
|
|||
|
|
}
|
|||
|
|
console.log('🚀 ~ handleConfirmSubmit ~ params:', params)
|
|||
|
|
const res = await submitAnswer(params)
|
|||
|
|
console.log('🚀 ~ handleConfirmSubmit ~ res:', res)
|
|||
|
|
if (res.code == 200) {
|
|||
|
|
this.isEnd = true
|
|||
|
|
uni.hideLoading()
|
|||
|
|
}
|
|||
|
|
this.isAddLoading = false
|
|||
|
|
}
|
|||
|
|
} catch (error) {
|
|||
|
|
console.log('🚀 ~ handleConfirmSubmit ~ error:', error)
|
|||
|
|
// 提示
|
|||
|
|
this.$refs.uToast.show({
|
|||
|
|
message: '提交失败, 请重新提交',
|
|||
|
|
duration: 1000
|
|||
|
|
})
|
|||
|
|
uni.hideLoading()
|
|||
|
|
this.isAddLoading = false
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 格式化时间
|
|||
|
|
formatDate(date) {
|
|||
|
|
const year = date.getFullYear()
|
|||
|
|
const month = date.getMonth() + 1
|
|||
|
|
const day = date.getDate()
|
|||
|
|
const hours = date.getHours()
|
|||
|
|
const minutes = date.getMinutes().toString().padStart(2, '0')
|
|||
|
|
const seconds = date.getSeconds().toString().padStart(2, '0')
|
|||
|
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
|
|||
|
|
},
|
|||
|
|
// 生成答题卡
|
|||
|
|
generateAnswerSheet() {
|
|||
|
|
return this.questionList.map(item => {
|
|||
|
|
return {
|
|||
|
|
id: item.questionId,
|
|||
|
|
isAnswer: item.selectAnswer == item.correctAnswer ? true : false,
|
|||
|
|
isUnAnswer: item.selectAnswer == ''
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
onBackPress(options) {
|
|||
|
|
console.log(options)
|
|||
|
|
if (options.from == 'backbutton') {
|
|||
|
|
// 来自手势返回
|
|||
|
|
console.log('手势返回')
|
|||
|
|
// 返回为 true 时，不会执行返回操作，可以自定义返回逻辑
|
|||
|
|
// 返回为 false 或者不返回时，则执行默认返回操作
|
|||
|
|
return true
|
|||
|
|
}
|
|||
|
|
// 返回为 false 或者不返回时，则执行默认返回操作
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.content {
|
|||
|
|
padding: 0 20px;
|
|||
|
|
font-size: 13px;
|
|||
|
|
word-wrap: break-word; // 自动换行
|
|||
|
|
word-break: break-all; // 强制换行
|
|||
|
|
|
|||
|
|
.top-wrapper {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
.time {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.center-wrapper {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
|
|||
|
|
.unfold {
|
|||
|
|
height: 50px;
|
|||
|
|
line-height: 50px;
|
|||
|
|
text-align: center;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
.answer-wrapper {
|
|||
|
|
width: 86%;
|
|||
|
|
max-height: 150px;
|
|||
|
|
overflow: auto;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
|
|||
|
|
.item-wrapper {
|
|||
|
|
padding: 5px 5px 0 0;
|
|||
|
|
width: 12%;
|
|||
|
|
height: 45px;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.answer-item {
|
|||
|
|
width: 33px;
|
|||
|
|
height: 33px;
|
|||
|
|
line-height: 33px;
|
|||
|
|
text-align: center;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
background: #f4f9fe;
|
|||
|
|
color: #333;
|
|||
|
|
&.isAnswer {
|
|||
|
|
background: #a9e08f;
|
|||
|
|
}
|
|||
|
|
&.isActive {
|
|||
|
|
background: #1989fa;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.question-wrapper {
|
|||
|
|
margin-top: 30px;
|
|||
|
|
.question-type {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
align-items: center;
|
|||
|
|
.line {
|
|||
|
|
width: 3px;
|
|||
|
|
height: 15px;
|
|||
|
|
background-color: #1989fa;
|
|||
|
|
}
|
|||
|
|
.type {
|
|||
|
|
padding: 0 10px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.question-title {
|
|||
|
|
margin: 10px 0;
|
|||
|
|
font-size: 15px;
|
|||
|
|
font-weight: 800;
|
|||
|
|
color: #333;
|
|||
|
|
}
|
|||
|
|
.question-img-list {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: row;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
align-items: center;
|
|||
|
|
/* margin-top: 10px; */
|
|||
|
|
}
|
|||
|
|
.img {
|
|||
|
|
margin-right: 10px;
|
|||
|
|
width: 60px;
|
|||
|
|
height: 60px;
|
|||
|
|
}
|
|||
|
|
.radio-item {
|
|||
|
|
margin-left: 10px;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
.radio-name {
|
|||
|
|
margin-bottom: 5px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.question-item {
|
|||
|
|
margin-top: 20px;
|
|||
|
|
}
|
|||
|
|
.answer-wrap {
|
|||
|
|
margin-top: 20px;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
background-color: #edf2f7;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
padding: 10px;
|
|||
|
|
.answer-item {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
div {
|
|||
|
|
margin-bottom: 5px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.answer-line {
|
|||
|
|
width: 1px;
|
|||
|
|
height: 45px;
|
|||
|
|
background-color: #ccc;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.analysis {
|
|||
|
|
padding: 10px;
|
|||
|
|
background-color: #f5f5f5;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
min-height: 30px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* .question-wrapper {
|
|||
|
|
margin-top: 20px;
|
|||
|
|
.question-title {
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 18px;
|
|||
|
|
color: #08428d;
|
|||
|
|
}
|
|||
|
|
.option-item {
|
|||
|
|
margin-top: 10px;
|
|||
|
|
padding: 10px;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
background: #f4f9fe;
|
|||
|
|
color: #333;
|
|||
|
|
&.isActive {
|
|||
|
|
background: #e4f5de;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
} */
|
|||
|
|
|
|||
|
|
.box {
|
|||
|
|
height: 50px;
|
|||
|
|
}
|
|||
|
|
.bottom-wrapper {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
padding: 10px;
|
|||
|
|
background-color: #fff;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
|||
|
|
.btn {
|
|||
|
|
margin: 0 15px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
::v-deep .u-count-down__text {
|
|||
|
|
color: #1989fa;
|
|||
|
|
font-size: 13px;
|
|||
|
|
}
|
|||
|
|
::v-deep .u-modal__content {
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
</style>
|