Skip to content

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

update

上级 645c19b7
隐藏空白字符变更
内嵌 并排
正在显示 包含 567 行增加 和 478 行删除
src/components/exam/examCard.vue
浏览文件 @ f4442d0f
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<div class="txt">{{ currentItem.sign ? '已标记' : '标记' }}</div> <div class="txt">{{ currentItem.sign ? '已标记' : '标记' }}</div>
</div> </div>
<div class="end-exam-btn"> <div class="end-exam-btn">
<div class="btn" v-if="hasSubmitBtn" @click="submitExam">交卷</div> <div class="btn" v-if="hasSubmitBtn && !disabled" @click="submitExam">交卷</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -81,7 +81,12 @@ export default { ...@@ -81,7 +81,12 @@ export default {
deep: true, deep: true,
immediate: true, immediate: true,
handler(value) { handler(value) {
this.genQuestions(value) if (value) {
const { status } = value
this.disabled = ['1', '2'].includes(status)
this.hasResult = ['1', '2'].includes(status)
this.genQuestions(value)
}
} }
} }
}, },
...@@ -108,6 +113,7 @@ export default { ...@@ -108,6 +113,7 @@ export default {
} }
this.examTimeText = this.secondToDate(sec) this.examTimeText = this.secondToDate(sec)
this.duration++ this.duration++
this.$emit('timeupdate', this.duration, this.questionList)
}, 1000) }, 1000)
}, },
secondToDate(result) { secondToDate(result) {
...@@ -152,7 +158,7 @@ export default { ...@@ -152,7 +158,7 @@ export default {
}, },
// 提交考试 // 提交考试
submitExam() { submitExam() {
this.$emit('submitExam') this.$emit('submitExam', this.questionList)
}, },
// 组装试题数据 // 组装试题数据
genQuestions(data) { genQuestions(data) {
......
src/components/exam/questionListItem.vue
浏览文件 @ f4442d0f
...@@ -45,7 +45,7 @@ ...@@ -45,7 +45,7 @@
</div> </div>
<div class="answer-item"> <div class="answer-item">
<div class="answer-item-label">您的答案：</div> <div class="answer-item-label">您的答案：</div>
<div class="answer-item-content">{{ correctAnswerText }}</div> <div class="answer-item-content">{{ submitAnswerText }}</div>
</div> </div>
</template> </template>
<template v-else> <template v-else>
......
src/pages/course/learn/item.vue
浏览文件 @ f4442d0f
...@@ -27,7 +27,12 @@ ...@@ -27,7 +27,12 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane v-if="examList.length" lazy label="课后习题"> <el-tab-pane v-if="examList.length" lazy label="课后习题">
<ul class="exam-list"> <ul class="exam-list">
<li v-for="item in examList" :key="item.id">{{item.name}}</li> <li v-for="item in examList" :key="item.id">
<router-link
:to="{ path: '/course/exam/chapter', query: { course_id: courseId, chapter_id: item.id,exam_id: item.resource_id } }"
>{{ item.name }}</router-link
>
</li>
</ul> </ul>
</el-tab-pane> </el-tab-pane>
<!-- <el-tab-pane lazy label="按考点学习"> <!-- <el-tab-pane lazy label="按考点学习">
...@@ -199,10 +204,10 @@ export default { ...@@ -199,10 +204,10 @@ export default {
margin-left: 20px; margin-left: 20px;
width: 300px; width: 300px;
} }
.exam-list li{ .exam-list li {
padding:5px 0; padding: 5px 0;
line-height:22px; line-height: 22px;
cursor:pointer; cursor: pointer;
&:hover { &:hover {
color: #c01540; color: #c01540;
} }
......
src/pages/exam/courseExam/chapter/index copy.vue 0 → 100644
浏览文件 @ f4442d0f
<template>
<div>
<div class="answer-box">
<div class="head" id="head-h">
<el-button icon="el-icon-arrow-left" circle @click="$router.back()"></el-button>
<div class="title">答题</div>
<div class="right">
<div class="count">{{ time.examTimeText }}</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"
@isSign="isSign"
></question>
</div>
<div class="right">
<answer-card
:questionParams="questionParams"
@isSign="isSign"
></answer-card>
</div>
</div>
<!-- @click="confirmBtn" -->
<div class="foot" id="foot-h">
<div class="exam-btn">
<!-- <div class="confirm" @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">
<div :class="questionParams.question.isCollection ? 'icon active' : 'icon'"></div>
<div class="txt">{{ questionParams.question.isCollection ? '已收藏' : '收藏' }}</div>
</div>
<div class="end-exam-btn">
<div class="btn" @click="endExam" v-if="!$route.query.id">交卷</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/exam.js'
import answerCard from '../../components/answerCard.vue'
import question from '../../components/question.vue'
export default {
components: {
question,
answerCard
},
data() {
return {
time: {
// 考试持续时间
duration: 0,
examTimeText: '00:00:00',
clearTime: null
},
// isExamTimeDate: true,
// 标记
itemSign: false,
// 设置页面高
contentHeight: 0,
// 原数据
beforeChangeData: {},
// 过滤后的数据
afterChangeData: {},
// 题的数据所需的参数
changeTime: 0,
questionParams: {
// 用户选择的选项 --- 提交后台的数据
answerRecord: {},
// 当前题的下标
questionIndex: 0,
// 所有题 和题的信息
question: {},
card: {},
beforeData: {}
}
}
},
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()
},
// 收藏试题
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(() => {
})
},
isSign(value) {
this.itemSign = value
},
// 提交考试
endExam() {
this.handlePapers(1)
},
setClock(time) {
let sec = parseInt(time)
console.log(time)
clearInterval(this.time.clearTime)
this.time.clearTime = setInterval(() => {
if (this.$route.query.id) {
this.time.examTimeText = '00:00:00'
return false
}
sec++
this.time.examTimeText = this.secondToDate(sec)
this.time.duration++
}, 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
},
addZero(i) {
return i < 10 ? '0' + i : i + ''
},
getDom(id) {
return document.getElementById(id)
},
// 改变题序
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()
this.handlePapers()
},
// 获取考卷
getTopic() {
const param = {
type: 1,
is_create: parseInt(this.$route.query.type) === 2 ? 0 : 1,
course_id: this.$route.query.course_id,
chapter_id: this.$route.query.chapter_id
}
api
.getCourseQuestion(param)
.then(response => {
const data = JSON.parse(response.data)
this.beforeChangeData = data.sheet
this.questionParams.beforeData = data.sheet
this.afterChangeData = this.setData(data.sheet.questions.question_items)
this.questionParams.card = this.setData(data.sheet.questions.question_items)
data.sheet.answers !== null && (this.questionParams.answerRecord = data.sheet.answers)
this.$route.query.id && this.$route.query.id.length > 5
? this.analysisInit()
: this.changeData()
this.setClock(data.sheet.duration || 0)
this.time.duration = data.sheet.duration || 0
})
.finally(() => {
})
},
// 重组数据
setData(data) {
let countNum = 0
const type = {
1: '单选题',
2: '多选题',
5: '案例题',
6: '判断题'
}
return data.map(item => {
return item.question_list.map(cItem => {
countNum++
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,
isCollection: cItem.isCollection
}
const qAnswer = Array.isArray(cItem.question_answer) ? cItem.question_answer : cItem.question_answer = [cItem.question_answer]
let optGroup = ''
const findAB = qAnswer.map(qOpt => {
const findIndex = cItem.question_options.findIndex(i => { return i.id === qOpt })
return this.A_Z()[findIndex]
})
data.question_analysis = cItem.question_analysis
optGroup = (findAB.sort().toString().replace(new RegExp(',', 'g'), ''))
data.question_answer = optGroup
if (parseInt(item.question_type) === 5) {
data.common_content = cItem.common_content
data.group_id = cItem.group_id
data.list = this.mergeData(item.question_list, 'group_id')
data.answer_count = cItem.answer_count
}
return data
})
})
},
// ABC
A_Z() {
const result = []
for (let i = 0; i < 26; i++) {
result.push(String.fromCharCode(65 + i))
}
return result
},
// 合并案例题
mergeData(arr, str) {
const _arr = []
let _t = []
let _tmp = null
arr.length && (_tmp = arr[0][str])
for (const i in arr) {
arr[i][str] === _tmp
? _t.push(arr[i])
: (() => {
_tmp = arr[i][str]
_arr.push(_t)
_t = [arr[i]]
})()
}
_arr.push(_t)
return _arr
},
// 点击上一题下一题 答题卡序号
changeData() {
this.afterChangeData.map(item => {
item.map(cItem => {
cItem.q_order === this.questionParams.questionIndex + 1 && (this.questionParams.question = cItem)
})
})
},
// 结果页进入设置默认点击的题
analysisInit() {
this.afterChangeData.map(item => {
const findData = item.find(datas => { return datas.id === this.$route.query.id })
if (findData) {
this.questionParams.questionIndex = findData.q_order - 1
this.questionParams.questions = findData
findData.q_order === 1 && (this.changeData())
}
})
},
// 缓存 提交
handlePapers(n) {
if (!this.$route.query.id) {
const param = {
type: 1,
sheet_id: this.beforeChangeData.id,
status: n || 0,
answers: JSON.stringify(this.questionParams.answerRecord),
duration: this.time.duration
}
api
.setCourseCache(param)
.then(response => {
if (n) {
// replace
this.$router.replace({
path: '/course/chapter/result',
query: Object.assign({}, this.$route.query, { type: 2 })
})
}
})
.finally(() => {
})
}
}
},
computed: {
changeQuestionIndex() {
return this.questionParams.questionIndex
}
},
watch: {
// 监听题的变化
changeQuestionIndex(newV, oldV) {
this.changeData()
}
}
}
</script>
<style lang="scss" scoped>
.answer-box{
width: 100%;
height: 100%;
// background: #f9f9f9;
.head{
border-bottom: 1px solid #ccc;
height: 80px;
background: #FFFFFF;
display: flex;
align-items: center;
padding-left: 40px;
.title{
padding-left: 20px;
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{
background: #fff;
flex: 1;
padding: 10px 20px 0 53px;
overflow-y: scroll;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
}
.right{
border-left: 1px solid #ccc;
position: relative;
width: 220px;
background: #fff;
padding: 0 20px;
overflow-y: scroll;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
}
}
.foot{
border-top: 1px solid #ccc;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 60px;
background: #FFFFFF;
display: flex;
align-items: center;
.exam-btn{
display: flex;
padding-left: 40px;
cursor: pointer;
.confirm{
width: 140px;
height: 40px;
background: #C01540;
border-radius: 4px;
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
line-height: 40px;
text-align: center;
}
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;
.end-exam-btn{
background: #fff;
height: 62px;
margin-top: -2px;
border-left: 1px solid #ccc;
width: 260px;
display: flex;
justify-content: center;
align-items: center;
.btn{
cursor: pointer;
width: 200px;
height: 40px;
background:#c01540;
border-radius: 4px;
font-size: 14px;
font-weight: bold;
color: #fff;
line-height: 40px;
text-align: center;
}
}
.sign{
margin-right: 20px;
margin-top: 8px;
.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>
src/pages/exam/courseExam/chapter/index.vue
浏览文件 @ f4442d0f
<template> <template>
<div> <exam-card
<div class="answer-box"> title="课后练习"
<div class="head" id="head-h"> :data="data"
<el-button icon="el-icon-arrow-left" circle @click="$router.back()"></el-button> @submitExam="handleSubmit"
<div class="title">答题</div> :hasCountDown="false"
<div class="right"> v-if="Object.keys(data).length"
<div class="count">{{ time.examTimeText }}</div> ></exam-card>
</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"
@isSign="isSign"
></question>
</div>
<div class="right">
<answer-card
:questionParams="questionParams"
@isSign="isSign"
></answer-card>
</div>
</div>
<!-- @click="confirmBtn" -->
<div class="foot" id="foot-h">
<div class="exam-btn">
<!-- <div class="confirm" @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">
<div :class="questionParams.question.isCollection ? 'icon active' : 'icon'"></div>
<div class="txt">{{ questionParams.question.isCollection ? '已收藏' : '收藏' }}</div>
</div>
<div class="end-exam-btn">
<div class="btn" @click="endExam" v-if="!$route.query.id">交卷</div>
</div>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
import * as api from '@/api/exam.js' import * as api from '@/api/exam.js'
import answerCard from '../../components/answerCard.vue' import ExamCard from '@/components/exam/examCard.vue'
import question from '../../components/question.vue'
export default { export default {
components: { components: { ExamCard },
question,
answerCard
},
data() { data() {
return { return {
time: { data: {}
// 考试持续时间
duration: 0,
examTimeText: '00:00:00',
clearTime: null
},
// isExamTimeDate: true,
// 标记
itemSign: false,
// 设置页面高
contentHeight: 0,
// 原数据
beforeChangeData: {},
// 过滤后的数据
afterChangeData: {},
// 题的数据所需的参数
changeTime: 0,
questionParams: {
// 用户选择的选项 --- 提交后台的数据
answerRecord: {},
// 当前题的下标
questionIndex: 0,
// 所有题 和题的信息
question: {},
card: {},
beforeData: {}
}
} }
}, },
mounted() { beforeMount() {
// 赋值页面高度 // 获取考卷
this.contentHeight = parseInt(document.documentElement.clientHeight - (this.getDom('head-h').offsetHeight + this.getDom('foot-h').offsetHeight))
this.getTopic() this.getTopic()
}, },
methods: { methods: {
confirmBtn() {
this.$refs.confirmBtn.answerConfirm()
},
// 收藏试题
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(() => {
})
},
isSign(value) {
this.itemSign = value
},
// 提交考试
endExam() {
this.handlePapers(1)
},
setClock(time) {
let sec = parseInt(time)
console.log(time)
clearInterval(this.time.clearTime)
this.time.clearTime = setInterval(() => {
if (this.$route.query.id) {
this.time.examTimeText = '00:00:00'
return false
}
sec++
this.time.examTimeText = this.secondToDate(sec)
this.time.duration++
}, 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
},
addZero(i) {
return i < 10 ? '0' + i : i + ''
},
getDom(id) {
return document.getElementById(id)
},
// 改变题序
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()
this.handlePapers()
},
// 获取考卷 // 获取考卷
getTopic() { getTopic() {
const query = this.$route.query
const param = { const param = {
type: 1, type: 1,
is_create: parseInt(this.$route.query.type) === 2 ? 0 : 1, is_create: parseInt(query.type) === 2 ? 0 : 1,
course_id: this.$route.query.course_id, course_id: query.course_id,
chapter_id: this.$route.query.chapter_id chapter_id: query.chapter_id,
paper_id: query.exam_id
} }
api api.getCourseQuestion(param).then(response => {
.getCourseQuestion(param) this.data = JSON.parse(response.data).sheet
.then(response => {
const data = JSON.parse(response.data)
this.beforeChangeData = data.sheet
this.questionParams.beforeData = data.sheet
this.afterChangeData = this.setData(data.sheet.questions.question_items)
this.questionParams.card = this.setData(data.sheet.questions.question_items)
data.sheet.answers !== null && (this.questionParams.answerRecord = data.sheet.answers)
this.$route.query.id && this.$route.query.id.length > 5
? this.analysisInit()
: this.changeData()
this.setClock(data.sheet.duration || 0)
this.time.duration = data.sheet.duration || 0
})
.finally(() => {
})
},
// 重组数据
setData(data) {
let countNum = 0
const type = {
1: '单选题',
2: '多选题',
5: '案例题',
6: '判断题'
}
return data.map(item => {
return item.question_list.map(cItem => {
countNum++
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,
isCollection: cItem.isCollection
}
const qAnswer = Array.isArray(cItem.question_answer) ? cItem.question_answer : cItem.question_answer = [cItem.question_answer]
let optGroup = ''
const findAB = qAnswer.map(qOpt => {
const findIndex = cItem.question_options.findIndex(i => { return i.id === qOpt })
return this.A_Z()[findIndex]
})
data.question_analysis = cItem.question_analysis
optGroup = (findAB.sort().toString().replace(new RegExp(',', 'g'), ''))
data.question_answer = optGroup
if (parseInt(item.question_type) === 5) {
data.common_content = cItem.common_content
data.group_id = cItem.group_id
data.list = this.mergeData(item.question_list, 'group_id')
data.answer_count = cItem.answer_count
}
return data
})
}) })
}, },
// ABC // 缓存答案
A_Z() { handleCache(data) {
const result = [] const params = this.genSubmitData(data)
for (let i = 0; i < 26; i++) { api.setCourseCache(Object.assign(params, { status: 0 }))
result.push(String.fromCharCode(65 + i)) },
} // 提交答案
return result handleSubmit(data) {
}, const params = this.genSubmitData(data)
// 合并案例题 api.setCourseCache(Object.assign(params, { status: 1 })).then(res => {
mergeData(arr, str) { this.$router.replace({
const _arr = [] path: '/course/chapter/result',
let _t = [] query: Object.assign({}, this.$route.query, { type: 2 })
let _tmp = null
arr.length && (_tmp = arr[0][str])
for (const i in arr) {
arr[i][str] === _tmp
? _t.push(arr[i])
: (() => {
_tmp = arr[i][str]
_arr.push(_t)
_t = [arr[i]]
})()
}
_arr.push(_t)
return _arr
},
// 点击上一题下一题 答题卡序号
changeData() {
this.afterChangeData.map(item => {
item.map(cItem => {
cItem.q_order === this.questionParams.questionIndex + 1 && (this.questionParams.question = cItem)
}) })
}) })
}, },
// 结果页进入设置默认点击的题 // 组装提交数据
analysisInit() { genSubmitData(questionList) {
this.afterChangeData.map(item => { const answers = {}
const findData = item.find(datas => { return datas.id === this.$route.query.id }) questionList.forEach(item => {
if (findData) { if (!answers[item.question_item_id]) {
this.questionParams.questionIndex = findData.q_order - 1 answers[item.question_item_id] = {}
this.questionParams.questions = findData
findData.q_order === 1 && (this.changeData())
} }
item.question_list.forEach(cItem => {
answers[item.question_item_id][cItem.id] = {
sign: cItem.sign ? cItem.sign : false,
answers: cItem.user_answer
}
})
}) })
}, return {
// 缓存 提交 type: 1,
handlePapers(n) { sheet_id: this.data.id,
if (!this.$route.query.id) { status: 0,
const param = { answers: JSON.stringify(answers),
type: 1, duration: 0
sheet_id: this.beforeChangeData.id,
status: n || 0,
answers: JSON.stringify(this.questionParams.answerRecord),
duration: this.time.duration
}
api
.setCourseCache(param)
.then(response => {
if (n) {
// replace
this.$router.replace({
path: '/course/chapter/result',
query: Object.assign({}, this.$route.query, { type: 2 })
})
}
})
.finally(() => {
})
} }
} }
},
computed: {
changeQuestionIndex() {
return this.questionParams.questionIndex
}
},
watch: {
// 监听题的变化
changeQuestionIndex(newV, oldV) {
this.changeData()
}
} }
} }
</script> </script>
<style lang="scss" scoped>
.answer-box{
width: 100%;
height: 100%;
// background: #f9f9f9;
.head{
border-bottom: 1px solid #ccc;
height: 80px;
background: #FFFFFF;
display: flex;
align-items: center;
padding-left: 40px;
.title{
padding-left: 20px;
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{
background: #fff;
flex: 1;
padding: 10px 20px 0 53px;
overflow-y: scroll;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
}
.right{
border-left: 1px solid #ccc;
position: relative;
width: 220px;
background: #fff;
padding: 0 20px;
overflow-y: scroll;
scrollbar-width: none;
&::-webkit-scrollbar {
display: none;
}
}
}
.foot{
border-top: 1px solid #ccc;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 60px;
background: #FFFFFF;
display: flex;
align-items: center;
.exam-btn{
display: flex;
padding-left: 40px;
cursor: pointer;
.confirm{
width: 140px;
height: 40px;
background: #C01540;
border-radius: 4px;
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
line-height: 40px;
text-align: center;
}
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;
.end-exam-btn{
background: #fff;
height: 62px;
margin-top: -2px;
border-left: 1px solid #ccc;
width: 260px;
display: flex;
justify-content: center;
align-items: center;
.btn{
cursor: pointer;
width: 200px;
height: 40px;
background:#c01540;
border-radius: 4px;
font-size: 14px;
font-weight: bold;
color: #fff;
line-height: 40px;
text-align: center;
}
}
.sign{
margin-right: 20px;
margin-top: 8px;
.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>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论