提交 96a4c436 authored 作者: lihuihui's avatar lihuihui

修改文件目录,知识点测试提交

上级 cfbe9bd0
...@@ -49,3 +49,38 @@ export function getAllQuestion(params) { ...@@ -49,3 +49,38 @@ export function getAllQuestion(params) {
export function setMyCache(params) { export function setMyCache(params) {
return httpRequest.post('/api/zy/v2/examination/cache-question', params) return httpRequest.post('/api/zy/v2/examination/cache-question', params)
} }
/**
* 收藏试题
*/
export function addCollection(params) {
return httpRequest.post('/api/zy/v2/examination/add-collection', params)
}
/**
* 取消收藏试题
*/
export function deleteCollection(params) {
return httpRequest.post('/api/zy/v2/examination/delete-my-question', params)
}
/**
* 删除试题
*/
export function deleteQuestion(params) {
return httpRequest.post('/api/zy/v2/examination/delete-my-question', params)
}
/**
* 知识点题获取
*/
export function getCourseQuestion(params) {
return httpRequest.get('/api/zy/v2/examination/course-papers', { params })
}
/**
* 知识点题缓存
*/
export function setCourseCache(params) {
return httpRequest.post('/api/zy/v2/examination/course-papers', params)
}
...@@ -84,6 +84,7 @@ export default { ...@@ -84,6 +84,7 @@ export default {
methods: { methods: {
// 跳详情 // 跳详情
goDetails(i) { goDetails(i) {
window.localStorage.removeItem('answerRecord')
this.$router.push({ this.$router.push({
path: '/my/questions/details', path: '/my/questions/details',
query: { query: {
......
<template> <template>
<div class="my-question-list-item" @click="goDetails"> <div class="my-question-list-item">
<el-checkbox v-model="data.checked"></el-checkbox> <el-checkbox v-model="data.checked"></el-checkbox>
<div class="badge" :class="`questiont-type_${data.question_type}`">{{ questionTypeName }}</div> <div class="badge" :class="`questiont-type_${data.question_type}`">{{ questionTypeName }}</div>
<div class="name" v-html="data.question_content"></div> <div class="name" v-html="data.question_content" @click="goDetails"></div>
<div class="tools"> <div class="tools">
<i class="el-icon-delete" @click="$emit('on-remove', data)"></i> <i class="el-icon-delete" @click="$emit('on-remove', data)"></i>
<i <i
......
<template>
<div>
<div class="tab1">
<!-- <div class="title">能力自测 测试说明</div> -->
<img src="../../assets/images/tab1bg.png" alt="">
<p class="ti">考试时间20分钟</p>
<p class="tx">考试题目共22题,分四部分</p>
<p class="tx">单选题共8题</p>
<p class="tx">多选题共8题</p>
<p class="tx">判断题共5题</p>
<p class="tx">案例题共1题</p>
<p class="ti2">了解自己知识掌握情况</p>
<p class="ti2">成绩报告准确分析定位</p>
<div class="comp">
<div class="btn" @click="abilityExam">开始测试</div>
</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 class="exam_submit" v-if="isExamPopTo">
<div class="pop">
<div class="tit">考前摸底</div>
<div class="txt">考试还未结束确定退出考试?</div>
<div class="btn_box">
<div class="btn" @click="isExamPopTo = false">退出考试</div>
<div class="btn btn2" @click="goAbilityExam(0)">继续考试</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/courseExam.js'
export default {
metaInfo: {
title: '考前摸底'
},
data() {
return {
isExamPop: false,
isExamPopTo: false
}
},
mounted() {
if (window.localStorage.isExamEnd === 'true' || window.localStorage.isExamEnd === true) {
this.init()
}
},
methods: {
async abilityExam() {
const isLogin = await this.$store.dispatch('checkLogin')
if (!isLogin) {
this.goAbilityExam(1)
return false
}
const param = {
type: 1
}
api.getExamStatus(param).then(res => {
if (parseInt(res.status) === 0 || parseInt(res.status) === 3) {
this.isExamPop = true
} else {
this.goAbilityExam(1)
}
})
},
goAbilityExam(n) {
window.localStorage.isExamEnd = true
window.localStorage.examTab = 0
this.$router.push({
path: '/exam/answer',
query: {
type: 1,
is_create: n,
papersUrl: 'zy/v2/examination/examination-papers'
}
})
},
async init() {
const param = {
type: 1
}
const isLogin = await this.$store.dispatch('checkLogin')
if (isLogin) {
api.getExamStatus(param).then(res => {
if (parseInt(res.status) === 0 || parseInt(res.status) === 3) {
this.isExamPopTo = true
}
})
}
}
}
}
</script>
<style lang="scss" scoped>
.tab1{
// padding-top: .2rem;
padding: .8rem .4rem 1rem .4rem;
.txt{
font-size: .26rem;
color: #222;
line-height: .26ren;
}
.comp{
position: fixed;
bottom: .15rem;
left: 50%;
-webkit-transform: translateX(-50%);
padding-bottom: env(safe-area-inset-bottom);
}
.btn{
width:6.7rem;
height:.8rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .8rem;
color: #fff;
font-size: .3rem;
}
.title{
font-size:.4rem;
font-weight:bold;
color:rgba(255,103,103,1);
line-height: 100%;
padding-top: .2rem;
text-align: center;
}
img{
width: 5.01rem;
height: 3.98rem;
display: block;
margin: 0.2rem auto 0 auto;
}
p{
line-height: 100%;
font-size: .26rem;
color: #222;
text-align: center;
}
.tx{
margin-top: .2rem;
}
.ti{
font-size: .3rem;
margin: .4rem 0 .2rem 0;
font-weight: bold;
}
.ti2{
font-size: .3rem;
font-weight: bold;
margin-top: .4rem;
}
}
.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:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
</style>
<template>
<div>
<exam-topic :requestParam="$route.query" @goExamResult="goExamResult"></exam-topic>
</div>
</template>
<script>
export default {
mounted() {
},
methods: {
goExamResult(e) {
this.$router.replace({
path: '/exam/result',
query: e
})
}
},
metaInfo () {
return {
title: '答题',
meta: [
// { vmid: 'description', name: 'description', content: this.description }
]
}
},
beforeDestroy() {
// this.$router.back()
window.localStorage.isBack = true
}
}
</script>
<style lang="scss" scoped>
</style>
<template>
<div>
<exam-end @cardChange="cardChange"></exam-end>
</div>
</template>
<script>
// import { Toast } from 'vant'
export default {
data() {
return {
questionsData: null,
requestData: null
}
},
computed: {
isWeapp() {
return this.$store.state.isWeapp
}
},
metaInfo () {
return {
title: '成绩报告',
meta: [
// { vmid: 'description', name: 'description', content: this.description }
]
}
},
methods: {
cardChange(e) {
const eData = JSON.stringify(e).replace(/:/gi, '=').replace(/,/gi, '&').replace(/({)|(})/gi, '').replace(/"/gi, '')
const path = `/exam/answer?${eData}`
if (this.isWeapp) {
const src = encodeURIComponent(`${window.location.origin}${path}`)
wx.miniProgram.navigateTo({
url: `/pages/web/index?src=${src}`
})
} else {
this.$router.push({ path })
}
// this.$router.push({
// path: '/exam/answer',
// query: e
// })
}
}
}
</script>
<style lang="scss" scoped>
</style>
<template>
<div class="course-tag-wrapper">
<div class="course-tag-hd">
<h1 class="course-title">{{detail.course_name}}</h1>
</div>
<div class="course-tag-bd">
<course-tag :courseId="courseId" :isTest="true" @ready="onReady"></course-tag>
</div>
</div>
</template>
<script>
import CourseTag from '@/pages/course/tag/index.vue'
export default {
components: { CourseTag },
metaInfo: {
title: '按考点练习'
},
data() {
return {
detail: {}
}
},
computed: {
courseId() {
return this.$route.query.id
}
},
methods: {
onReady(response) {
this.detail = response
}
}
}
</script>
<style lang="scss" scoped>
.course-tag-wrapper {
min-height: 100vh;
background-color: #eee;
box-sizing: border-box;
}
.course-tag-hd {
padding: 0.4rem;
background-color: #fff;
}
.course-tag-bd {
padding: 0.4rem;
}
.course-title {
font-size: 0.3rem;
color: #222;
}
</style>
<template>
<div class="exam-box">
<!-- <div class="no-swiping" v-if="countPage.noSwiping"></div> -->
<div class="topic-box">
<swiper ref="mySwiper" :options="swiperOptions">
<template v-for="item in question.list">
<template v-for="(cItem, cIndex) in item.question_list">
<swiper-slide :key="cIndex+cItem.id">
<div id="top-view">
<div class="tool-box">
<div class="time">{{time.showTime}}</div>
<div class="tag-box">
<span @click="collectQuestion(cItem)">{{ cItem.is_collection ? '已收藏' : '收藏' }}</span>
</div>
</div>
</div>
<div class="title">
<div class="type">{{other.type[cItem.question_type]}}</div>
<div class="count">{{ other.pageOrderNum + 1 }}/{{ other.totalQuestionCount }}</div>
</div>
<div class="topic-bt" v-if="cItem.question_type == '5'" v-html="cItem.common_content"></div>
<div class="topic" v-html="cItem.question_content"></div>
<ul class="option">
<template v-for="(opt, oIndex) in cItem.question_options">
<template v-if="item.question_type == 2 || (item.question_type == 5 && item.answer_count > 1)">
<li
:key="oIndex + opt.id"
:class="cItem.isConfirm
? cItem.question_answer.find(i => { return i === opt.id })
? 'active2'
: cItem.userAnswer.find(i => { return i === opt.id })
? 'active'
: ''
: cItem.userAnswer.find(i => { return i === opt.id })
? 'active'
: ''"
@click="selectOptions(item, cItem, opt)"
>
<van-icon
v-if="cItem.isConfirm && cItem.question_answer.find(i => { return i === opt.id })"
class="icon"
name="checked"
/>
<div>
<span
v-if="!cItem.isConfirm || !cItem.question_answer.find(i => { return i === opt.id })"
>{{ other.A_Z[oIndex] }}.</span>
<span>{{ opt.option }}</span>
</div>
</li>
</template>
<template v-else>
<li
:key="oIndex + opt.id"
:class="isObjKey(item, cItem)
? cItem.question_answer === opt.id
? 'active2'
: question.answer[item.question_item_id][cItem.id].answer.find(i => { return i === opt.id })
? 'active'
: ''
: ''"
@click="selectOptions(item, cItem, opt)"
>
<van-icon
v-if="isObjKey(item, cItem)
? cItem.question_answer === opt.id
? true
: false
: false"
class="icon"
name="checked"
/>
<div>
<span
v-if="isObjKey(item, cItem)
? cItem.question_answer === opt.id
? false
: true
: true
">{{ other.A_Z[oIndex] }}.</span>
<span>{{ opt.option }}</span>
</div>
</li>
</template>
</template>
</ul>
<div class="com-btn" @click="confirmSelect(item, cItem)" v-if="item.question_type == 2 || (item.question_type == 5 && item.answer_count > 1)">确认答案</div>
<div class="analy" v-if="isObjKey(item, cItem)">
<div class="tit">答案解析</div>
<div class="txt">正确答案:
<span>
{{
changeA_Z(changeArray(cItem.question_answer), cItem).sort().toString().replace(new RegExp(',', 'g'), '')
}}
</span>
</div>
<div class="txt">您的答案:
<span>
{{
isObjKey(item, cItem)
? changeA_Z(question.answer[item.question_item_id][cItem.id].answer, cItem).sort().toString().replace(new RegExp(',', 'g'), '')
: ''
}}
</span>
</div>
<div class="exp">
<p class="name">解析:</p>
<p class="nr" v-html="cItem.question_analysis"></p>
<!-- <p class="nr" v-html="dItem.question_analysis"></p> -->
</div>
</div>
</swiper-slide>
</template>
</template>
</swiper>
</div>
<div class="btn-box" id="bottom-view-btn">
<div class="padd">
<div @click="swiper.slidePrev()" class="btn left btn-w" v-show="isBtn.currentPageNum != 0">上一题</div>
<div @click="swiper.slideNext()" class="btn right btn-w" v-show="isBtn.currentPageNum != other.totalQuestionCount - 1">下一题</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/courseExam.js'
import * as apiMy from '@/api/my.js'
import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
import { Toast, Dialog } from 'vant'
export default {
components: {
Swiper,
SwiperSlide,
[Toast.name]: Toast,
[Dialog.name]: Dialog
},
directives: {
swiper: directive
},
data() {
const _this = this
return {
isBtn: {
currentPageNum: 0
},
question: {
list: [],
answer: {}
},
time: {
count: 1,
clearTime: null,
showTime: ''
},
other: {
type: {
1: '单选题',
2: '多选题',
5: '案例题',
6: '判断题'
},
A_Z: ['A', 'B', 'C', 'D', 'E', 'F'],
totalQuestionCount: 1,
pageOrderNum: 0,
sheetId: 0
},
swiperOptions: {
observer: true,
autoHeight: true,
on: {
init() {
setTimeout(() => {
_this.isBtn.currentPageNum = this.activeIndex
}, 500)
},
slideChangeTransitionStart: function() {
_this.isBtn.currentPageNum = this.activeIndex
_this.other.pageOrderNum = this.activeIndex
},
slidePrevTransitionEnd: function() {
},
slideNextTransitionEnd: function() {
},
slideNextTransitionStart: function() {
}
}
}
}
},
mounted() {
this.init()
},
computed: {
swiper() {
return this.$refs.mySwiper.$swiper
},
changeArray() {
return function (item) {
return Array.isArray(item) ? item : [item]
}
},
isObjKey() {
return function (item, cItem) {
return this.question.answer
? this.question.answer[item.question_item_id]
? this.question.answer[item.question_item_id][cItem.id]
? 1
: 0
: 0
: 0
}
},
changeA_Z() {
return function (data, cItem) {
return data.map((i, index) => {
return this.other.A_Z[cItem.question_options.findIndex(id => { return id.id === i })]
})
// .toString().replace(new RegExp(',', 'g'), '')
}
}
},
methods: {
collectQuestion(item) {
item.is_collection
? this.removeColl(item.id, () => {
Toast('取消收藏')
item.is_collection = false
})
: this.addColl(item.id, () => {
Toast('收藏成功')
item.is_collection = true
})
},
removeColl(id, callback) {
apiMy.deleteQuestion({ type: 2, question_id: id }).then(res => {
if (res.code === 0) {
callback()
}
})
},
addColl(id, callback) {
apiMy.collectQuestion({ question_id: id }).then(res => {
if (res.code === 0) {
callback()
}
})
},
setClock() {
clearInterval(this.time.clearTime)
this.time.clearTime = setInterval(() => {
this.time.count++
this.time.showTime = this.secondToDate(this.time.count)
}, 1000)
},
secondToDate(result) {
const h = Math.floor(result / 3600) < 10 ? '0' + Math.floor(result / 3600) : Math.floor(result / 3600)
const m = Math.floor((result / 60 % 60)) < 10 ? '0' + Math.floor((result / 60 % 60)) : Math.floor((result / 60 % 60))
const s = Math.floor((result % 60)) < 10 ? '0' + Math.floor((result % 60)) : Math.floor((result % 60))
if (h === 0) {
result = m + ':' + s
} else {
result = h + ':' + m + ':' + s
}
return result
},
init() {
api.getExam({ type: 2, tag_id: this.$route.query.tag_id }).then(res => {
const data = JSON.parse(res.data)
this.question.answer = data.sheet.answer
data.sheet.questions.question_items.map(item => {
return item.question_list.map(cItem => {
if (parseInt(cItem.question_type) === 2 || (parseInt(cItem.question_type) === 5 && cItem.answer_count > 1)) {
if (this.question.answer) {
if (this.question.answer[item.question_item_id]) {
if (this.question.answer[item.question_item_id][cItem.id]) {
cItem.isConfirm = true
cItem.userAnswer = this.question.answer[item.question_item_id][cItem.id].answer
return false
}
}
}
cItem.isConfirm = false
cItem.userAnswer = []
}
})
})
this.other.sheetId = data.sheet.id
this.question.list = data.sheet.questions.question_items
this.other.totalQuestionCount = data.sheet.questions.total_question_count
this.time.count = data.sheet.duration || 0
this.setClock()
})
},
confirmSelect(item, cItem) {
if (cItem.isConfirm) {
return false
}
cItem.isConfirm = true
const cacheData = this.question.answer
if (cacheData) {
cacheData[item.question_item_id]
? cacheData[item.question_item_id][cItem.id]
? cacheData[item.question_item_id][cItem.id].answer = cItem.userAnswer
: cacheData[item.question_item_id][cItem.id] = { answer: cItem.userAnswer }
: cacheData[item.question_item_id] = { [cItem.id]: { answer: cItem.userAnswer } }
this.$forceUpdate()
this.cacheRequest()
return false
}
this.question.answer = {
[item.question_item_id]: {
[cItem.id]: {
answer: cItem.userAnswer
}
}
}
this.cacheRequest()
},
selectOptions(item, cItem, opt) {
const qType = parseInt(item.question_type)
qType === 2 || (qType === 5 && item.answer_count > 1)
? this.checkboxSelect(item, cItem, opt)
: this.radioSelect(item, cItem, opt)
},
checkboxSelect(item, cItem, opt) {
if (cItem.isConfirm) {
return false
}
if (cItem.userAnswer) {
const index = cItem.userAnswer.findIndex(i => { return i === opt.id })
index === -1 ? cItem.userAnswer.push(opt.id) : cItem.userAnswer.splice(index, 1)
} else {
cItem.userAnswer = [opt.id]
}
this.$forceUpdate()
},
radioSelect(item, cItem, opt) {
if (this.isObjKey(item, cItem)) {
return false
}
const cacheData = this.question.answer
if (cacheData) {
cacheData[item.question_item_id]
? cacheData[item.question_item_id][cItem.id]
? cacheData[item.question_item_id][cItem.id].answer = [opt.id]
: cacheData[item.question_item_id][cItem.id] = { answer: [opt.id] }
: cacheData[item.question_item_id] = { [cItem.id]: { answer: [opt.id] } }
this.$forceUpdate()
this.cacheRequest()
return false
}
this.question.answer = {
[item.question_item_id]: {
[cItem.id]: {
answer: [opt.id]
}
}
}
this.cacheRequest()
this.$forceUpdate()
},
cacheRequest() {
let count = 0
const fKey = Object.keys(this.question.answer)
fKey.map(item => {
const cKey = Object.keys(this.question.answer[item])
for (let i = 0; i < cKey.length; i++) {
count++
}
})
const param = {
type: 2,
sheet_id: this.other.sheetId,
status: this.other.totalQuestionCount === count ? 1 : 0,
answers: JSON.stringify(this.question.answer),
duration: this.time.count
}
api.cacheExam(param).then(res => {})
}
},
beforeDestroy() {
clearInterval(this.time.clearTime)
}
}
</script>
<style lang="scss">
.no-swiping{
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 999999;
}
.exam-box{
.swiper-wrapper{
padding-bottom: env(safe-area-inset-bottom);
.swiper-slide{
padding-bottom: 1.2rem;
}
}
.head{
color: #222;
display: flex;
padding: .4rem 0;
align-items: center;
i{
font-size: .35rem;
margin-left: .28rem;
}
.title{
margin-left: .03rem;
font-size: .3rem;
}
}
.tool-box{
width: 6.7rem;
border-bottom: .01rem solid rgba(238,238,238,1);
padding: .35rem 0;
display: flex;
align-items: center;
margin: 0 auto;
color: #222;
.time{
font-size: .3rem;
}
.tag-box{
margin-left: auto;
display: flex;
span{
padding: .1rem .2rem;
font-size: .2rem;
color: #fff;
background: #F47885;
border-radius: .25rem;
margin-left: .2rem;
}
.active{
background: #FF8000;
}
}
}
.topic-box{
width: 100%;
margin: 0 auto;
font-size: .3rem;
color: #222;
overflow-y: scroll;
.title{
padding: .4rem;
display: flex;
align-items: center;
.count{
margin-left: auto;
}
}
.topic{
font-size: .26rem;
line-height: .4rem;
padding: 0 .4rem;
span{
width: 100%;
display: block;
}
img{
width: 100%;
display: block;
}
}
.topic-bt{
font-size: .26rem;
line-height: .4rem;
padding: 0 .4rem;
// font-weight: bold;
margin-bottom: .2rem;
span{
width: 100%;
display: block;
}
img{
width: 100%;
display: block;
}
}
.option{
list-style: none;
margin: .35rem 0 0 0;
padding: 0 .4rem;
li{
background:rgba(247,247,247,1);
border-radius: .2rem;
font-weight: bold;
padding: .35rem .2rem;
margin-bottom: .2rem;
word-wrap:break-word;
display: flex;
align-items: center;
.icon{
margin-right: 0.1rem;
color: #5CB9A2;
}
}
.active{
color: #5F95DE;
background:#DDF1FF;
}
.active2{
color: #40A38B;
background: #E4F9ED;
}
}
.analy{
font-size: .3rem;
color: #222;
padding: 0.2rem .4rem 1.2rem .4rem;
.tit{
font-weight: bold;
line-height: 100%;
}
.txt{
line-height: 100%;
margin-top: .4rem;
span{
font-weight: bold;
}
}
.exp{
margin-top: .4rem;
overflow: hidden;
p{
float: left;
}
.nr{
// width: 5.8rem;
p{
width: 100%;
}
img{
width: 100%;
}
}
}
}
}
.topic-box.hide{
overflow: hidden;
}
.btn-box{
position: fixed;
bottom: 0;
left: 0;
height: 1rem;
box-shadow:0px 0px 6px 0px rgba(0,0,0,0.05);
background: #fff;
color: #222;
font-size: .3rem;
width: 100%;
z-index: 99;
padding-bottom: env(safe-area-inset-bottom);
.padd{
display: flex;
padding: 0 .4rem;
align-items: center;
height: 100%;
}
.analysis{
white-space: nowrap;
margin-right: .3rem;
}
.btn{
width:1.97rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
}
.btn-w{
width: 2.77rem;
}
.left{
margin-right: .4rem;
}
.right{
margin-left: auto;
// background:rgba(255,103,103,1);
}
}
.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:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
.exam-end-pop{
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: .4rem 0;
.tit{
font-size: .3rem;
color: #222;
text-align: center;
font-weight: bold;
}
img{
width: 1.59rem;
height: 1.35rem;
display: block;
margin: 0.4rem auto 0.2rem auto;
}
.txt{
color: #222;
font-size: .3rem;
line-height: 100%;
text-align: center;
}
.btn{
margin: .4rem auto 0 auto;
width:5.5rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
}
}
}
.com-btn{
width:6.7rem;
height:.7rem;
background:rgba(244,120,133,1);
border-radius:.12rem;
margin: 0 auto;
text-align: center;
line-height: .7rem;
font-size: .3rem;
color: #fff;
}
</style>
<template>
<div class="layout">
<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="title">能力自测 测试说明</div>
<img src="../../assets/images/tab1bg.png" alt="">
<p class="ti">自测考试时间20分钟</p>
<p class="tx">考试题目共33题,分四部分</p>
<p class="tx">单选题共15题</p>
<p class="tx">多选题共10题</p>
<p class="tx">判断题共5题</p>
<p class="tx">案例题共1题</p>
<p class="ti2">随时自测了解知识掌握情况</p>
<p class="ti2">成绩报告准确分析提升成绩</p>
<div class="comp">
<div class="btn" @click="abilityExam">开始测试</div>
</div>
</div>-->
<div v-show="tabNav.navIndex == 0" class="tab2">
<ul class="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 == 1" class="tab3">
<ul>
<template v-for="(item, index) in courseList">
<li :key="index" @click="courseNodeDetail(item.course_id)">
<div class="tit">{{ item.course_name }}</div>
<van-icon name="arrow" class="arr" />
</li>
</template>
</ul>
</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 class="exam_submit" v-if="isExamPopTo">
<div class="pop">
<div class="tit">考前摸底</div>
<div class="txt">考试还未结束确定退出考试?</div>
<div class="btn_box">
<div class="btn" @click="isExamPopTo = false">退出考试</div>
<div class="btn btn2" @click="goAbilityExam(0)">继续考试</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/courseExam.js'
import * as courseApi from '@/api/course.js'
import { Icon, Toast } from 'vant'
export default {
components: {
[Icon.name]: Icon,
[Toast.name]: Toast
},
data() {
return {
isExamPop: false,
isExamPopTo: false,
tabNav: {
navText: ['按章节练习', '按考点练习'],
navIndex: 0
},
CourseChapter: [],
courseList: []
}
},
computed: {
isWeapp() {
return this.$store.state.isWeapp
}
},
metaInfo() {
return {
title: '必考考点',
meta: [
// { vmid: 'description', name: 'description', content: this.description }
]
}
},
created() {
if (this.$route.query.t === 1) {
this.goAbilityExam2(1)
}
},
mounted() {
this.getCourseChapterList()
// if (window.localStorage.examTab === '1' || window.localStorage.examTab === 1) {
// this.tabNav.navIndex = 1
// } else {
// // if (window.localStorage.isExamEnd === 'true' || window.localStorage.isExamEnd === true) {
// // this.init()
// // }
// // this.tabNav.navIndex = 0
// }
// this.getCourseChapterList()
this.scrollDom()
},
// beforeMount() {
// },
methods: {
courseNodeDetail(id) {
const path = `/exam/courseNode?id=${id}`
if (this.isWeapp) {
const src = encodeURIComponent(`${window.location.origin}${path}`)
wx.miniProgram.navigateTo({
url: `/pages/web/index?src=${src}`
})
} else {
this.$router.push({ path })
}
// this.$router.push({
// path: '/exam/courseNode',
// query: {
// id: id
// }
// })
},
getCourseList() {
courseApi.getCourseList().then(response => {
this.courseList = response
Toast.clear()
})
},
async init() {
const param = {
type: 1
}
const isLogin = await this.$store.dispatch('checkLogin')
if (isLogin) {
api.getExamStatus(param).then(res => {
if (parseInt(res.status) === 0 || parseInt(res.status) === 3) {
this.isExamPopTo = true
}
})
}
},
async abilityExam() {
const isLogin = await this.$store.dispatch('checkLogin')
if (!isLogin) {
this.goAbilityExam(1)
return false
}
const param = {
type: 1
}
api.getExamStatus(param).then(res => {
if (parseInt(res.status) === 0 || parseInt(res.status) === 3) {
this.isExamPop = true
} else {
this.goAbilityExam(1)
}
})
},
goAbilityExam2(n) {
window.localStorage.examTab = 0
// const path = `/exam/answer?type=1&is_create=${n}&papersUrl=zy/v2/examination/examination-papers`
// if (this.isWeapp) {
// const src = encodeURIComponent(`${window.location.origin}${path}`)
// wx.miniProgram.navigateTo({
// url: `/pages/web/index?src=${src}`
// })
// } else {
// this.$router.push({ path })
// }
this.$router.replace({
path: '/exam/answer',
query: {
type: 1,
is_create: n,
papersUrl: 'zy/v2/examination/examination-papers'
}
})
},
goAbilityExam(n) {
window.localStorage.isExamEnd = true
window.localStorage.examTab = 0
this.$router.push({
path: '/exam/answer',
query: {
type: 1,
is_create: n,
papersUrl: 'zy/v2/examination/examination-papers'
}
})
},
startExam(event, id, cId, isCreate) {
// const path = `/exam/answer?type=1&is_create=${isCreate}&course_id=${cId}&chapter_id=${id}&papersUrl=zy/v2/examination/course-papers`
// if (this.isWeapp) {
// const src = encodeURIComponent(`${window.location.origin}${path}`)
// wx.miniProgram.navigateTo({
// url: `/pages/web/index?src=${src}`
// })
// } else {
// this.$router.push({ path })
// }
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) {
// const path = `/exam/result?type=1&is_create=${isCreate}&course_id=${cId}&chapter_id=${id}&papersUrl=zy/v2/examination/course-papers`
// if (this.isWeapp) {
// const src = encodeURIComponent(`${window.location.origin}${path}`)
// wx.miniProgram.navigateTo({
// url: `/pages/web/index?src=${src}`
// })
// } else {
// this.$router.push({ path })
// }
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()
},
async tab(e) {
const isLogin = await this.$store.dispatch('checkLogin')
if (e === 0 || e === 1) {
if (!isLogin) {
// if (this.isWeapp) {
// // 小程序
// wx.miniProgram.navigateTo({
// url: `/pages/login/index?redirect_uri=${encodeURIComponent(
// `/pages/web/index?src=${window.location.origin}/course/learn`
// )}`
// })
// } else {
// this.$router.push({ name: 'login' })
// }
Toast.loading({
message: '加载中...',
forbidClick: true,
duration: 1000
})
if (e === 0) {
window.localStorage.examTab = e
this.getCourseChapterList()
} else {
window.localStorage.examTab = 0
this.getCourseList()
}
} else {
Toast.loading({
message: '加载中...',
forbidClick: true,
duration: 1000
})
if (e === 0) {
window.localStorage.examTab = e
this.getCourseChapterList()
} else {
window.localStorage.examTab = 0
this.getCourseList()
}
}
}
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
Toast.clear()
})
}
}
}
</script>
<style lang="scss" scoped>
.course-box {
// padding: 0 .4rem;
.tab-nav {
height: 1.1rem;
padding: 0 0.4rem;
ul {
border-bottom: 0.01rem solid #eeeeee;
display: flex;
justify-content: space-between;
li {
line-height: 1.1rem;
font-size: 0.3rem;
color: #999999;
flex: 1;
text-align: center;
}
li.active {
color: #222;
font-weight: bold;
border-bottom: 0.02rem solid #c62245;
}
}
}
.tab-con {
overflow-y: scroll;
// padding-bottom: 1rem;
.tab1 {
// padding-top: .2rem;
padding: 0.2rem 0.4rem 1rem 0.4rem;
.txt {
font-size: 0.26rem;
color: #222;
line-height: 0.26ren;
}
.comp {
position: fixed;
bottom: 0.15rem;
left: 50%;
-webkit-transform: translateX(-50%);
padding-bottom: env(safe-area-inset-bottom);
}
.btn {
width: 6.7rem;
height: 0.7rem;
background: rgba(255, 103, 103, 1);
border-radius: 0.12rem;
text-align: center;
line-height: 0.7rem;
color: #fff;
font-size: 0.3rem;
}
.title {
font-size: 0.4rem;
font-weight: bold;
color: rgba(255, 103, 103, 1);
line-height: 100%;
padding-top: 0.2rem;
text-align: center;
}
img {
width: 5.01rem;
height: 3.98rem;
display: block;
margin: 0.2rem auto 0 auto;
}
p {
line-height: 100%;
font-size: 0.26rem;
color: #222;
text-align: center;
}
.tx {
margin-top: 0.2rem;
}
.ti {
font-size: 0.3rem;
margin: 0.4rem 0 0.2rem 0;
font-weight: bold;
}
.ti2 {
font-size: 0.3rem;
font-weight: bold;
margin-top: 0.4rem;
}
}
.tab2 {
.ul {
padding: 0 0.4rem;
li {
.parent {
display: flex;
border-bottom: 0.01rem solid #eeeeee;
padding: 0.4rem 0;
align-items: center;
.title {
font-size: 0.3rem;
color: #222222;
font-weight: bold;
}
.arrow {
margin-left: auto;
}
}
.hide {
display: none;
}
.show {
display: block;
}
ul {
li {
display: flex;
border-bottom: 0.01rem solid #eeeeee;
padding: 0.4rem 0;
.txt {
font-size: 0.26rem;
color: #999999;
}
.btn-box {
margin-left: auto;
display: flex;
.tag {
line-height: 0.46rem;
height: 0.46rem;
font-size: 0.26rem;
color: #fff;
padding: 0 0.3rem;
margin-left: 0.2rem;
background: #f47885;
border-radius: 0.25rem;
white-space: nowrap;
}
}
}
}
}
}
}
.tab3 {
ul {
padding: 0 0.4rem;
li {
display: flex;
padding: 0.4rem 0;
border-bottom: 0.01rem solid #eee;
align-items: center;
.tit {
width: 6.15rem;
color: rgba(34, 34, 34, 1);
font-size: 0.3rem;
font-weight: bold;
}
.arr {
margin-left: auto;
}
}
}
}
}
}
.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: 0.12rem;
padding: 0.4rem 0;
.tit {
font-weight: bold;
color: rgba(34, 34, 34, 1);
font-size: 0.3rem;
text-align: center;
line-height: 100%;
}
.txt {
color: rgba(34, 34, 34, 1);
font-size: 0.3rem;
text-align: center;
line-height: 100%;
margin-top: 0.8rem;
}
.btn_box {
padding: 0 0.2rem;
display: flex;
margin-top: 0.8rem;
.btn {
width: 2.6rem;
height: 0.7rem;
background: rgba(43, 124, 233, 1);
border-radius: 0.12rem;
text-align: center;
line-height: 0.7rem;
color: #fff;
font-size: 0.3rem;
}
.btn2 {
margin-left: auto;
}
}
}
}
</style>
<template>
<div>
<!-- 单选多选判断题(题目描述dom结构一样,只那选项区分) -->
<template v-if="questionData.question_item_type == 1 || questionData.question_item_type == 2 || questionData.question_item_type == 6">
<div class="title-type">
<div class="type">{{ questionData.question_item_title }}</div>
<div class="num">{{ questionData.q_order }}/{{ questionData.total_question_count }}</div>
</div>
<div class="title">
<div class="num">{{ questionData.q_order }}.</div><div class="des" v-html="questionData.content"></div>
</div>
<ul :class="questionData.question_item_type == 2 ? 'check-option' : 'radio-option'">
<template v-for="(item, index) in questionData.options">
<li
:key="index"
@click="changeOptions(questionData.question_item_type, questionData.question_item_id, questionData.id, item.id)"
:class="isClass(questionData.question_item_id, questionData.id, item.id)"
>
<div class="icon"></div>
<div class="txt">{{A_Z()[index]}}. {{item.option}}</div>
</li>
</template>
</ul>
</template>
<!-- 解析 -->
<div class="analysis" v-if="!isAnswer">
<div class="title">答案解析</div>
<div class="analy-mian">
<div class="txt1">正确答案:{{ questionData.question_answer }}</div>
<div class="txt1">您的答案:{{ myAnswer() }}</div>
<div class="explain-box">
<div>解析:</div>
<div class="w" v-html="questionData.question_analysis"></div>
</div>
</div>
</div>
<!-- 复合题 -->
<!-- <template v-if="questionData.question_item_type == 5">
<div class="title-type">
<div class="type">{{ questionData.question_item_title }}</div>
<div class="num">{{ questionData.q_order }}/{{ questionParams.question.total_question_count }}</div>
</div>
<div class="case-que">
<div class="flex">
<div class="stem" v-html="questionData.common_content"></div>
<div class="analysis" v-if="$route.query.id">
<div class="title">答案解析</div>
<div class="analy-mian">
<div class="txt1">正确答案:{{ questionData.question_answer }}</div>
<div class="txt1">您的答案:{{ myAnswer() }}</div>
<div class="explain-box">
<div>解析:</div>
<div class="w" v-html="questionData.question_analysis"></div>
</div>
</div>
</div>
</div>
<ul class="topics" :style="{height: contentHeight - 60 + 'px'}">
<template v-for="item in questionData.list">
<template v-if="questionData.group_id === item[0].group_id">
<template v-for="(listItem, index) in item">
<li :key="'type5' + index">
<div class="title">
<div class="num">{{ questionData.q_order }}.</div><div class="des" v-html="listItem.question_content"></div>
</div>
<ul :class="questionData.answer_count > 1 ? 'check-option' : 'radio-option'">
<template v-if="listItem.id === questionData.id">
<template v-for="(opt, oIndex) in listItem.question_options">
<li
:id="opt.id"
:key="'c' + oIndex"
@click="changeOptions(questionData.answer_count > 1 ? 2 : 1, questionData.question_item_id, questionData.id, opt.id)"
:class="questionParams.answerRecord[questionData.question_item_id]
? questionParams.answerRecord[questionData.question_item_id][questionData.id]
? questionParams.answerRecord[questionData.question_item_id][questionData.id].answer.find(id => { return id === opt.id })
? 'active'
: ''
: ''
: ''"
>
<div class="icon"></div>
<div class="txt">{{A_Z()[oIndex]}}. {{opt.option}}</div>
</li>
</template>
</template>
</ul>
</li>
</template>
</template>
</template>
</ul>
</div>
</template> -->
</div>
</template>
<script>
export default {
props: {
contentHeight: { type: Number, default: () => {} },
questionParams: { type: Object, default: () => {} }
},
data() {
return {
questionData: {},
isAnswer: true,
currentCheck: {}
}
},
created() {
this.questionData = this.questionParams.question
},
mounted() {
},
methods: {
// 多选确认答案
answerConfirm() {
const key = Object.keys(this.currentCheck)
const value = Object.values(this.currentCheck)
this.questionParams.answerRecord[key[0]] = value[0]
this.isChangeAnswer()
},
// 自己选择的答案
myAnswer() {
const selectAnswer = this.questionParams.answerRecord
const currentData = this.questionData
return selectAnswer[currentData.question_item_id]
? selectAnswer[currentData.question_item_id][currentData.id]
? (() => {
const arr = []
selectAnswer[currentData.question_item_id][currentData.id].answer.map(i => {
const findIndex = currentData.options.findIndex(d => { return i === d.id })
arr.push(this.A_Z()[findIndex])
})
return arr.sort().toString().replace(new RegExp(',', 'g'), '')
})()
: ''
: ''
},
// 选项选择
changeOptions(type, pId, cId, optId) {
if (this.isAnswer) {
if (parseInt(type) !== 2) {
this.questionParams.answerRecord[pId]
? this.questionParams.answerRecord[pId][cId]
? this.questionParams.answerRecord[pId][cId].answer = [optId]
: this.questionParams.answerRecord[pId][cId] = {
answer: [optId],
sign: false
}
: this.questionParams.answerRecord[pId] = {
[cId]: {
answer: [optId],
sign: false
}
}
} else {
this.currentCheck[pId]
? this.currentCheck[pId][cId]
? (() => {
const optChack = this.currentCheck[pId][cId].answer.findIndex(id => { return id === optId })
optChack === -1
? this.currentCheck[pId][cId].answer.push(optId)
: this.currentCheck[pId][cId].answer.splice(optChack, 1)
})()
: this.currentCheck[pId] = {
[cId]: {
answer: [optId],
sign: false
}
}
: this.currentCheck[pId] = {
[cId]: {
answer: [optId],
sign: false
}
}
}
console.log(this.currentCheck)
this.isChangeAnswer()
this.$forceUpdate()
}
},
isChangeAnswer() {
const item = this.questionParams.answerRecord[this.questionData.question_item_id]
item
? item[this.questionData.id]
? this.isAnswer = false
: this.isAnswer = true
: this.isAnswer = true
},
// ABCD
A_Z() {
const result = []
for (let i = 0; i < 26; i++) {
result.push(String.fromCharCode(65 + i))
}
return result
}
},
computed: {
changeQuestionIndex() {
return this.questionParams.questionIndex
},
isClass() {
return (pId, cId, oId) => {
let active = ''
if (this.questionParams.answerRecord[pId]) {
if (this.questionParams.answerRecord[pId][cId]) {
const findData = this.questionParams.answerRecord[pId][cId].answer.find(id => { return id === oId })
findData && (active = 'active')
}
} else {
if (this.currentCheck[pId]) {
if (this.currentCheck[pId][cId]) {
const findData = this.currentCheck[pId][cId].answer.find(id => { return id === oId })
findData && (active = 'active')
}
}
}
return active
}
}
},
watch: {
changeQuestionIndex(newV, oldV) {
this.questionData = this.questionParams.question
this.isChangeAnswer()
this.$forceUpdate()
}
}
}
</script>
<style lang="scss" scoped>
.title-type{
width: 100%;
height: 45px;
border-bottom:1px solid #ccc;
display: flex;
align-items: center;
.type{
font-size: 18px;
color: #222222;
}
.num{
margin-left: auto;
font-size: 18px;
color: #222222;
}
}
.title{
font-size: 18px;
font-weight: bold;
color: #222222;
line-height: 25px;
display: flex;
.num{
font-size: 32px;
font-weight: bold;
color: #222222;
line-height: 45px;
margin-top: 5px;
}
.des{
margin-left: 5px;
padding-top: 18px;
&::v-deep p{
margin: 0;
}
}
}
.describe{
font-size: 18px;
color: #222222;
line-height: 25px;
margin-top: 20px;
}
.radio-option,.check-option{
padding: 24px 0 0 0;
margin: 0;
list-style: none;
li{
cursor: pointer;
margin-bottom: 20px;
display: flex;
// align-items: center;
.icon{
width: 18px;
height: 18px;
border: 1px solid #999999;
border-radius: 50%;
margin-top: 3px;
}
.txt{
width: 95%;
font-size: 18px;
color: #222222;
line-height: 28px;
margin-left: 10px;
}
&.active{
.icon{
width: 8px;
height: 8px;
border: 6px solid #C01540;
}
}
}
}
.check-option{
.icon{
border-radius: 3px !important;
}
}
.flex{
flex: 1;
}
.case-que{
display: flex;
.stem{
flex: 1;
font-size: 14px;
font-weight: bold;
color: #222222;
line-height: 28px;
margin-bottom: 20px;
}
.topics{
flex: 1;
margin: 0;
padding: 0 0 0 20px;
list-style: none;
overflow-y: scroll;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
li{
.title{
font-size: 18px;
font-weight: bold;
color: #222222;
line-height: 25px;
span{
font-size: 32px;
font-weight: bold;
color: #222222;
line-height: 45px;
}
}
}
}
}
.analysis{
.title{
font-size: 18px;
font-weight: bold;
color: #222222;
line-height: 25px;
}
.analy-mian{
padding-left: 27px;
.txt1{
margin-top: 10px;
font-size: 18px;
color: #222222;
line-height: 25px;
}
.explain-box{
display: flex;
margin-top: 10px;
flex-wrap: wrap;
div{
font-size: 18px;
font-weight: 400;
color: #222222;
line-height: 25px;
}
.w{
width: 89%;
}
}
}
}
</style>
<template>
<div>
<div class="answer-box">
<div class="head" id="head-h">
<div class="title">全国统一高考试卷A</div>
<div class="right">
<div class="count">{{ questionParams.question.sheet_time }}</div>
</div>
</div>
<div class="exam-main" :style="{height: this.contentHeight + 'px'}">
<div class="left">
<question
v-if="Object.keys(questionParams.question).length"
:contentHeight="contentHeight"
:questionParams="questionParams"
ref="confirmBtn"
></question>
</div>
</div>
<div class="foot" id="foot-h">
<div class="exam-btn">
<div class="confirm"
v-if="questionParams.question.question_item_type == 2"
@click="confirmBtn"
>
确认答案
</div>
<div
@click="changeIndex('prev')"
:class="this.questionParams.questionIndex !== 0 ? 'active' : ''"
>上一题</div>
<div
:class="questionParams.questionIndex + 1 !== questionParams.question.total_question_count ? 'active' : ''"
@click="changeIndex('next')"
>下一题</div>
</div>
<div class="rigth-btn">
<div class="sign" @click="collectQuestion" v-if="$route.query.type != 2">
<div :class="questionParams.question.is_collection ? 'icon active' : 'icon'"></div>
<div class="txt">{{ questionParams.question.is_collection ? '已收藏' : '收藏' }}</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/exam.js'
import question from './components/question.vue'
export default {
components: {
question
},
data() {
return {
// 设置页面高
contentHeight: 0,
// 原数据
beforeChangeData: {},
// 过滤后的数据
afterChangeData: {},
questionParams: {
// 用户选择的选项 --- 提交后台的数据
answerRecord: {},
// 所有题 和题的信息
question: {},
questionIndex: 0
}
}
},
mounted() {
// 赋值页面高度
this.contentHeight = parseInt(document.documentElement.clientHeight - (this.getDom('head-h').offsetHeight + this.getDom('foot-h').offsetHeight))
this.getTopic()
},
methods: {
confirmBtn() {
this.$refs.confirmBtn.answerConfirm()
},
getDom(id) {
return document.getElementById(id)
},
// 收藏试题
collectQuestion() {
const data = this.questionParams.question
data.is_collection
? this.removeCall(data.id, () => {
data.is_collection = false
})
: this.addCall(data.id, () => {
data.is_collection = true
})
},
addCall(id, call) {
api
.addCollection({ question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
removeCall(id, call) {
api
.deleteCollection({ type: 2, question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
// 改变数据
setData(data) {
let countNum = 0
const type = {
1: '单选题',
2: '多选题',
5: '案例题',
6: '判断题'
}
return data.map(item => {
return item.question_list.map(cItem => {
countNum++
const rightAnswer = Array.isArray(cItem.question_answer)
? cItem.question_answer
: [cItem.question_answer]
const data = {
q_order: countNum,
question_item_id: item.question_item_id,
question_item_type: item.question_type,
content: cItem.question_content,
id: cItem.id,
options: cItem.question_options,
question_item_title: type[item.question_type],
total_question_count: this.beforeChangeData.questions.total_question_count,
is_collection: cItem.is_collection,
question_analysis: cItem.question_analysis,
common_content: cItem.common_content
}
const findAb = rightAnswer.map(ans => {
const index = cItem.question_options.findIndex(opt => { return opt.id === ans })
return this.A_Z()[index]
})
data.question_answer = findAb.sort().toString().replace(new RegExp(',', 'g'), '')
return data
})
})
},
// 获取考卷
getTopic() {
const param = {
type: 2,
tag_id: this.$route.query.tag_id
}
api
.getCourseQuestion(param)
.then(response => {
const data = JSON.parse(response.data)
this.beforeChangeData = data.sheet
this.afterChangeData = this.setData(data.sheet.questions.question_items)
this.changeData()
console.log(this.afterChangeData)
})
.finally(() => {
})
},
// ABC
A_Z() {
const result = []
for (let i = 0; i < 26; i++) {
result.push(String.fromCharCode(65 + i))
}
return result
},
// 点击上一题下一题 答题卡序号
changeData() {
this.afterChangeData.map(item => {
item.map(cItem => {
cItem.q_order === this.questionParams.questionIndex + 1 && (this.questionParams.question = cItem)
})
})
},
// 改变题序
changeIndex(type) {
if (type === 'prev') {
this.questionParams.questionIndex > 0 && (this.questionParams.questionIndex--)
} else {
this.questionParams.questionIndex + 1 !== this.questionParams.question.total_question_count && (this.questionParams.questionIndex++)
}
this.changeData()
},
// 缓存 提交
handlePapers(n) {
const param = {
type: this.$route.query.type,
question_type: this.$route.query.qType,
answer: JSON.stringify(this.questionParams.answerRecord)
}
window.localStorage.answerRecord = JSON.stringify(this.questionParams.answerRecord)
this.chcheReq(param, () => {})
}
},
computed: {
changeQuestionIndex() {
return this.questionParams.questionIndex
}
},
watch: {
// 监听题的变化
changeQuestionIndex(newV, oldV) {
this.changeData()
// this.$forceUpdate()
console.log(this.questionParams.question)
}
}
}
</script>
<style lang="scss" scoped>
.answer-box{
width: 100%;
height: 100%;
// background: #f9f9f9;
.head{
width: 100%;
height: 80px;
background: #FFFFFF;
display: flex;
.title{
padding-left: 30px;
font-size: 24px;
font-weight: bold;
color: #222222;
line-height: 80px;
}
.right{
width: 260px;
margin-left: auto;
display: flex;
justify-content: space-around;
align-items: center;
.count{
font-size: 18px;
font-weight: bold;
color: #222222;
}
.time{
display: flex;
.icon{
width: 23px;
height: 23px;
// background: url(../../assets/images/tick.png);
background-size:100% 100%;
}
.mun{
font-size: 18px;
font-weight: bold;
color: #222222;
line-height: 25px;
margin-left: 10px;
}
}
}
}
.exam-main{
display: flex;
.left{
flex: 1;
padding: 10px 20px 0 53px;
overflow-y: scroll;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
}
.right{
position: relative;
width: 220px;
background: #fff;
padding: 0 20px;
overflow-y: scroll;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
}
}
.foot{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 60px;
background: #FFFFFF;
display: flex;
align-items: center;
.exam-btn{
display: flex;
padding-left: 40px;
.confirm{
width: 140px;
height: 40px;
background: #C01540;
border-radius: 4px;
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
line-height: 40px;
text-align: center;
}
cursor: pointer;
div{
width: 100px;
height: 40px;
border-radius: 4px;
border: 1px solid #CCCCCC;
font-size: 14px;
font-weight: bold;
color: #999999;
line-height: 40px;
text-align: center;
margin-right: 20px;
&.active{
background: #C01540;
border-radius: 4px;
color: #fff;
}
}
}
.rigth-btn{
display: flex;
margin-left: auto;
.del-btn{
width: 100px;
height: 40px;
border-radius: 4px;
border: 1px solid #CCCCCC;
line-height: 40px;
font-size: 14px;
font-weight: bold;
color: #999999;
text-align: center;
margin-right: 30px;
}
.end-exam-btn{
width: 260px;
display: flex;
justify-content: center;
align-items: center;
.btn{
cursor: pointer;
width: 200px;
height: 40px;
background: #EEEEEE;
border-radius: 4px;
font-size: 14px;
font-weight: bold;
color: #CCCCCC;
line-height: 40px;
text-align: center;
}
}
.sign{
margin-right: 20px;
.icon{
margin: 0 auto;
width: 24px;
height: 24px;
background: url(@/assets/images/collection.png);
background-size:100% 100%;
&.active{
background: url(@/assets/images/collection2.png);
background-size:100% 100%;
}
}
.txt{
font-size: 14px;
color: #CCCCCC;
line-height: 20px;
margin-top: 2px;
}
}
}
}
}
</style>
...@@ -36,12 +36,12 @@ ...@@ -36,12 +36,12 @@
@click="changeIndex('next')" @click="changeIndex('next')"
>下一题</div> >下一题</div>
</div> </div>
<div class="rigth-btn" @click="signHandle" v-if="!$route.query.id"> <div class="rigth-btn" @click="signHandle">
<!-- <div class="sign"> <div class="sign" @click="collectQuestion">
<div class="icon"></div> <div :class="questionParams.question.isCollection ? 'icon active' : 'icon'"></div>
<div class="txt">{{ itemSign ? '取消标记' : '标记' }}</div> <div class="txt">{{ questionParams.question.isCollection ? '已收藏' : '收藏' }}</div>
</div> --> </div>
<div class="end-exam-btn"> <div class="end-exam-btn" v-if="!$route.query.id">
<div class="btn" @click="endExam">交卷</div> <div class="btn" @click="endExam">交卷</div>
</div> </div>
</div> </div>
...@@ -95,6 +95,36 @@ export default { ...@@ -95,6 +95,36 @@ export default {
this.getTopic() this.getTopic()
}, },
methods: { methods: {
// 收藏试题
collectQuestion() {
const data = this.questionParams.question
console.log(data)
data.isCollection
? this.removeCall(data.id, () => {
data.isCollection = false
})
: this.addCall(data.id, () => {
data.isCollection = true
})
},
addCall(id, call) {
api
.addCollection({ question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
removeCall(id, call) {
api
.deleteCollection({ type: 2, question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
// 标记 // 标记
signHandle() { signHandle() {
this.$refs.signHandle.onSignHandle() this.$refs.signHandle.onSignHandle()
...@@ -200,7 +230,8 @@ export default { ...@@ -200,7 +230,8 @@ export default {
id: cItem.id, id: cItem.id,
options: cItem.question_options, options: cItem.question_options,
question_item_title: type[item.question_type], question_item_title: type[item.question_type],
total_question_count: this.beforeChangeData.questions.total_question_count total_question_count: this.beforeChangeData.questions.total_question_count,
isCollection: cItem.is_collection
} }
if (this.$route.query.id) { if (this.$route.query.id) {
if (this.$route.query.id.length > 5 || this.$route.query.id === 'all' || this.$route.query.id === 'err') { if (this.$route.query.id.length > 5 || this.$route.query.id === 'all' || this.$route.query.id === 'err') {
...@@ -433,8 +464,12 @@ export default { ...@@ -433,8 +464,12 @@ export default {
margin: 0 auto; margin: 0 auto;
width: 24px; width: 24px;
height: 24px; height: 24px;
background: url(@/assets/images/sign.png); background: url(@/assets/images/collection.png);
background-size:100% 100%; background-size:100% 100%;
&.active{
background: url(@/assets/images/collection2.png);
background-size:100% 100%;
}
} }
.txt{ .txt{
font-size: 14px; font-size: 14px;
......
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
</div> </div>
<div class="item"> <div class="item">
<p><b>试卷组卷比例见下表</b></p> <p><b>试卷组卷比例见下表</b></p>
<img src="../../assets/images/exam_table.png" style="max-width: 100%" /> <img src="../../../assets/images/exam_table.png" style="max-width: 100%" />
</div> </div>
</div> </div>
<template #footer> <template #footer>
...@@ -62,7 +62,7 @@ export default { ...@@ -62,7 +62,7 @@ export default {
this.$router.push({ this.$router.push({
path: '/mock/exam', path: '/mock/exam',
query: { query: {
is_create: true is_create: 1
} }
}) })
} }
......
...@@ -32,6 +32,7 @@ export default { ...@@ -32,6 +32,7 @@ export default {
questionParams: { type: Object, default: () => {} } questionParams: { type: Object, default: () => {} }
}, },
mounted() { mounted() {
console.log(this.questionParams.card, '====123')
this.msgCenter.$on('monitoringChanges', this.monitoringChanges) this.msgCenter.$on('monitoringChanges', this.monitoringChanges)
}, },
computed: { computed: {
...@@ -68,7 +69,7 @@ export default { ...@@ -68,7 +69,7 @@ export default {
goQuestion(n) { goQuestion(n) {
this.$emit('cardChangeQuention', n) this.$emit('cardChangeQuention', n)
}, },
changeCardStatus(id) { changeCardStatus(id, n) {
const dataArr1 = this.questionParams.question.rightKey const dataArr1 = this.questionParams.question.rightKey
const dataArr2 = this.questionParams.answerRecord[id] ? this.questionParams.answerRecord[id].answer : [] const dataArr2 = this.questionParams.answerRecord[id] ? this.questionParams.answerRecord[id].answer : []
const findData = this.questionParams.card.find(item => { return item.question_id === id }) const findData = this.questionParams.card.find(item => { return item.question_id === id })
...@@ -86,6 +87,9 @@ export default { ...@@ -86,6 +87,9 @@ export default {
} }
} }
return false return false
},
allIsClass() {
console.log(this.questionParams, '====321')
} }
}, },
watch: { watch: {
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<li <li
:key="index" :key="index"
@click="changeOptions(questionData.question_item_type, questionData.id, item.id)" @click="changeOptions(questionData.question_item_type, questionData.id, item.id)"
:class="isClass(questionData.id, item.id)" :class="$route.query.type == 3 ? allIsClass(item.id) : isClass(questionData.id, item.id)"
> >
<div class="icon"></div> <div class="icon"></div>
<div class="txt">{{A_Z()[index]}}. {{item.option}}</div> <div class="txt">{{A_Z()[index]}}. {{item.option}}</div>
...@@ -57,32 +57,24 @@ ...@@ -57,32 +57,24 @@
</div> </div>
</div> </div>
<ul class="topics" :style="{height: contentHeight - 60 + 'px'}"> <ul class="topics" :style="{height: contentHeight - 60 + 'px'}">
<!-- <template v-for="item in questionData.list"> --> <li>
<!-- <template v-if="questionData.group_id === item[0].group_id"> --> <div class="title">
<!-- <template v-for="(listItem, index) in item"> --> <div class="num">{{ questionData.q_order }}.</div><div class="des" v-html="questionData.content"></div>
<li> </div>
<div class="title"> <ul :class="questionData.answer_count > 1 ? 'check-option' : 'radio-option'"><!-- radio-option check-option -->
<div class="num">{{ questionData.q_order }}.</div><div class="des" v-html="questionData.content"></div> <template v-for="(opt, oIndex) in questionData.options">
</div> <li
<ul :class="questionData.answer_count > 1 ? 'check-option' : 'radio-option'"><!-- radio-option check-option --> :id="opt.id"
<!-- <template v-if="listItem.id === questionData.id"> --> :key="'c' + oIndex"
<template v-for="(opt, oIndex) in questionData.options"> @click="changeOptions(questionData.answer_count > 1 ? 2 : 1, questionData.id, opt.id)"
<li :class="isClass(questionData.id, opt.id)"
:id="opt.id" >
:key="'c' + oIndex" <div class="icon"></div>
@click="changeOptions(questionData.answer_count > 1 ? 2 : 1, questionData.id, opt.id)" <div class="txt">{{A_Z()[oIndex]}}. {{opt.option}}</div>
:class="isClass(questionData.id, opt.id)"
>
<div class="icon"></div>
<div class="txt">{{A_Z()[oIndex]}}. {{opt.option}}</div>
</li>
</template>
<!-- </template> -->
</ul>
</li> </li>
<!-- </template> --> </template>
<!-- </template> --> </ul>
<!-- </template> --> </li>
</ul> </ul>
</div> </div>
</template> </template>
...@@ -105,6 +97,7 @@ export default { ...@@ -105,6 +97,7 @@ export default {
this.questionData = this.questionParams.question this.questionData = this.questionParams.question
}, },
mounted() { mounted() {
this.isChangeAnswer()
}, },
methods: { methods: {
answerConfirm() { answerConfirm() {
...@@ -112,8 +105,6 @@ export default { ...@@ -112,8 +105,6 @@ export default {
const value = Object.values(this.currentCheck) const value = Object.values(this.currentCheck)
this.questionParams.answerRecord[key[0]] = value[0] this.questionParams.answerRecord[key[0]] = value[0]
this.isChangeAnswer() this.isChangeAnswer()
// console.log(this.questionParams.answerRecord)
// console.log(key, value)
}, },
// 自己选择的答案 // 自己选择的答案
myAnswer() { myAnswer() {
...@@ -156,10 +147,14 @@ export default { ...@@ -156,10 +147,14 @@ export default {
this.$forceUpdate() this.$forceUpdate()
}, },
isChangeAnswer() { isChangeAnswer() {
this.questionParams.answerRecord[this.questionData.id] if (parseInt(this.$route.query.type) === 3) {
? this.isAnswer = false this.isAnswer = false
: this.isAnswer = true } else {
this.msgCenter.$emit('monitoringChanges', this.questionData.id) this.questionParams.answerRecord[this.questionData.id]
? this.isAnswer = false
: this.isAnswer = true
this.msgCenter.$emit('monitoringChanges', this.questionData.id)
}
}, },
signCallback() { signCallback() {
const pId = this.questionData.question_item_id const pId = this.questionData.question_item_id
...@@ -199,6 +194,12 @@ export default { ...@@ -199,6 +194,12 @@ export default {
} }
return active return active
} }
},
allIsClass() {
return (oId) => {
const findData = this.questionParams.question.user_answer.find(id => { return id === oId })
return findData ? 'active' : ''
}
} }
}, },
watch: { watch: {
......
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<div class="foot" id="foot-h"> <div class="foot" id="foot-h">
<div class="exam-btn"> <div class="exam-btn">
<div class="confirm" <div class="confirm"
v-if="this.questionParams.question.answer_count > 1" v-if="this.questionParams.question.answer_count > 1 && $route.query.type != 3"
@click="confirmBtn" @click="confirmBtn"
> >
确认答案 确认答案
...@@ -41,11 +41,12 @@ ...@@ -41,11 +41,12 @@
>下一题</div> >下一题</div>
</div> </div>
<div class="rigth-btn"> <div class="rigth-btn">
<!-- <div class="sign"> <div class="sign" @click="collectQuestion" v-if="$route.query.type != 2">
<div class="icon"></div> <div :class="questionParams.question.is_collection ? 'icon active' : 'icon'"></div>
<div class="txt">{{ itemSign ? '取消标记' : '标记' }}</div> <div class="txt">{{ questionParams.question.is_collection ? '已收藏' : '收藏' }}</div>
</div> --> </div>
<div class="end-exam-btn"> <div class="del-btn" @click="deleteQuestion">删除</div>
<div class="end-exam-btn" v-if="$route.query.type != 3">
<div class="btn" @click="clearQuestion">清空记录,重新答题</div> <div class="btn" @click="clearQuestion">清空记录,重新答题</div>
</div> </div>
</div> </div>
...@@ -55,8 +56,8 @@ ...@@ -55,8 +56,8 @@
</template> </template>
<script> <script>
import * as api from '@/api/exam.js' import * as api from '@/api/exam.js'
import answerCard from '@/components/myQuestion/answerCard.vue' import answerCard from './components/answerCard.vue'
import question from '@/components/myQuestion/question.vue' import question from './components/question.vue'
export default { export default {
components: { components: {
question, question,
...@@ -89,10 +90,34 @@ export default { ...@@ -89,10 +90,34 @@ export default {
this.initData() this.initData()
}, },
methods: { methods: {
// 删除试题
deleteQuestion() {
this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
})
const param = {
question_id: this.questionParams.question.id,
type: this.$route.query.type
}
api
.deleteQuestion(param)
.then(response => {
this.$router.go(0)
})
.finally(() => {
})
},
// 初始化 // 初始化
initData() { initData() {
this.getCardAll() this.getCardAll()
this.goAppointQuestion(this.$route.query.index - 1) this.goAppointQuestion(this.$route.query.index - 1)
this.questionParams.questionIndex = 0
window.localStorage.answerRecord
? this.questionParams.answerRecord = JSON.parse(window.localStorage.answerRecord)
: this.questionParams.answerRecord = {}
}, },
confirmBtn() { confirmBtn() {
this.$refs.confirmBtn.answerConfirm() this.$refs.confirmBtn.answerConfirm()
...@@ -100,6 +125,36 @@ export default { ...@@ -100,6 +125,36 @@ export default {
getDom(id) { getDom(id) {
return document.getElementById(id) return document.getElementById(id)
}, },
// 收藏试题
collectQuestion() {
const data = this.questionParams.question
console.log(data)
data.is_collection
? this.removeCall(data.id, () => {
data.is_collection = false
})
: this.addCall(data.id, () => {
data.is_collection = true
})
},
addCall(id, call) {
api
.addCollection({ question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
removeCall(id, call) {
api
.deleteCollection({ question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
// 改变数据 // 改变数据
setData(list) { setData(list) {
return list.map(list => { return list.map(list => {
...@@ -110,9 +165,9 @@ export default { ...@@ -110,9 +165,9 @@ export default {
6: '判断题' 6: '判断题'
} }
const typeTotal = { const typeTotal = {
0: 'total', 3: 'total',
1: 'error_total', 1: 'error_total',
2: '' 2: 'collection_total'
} }
const data = { const data = {
q_order: list.num, q_order: list.num,
...@@ -121,7 +176,7 @@ export default { ...@@ -121,7 +176,7 @@ export default {
id: list.question_id, id: list.question_id,
options: list.question_options, options: list.question_options,
question_item_title: type[parseInt(list.question_type)], question_item_title: type[parseInt(list.question_type)],
total_question_count: this.questionData[typeTotal[this.$route.query.type]], total_question_count: this.questionData[typeTotal[parseInt(this.$route.query.type)]],
question_analysis: list.question_analysis, question_analysis: list.question_analysis,
user_answer: list.user_answer, user_answer: list.user_answer,
is_collection: list.is_collection, is_collection: list.is_collection,
...@@ -158,17 +213,27 @@ export default { ...@@ -158,17 +213,27 @@ export default {
// 获取答题卡所有题 // 获取答题卡所有题
getCardAll() { getCardAll() {
const param = { const param = {
type: this.$route.query.type, type: parseInt(this.$route.query.type) === 3 ? 0 : this.$route.query.type,
question_type: this.$route.query.qType question_type: this.$route.query.qType
} }
api api
.getAllQuestion(param) .getAllQuestion(param)
.then(response => { .then(response => {
this.questionParams.card = response.list if (response.list[0].question) {
this.questionParams.card = this.setCardData(response.list)
} else {
this.questionParams.card = response.list
}
}) })
.finally(() => { .finally(() => {
}) })
}, },
setCardData(list) {
return list.map(item => {
item.question = JSON.parse(item.question)
return item
})
},
// ABC // ABC
A_Z() { A_Z() {
const result = [] const result = []
...@@ -219,9 +284,11 @@ export default { ...@@ -219,9 +284,11 @@ export default {
!isData && (this.supplyRequest()) !isData && (this.supplyRequest())
} }
} else { } else {
this.questionParams.questionIndex++ if (parseInt(this.questionParams.questionIndex + 1) !== parseInt(this.questionParams.question.total_question_count)) {
const isData = this.questionData.list.find(i => { return i.q_order === this.questionParams.questionIndex + 2 }) this.questionParams.questionIndex++
!isData && (this.supplyRequest(1)) const isData = this.questionData.list.find(i => { return i.q_order === this.questionParams.questionIndex + 2 })
!isData && (this.supplyRequest(1))
}
} }
}, },
supplyRequest(n) { supplyRequest(n) {
...@@ -256,6 +323,7 @@ export default { ...@@ -256,6 +323,7 @@ export default {
question_type: this.$route.query.qType, question_type: this.$route.query.qType,
answer: JSON.stringify(this.questionParams.answerRecord) answer: JSON.stringify(this.questionParams.answerRecord)
} }
window.localStorage.answerRecord = JSON.stringify(this.questionParams.answerRecord)
this.chcheReq(param, () => {}) this.chcheReq(param, () => {})
}, },
// 清除所有答案 重新答题 // 清除所有答案 重新答题
...@@ -267,6 +335,7 @@ export default { ...@@ -267,6 +335,7 @@ export default {
} }
this.chcheReq(param, () => { this.chcheReq(param, () => {
this.questionParams.questionIndex = 0 this.questionParams.questionIndex = 0
window.localStorage.removeItem('answerRecord')
this.initData() this.initData()
}) })
}, },
...@@ -289,7 +358,8 @@ export default { ...@@ -289,7 +358,8 @@ export default {
// 监听题的变化 // 监听题的变化
changeQuestionIndex(newV, oldV) { changeQuestionIndex(newV, oldV) {
this.changeData() this.changeData()
this.handlePapers() parseInt(this.$route.query.type) !== 3 && (this.handlePapers())
console.log(this.questionParams.question)
} }
} }
} }
...@@ -408,6 +478,18 @@ export default { ...@@ -408,6 +478,18 @@ export default {
.rigth-btn{ .rigth-btn{
display: flex; display: flex;
margin-left: auto; margin-left: auto;
.del-btn{
width: 100px;
height: 40px;
border-radius: 4px;
border: 1px solid #CCCCCC;
line-height: 40px;
font-size: 14px;
font-weight: bold;
color: #999999;
text-align: center;
margin-right: 30px;
}
.end-exam-btn{ .end-exam-btn{
width: 260px; width: 260px;
display: flex; display: flex;
...@@ -432,8 +514,12 @@ export default { ...@@ -432,8 +514,12 @@ export default {
margin: 0 auto; margin: 0 auto;
width: 24px; width: 24px;
height: 24px; height: 24px;
background: url(@/assets/images/sign.png); background: url(@/assets/images/collection.png);
background-size:100% 100%; background-size:100% 100%;
&.active{
background: url(@/assets/images/collection2.png);
background-size:100% 100%;
}
} }
.txt{ .txt{
font-size: 14px; font-size: 14px;
......
...@@ -36,12 +36,12 @@ ...@@ -36,12 +36,12 @@
@click="changeIndex('next')" @click="changeIndex('next')"
>下一题</div> >下一题</div>
</div> </div>
<div class="rigth-btn" @click="signHandle" v-if="!$route.query.id"> <div class="rigth-btn" @click="signHandle">
<!-- <div class="sign"> <div class="sign" @click="collectQuestion">
<div class="icon"></div> <div :class="questionParams.question.isCollection ? 'icon active' : 'icon'"></div>
<div class="txt">{{ itemSign ? '取消标记' : '标记' }}</div> <div class="txt">{{ questionParams.question.isCollection ? '已收藏' : '收藏' }}</div>
</div> --> </div>
<div class="end-exam-btn"> <div class="end-exam-btn" v-if="!$route.query.id">
<div class="btn" @click="endExam">交卷</div> <div class="btn" @click="endExam">交卷</div>
</div> </div>
</div> </div>
...@@ -95,6 +95,36 @@ export default { ...@@ -95,6 +95,36 @@ export default {
this.getTopic() this.getTopic()
}, },
methods: { methods: {
// 收藏试题
collectQuestion() {
const data = this.questionParams.question
console.log(data)
data.isCollection
? this.removeCall(data.id, () => {
data.isCollection = false
})
: this.addCall(data.id, () => {
data.isCollection = true
})
},
addCall(id, call) {
api
.addCollection({ question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
removeCall(id, call) {
api
.deleteCollection({ type: 2, question_id: id })
.then(response => {
call(response.list)
})
.finally(() => {
})
},
// 标记 // 标记
signHandle() { signHandle() {
this.$refs.signHandle.onSignHandle() this.$refs.signHandle.onSignHandle()
...@@ -205,7 +235,8 @@ export default { ...@@ -205,7 +235,8 @@ export default {
id: cItem.id, id: cItem.id,
options: cItem.question_options, options: cItem.question_options,
question_item_title: type[item.question_type], question_item_title: type[item.question_type],
total_question_count: this.beforeChangeData.questions.total_question_count total_question_count: this.beforeChangeData.questions.total_question_count,
isCollection: cItem.isCollection
} }
if (this.$route.query.id) { if (this.$route.query.id) {
if (this.$route.query.id.length > 5 || this.$route.query.id === 'all' || this.$route.query.id === 'err') { if (this.$route.query.id.length > 5 || this.$route.query.id === 'all' || this.$route.query.id === 'err') {
...@@ -438,8 +469,12 @@ export default { ...@@ -438,8 +469,12 @@ export default {
margin: 0 auto; margin: 0 auto;
width: 24px; width: 24px;
height: 24px; height: 24px;
background: url(@/assets/images/sign.png); background: url(@/assets/images/collection.png);
background-size:100% 100%; background-size:100% 100%;
&.active{
background: url(@/assets/images/collection2.png);
background-size:100% 100%;
}
} }
.txt{ .txt{
font-size: 14px; font-size: 14px;
......
...@@ -30,22 +30,22 @@ const examAnswer = [ ...@@ -30,22 +30,22 @@ const examAnswer = [
/* 考前摸底 */ /* 考前摸底 */
{ {
path: '/testExam', path: '/testExam',
component: () => import(/* webpackChunkName: "exam" */ '@/pages/testExam') component: () => import(/* webpackChunkName: "exam" */ '@/pages/exam/testExam/index')
}, },
/* 考前摸底结果页 */ /* 考前摸底结果页 */
{ {
path: '/testExam/result', path: '/testExam/result',
component: () => import(/* webpackChunkName: "exam" */ '@/pages/testExam/exam/result') component: () => import(/* webpackChunkName: "exam" */ '@/pages/exam/testExam/exam/result')
}, },
/* 真题实战 */ /* 真题实战 */
{ {
path: '/mock', path: '/mock',
component: () => import(/* webpackChunkName: "exam" */ '@/pages/mockExam') component: () => import(/* webpackChunkName: "exam" */ '@/pages/exam/mockExam/index')
}, },
/* 真题实战结果页 */ /* 真题实战结果页 */
{ {
path: '/mock/result', path: '/mock/result',
component: () => import(/* webpackChunkName: "exam" */ '@/pages/mockExam/exam/result') component: () => import(/* webpackChunkName: "exam" */ '@/pages/exam/mockExam/exam/result')
} }
] ]
...@@ -114,17 +114,22 @@ export default [ ...@@ -114,17 +114,22 @@ export default [
/* 考前摸底考试 */ /* 考前摸底考试 */
{ {
path: '/testExam/exam', path: '/testExam/exam',
component: () => import(/* webpackChunkName: "course-learn" */ '@/pages/testExam/exam/index') component: () => import(/* webpackChunkName: "course-learn" */ '@/pages/exam/testExam/exam/index')
}, },
/* 模拟考试 */ /* 模拟考试 */
{ {
path: '/mock/exam', path: '/mock/exam',
component: () => import(/* webpackChunkName: "course-learn" */ '@/pages/mockExam/exam/index') component: () => import(/* webpackChunkName: "course-learn" */ '@/pages/exam/mockExam/exam/index')
}, },
/* 错题收藏全部列表详情 */ /* 错题收藏全部列表详情 */
{ {
path: '/my/questions/details', path: '/my/questions/details',
component: () => import(/* webpackChunkName: "course-learn" */ '@/pages/my/questions/questionDetails') component: () => import(/* webpackChunkName: "course-learn" */ '@/pages/exam/myExam/questionDetails')
},
/* 知识点练习 */
{
path: '/course/exam/examSite',
component: () => import(/* webpackChunkName: "course-learn" */ '@/pages/exam/courseExam/examSite/index')
}, },
...viewerRoutes ...viewerRoutes
] ]
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论