Skip to content

T
transport-show-h5
提交 3c89e7a8 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

测试列表页

上级 9957fc54
显示空白字符变更
内嵌 并排
正在显示 包含 951 行增加 和 108 行删除
package-lock.json
浏览文件 @ 3c89e7a8
This source diff could not be displayed because it is too large. You can view the blob instead.
src/api/courseExam.js 0 → 100644
浏览文件 @ 3c89e7a8
import BaseAPI from '@/api/base_api'
const httpRequest = new BaseAPI(webConf)
/**
* 随堂测试课程章节列表
*/
export function getCourseChapterList() {
return httpRequest.get('/zy/v2/education/courses/my')
}
/* 模拟考试设置角色 */
export function setRole(data) {
return httpRequest.post('/zy/v2/examination/role', data, {
headers: { 'Content-Type': 'multipart/form-data' }
})
}
/* 获取考试状态 */
export function getExamStatus(data) {
return httpRequest.get('/zy/v2/examination/examination-papers-status', data, {
headers: { 'Content-Type': 'multipart/form-data' }
})
}
src/main.js
浏览文件 @ 3c89e7a8
...@@ -51,7 +51,6 @@ router.beforeEach((to, from, next) => { ...@@ -51,7 +51,6 @@ router.beforeEach((to, from, next) => {
// before.update(to, from, next) // before.update(to, from, next)
next() next()
}) })
window.G.$instance_vue = new Vue({ window.G.$instance_vue = new Vue({
store, store,
router, router,
......
src/modules/exam-module/action/ExamAction.js
浏览文件 @ 3c89e7a8
...@@ -5,12 +5,12 @@ export default class ExamAction extends BaseACTION { ...@@ -5,12 +5,12 @@ export default class ExamAction extends BaseACTION {
return Exam.getPower(obj).then(res => res) return Exam.getPower(obj).then(res => res)
} }
getExam(obj) { getExam(obj, url) {
return Exam.getExam(obj).then(res => { return Exam.getExam(obj, url).then(res => {
if (res.code !== 0) { if (res.code !== 0) {
return res.code return res.code
} }
const _data = res.data const _data = JSON.parse(res.data)
const question = _data.sheet.questions.question_items.map(function(_) { const question = _data.sheet.questions.question_items.map(function(_) {
return { return {
type: _.question_type, type: _.question_type,
...@@ -23,7 +23,7 @@ export default class ExamAction extends BaseACTION { ...@@ -23,7 +23,7 @@ export default class ExamAction extends BaseACTION {
question_content: e.question_content, question_content: e.question_content,
id: e.id, id: e.id,
question_options: e.question_options.map(res => { question_options: e.question_options.map(res => {
if (_.question_type === '2') { if (_.question_type === '2' || _.question_type === '5') {
if (_data.sheet.answers === null || Array.isArray(_data.sheet.answers)) { if (_data.sheet.answers === null || Array.isArray(_data.sheet.answers)) {
return res return res
} }
...@@ -55,21 +55,23 @@ export default class ExamAction extends BaseACTION { ...@@ -55,21 +55,23 @@ export default class ExamAction extends BaseACTION {
id: _data.sheet.id, id: _data.sheet.id,
question_count: _data.sheet.questions.total_question_count, question_count: _data.sheet.questions.total_question_count,
score: _data.sheet.questions.total_score, score: _data.sheet.questions.total_score,
remainingTime: _data.sheet.remaining_times remainingTime: _data.sheet.remaining_times,
duration: _data.sheet.duration
}, },
answers: _data.sheet.answers, answers: _data.sheet.answers,
questions: question, questions: question,
score_items: _data.sheet.score_items, score_items: _data.sheet.score_items,
created_time: _data.sheet.created_time, created_time: _data.sheet.created_time,
score: _data.sheet.score, score: _data.sheet.score,
total_score: _data.sheet.questions.total_score total_score: _data.sheet.questions.total_score,
status: _data.sheet.status
} }
return json return json
}) })
} }
examSubmit(obj) { examSubmit(obj, url) {
return Exam.examSubmit(obj).then(res => { return Exam.examSubmit(obj, url).then(res => {
return res return res
}) })
} }
......
src/modules/exam-module/api/exam_api.js
浏览文件 @ 3c89e7a8
import BaseAPI from '@/api/base_api' import BaseAPI from '@/api/base_api'
export default class Exam extends BaseAPI { export default class Exam extends BaseAPI {
getExam = (obj = {}) => this.get('zy/v2/examination/examination-papers', obj) getExam = (obj, url) => this.get(url, obj)
getPower = (obj) => this.post('zy/v2/examination/role', obj, { headers: { 'Content-Type': 'multipart/form-data' } }) getPower = (obj, url) => this.post(url, obj, { headers: { 'Content-Type': 'multipart/form-data' } })
examSubmit = (obj) => this.post('zy/v2/examination/examination-papers', obj, { headers: { 'Content-Type': 'multipart/form-data' } }) examSubmit = (obj, url) => this.post(url, obj, { headers: { 'Content-Type': 'multipart/form-data' } })
} }
src/modules/exam-module/components/answer.vue 0 → 100644
浏览文件 @ 3c89e7a8
<template>
<div>
<div class="title">
<div class="type">{{ dItem.question_title }}</div>
<div class="count">{{ currentNum }}/{{ questionsData.sheet.question_count }}</div>
</div>
<div class="topic" v-html="dItem.question_content">
</div>
<ul class="option" v-if="item.type === '1' || item.type === '6' || item.type === '5' && dItem.answer_count <= 1">
<template v-for="(opt, oIndex) in dItem.question_options">
<template v-if="requestData2 != 0 && requestData[item.id]">
<li :key="oIndex" v-if="requestData[item.id][dItem.id]" :class="requestData[item.id][dItem.id].answer.find(res => { return res === opt.id }) ? 'active' : ''" @click="selectRadio(dItem, opt.id, oIndex, item)" :data-id="opt.id">{{opaKey[oIndex]}}.{{ opt.option }}</li>
<li :key="oIndex" v-else :class="dItem.activeIndex == oIndex ? 'active' : ''" @click="selectRadio(dItem, opt.id, oIndex, item)" :data-id="opt.id">{{opaKey[oIndex]}}.{{ opt.option }}</li>
</template>
<template v-else>
<li :key="oIndex" :class="dItem.activeIndex == oIndex ? 'active' : ''" @click="selectRadio(dItem, opt.id, oIndex, item)" :data-id="opt.id">{{opaKey[oIndex]}}{{ opt.option }}</li>
</template>
</template>
</ul>
<ul class="option" v-if="item.type === '2' || item.type === '5' && dItem.answer_count > 1">
<template v-for="(opt, oIndex) in dItem.question_options">
<template v-if="requestData2 != 0 && requestData[item.id]">
<li :key="oIndex+'-'" v-if="requestData[item.id][dItem.id]" :class="opt.active ? 'active' : ''" @click="selectCheckbox(opt, opt.id, dItem, item, oIndex)" :data-id="opt.id">{{opaKey[oIndex]}}.{{ opt.option }}</li>
<li :key="oIndex+'-'" v-else :class="opt.active ? 'active' : ''" @click="selectCheckbox(opt, opt.id, dItem, item, oIndex)" :data-id="opt.id">{{opaKey[oIndex]}}.{{ opt.option }}</li>
</template>
<template v-else>
<li :key="oIndex+'-'" :class="opt.active ? 'active' : ''" @click="selectCheckbox(opt, opt.id, dItem, item, oIndex)" :data-id="opt.id">{{opaKey[oIndex]}}.{{ opt.option }}</li>
</template>
</template>
</ul>
<!-- <div class="analy" v-if="isAnalysis">
<div class="tit">答案解析</div>
<div class="txt">正确答案：<span>{{ dItem.answerOpt }}</span></div>
<div class="txt">您的答案：<span>{{ dItem.opaVal }}</span></div>
<div class="exp">
<p class="name">解析：</p>
<p class="nr" v-html="dItem.question_analysis"></p>
</div>
</div> -->
</div>
</template>
<script>
export default {
props: ['dItem', 'currentNum', 'questionsData', 'item', 'requestData2', 'requestData'],
data() {
return {
opaKey: ['A', 'B', 'C', 'D', 'E', 'F', 'G']
}
},
methods: {
selectRadio(cData, checkId, index, oData) {
if (!this.isExamEnd) {
return false
}
const opa = this.opaKey
cData.opaVal = opa[index]
cData.activeIndex = index
if (this.requestData[oData.id]) {
if (!this.requestData[oData.id][cData.id]) {
this.requestData[oData.id][cData.id] = {
sign: false,
answer: [checkId]
}
} else {
this.requestData[oData.id][cData.id].answer = [checkId]
}
} else {
this.requestData[oData.id] = {
[cData.id]: {
sign: false,
answer: [checkId]
}
}
}
this.$forceUpdate()
},
// 多选事件
selectCheckbox(opt, checkId, cData, oData, index) {
if (!this.isExamEnd) {
return false
}
opt.active === undefined ? opt.active = true : opt.active = !opt.active
if (opt.active) {
if (this.requestData[oData.id]) {
if (this.requestData[oData.id][cData.id]) {
const arr = this.requestData[oData.id][cData.id].answer
this.requestData[oData.id][cData.id] = {
sign: this.requestData[oData.id][cData.id].sign
}
arr.push(checkId)
this.requestData[oData.id][cData.id].answer = arr
} else {
this.requestData[oData.id][cData.id] = {
sign: false,
answer: [checkId]
}
}
} else {
this.requestData[oData.id] = {
[cData.id]: {
sign: false,
answer: [checkId]
}
}
}
} else {
const index = this.requestData[oData.id][cData.id].answer.indexOf(checkId)
this.requestData[oData.id][cData.id].answer.splice(index, 1)
}
const opa = this.opaKey
const opaArr = []
cData.question_options.map((item, i) => {
if (item.active) {
opaArr.push(opa[i])
}
cData.opaVal = opaArr.toString().replace(new RegExp(',', 'g'), '')
})
console.log(this.requestData)
this.$forceUpdate()
}
}
// props: {
// dItem: {
// type: Object,
// default () {
// return {}
// }
// },
// currentNum:
// }
// :dItem="dItem" :currentNum="currentNum" :questionsData="questionsData"
}
</script>
<style lang="scss" scoped>
</style>
src/modules/exam-module/src/ExamEnd.vue
浏览文件 @ 3c89e7a8
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="end_box"> <div class="end_box">
<div id="bottom-view3"> <div id="bottom-view3">
<div class="end_con"> <div class="end_con">
<div class="cs_type"><span>测试内容：</span>能力自测</div> <div class="cs_type"><span>测试内容：</span>{{ title }}</div>
<div class="cs_time"><span>测试时间：</span>{{ questionsData.created_time }}</div> <div class="cs_time"><span>测试时间：</span>{{ questionsData.created_time }}</div>
<div class="charts"> <div class="charts">
<svg width="86%" height="86%" viewBox="0 0 100 100"> <svg width="86%" height="86%" viewBox="0 0 100 100">
...@@ -105,24 +105,30 @@ export default { ...@@ -105,24 +105,30 @@ export default {
questionsData: { questionsData: {
questions: [] questions: []
}, },
requestData: {} requestData: {},
title: ''
} }
}, },
created() { created() {
}, },
mounted() { mounted() {
if (this.$route.query.course_id) {
this.$route.query.type === 1 ? this.title = '随堂测试' : this.title = '知识点测试'
} else {
this.$route.query.type === 1 ? this.title = '能力自测' : this.title = '模拟考试'
}
// this.title
this.initData() this.initData()
}, },
methods: { methods: {
go(id) { go(id) {
this.$emit('cardChange', id) const param = this.$route.query
param.id = id
this.$emit('cardChange', param)
}, },
initData() { initData() {
const param = { const param = this.$route.query
type: 1, Exam.getExam(param, param.papersUrl).then(res => {
is_create: 0
}
Exam.getExam(param).then(res => {
this.questionsData = res this.questionsData = res
this.requestData = res.answers this.requestData = res.answers
const count = this.questionsData.score / this.questionsData.total_score const count = this.questionsData.score / this.questionsData.total_score
......
src/modules/exam-module/src/ExamTopic.vue
浏览文件 @ 3c89e7a8
<template> <template>
<div> <div class="exam-box">
<div id="top-view"> <div id="top-view">
<!-- <div class="head">
<i class="el-icon-arrow-left"></i>
<div class="title">答题</div>
</div> -->
<div class="tool-box"> <div class="tool-box">
<div class="time">{{ remainingTime }}</div> <div class="time">{{ remainingTime }}</div>
<div class="tag-box"> <div class="tag-box">
<span @click="signQuestion">标记</span> <span @click="signQuestion" v-if="isExamEnd">标记</span>
<span @click="showCard">答题卡</span> <span @click="showCard">答题卡</span>
<span @click="isExamSubPop = true" v-if="isExamEnd">交卷</span> <span @click="isExamSubPop = true" v-if="isExamEnd">交卷</span>
</div> </div>
...@@ -19,6 +15,7 @@ ...@@ -19,6 +15,7 @@
<template v-for="(item) in questionsData.questions"> <template v-for="(item) in questionsData.questions">
<template v-for="(dItem, dIndex) in item.question_list"> <template v-for="(dItem, dIndex) in item.question_list">
<swiper-slide :key="dIndex+dItem.id" :data-dId="dItem.id" :data-cId="item.id"> <swiper-slide :key="dIndex+dItem.id" :data-dId="dItem.id" :data-cId="item.id">
<!-- <answer :item="item" :dItem="dItem" :currentNum="currentNum" :questionsData="questionsData" :requestData="requestData" :requestData2="requestData2"></answer> -->
<div class="title"> <div class="title">
<div class="type">{{ dItem.question_title }}</div> <div class="type">{{ dItem.question_title }}</div>
<div class="count">{{ currentNum }}/{{ questionsData.sheet.question_count }}</div> <div class="count">{{ currentNum }}/{{ questionsData.sheet.question_count }}</div>
...@@ -47,7 +44,7 @@ ...@@ -47,7 +44,7 @@
</template> </template>
</template> </template>
</ul> </ul>
<div class="analy" v-if="isAnalysis"> <div class="analy" v-if="isAnalysis || $route.query.id">
<div class="tit">答案解析</div> <div class="tit">答案解析</div>
<div class="txt">正确答案：<span>{{ dItem.answerOpt }}</span></div> <div class="txt">正确答案：<span>{{ dItem.answerOpt }}</span></div>
<div class="txt">您的答案：<span>{{ dItem.opaVal }}</span></div> <div class="txt">您的答案：<span>{{ dItem.opaVal }}</span></div>
...@@ -63,7 +60,7 @@ ...@@ -63,7 +60,7 @@
</div> </div>
<div class="btn-box"> <div class="btn-box">
<div class="padd"> <div class="padd">
<div class="analysis" @click="analyShow" v-if="false">查看解析</div> <div class="analysis" @click="analyShow" v-if="$route.query.id || $route.query.course_id || $route.query.chapter_id">查看解析</div>
<div class="btn left" @click="switchQuestions('left')">上一题</div> <div class="btn left" @click="switchQuestions('left')">上一题</div>
<div class="btn right" @click="switchQuestions('right')">下一题</div> <div class="btn right" @click="switchQuestions('right')">下一题</div>
</div> </div>
...@@ -85,14 +82,16 @@ ...@@ -85,14 +82,16 @@
<div class="tit">提示</div> <div class="tit">提示</div>
<img src="../assets/images/time.png" alt=""> <img src="../assets/images/time.png" alt="">
<div class="txt">考试时间到！答题结束</div> <div class="txt">考试时间到！答题结束</div>
<div class="btn" @click="goExamResult">确定</div> <div class="btn" @click="goExamResult ;examSubmit(1, true)">确定</div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import card from '../components/answerCard.vue' import card from '../components/answerCard.vue'
// import answer from '../components/answer.vue'
import examEnd from '../components/examEnd.vue' import examEnd from '../components/examEnd.vue'
import { Toast } from 'vant'
import Exam from '../action' import Exam from '../action'
import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper' import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
import 'swiper/css/swiper.css' import 'swiper/css/swiper.css'
...@@ -102,7 +101,8 @@ export default { ...@@ -102,7 +101,8 @@ export default {
Swiper, Swiper,
SwiperSlide, SwiperSlide,
card, card,
examEnd examEnd,
[Toast.name]: Toast
}, },
directives: { directives: {
swiper: directive swiper: directive
...@@ -119,6 +119,7 @@ export default { ...@@ -119,6 +119,7 @@ export default {
observer: true, observer: true,
on: { on: {
slideChangeTransitionStart: function() { slideChangeTransitionStart: function() {
document.getElementById('bottom-view').scrollTop = 0
_this.isAnalysis = false _this.isAnalysis = false
_this.currentNum = this.activeIndex + 1 _this.currentNum = this.activeIndex + 1
} }
...@@ -134,7 +135,8 @@ export default { ...@@ -134,7 +135,8 @@ export default {
// examIsShow: false, // examIsShow: false,
isExamSubPop: false, isExamSubPop: false,
timePopIsShow: false, timePopIsShow: false,
initTime: null initTime: null,
cache: null
} }
}, },
computed: { computed: {
...@@ -143,7 +145,7 @@ export default { ...@@ -143,7 +145,7 @@ export default {
} }
}, },
props: { props: {
params: { requestParam: {
type: Object, type: Object,
required: false, required: false,
default () { default () {
...@@ -151,21 +153,25 @@ export default { ...@@ -151,21 +153,25 @@ export default {
} }
} }
}, },
beforeDestroy() {
console.log(111111)
clearInterval(this.initTime)
// clearInterval(this.cache)
},
mounted () { mounted () {
if (!this.$route.query.id) { if (!this.$route.query.id) {
this.swiper.slideTo(0, 1000, false) this.swiper.slideTo(0, 1000, false)
clearInterval(this.initTime)
this.initTime = setInterval(() => { this.initTime = setInterval(() => {
this.examSubmit(0) this.examSubmit(0)
}, 5000) }, 5000)
this.initData(1) this.initData()
} else { } else {
this.examEnd() this.examEnd()
this.initData(0) this.initData(0)
} }
this.scrollDom() this.scrollDom()
}, },
created() {
},
methods: { methods: {
// 答题结束禁止答题 // 答题结束禁止答题
examEnd() { examEnd() {
...@@ -173,7 +179,6 @@ export default { ...@@ -173,7 +179,6 @@ export default {
}, },
// 答题卡点击跳题 // 答题卡点击跳题
cardChange(e) { cardChange(e) {
console.log(this.swiper.slides, '=======')
for (let i = 0; i < this.questionsData.sheet.question_count; i++) { for (let i = 0; i < this.questionsData.sheet.question_count; i++) {
if (this.swiper.slides[i].attributes['data-dId'].nodeValue === e) { if (this.swiper.slides[i].attributes['data-dId'].nodeValue === e) {
this.swiper.slideTo(i, 0, false) this.swiper.slideTo(i, 0, false)
...@@ -189,22 +194,10 @@ export default { ...@@ -189,22 +194,10 @@ export default {
const itemDid = this.swiper.slides[this.swiper.activeIndex].attributes['data-dId'].nodeValue const itemDid = this.swiper.slides[this.swiper.activeIndex].attributes['data-dId'].nodeValue
const itemCid = this.swiper.slides[this.swiper.activeIndex].attributes['data-cId'].nodeValue const itemCid = this.swiper.slides[this.swiper.activeIndex].attributes['data-cId'].nodeValue
const on = () => { const on = () => {
this.$message({ Toast('已完成标记')
showClose: true,
message: '已完成标记',
type: 'success',
center: true,
iconClass: ''
})
} }
const off = () => { const off = () => {
this.$message({ Toast('已取消标记')
showClose: true,
message: '已取消标记',
type: 'success',
center: true,
iconClass: ''
})
} }
if (!this.requestData[itemCid]) { if (!this.requestData[itemCid]) {
this.requestData[itemCid] = { this.requestData[itemCid] = {
...@@ -236,12 +229,24 @@ export default { ...@@ -236,12 +229,24 @@ export default {
setClock(time) { setClock(time) {
let sec = parseInt(time) let sec = parseInt(time)
this.clockCount = setInterval(() => { this.clockCount = setInterval(() => {
if (this.requestParam.course_id) {
this.remainingTime = this.secondToDate(sec)
sec++
} else {
if (this.$route.query.id) {
this.remainingTime = '00:00:00'
return false
}
sec--
if (sec === 0) { if (sec === 0) {
clearInterval(this.clockCount) clearInterval(this.clockCount)
this.timePopIsShow = true
return false return false
} }
this.remainingTime = this.secondToDate(sec) this.remainingTime = this.secondToDate(sec)
sec-- }
this.questionsData.sheet.duration++
// this.questionsData.sheet.duration += parseInt(this.questionsData.sheet.duration)
}, 1000) }, 1000)
}, },
secondToDate(result) { secondToDate(result) {
...@@ -278,7 +283,6 @@ export default { ...@@ -278,7 +283,6 @@ export default {
const opa = this.opaKey const opa = this.opaKey
cData.opaVal = opa[index] cData.opaVal = opa[index]
cData.activeIndex = index cData.activeIndex = index
console.log(this.requestData)
if (this.requestData[oData.id]) { if (this.requestData[oData.id]) {
if (!this.requestData[oData.id][cData.id]) { if (!this.requestData[oData.id][cData.id]) {
this.requestData[oData.id][cData.id] = { this.requestData[oData.id][cData.id] = {
...@@ -339,7 +343,6 @@ export default { ...@@ -339,7 +343,6 @@ export default {
} }
cData.opaVal = opaArr.toString().replace(new RegExp(',', 'g'), '') cData.opaVal = opaArr.toString().replace(new RegExp(',', 'g'), '')
}) })
console.log(this.requestData)
this.$forceUpdate() this.$forceUpdate()
}, },
// 页面过高局部滚动 // 页面过高局部滚动
...@@ -350,18 +353,16 @@ export default { ...@@ -350,18 +353,16 @@ export default {
bottomView.style.height = (clientHeight - topViewH) + 'px' bottomView.style.height = (clientHeight - topViewH) + 'px'
}, },
initData(n) { initData(n) {
const param = { const param = this.requestParam
type: 1, Exam.getExam(param, this.requestParam.papersUrl).then(res => {
is_create: n const times = res.sheet.remainingTime ? res.sheet.remainingTime : res.sheet.duration
}
Exam.getExam(param).then(res => {
if (res === 2) {
this.getPower()
return false
}
this.questionsData = res this.questionsData = res
this.remainingTime = this.secondToDate(res.sheet.remainingTime) this.remainingTime = this.secondToDate(times)
if (n === 1) { this.setClock(times)
if (res.sheet.status === 1 || res.sheet.status === 2) {
if (res.sheet.remainingTime === undefined) {
this.setClock(res.sheet.duration)
} else {
if (res.sheet.remainingTime > 0) { if (res.sheet.remainingTime > 0) {
this.setClock(res.sheet.remainingTime) this.setClock(res.sheet.remainingTime)
} else { } else {
...@@ -369,6 +370,8 @@ export default { ...@@ -369,6 +370,8 @@ export default {
this.scrollDom() this.scrollDom()
} }
} }
}
// clearTimeout(this.cache)
setTimeout(() => { setTimeout(() => {
this.examSubmit(0) this.examSubmit(0)
}, 1000) }, 1000)
...@@ -399,25 +402,23 @@ export default { ...@@ -399,25 +402,23 @@ export default {
return s return s
}, },
goExamResult(n) { goExamResult(n) {
this.$emit('goExamResult') const param = this.requestParam
}, param.is_create = 0
getPower() { this.$emit('goExamResult', this.requestParam)
Exam.getPower({ role: 1 }).then(res => {
})
}, },
examSubmit(status, isSub) { examSubmit(status, isSub) {
const reqData = this.requestData const reqData = this.requestData
const param = { const param = {
sheet_id: this.questionsData.sheet.id, sheet_id: this.questionsData.sheet.id,
answers: JSON.stringify(reqData), answers: JSON.stringify(reqData),
duration: this.getSecond(this.remainingTime) duration: this.questionsData.sheet.duration
} }
param.status = status param.status = status
Exam.examSubmit(param).then(res => { Exam.examSubmit(param, this.requestParam.papersUrl).then(res => {
if (res.exm_status === 1) { if (res.exm_status === 1) {
clearInterval(this.initTime) clearInterval(this.initTime)
clearInterval(this.clockCount) clearInterval(this.clockCount)
if (this.questionsData.sheet.remainingTime > 0) { if (this.requestParam.course_id !== undefined || this.questionsData.sheet.remainingTime > 0) {
if (isSub) { if (isSub) {
this.goExamResult() this.goExamResult()
} }
...@@ -432,11 +433,14 @@ export default { ...@@ -432,11 +433,14 @@ export default {
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss">
.swiper-wrapper .swiper-slide{ .exam-box{
.swiper-wrapper{
.swiper-slide{
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.head{ }
.head{
color: #222; color: #222;
display: flex; display: flex;
padding: .4rem 0; padding: .4rem 0;
...@@ -449,8 +453,8 @@ export default { ...@@ -449,8 +453,8 @@ export default {
margin-left: .03rem; margin-left: .03rem;
font-size: .3rem; font-size: .3rem;
} }
} }
.tool-box{ .tool-box{
width: 6.7rem; width: 6.7rem;
border-bottom: .01rem solid rgba(238,238,238,1); border-bottom: .01rem solid rgba(238,238,238,1);
padding: .35rem 0; padding: .35rem 0;
...@@ -473,8 +477,8 @@ export default { ...@@ -473,8 +477,8 @@ export default {
margin-left: .2rem; margin-left: .2rem;
} }
} }
} }
.topic-box{ .topic-box{
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
font-size: .3rem; font-size: .3rem;
...@@ -499,6 +503,14 @@ export default { ...@@ -499,6 +503,14 @@ export default {
font-size: .26rem; font-size: .26rem;
line-height: .4rem; line-height: .4rem;
padding: 0 .4rem; padding: 0 .4rem;
span{
width: 100%;
display: block;
}
img{
width: 100%;
display: block;
}
} }
.option{ .option{
list-style: none; list-style: none;
...@@ -542,11 +554,17 @@ export default { ...@@ -542,11 +554,17 @@ export default {
} }
.nr{ .nr{
width: 5.8rem; width: 5.8rem;
p{
width: 100%;
} }
img{
width: 100%;
} }
} }
} }
.btn-box{ }
}
.btn-box{
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;
...@@ -582,8 +600,8 @@ export default { ...@@ -582,8 +600,8 @@ export default {
margin-left: auto; margin-left: auto;
// background:rgba(255,103,103,1); // background:rgba(255,103,103,1);
} }
} }
.exam_submit{ .exam_submit{
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
...@@ -593,14 +611,13 @@ export default { ...@@ -593,14 +611,13 @@ export default {
background: rgba(0,0,0,0.6); background: rgba(0,0,0,0.6);
.pop{ .pop{
width: 5.9rem; width: 5.9rem;
height: 3.1rem;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
-webkit-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1); background:rgba(255,255,255,1);
border-radius:.12rem; border-radius:.12rem;
padding-top: .4rem; padding: 0.4rem 0;
.tit{ .tit{
font-weight:bold; font-weight:bold;
color:rgba(34,34,34,1); color:rgba(34,34,34,1);
...@@ -634,8 +651,8 @@ export default { ...@@ -634,8 +651,8 @@ export default {
} }
} }
} }
} }
.exam-end-pop{ .exam-end-pop{
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
...@@ -645,14 +662,13 @@ export default { ...@@ -645,14 +662,13 @@ export default {
background: rgba(0,0,0,0.6); background: rgba(0,0,0,0.6);
.pop{ .pop{
width: 5.9rem; width: 5.9rem;
height: 4.08rem;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
-webkit-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1); background:rgba(255,255,255,1);
border-radius:.12rem; border-radius:.12rem;
padding-top: .4rem; padding: .4rem 0;
.tit{ .tit{
font-size: .3rem; font-size: .3rem;
color: #222; color: #222;
...@@ -683,5 +699,6 @@ export default { ...@@ -683,5 +699,6 @@ export default {
font-size: .3rem; font-size: .3rem;
} }
} }
}
} }
</style> </style>
src/pages/courseTest/answer.vue → src/pages/courseExam/answer.vue
浏览文件 @ 3c89e7a8
<template> <template>
<div> <div>
<exam-topic @goExamResult="goExamResult"></exam-topic> <exam-topic :requestParam="$route.query" @goExamResult="goExamResult"></exam-topic>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
methods: { methods: {
goExamResult() { goExamResult(e) {
this.$router.replace('/course/answer-result') this.$router.replace({
path: '/exam/result',
query: e
})
} }
}, },
metaInfo () { metaInfo () {
......
src/pages/courseTest/answerResult.vue → src/pages/courseExam/answerResult.vue
浏览文件 @ 3c89e7a8
...@@ -23,10 +23,8 @@ export default { ...@@ -23,10 +23,8 @@ export default {
methods: { methods: {
cardChange(e) { cardChange(e) {
this.$router.push({ this.$router.push({
path: '/course/answer', path: '/exam/answer',
query: { query: e
id: e
}
}) })
} }
} }
......
src/pages/courseExam/index.vue 0 → 100644
浏览文件 @ 3c89e7a8
<template>
<div class="course-box">
<div class="tab-nav" id="top-view">
<ul>
<li
:class="index === tabNav.navIndex ? 'active' : ''"
:key="index"
@click="tab(index)"
v-for="(item, index) in tabNav.navText"
>
{{ item }}
</li>
</ul>
</div>
<div class="tab-con" id="bottom-view">
<div v-show="tabNav.navIndex === 0" class="tab1">
<div class="txt">
设计盒子为您提供2.5D风格公交站台等候公交车png图片
素材免费下载服务，这款素材采用的是EPS矢量图格式，
同时我们还会提供一个宽度分辨率为1500像素的透明背景
png图片，可以方便你直接应用到自己的设计作品中，我们
还提供设计盒子为您提供2.5D风格公交站台等候公交车png图片
</div>
<div class="btn" @click="abilityExam">确定</div>
</div>
<div v-show="tabNav.navIndex === 1" class="tab2">
<ul>
<template v-for="(item, index) in CourseChapter">
<li @click="listFold(item)" :key="index">
<div class="parent">
<div class="title">{{ item.course_name }}</div>
<template v-if="item.isShow">
<van-icon v-if="item.isShow === false" name="arrow" class="arrow"/>
<van-icon v-else name="arrow-down" class="arrow"/>
</template>
<template v-else>
<van-icon name="arrow" class="arrow"/>
</template>
</div>
<div :class="item.isShow === undefined ? 'hide' : item.isShow ? 'show' : 'hide'">
<template v-for="(cItem, cIndex) in item.curriculum.chapters_examination">
<ul :key="cIndex">
<li>
<div class="txt">{{ cItem.children[0].name }}</div>
<div class="btn-box">
<div v-if="cItem.children[0].status == 100" @click="startExam($event, cItem.children[0].id, item.course_id, 1)" class="tag">测试</div>
<div v-if="cItem.children[0].status == 0 || cItem.children[0].status == 3" @click="startExam($event, cItem.children[0].id, item.course_id, 0)" class="tag">继续测试</div>
<template v-if="cItem.children[0].status == 1 || cItem.children[0].status == 2">
<div @click="startExam($event, cItem.children[0].id, item.course_id, 1)" class="tag">重新测试</div>
<div @click="viewReport($event, cItem.children[0].id, item.course_id, 0)" class="tag">报告</div>
</template>
</div>
</li>
</ul>
</template>
</div>
</li>
</template>
</ul>
</div>
<div v-show="tabNav.navIndex === 2">3</div>
</div>
<div class="exam_submit" v-if="isExamPop">
<div class="pop">
<div class="tit">能力自测</div>
<div class="txt">您上次未做完试题</div>
<div class="btn_box">
<div class="btn" @click="goAbilityExam(1)">重新答题</div>
<div class="btn btn2" @click="goAbilityExam(0)">继续答题</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/courseExam.js'
import { Icon } from 'vant'
export default {
components: {
[Icon.name]: Icon
},
data() {
return {
isExamPop: false,
tabNav: {
navText: ['能力自测', '随堂小测', '知识点小测'],
navIndex: 0
},
CourseChapter: []
}
},
metaInfo () {
return {
title: '课程测验',
meta: [
// { vmid: 'description', name: 'description', content: this.description }
]
}
},
mounted() {
this.getCourseChapterList()
this.scrollDom()
},
methods: {
abilityExam() {
const param = {
type: 1
}
api.getExamStatus(param).then(res => {
if (res.status === '0' || res.status === '3') {
this.isExamPop = true
} else {
this.goAbilityExam(1)
}
})
},
goAbilityExam(n) {
this.$router.push({
path: '/exam/answer',
query: {
type: 1,
is_create: n,
papersUrl: 'zy/v2/examination/examination-papers'
}
})
},
startExam(event, id, cId, isCreate) {
this.$router.push({
path: '/exam/answer',
query: {
course_id: cId,
chapter_id: id,
type: 1,
is_create: isCreate,
papersUrl: 'zy/v2/examination/course-papers'
}
})
event.stopPropagation()
},
viewReport(event, id, cId, isCreate) {
this.$router.push({
path: '/exam/result',
query: {
course_id: cId,
chapter_id: id,
type: 1,
is_create: isCreate,
papersUrl: 'zy/v2/examination/course-papers'
}
})
event.stopPropagation()
},
go() {
this.$router.push('/exam/answer')
},
tab(e) {
this.tabNav.navIndex = e
this.scrollDom()
},
scrollDom() {
const topViewH = document.getElementById('top-view').offsetHeight
const clientHeight = document.documentElement.clientHeight
const bottomView = document.getElementById('bottom-view')
bottomView.style.height = (clientHeight - topViewH) + 'px'
},
listFold(e) {
if (e.isShow !== undefined) {
e.isShow ? e.isShow = false : e.isShow = true
} else {
e.isShow = true
}
this.$forceUpdate()
},
getCourseChapterList() {
api.getCourseChapterList().then(res => {
this.CourseChapter = res
})
}
}
}
</script>
<style lang="scss" scoped>
.course-box{
padding: 0 .4rem;
.tab-nav{
border-bottom: .01rem solid #EEEEEE;
height: 1.1rem;
padding: 0 .4rem;
ul{
display: flex;
justify-content: space-between;
li{
line-height: 1.1rem;
font-size: .3rem;
color:#999999;
}
li.active{
font-weight: bold;
border-bottom: .02rem solid #2B7CE9;
}
}
}
.tab-con{
overflow-y: scroll;
padding-bottom: 1rem;
.tab1{
padding-top: .2rem;
.txt{
font-size: .26rem;
color: #222;
line-height: .26ren;
}
.btn{
position: fixed;
bottom: .15rem;
left: 50%;
-webkit-transform: translateX(-50%);
width:6.7rem;
height:.7rem;
background:rgba(255,103,103,1);
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
}
.tab2{
ul{
li{
.parent{
display: flex;
border-bottom: .01rem solid #EEEEEE;
padding: 0.4rem 0;
.title{
font-size: .3rem;
color: #222222;
font-weight: bold;
}
.arrow{
margin-left: auto;
}
}
.hide{
display: none;
}
.show{
display: block;
}
ul{
li{
display: flex;
border-bottom: .01rem solid #EEEEEE;
padding: 0.4rem 0;
.txt{
font-size: .26rem;
color: #999999;
}
.btn-box{
margin-left: auto;
display: flex;
.tag{
line-height: .46rem;
height: .46rem;
font-size: .26rem;
color: #fff;
padding: 0 .3rem;
margin-left: .2rem;
background: #67A8FF;
border-radius: .25rem;
white-space: nowrap;
}
}
}
}
}
}
}
}
}
.exam_submit{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: 0.4rem 0;
.tit{
font-weight:bold;
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
}
.txt{
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
margin-top: .8rem;
}
.btn_box{
padding:0 0.2rem;
display: flex;
margin-top: .8rem;
.btn{
width:2.6rem;
height:.7rem;
background:rgba(43,124,233,1);
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
</style>
src/pages/mockExam/answer.vue 0 → 100644
浏览文件 @ 3c89e7a8
<template>
<div>
<exam-topic :requestParam="$route.query" @goExamResult="goExamResult"></exam-topic>
</div>
</template>
<script>
export default {
mounted() {
},
methods: {
goExamResult(e) {
this.$router.replace({
path: '/mock/result',
query: e
})
}
},
metaInfo () {
return {
title: '答题',
meta: [
// { vmid: 'description', name: 'description', content: this.description }
]
}
}
}
</script>
<style lang="scss" scoped>
</style>
src/pages/courseTest/courseTest.vue → src/pages/mockExam/answerResult.vue
浏览文件 @ 3c89e7a8
<template> <template>
<div> <div>
<ul> <exam-end @cardChange="cardChange"></exam-end>
<li @click="go">测试btn</li>
</ul>
</div> </div>
</template> </template>
...@@ -10,11 +8,24 @@ ...@@ -10,11 +8,24 @@
export default { export default {
data() { data() {
return { return {
questionsData: null,
requestData: null
}
},
metaInfo () {
return {
title: '成绩报告',
meta: [
// { vmid: 'description', name: 'description', content: this.description }
]
} }
}, },
methods: { methods: {
go() { cardChange(e) {
this.$router.push('/course/answer') this.$router.push({
path: '/exam/answer',
query: e
})
} }
} }
} }
......
src/pages/mockExam/index.vue 0 → 100644
浏览文件 @ 3c89e7a8
<template>
<div class="mock-box">
<div class="top-tit">
<div class="left">考试时间90分钟</div>
<div class="right">总分100分</div>
</div>
<div class="intr">模拟考试介绍：</div>
<div class="answer-type">
<div class="tit">共分为四部分：</div>
<div class="type">
<p>单选题共1题</p>
<p>单选题共1题</p>
<p>单选题共1题</p>
<p>单选题共1题</p>
</div>
</div>
<div class="role-tit">选择角色：</div>
<div class="describe">请认真选择角色，选定后,模拟考试题型会针对角色为您匹配最准确的题型！</div>
<div class="sele-role">
<div @click="changeActive(1)" :class="roleChange === 1 ? 'btn active' : 'btn'">
<i></i>
<div class="txt">管理人员</div>
</div>
<div @click="changeActive(2)" :class="roleChange === 2 ? 'btn active' : 'btn'">
<i></i>
<div class="txt">安全人员</div>
</div>
</div>
<div class="start-exam">
<div class="b" @click="setRole">开始考试</div>
</div>
<div class="exam_submit" v-if="isExamPop">
<div class="pop">
<div class="tit">模拟考试</div>
<div class="txt">您上次未做完试题</div>
<div class="btn_box">
<div class="btn" @click="goAbilityExam(1)">重新答题</div>
<div class="btn btn2" @click="goAbilityExam(0)">继续答题</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/courseExam.js'
export default {
data() {
return {
roleChange: 1,
isExamPop: false
}
},
mounted() {
this.abilityExam()
},
methods: {
changeActive(e) {
this.roleChange = e
},
abilityExam() {
const param = {
type: 2
}
api.getExamStatus(param).then(res => {
if (res.status === '0' || res.status === '3') {
this.isExamPop = true
}
})
},
goAbilityExam(n) {
this.$router.push({
path: '/mock/answer',
query: {
type: 2,
is_create: n,
papersUrl: 'zy/v2/examination/examination-papers'
}
})
},
setRole() {
api.setRole({ role: this.roleChange }).then(res => {
console.log(res.code)
if (res.code === 0) {
this.goAbilityExam(1)
}
})
}
}
}
</script>
<style lang="scss" scoped>
.mock-box{
padding: 0 0.4rem;
}
.top-tit{
border-bottom: 0.01rem solid #EEE;
display: flex;
line-height: 1.1rem;
div{
font-weight: bold;
font-size: .3rem;
color: #222;
}
.right{
margin-left: auto;
}
}
.intr{
line-height: 1.1rem;
font-weight: bold;
font-size: .3rem;
color: #222;
}
.answer-type{
padding-bottom: .2rem;
border-bottom: 0.01rem solid #EEE;
display: flex;
.tit{
font-size: .26rem;
color: #222;
line-height: 100%;
}
p{
line-height: 100%;
font-size: .26rem;
color: #222;
font-weight: bold;
margin-bottom: .2rem;
}
}
.role-tit{
line-height: 100%;
font-size: .3rem;
color: #222;
font-weight: bold;
margin: .4rem 0 .18rem 0;
}
.describe{
font-size: .26rem;
color: #222;
}
.sele-role{
width: 5.09rem;
margin: .4rem auto 0 auto;
display: flex;
.btn:nth-child(2){
margin-left: auto;
}
.btn{
width: 1.76rem;
height: .8rem;
border: 0.01rem solid #3a7be6;
display: flex;
justify-content: center;
border-radius: .1rem;
align-items: center;
.txt{
font-size: .26rem;
color: #222;
font-weight: bold;
}
i{
width: .28rem;
height: .28rem;
margin-right: .1rem;
background: url('../../assets/images/radio2.png');
background-size: 100% 100%;
}
}
.btn.active{
background:#3a7be6;
.txt{
color: #fff;
}
i{
background: url('../../assets/images/radio.png');
background-size: 100% 100%;
}
}
}
.start-exam{
position: fixed;
bottom: 0;
left: 0;
width:7.5rem;
height:1rem;
background:rgba(255,255,255,1);
box-shadow:0 0 .06 0px rgba(0,0,0,0.05);
.b{
width:6.7rem;
height:.7rem;
background:rgba(43,124,233,1);
border-radius:.12rem;
margin: .15rem auto;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
}
.exam_submit{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: 0.4rem 0;
.tit{
font-weight:bold;
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
}
.txt{
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
margin-top: .8rem;
}
.btn_box{
padding:0 0.2rem;
display: flex;
margin-top: .8rem;
.btn{
width:2.6rem;
height:.7rem;
background:rgba(43,124,233,1);
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
</style>
src/router/routes.js
浏览文件 @ 3c89e7a8
...@@ -2,12 +2,42 @@ export default [ ...@@ -2,12 +2,42 @@ export default [
{ path: '/', redirect: '/index' }, { path: '/', redirect: '/index' },
/* 测试页面 */ /* 测试页面 */
{ path: '/test', name: 'test', component: () => import('../pages/test.vue') }, { path: '/test', name: 'test', component: () => import('../pages/test.vue') },
/* 能力自测 */ /* 课程检测 */
{ path: '/course-test', name: 'course-test', component: () => import('../pages/courseTest/courseTest.vue') }, {
/* 答题页面 */ path: '/exam/index',
{ path: '/course/answer', name: 'course-answer', component: () => import('../pages/courseTest/answer.vue') }, name: 'examIndex',
/* 答题结果 */ component: () => import('../pages/courseExam/index.vue')
{ path: '/course/answer-result', name: 'answer-result', component: () => import('../pages/courseTest/answerResult.vue') }, },
/* 能力自测答题页面 */
{
path: '/exam/answer',
name: 'examAnswer',
component: () => import('../pages/courseExam/answer.vue')
},
/* 能力自测答题结果 */
{
path: '/exam/result',
name: 'examResult',
component: () => import('../pages/courseExam/answerResult.vue')
},
/* 模拟考试 */
{
path: '/mock/index',
name: 'mockIndex',
component: () => import('../pages/mockExam/index.vue')
},
/* 模拟考试答题页面 */
{
path: '/mock/answer',
name: 'mockAnswer',
component: () => import('../pages/mockExam/answer.vue')
},
/* 模拟考试答题页面 */
{
path: '/mock/result',
name: 'mockResult',
component: () => import('../pages/mockExam/answerResult.vue')
},
/* 如果所有页面都没找到 - 指向 */ /* 如果所有页面都没找到 - 指向 */
{ path: '*', component: () => import('@/components/errorPages/404.vue') }, { path: '*', component: () => import('@/components/errorPages/404.vue') },
/* 首页 */ /* 首页 */
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论