Skip to content

X
x-learn
提交 86e3e6c3 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

updates

上级 cf194517
显示空白字符变更
内嵌 并排
正在显示 包含 164 行增加 和 144 行删除
src/components/exam/examCard.vue
浏览文件 @ 86e3e6c3
...@@ -2,45 +2,45 @@ ...@@ -2,45 +2,45 @@
<div> <div>
<div class="answer-box"> <div class="answer-box">
<div class="head" id="head-h"> <div class="head" id="head-h">
<el-button icon="el-icon-arrow-left" circle @click="$router.back()"></el-button> <el-button icon="el-icon-arrow-left" circle @click="$emit('back')"></el-button>
<div class="title">{{ title }}</div> <div class="title">{{ title }}</div>
<div class="right"> <div class="right">
<div class="count" v-if="hasCountDown">{{ examTimeText }}</div> <div class="count" v-if="hasCountdown">{{ countdownText }}</div>
</div> </div>
</div> </div>
<div class="exam-main"> <div class="exam-main">
<div class="left"> <div class="left">
<question-list :data="currentExam" :index="index" :disabled="disabled" :hasResult="hasResult"> <question-list :data="currentQuestionGroup" :index="currentPage" :disabled="disabled" :hasResult="hasResult">
<template #index>{{ index + 1 }}/{{ questionList.length }}</template> <template #index>{{ currentPage + 1 }}/{{ questionGroups.length }}</template>
</question-list> </question-list>
</div> </div>
<div class="right"> <div class="right">
<question-numbers <question-numbers
:index="index" :index="currentPage"
:list="questionList" :list="questionGroups"
:data="currentExam" :data="currentQuestionGroup"
@page-change="handlePageChange" @page-change="handlePageChange"
></question-numbers> ></question-numbers>
</div> </div>
</div> </div>
<div class="foot" id="foot-h"> <div class="foot" id="foot-h">
<div class="exam-btn"> <div class="exam-btn">
<div class="confirm" @click="showResult">确认答案</div> <div class="confirm" @click="showResult" v-if="hasShowResultBtn">确认答案</div>
<div @click="prevQuestion">上一题</div> <div @click="prev">上一题</div>
<div @click="nextQuestion">下一题</div> <div @click="next">下一题</div>
</div> </div>
<div class="rigth-btn"> <div class="rigth-btn">
<div class="sign" v-if="hasCollect" @click="collectQuestion"> <div class="sign" v-if="hasCollect" @click="toggleCollect">
<div :class="currentItem.is_collection ? 'icon active' : 'icon'"></div> <div :class="firstQuestion.is_collection ? 'icon active' : 'icon'"></div>
<div class="txt">{{ currentItem.is_collection ? '已收藏' : '收藏' }}</div> <div class="txt">{{ firstQuestion.is_collection ? '已收藏' : '收藏' }}</div>
</div> </div>
<div class="sign2" v-if="hasMark" @click="markQuestion"> <div class="sign2" v-if="hasMark" @click="toggleMark">
<div :class="currentItem.sign ? 'icon active' : 'icon'"></div> <div :class="firstQuestion.sign ? 'icon active' : 'icon'"></div>
<div class="txt">{{ currentItem.sign ? '已标记' : '标记' }}</div> <div class="txt">{{ firstQuestion.sign ? '已标记' : '标记' }}</div>
</div> </div>
<div class="del-btn" v-if="hasDeleteBtn">删除</div> <div class="del-btn" v-if="hasDeleteBtn" @click="$emit('delete', currentQuestionGroup)">删除</div>
<div class="end-exam-btn"> <div class="end-exam-btn">
<div class="btn" v-if="hasSubmitBtn && !disabled" @click="submitExam">{{ submitButtonText }}</div> <div class="btn" v-if="hasSubmitBtn && !disabled" @click="submit">{{ submitButtonText }}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -60,80 +60,78 @@ export default { ...@@ -60,80 +60,78 @@ export default {
hasCollect: { type: Boolean, default: true }, // 收藏 hasCollect: { type: Boolean, default: true }, // 收藏
hasSubmitBtn: { type: Boolean, default: true }, // 提交按钮 hasSubmitBtn: { type: Boolean, default: true }, // 提交按钮
hasDeleteBtn: { type: Boolean, default: false }, // 删除按钮 hasDeleteBtn: { type: Boolean, default: false }, // 删除按钮
hasCountDown: { type: Boolean, default: true }, // 计时 hasShowResultBtn: { type: Boolean, default: false }, // 显示答案按钮
data: { type: Object, default: () => {} }, hasCountdown: { type: Boolean, default: true }, // 计时
questionItems: { type: Array, default: () => [] }, submitButtonText: { type: String, default: '交卷' }, // 提交按钮显示的文字
submitButtonText: { type: String, default: '交卷' } // 提交按钮显示的文字 data: { type: Object, default: () => {} }, // 模拟考试返回的数据，内部组装
groups: { type: Array, default: () => [] } // 收藏、错题组装好的数据
}, },
data() { data() {
return { return {
disabled: false, disabled: false, // 是否禁用输入框
hasResult: false, hasResult: false, // 是否显示解析
index: 0, // 当前题的下标
countDownTime: null, // 倒计时计时器
duration: 0, // 答题所用时间 duration: 0, // 答题所用时间
examTimeText: '', countdownTimer: null, // 倒计时计时器
questionList: [] // 所有试题 countdownText: '', // 倒计时显示时间
questionGroups: this.groups, // 所有试题分组,一组一页
questionIndex: 0, // 题号
currentPage: 0 // 页码
} }
}, },
computed: { computed: {
// 当前页面的大题数据 // 当前页面试题组
currentExam() { currentQuestionGroup() {
return this.questionList[this.index] || {} return this.questionGroups[this.currentPage] || {}
}, },
// 当前题第一个小题 // 当前页面的试题列表
currentItem() { currentQuestionList() {
const [first = {}] = this.currentExam.question_list || [] return this.currentQuestionGroup.question_list || []
return first },
// 当前页面第一个试题
firstQuestion() {
return this.currentQuestionList[0] || {}
} }
}, },
watch: { watch: {
data: { data: {
deep: true, deep: true,
immediate: true, handler(data) {
handler(value) { data && this.dataInit(data)
if (this.questionItems.length) {
this.questionList = this.questionItems
return
}
if (value) {
const { status } = value
this.disabled = ['1', '2'].includes(status)
this.hasResult = ['1', '2'].includes(status)
this.genQuestions(value)
} }
},
groups: {
handler(groups) {
this.questionGroups = groups
} }
}, },
index(value) { currentPage() {
this.hasResult = this.currentExam.hasResult this.hasResult = this.currentQuestionGroup.hasResult
} }
}, },
beforeDestroy() { beforeDestroy() {
clearInterval(this.countDownTime) // 停止倒计时 clearInterval(this.countdownTimer) // 停止倒计时
},
mounted() {
}, },
methods: { methods: {
// 倒计时 // 倒计时
countDown(time) { countDown(time) {
console.log(time, 'time') console.log(time, 'time')
let sec = parseInt(time) let sec = parseInt(time)
clearInterval(this.countDownTime) clearInterval(this.countdownTimer)
this.countDownTime = setInterval(() => { this.countdownTimer = setInterval(() => {
sec-- sec--
if (sec === 0) { if (sec === 0) {
clearInterval(this.time.clearTime) clearInterval(this.time.clearTime)
this.$alert('考试时间结束，自动提交试卷', '', { this.$alert('考试时间结束，自动提交试卷', '', {
confirmButtonText: '确定', confirmButtonText: '确定',
callback: action => { callback: action => {
this.submitExam() this.submit()
} }
}) }) // 是否显示解析
return false return false
} }
this.examTimeText = this.secondToDate(sec) this.countdownText = this.secondToDate(sec) // 倒计时显示时间
this.duration++ this.duration++
this.$emit('timeupdate', this.duration, this.questionList) this.$emit('timeupdate', this.duration, this.questionGroups)
}, 1000) }, 1000)
}, },
secondToDate(result) { secondToDate(result) {
...@@ -148,53 +146,63 @@ export default { ...@@ -148,53 +146,63 @@ export default {
} }
return result return result
}, },
// 确认答案 // 显示答案
showResult() { showResult() {
this.hasResult = true this.hasResult = true
this.questionList[this.index].hasResult = true this.questionGroups[this.currentPage].hasResult = true
},
// 下一题
nextQuestion() {
const totalNumber = this.questionList.length
if (this.index + 1 < totalNumber) this.index++
this.$emit('page-change', this.currentExam)
}, },
// 上一题 // 上一题
prevQuestion() { prev() {
if (this.index !== 0) this.index-- if (this.currentPage <= 0) return
this.$emit('page-change', this.currentExam) this.currentPage--
this.$emit('page-change', this.currentQuestionGroup, this.questionGroups)
},
// 下一题
next() {
const total = this.questionGroups.length
if (this.currentPage + 1 >= total) return
this.currentPage++
this.$emit('page-change', this.currentQuestionGroup, this.questionGroups)
}, },
handlePageChange(index) { handlePageChange(index) {
this.index = index this.currentPage = index
this.$emit('page-change', this.currentQuestionGroup, this.questionGroups)
}, },
// 收藏试题 // 收藏
collectQuestion() { toggleCollect() {
const item = this.currentItem const ids = []
if (item.is_collection) { // 第一题的收藏状态
api.deleteCollection({ type: 2, question_id: item.id }).then(response => { const isCollection = this.firstQuestion.is_collection
item.is_collection = false this.currentQuestionList.forEach(item => {
}) item.is_collection = !isCollection
return false ids.push(item.id || item.question_id)
}
api.addCollection({ question_id: item.id }).then(response => {
item.is_collection = true
}) })
isCollection
? api.deleteCollection({ type: 2, question_id: ids.join() })
: api.addCollection({ question_id: ids.join() })
}, },
// 标记 // 标记
markQuestion() { toggleMark() {
const item = this.questionList[this.index].question_list[0] this.currentQuestionList.forEach(item => {
item.sign ? (item.sign = false) : (item.sign = true) item.sign = !item.sign
this.$forceUpdate() })
}, },
// 提交考试 // 提交
submitExam() { submit() {
this.$emit('submitExam', this.questionList) this.$emit('submit', this.questionGroups)
},
// 数据初始化
dataInit(data) {
const isSubmited = ['1', '2'].includes(data.status)
this.disabled = isSubmited
this.hasResult = isSubmited
this.genQuestions(data)
}, },
// 组装试题数据 // 组装试题数据
genQuestions(data) { genQuestions(data) {
const { questions, answers = {} } = data const { questions, answers = {} } = data
if (!questions) return [] if (!questions) return []
this.questionList = questions.question_items.reduce((result, question) => { this.questionGroups = questions.question_items.reduce((result, question) => {
question.question_list.forEach(list => { question.question_list.forEach(list => {
list = list.map(item => { list = list.map(item => {
let userAnswers = [] let userAnswers = []
...@@ -215,11 +223,13 @@ export default { ...@@ -215,11 +223,13 @@ export default {
}) })
return result return result
}, []) }, [])
// 答题倒计时 },
if (this.hasCountDown) { genQuestionItem(data) {
this.countDown(this.data.remaining_times) return {}
this.duration = this.data.duration || 0 },
} // 重置
reset() {
this.currentPage = 0
} }
} }
} }
......
src/pages/exam/courseExam/chapter/index.vue
浏览文件 @ 86e3e6c3
...@@ -2,8 +2,9 @@ ...@@ -2,8 +2,9 @@
<exam-card <exam-card
title="课后练习" title="课后练习"
:data="data" :data="data"
@submitExam="handleSubmit" :hasCountdown="false"
:hasCountDown="false" @submit="handleSubmit"
@back="handleBack"
v-if="Object.keys(data).length" v-if="Object.keys(data).length"
></exam-card> ></exam-card>
</template> </template>
...@@ -36,10 +37,9 @@ export default { ...@@ -36,10 +37,9 @@ export default {
this.data = JSON.parse(response.data).sheet this.data = JSON.parse(response.data).sheet
}) })
}, },
// 缓存答案 // 返回
handleCache(data) { handleBack() {
const params = this.genSubmitData(data) this.$router.push(`/course/learn/${this.$route.query.course_id}`)
api.setCourseCache(Object.assign(params, { status: 0 }))
}, },
// 提交答案 // 提交答案
handleSubmit(data) { handleSubmit(data) {
...@@ -52,26 +52,20 @@ export default { ...@@ -52,26 +52,20 @@ export default {
}) })
}, },
// 组装提交数据 // 组装提交数据
genSubmitData(questionList) { genSubmitData(questionGroups) {
const answers = {} const answers = {}
questionList.forEach(item => { questionGroups.forEach(group => {
if (!answers[item.question_item_id]) { if (!answers[group.question_item_id]) {
answers[item.question_item_id] = {} answers[group.question_item_id] = {}
} }
item.question_list.forEach(cItem => { group.question_list.forEach(item => {
answers[item.question_item_id][cItem.id] = { answers[item.question_item_id][item.id] = {
sign: cItem.sign ? cItem.sign : false, sign: item.sign ? item.sign : false,
answers: cItem.user_answer answers: item.user_answer
} }
}) })
}) })
return { return { type: 1, sheet_id: this.data.id, status: 0, answers: JSON.stringify(answers), duration: 0 }
type: 1,
sheet_id: this.data.id,
status: 0,
answers: JSON.stringify(answers),
duration: 0
}
} }
} }
} }
......
src/pages/exam/myExam/questionDetails.vue
浏览文件 @ 86e3e6c3
<template> <template>
<exam-card <exam-card
:title="title" :title="title"
:questionItems="questionItems" :groups="questionGroups"
:hasMark="false" :hasMark="false"
:hasDeleteBtn="true" :hasDeleteBtn="true"
:hasCountDown="false" :hasCountDown="false"
:hasShowResultBtn="true"
submitButtonText="清空记录，重新答题" submitButtonText="清空记录，重新答题"
@submitExam="handleSubmit" @back="handleBack"
@submit="handleSubmit"
@page-change="handlePageChange" @page-change="handlePageChange"
@deleteQuestion="deleteQuestion" @delete="deleteQuestion"
ref="exam" ref="exam"
v-if="Object.keys(data).length" v-if="Object.keys(data).length"
></exam-card> ></exam-card>
...@@ -28,10 +30,10 @@ export default { ...@@ -28,10 +30,10 @@ export default {
title() { title() {
return this.$route.query.type === '1' ? '错题集合' : '收藏试题' return this.$route.query.type === '1' ? '错题集合' : '收藏试题'
}, },
questionItems() { questionGroups() {
return this.data.list.map(groups => { return this.data.list.map(list => {
const [first = {}] = groups const [first = {}] = list
return { question_item_id: '', question_type: first.question_type, question_list: groups, hasResult: false } return { question_item_id: '', question_type: first.question_type, question_list: list, hasResult: false }
}) })
} }
}, },
...@@ -46,15 +48,20 @@ export default { ...@@ -46,15 +48,20 @@ export default {
question_id: data.question_list[0].question_id, question_id: data.question_list[0].question_id,
type: this.$route.query.type type: this.$route.query.type
} }
api api.deleteQuestion(param).then(response => {
.deleteQuestion(param) this.getTopic().then(() => {
.then(response => { // 重置
// this.getTopic() this.$refs.exam.reset()
this.$router.go(0)
}) })
.finally(() => {
}) })
console.log(data) },
// 返回
handleBack() {
if (this.$route.query.type === '1') {
this.$router.push('/my/questions/wrong')
} else {
this.$router.push('/my/questions/collection')
}
}, },
// 获取考卷 // 获取考卷
getTopic() { getTopic() {
...@@ -65,7 +72,7 @@ export default { ...@@ -65,7 +72,7 @@ export default {
page: this.page, page: this.page,
page_size: 20 page_size: 20
} }
api.getMyQuestion(param).then(response => { return api.getMyQuestion(param).then(response => {
this.data = response this.data = response
}) })
}, },
...@@ -81,25 +88,21 @@ export default { ...@@ -81,25 +88,21 @@ export default {
}) })
}, },
// 缓存答案 // 缓存答案
handlePageChange(data) { handlePageChange(data, groups) {
this.cacheQuestion(this.genSubmitData(this.$refs.exam.questionItems)) this.cacheQuestion(this.genSubmitData(groups))
}, },
cacheQuestion(param, call) { cacheQuestion(param, callback) {
api api.setMyCache(param).then(response => {
.setMyCache(param) callback && callback()
.then(response => {
call()
})
.finally(() => {
}) })
}, },
// 组装提交数据 // 组装提交数据
genSubmitData(questionList) { genSubmitData(questionGroups) {
const answers = {} const answers = {}
questionList.forEach(item => { questionGroups.forEach(group => {
item.question_list.forEach(cItem => { group.question_list.forEach(item => {
if (cItem.user_answer.length) { if (item.user_answer.length) {
answers[cItem.question_id] = cItem.user_answer answers[item.question_id] = item.user_answer
} }
}) })
}) })
......
src/pages/exam/testExam/exam/index.vue
浏览文件 @ 86e3e6c3
<template> <template>
<div> <div>
<exam-card :hasSubmitBtn="!!(!this.$route.query.id)" :hasCountDown="!!(!this.$route.query.id)" v-if="Object.keys(data).length" @submitExam="submitExam" ref="exam" title="模拟考试" :data="data"></exam-card> <exam-card
title="模拟考试"
:hasSubmitBtn="!!!this.$route.query.id"
:hasCountdown="!!!this.$route.query.id"
:data="data"
@submit="submitExam"
@back="handleBack"
ref="exam"
v-if="Object.keys(data).length"
></exam-card>
</div> </div>
</template> </template>
<script> <script>
...@@ -47,6 +56,10 @@ export default { ...@@ -47,6 +56,10 @@ export default {
this.data = JSON.parse(response.data).sheet this.data = JSON.parse(response.data).sheet
}) })
}, },
// 返回
handleBack() {
this.$router.push('/testExam')
},
// 提交考卷 isCache：0缓存，1提交 // 提交考卷 isCache：0缓存，1提交
submitExam(isCache) { submitExam(isCache) {
const refData = this.$refs.exam const refData = this.$refs.exam
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论