feat: 接口对接

This commit is contained in:
cgd_mac 2022-02-22 17:53:04 +08:00
parent de5cd00958
commit f797c6a418
20 changed files with 695 additions and 309 deletions

View File

@ -9,9 +9,12 @@ const mycourseApi = {
recommendDetail: 'sys/recommend/detail', // 系统课程推荐详情 recommendDetail: 'sys/recommend/detail', // 系统课程推荐详情
getCourseDetail: 'myCourse/getCourseDetail', // 我的课程详情 getCourseDetail: 'myCourse/getCourseDetail', // 我的课程详情
getCourseCatalogue: 'myCourse/getCourseCatalogue', // 获取课程目录 getCourseCatalogue: 'myCourse/getCourseCatalogue', // 获取课程目录
reqCourseExam: 'testInClass/add', // 课中检测
simulateTestList: 'simulateTest/list', // 模拟测试列表 simulateTestList: 'simulateTest/list', // 模拟测试列表
simulateTestDetail: 'simulateTest/getQuestions', // 获取模拟测试详情 simulateTestDetail: 'simulateTest/getQuestions', // 获取模拟测试详情
operationList: 'classwork/getDetail', // 作业列表 operationList: 'classwork/list', // 作业列表
reqOperationDetail: 'classwork/get', // 作业详情
reqOperationSubmit: 'classwork/submit', // 作业提交
getMyCourseList: 'studyStatistics/getMyCourseList' // 课程学习统计 getMyCourseList: 'studyStatistics/getMyCourseList' // 课程学习统计
} }
@ -23,10 +26,26 @@ export function reqMycourseCount (params) {
}) })
} }
export function reqOperationDetail (params) {
return request({
url: mycourseApi.reqOperationDetail,
method: 'get',
params: params
})
}
export function reqOperationSubmit (params) {
return request({
url: mycourseApi.reqOperationSubmit,
method: 'post',
data: params
})
}
export function reqOperationList (params) { export function reqOperationList (params) {
return request({ return request({
url: mycourseApi.operationList, url: mycourseApi.operationList,
method: 'post', method: 'get',
params: params params: params
}) })
} }
@ -111,3 +130,12 @@ export function reqCourseCatalogue (params) {
params: params params: params
}) })
} }
export function reqCourseExam (params, data) {
return request({
url: mycourseApi.reqCourseExam,
method: 'post',
params: params,
data: data
})
}

View File

@ -6,7 +6,8 @@ const examApi = {
exam: 'exam/exam', // 我的考试进入考试 exam: 'exam/exam', // 我的考试进入考试
viewReport: 'exam/viewReport', // 查看报告 viewReport: 'exam/viewReport', // 查看报告
viewResolution: 'exam/viewResolution', // 查看解析 viewResolution: 'exam/viewResolution', // 查看解析
submit: 'exam/submit' // 交卷 submit: 'exam/submit', // 交卷
subscribe: '/exam/subscribe'
} }
export function reqExamViewResolution (data) { export function reqExamViewResolution (data) {
@ -17,6 +18,14 @@ export function reqExamViewResolution (data) {
}) })
} }
export function reqExamSubscribe (data) {
return request({
url: examApi.subscribe,
method: 'get',
params: data
})
}
export function reqExamSubmit (data) { export function reqExamSubmit (data) {
return request({ return request({
url: examApi.submit, url: examApi.submit,

View File

@ -8,7 +8,7 @@
<b style="margin-left: 5px;"><a-statistic-countdown :value="deadline" :valueStyle="{ fontSize: '16px' }" @finish="onFinish"/></b> <b style="margin-left: 5px;"><a-statistic-countdown :value="deadline" :valueStyle="{ fontSize: '16px' }" @finish="onFinish"/></b>
</div> </div>
<DbAnswerCard :data="data"></DbAnswerCard> <DbAnswerCard :data="data"></DbAnswerCard>
<div class="answer-cart-footer flex-center"> <div class="answer-cart-footer flex-center" style="margin-top: 20px;">
<a-button @click="handlerSubmit" type="primary" size="large">交卷</a-button> <a-button @click="handlerSubmit" type="primary" size="large">交卷</a-button>
</div> </div>
</a-card> </a-card>

View File

@ -3,23 +3,25 @@
<a-row> <a-row>
<a-col class="title-info"> <a-col class="title-info">
<span class="label">课程名称</span> <span class="label">课程名称</span>
<span class="value">安全培训项目第一期</span> <span class="value">{{ data.projectName }}</span>
</a-col> </a-col>
<a-col class="title-info"> <a-col class="title-info">
<span class="label">课时统计</span> <span class="label">课时统计</span>
<span class="value">10课时1/10</span> <span class="value">
{{ data.totalHours }}课时{{ data.learnedHours }}/{{ data.totalHours }}
</span>
</a-col> </a-col>
<a-col class="title-info"> <a-col class="title-info">
<span class="label">考试成绩</span> <span class="label">培训方式</span>
<span class="value">100</span> <span class="value">{{ data.trainWay | trainWayText }}</span>
</a-col> </a-col>
<a-col class="title-info"> <a-col class="title-info">
<span class="label">学习时间</span> <span class="label">开始时间</span>
<span class="value">100分钟</span> <span class="value">{{ data.startDate }}</span>
</a-col> </a-col>
<a-col class="title-info"> <a-col class="title-info">
<span class="label">学习方式</span> <span class="label">学习状态</span>
<span class="value">学习+考试</span> <span class="value">{{ data.status }}</span>
</a-col> </a-col>
</a-row> </a-row>
</div> </div>
@ -35,6 +37,28 @@ export default {
}, },
data () { data () {
return {} return {}
},
filters: {
trainWayText: function (value) {
let result = ''
switch (value) {
case '1':
result = '培训'
break
case '2':
result = '考试'
break
case '3':
result = '培训练习'
break
case '4':
result = '培训练习考试'
break
default:
break
}
return result
}
} }
} }
</script> </script>

View File

@ -2,12 +2,12 @@
<div class="question-item"> <div class="question-item">
<div class="question-title"> <div class="question-title">
<span>{{ index || 1 }}</span> <span>{{ index || 1 }}</span>
<span>({{ $getQuestionTypeText(type) }})</span> <span>({{ $getQuestionTypeText(data.questionType) }})</span>
<span v-html="data.questionName"></span> <span v-html="data.questionName"></span>
</div> </div>
<div class="options-box"> <div class="options-box">
<!-- 单选题选项 --> <!-- 单选题选项 -->
<template v-if="type == 1"> <template v-if="data.questionType == 1">
<a-radio-group v-model="data.myAnswers"> <a-radio-group v-model="data.myAnswers">
<a-radio v-if="data.answerA" :style="radioStyle" value="A"><span>A</span>{{ data.answerA }}</a-radio> <a-radio v-if="data.answerA" :style="radioStyle" value="A"><span>A</span>{{ data.answerA }}</a-radio>
<a-radio v-if="data.answerB" :style="radioStyle" value="B"><span>B</span>{{ data.answerB }}</a-radio> <a-radio v-if="data.answerB" :style="radioStyle" value="B"><span>B</span>{{ data.answerB }}</a-radio>
@ -18,7 +18,7 @@
</a-radio-group> </a-radio-group>
</template> </template>
<!-- 多选题选项 --> <!-- 多选题选项 -->
<template v-if="type == 2"> <template v-if="data.questionType == 2">
<a-checkbox-group v-model="data.myAnswers"> <a-checkbox-group v-model="data.myAnswers">
<a-col :span="24"> <a-col :span="24">
<a-checkbox v-if="data.answerA" value="A" :style="radioStyle"><span>A</span>{{ data.answerA }}</a-checkbox> <a-checkbox v-if="data.answerA" value="A" :style="radioStyle"><span>A</span>{{ data.answerA }}</a-checkbox>
@ -31,14 +31,14 @@
</a-checkbox-group> </a-checkbox-group>
</template> </template>
<!-- 判断题选项 --> <!-- 判断题选项 -->
<template v-if="type == 3"> <template v-if="data.questionType == 3">
<a-radio-group v-model="data.myAnswers"> <a-radio-group v-model="data.myAnswers">
<a-radio :style="radioStyle" value="A"><span>A</span>{{ data.answerA || '正确' }}</a-radio> <a-radio :style="radioStyle" value="A"><span>A</span>{{ data.answerA || '正确' }}</a-radio>
<a-radio :style="radioStyle" value="B"><span>B</span>{{ data.answerB || '错误' }}</a-radio> <a-radio :style="radioStyle" value="B"><span>B</span>{{ data.answerB || '错误' }}</a-radio>
</a-radio-group> </a-radio-group>
</template> </template>
<!-- 填空题 --> <!-- 填空题 -->
<template v-if="type == 4"> <template v-if="data.questionType == 4">
<a-row :gutter="50" style="font-size: 14px;"> <a-row :gutter="50" style="font-size: 14px;">
<a-col <a-col
:span="12" :span="12"
@ -69,7 +69,7 @@
</a-row> </a-row>
</template> </template>
<!-- 简单题 --> <!-- 简单题 -->
<template v-if="type == 5"> <template v-if="data.questionType == 5">
<div style="font-size: 14px;padding-bottom: 5px;">答案区:</div> <div style="font-size: 14px;padding-bottom: 5px;">答案区:</div>
<a-row> <a-row>
<a-textarea placeholder="请填写答案" :rows="4" /> <a-textarea placeholder="请填写答案" :rows="4" />
@ -85,10 +85,6 @@ export default {
index: { index: {
type: Number, type: Number,
default: 0 default: 0
}, //
type: {
type: [String, Number], // 1: , 2: , 3: , 4: , 5:
default: 1
}, },
data: { data: {
type: Object, type: Object,
@ -131,5 +127,6 @@ export default {
::v-deep .ant-checkbox-wrapper + .ant-checkbox-wrapper{ ::v-deep .ant-checkbox-wrapper + .ant-checkbox-wrapper{
margin-left: 0; margin-left: 0;
height: auto !important;
} }
</style> </style>

View File

@ -5,10 +5,18 @@
<a-card title="得分统计" :bordered="false"> <a-card title="得分统计" :bordered="false">
<a-row :gutter="30" style="margin: 15px 0;"> <a-row :gutter="30" style="margin: 15px 0;">
<a-col :span="12" class="flex-center"> <a-col :span="12" class="flex-center">
<a-progress type="circle" :percent="score/totalScore * 100" :format="percent => `${percent} 分`" /> <a-progress
type="circle"
:percent="data.score / (data.totalScore * 100)"
:format="percent => `${percent} 分`"
/>
</a-col> </a-col>
<a-col class="count-info" :span="12"> <a-col class="count-info" :span="12">
<div>{{ data.totalQuestions }}道题答对{{ data.rightQuestions }}总用时{{ data.answerTime }}分钟</div> <div>
{{ data.totalQuestions }}道题答对{{ data.rightQuestions }}总用时{{
data.answerTime
}}分钟
</div>
<div>已击败考生{{ data.beat }}%的考生</div> <div>已击败考生{{ data.beat }}%的考生</div>
<div>全站平均得分{{ data.avgScore }}</div> <div>全站平均得分{{ data.avgScore }}</div>
</a-col> </a-col>
@ -28,12 +36,17 @@
<a-col :span="24" style="margin-top: 15px;"> <a-col :span="24" style="margin-top: 15px;">
<a-card title="答题卡" :bordered="false"> <a-card title="答题卡" :bordered="false">
<ul class="answer-box"> <ul class="answer-box">
<li class="flex-center" v-for="(item, index) in data.reportItems" :key="index">{{ index+1 }}</li> <li
:class="['flex-center', {'is-right': item.answerType === 1}]"
v-for="(item, index) in data.reportItems"
:key="index"
>
{{ index + 1 }}
</li>
</ul> </ul>
</a-card> </a-card>
</a-col> </a-col>
</a-row> </a-row>
</div> </div>
</template> </template>
@ -80,11 +93,11 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
::v-deep .ant-card-head{ ::v-deep .ant-card-head {
padding-left: 0 !important; padding-left: 0 !important;
} }
.count-info{ .count-info {
font-weight: bold; font-weight: bold;
color: #333; color: #333;
line-height: 2; line-height: 2;
@ -94,17 +107,20 @@ export default {
height: 112px; height: 112px;
} }
.answer-box{ .answer-box {
display: grid; display: grid;
grid-template-columns: repeat(18, 1fr); grid-template-columns: repeat(18, 1fr);
grid-template-rows: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr);
grid-column-gap: 10px; grid-column-gap: 10px;
grid-row-gap: 10px; grid-row-gap: 10px;
padding: 0; padding: 0;
li{ li {
background: red; background: red;
color: #fff; color: #fff;
height: 60px; height: 60px;
} }
.is-right{
background: green;
}
} }
</style> </style>

View File

@ -27,7 +27,7 @@
</div> </div>
</template> </template>
<div class="flex-center"> <div class="flex-center">
<a-pagination @change="(page, size) =>{changePaginatio(page, size, 'record')}" :default-current="wrongInfo.pageNum" :total="wrongInfo.total" /> <a-pagination @change="(page, size) =>{changePaginatio(page, size, 'wrong')}" :default-current="wrongInfo.pageNum" :total="wrongInfo.total" />
</div> </div>
</template> </template>
<a-empty style="margin: 30px 0;" v-else /> <a-empty style="margin: 30px 0;" v-else />
@ -47,7 +47,7 @@
</div> </div>
</a-card> </a-card>
<div class="flex-center"> <div class="flex-center">
<a-pagination @change="(page, size) =>{changePaginatio(page, size, 'wrong')}" :default-current="recordInfo.pageNum" :total="recordInfo.total" /> <a-pagination @change="(page, size) =>{changePaginatio(page, size, 'record')}" :default-current="recordInfo.pageNum" :total="recordInfo.total" />
</div> </div>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>

View File

@ -2,16 +2,39 @@
<div class="CourseCatalogue-box"> <div class="CourseCatalogue-box">
<ul class="list-box"> <ul class="list-box">
<li class="list-item" v-for="(item, index) in catalogueList" :key="index"> <li class="list-item" v-for="(item, index) in catalogueList" :key="index">
<div class="list-item-title"><span style="margin-right: 10px;">{{ capitalizeNumber[index] }}</span>{{ item.name }}</div> <div class="list-item-title">
<span style="margin-right: 10px;">{{ capitalizeNumber[index] }}</span>
{{ item.name }}
</div>
<ul class="sub-list"> <ul class="sub-list">
<li @click="handlerItem(j, item)" class="sub-list-item" v-for="(j, k) in item.courseList" :key="`${index}-${k}`"> <li
<div class="sub-item-info"> @click="handlerItem(j, item)"
<VideoOne theme="filled" fill="#ccc" style="margin-right: 6px;" size="1.2em"></VideoOne>{{index+1}}.{{k+1}} class="sub-list-item"
{{item.name}} v-for="(j, k) in item.courseList"
:key="`${index}-${k}`"
>
<div
:class="[
'sub-item-info',
{ 'sub-item-info-success': j.status === 1 },
{
'sub-item-info-active': j.id === curVideo.id,
},
]"
>
<VideoOne
theme="filled"
:fill="j.id === curVideo.id ? '#1890ff' : j.status === 1 ? '#26bd71' : '#ccc'"
style="margin-right: 6px;"
size="1.2em"
></VideoOne>
{{ index + 1 }}.{{ k + 1 }}
{{ j.name }}
</div> </div>
<!-- 0-未学 1-已学 --> <!-- 0-未学 1-已学 -->
<div v-if="`${index}-${k}` === selectedId" class="sub-item-status"> <div v-if="j.id === curVideo.id" class="sub-item-status">
正在学习中<History 正在学习中
<History
theme="filled" theme="filled"
tyle="margin-left: 10px;" tyle="margin-left: 10px;"
size="1.2em" size="1.2em"
@ -19,7 +42,12 @@
></History> ></History>
</div> </div>
<div v-else class="sub-item-status"> <div v-else class="sub-item-status">
<Round theme="filled" strokeWidth="6" fill="#666" style="margin-left: 10px;"></Round> <Round
theme="filled"
strokeWidth="6"
:fill="j.status === 1 ? '#26bd71' : '#666'"
style="margin-left: 10px;"
></Round>
</div> </div>
</li> </li>
</ul> </ul>
@ -35,15 +63,20 @@ export default {
props: { props: {
catalogueList: { catalogueList: {
type: Array, type: Array,
default: () => ([]) default: () => []
},
curVideo: {
type: Object,
default: () => ({})
} }
}, },
data () { data () {
return { return {
capitalizeNumber: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一'], capitalizeNumber: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一'],
selectedId: '1-1' data: []
} }
}, },
mounted () {},
methods: { methods: {
handlerItem (item, pItem) { handlerItem (item, pItem) {
this.$emit('changeVideo', { item, pItem }) this.$emit('changeVideo', { item, pItem })
@ -101,6 +134,14 @@ export default {
line-height: 2; line-height: 2;
} }
.sub-item-info-active {
color: #1890ff !important;
}
.sub-item-info-success {
color: #26bd71;
}
.sub-item-status { .sub-item-status {
flex: 0 0 200px; flex: 0 0 200px;
font-size: 12px; font-size: 12px;

View File

@ -1,32 +1,98 @@
<template> <template>
<a-modal title="课中检查" :visible="visible" :confirm-loading="confirmLoading" :footer="null" :closable="false"> <a-modal
<DbQuestionItem></DbQuestionItem> title="课中检查"
:visible="visible"
:confirm-loading="confirmLoading"
:footer="null"
:closable="false"
>
<DbQuestionItem :data="data"></DbQuestionItem>
<div class="text-center margin-top"> <div class="text-center margin-top">
<a-button type="primary" @click="handlerSubmit">提交</a-button> <a-button type="primary" @click="handlerSubmit">提交</a-button>
</div> </div>
<p class="tip-info margin-top"> <p class="tip-info margin-top">
注意每段课程学习完成后都会随机出现1道小题答对题目方可继续下一部分学习您有2次机会否则之前上一小段学习时间不计算学时需要重新学习 注意每段课程学习完成后都会随机出现1道小题答对题目方可继续下一部分学习您有{{
chance
}}次机会否则之前上一小段学习时间不计算学时需要重新学习
</p> </p>
</a-modal> </a-modal>
</template> </template>
<script> <script>
import DbQuestionItem from '@/components/DbQuestionItem/index.vue' import DbQuestionItem from '@/components/DbQuestionItem/index.vue'
import { reqCourseExam } from '@/api/mycourse/index.js'
export default { export default {
components: { DbQuestionItem }, components: { DbQuestionItem },
props: {
curVideo: {
type: Object,
default: () => ({})
}
},
data () { data () {
return { return {
visible: false, visible: false,
confirmLoading: false confirmLoading: false,
chance: 2, // 2
data: {} //
} }
}, },
methods: { methods: {
show(){ show () {
this.chance = 2
this.visible = true this.visible = true
}, },
//
getExamQuestion () {
const curVideo = this.curVideo
const query = this.$route.query
const { person } = this.$store.state.user
const params = {
courseId: curVideo.courseId,
coursewareId: curVideo.id,
personId: person.id,
projectId: query.courseId,
count: ''
}
reqCourseExam(params).then(res => {
this.data = res.data
})
},
handlerSubmit () { handlerSubmit () {
// //
this.visible = false const curVideo = this.curVideo
const { person } = this.$store.state.user
const query = this.$route.query
const question = { ...this.data }
if (Array.isArray(question.myAnswers)) {
question.myAnswerList = question.myAnswers
question.myAnswers = question.myAnswers && question.myAnswers.join(',')
} else {
question.myAnswerList = question.myAnswers && question.myAnswers.split(',')
}
const params = {
courseId: curVideo.courseId,
coursewareId: curVideo.id,
personId: person.id,
projectId: query.courseId,
count: ''
}
reqCourseExam(params, question).then(res => {
// this.data = res.data
const data = res.data
if (res.correctness) {
this.$message.success('恭喜你,回答正确!')
this.visible = false
} else {
if (this.chance === 1) {
this.visible = false
} else {
this.data = data
}
this.$message.warning('很遗憾,回答错误!')
this.chance--
}
})
} }
} }
} }

View File

@ -1,15 +1,23 @@
<template> <template>
<div> <div>
<template v-if="dataList && dataList.length>0"> <a-row style="margin-bottom: 20px;">
<a-button @click="handlerExam" type="primary">写作业</a-button>
</a-row>
<template v-if="dataList && dataList.length > 0">
<a-card v-for="(item, index) in dataList" :key="index" style="margin-bottom: 15px;"> <a-card v-for="(item, index) in dataList" :key="index" style="margin-bottom: 15px;">
<div class="flex-center" > <div class="flex-center">
<div style="flex: 1;"> <div style="flex: 1;">
<h3>{{ item.name }}</h3> <h3>{{ item.name }}</h3>
<div><span style="margin-right: 20px;">提交时间{{ item.submitTime }}</span><span>出题范围{{ item.questionScope }}</span></div> <div>
<span style="margin-right: 20px;">提交时间{{ item.submitTime }}</span>
<span>出题范围{{ item.rangeOfQuestions }}</span>
</div>
</div> </div>
<div style="flex: 0 0 200px; text-align: right;"> <div style="flex: 0 0 200px; text-align: right;">
<div @click="handlerDetail(item)" :span="24" style="margin-bottom: 10px;"><a-button type="primary" size="small" >查看详情</a-button></div> <div @click="handlerDetail(item)" :span="24" style="margin-bottom: 10px;">
<!-- <div @click="handlerPreview(item)" :span="24"><a-button type="danger" size="small">预览</a-button></div> --> <a-button type="primary" size="small">查看详情</a-button>
</div>
<!-- <div @click="handlerPreview(item)" :span="24"><a-button type="danger" size="small">预览</a-button></div> -->
</div> </div>
</div> </div>
</a-card> </a-card>
@ -18,7 +26,6 @@
<a-empty style="margin: 30px 0;" description="暂无相关作业" /> <a-empty style="margin: 30px 0;" description="暂无相关作业" />
</template> </template>
</div> </div>
</template> </template>
<script> <script>
@ -36,17 +43,29 @@ export default {
methods: { methods: {
getList () { getList () {
const { person } = this.$store.state.user const { person } = this.$store.state.user
reqOperationList({ personId: person.id, projectId: this.$route.query.courseId }).then(res => { reqOperationList({
this.dataList = res.data personId: person.id,
projectId: this.$route.query.courseId,
pageSize: 99999,
pageNum: 1
}).then(res => {
this.dataList = res.rows
}) })
}, },
handlerDetail () { handlerExam () {
this.$router.push({
path: '/myexamDetail',
query: { type: 'operation', projectId: this.$route.query.courseId, practiceType: 4 }
})
},
handlerDetail (data) {
this.$router.push({
path: '/myreport',
query: { type: 'operation', reportId: data.id, practiceType: 4 }
})
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped></style>
</style>

View File

@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<DbLearnCount></DbLearnCount> <DbLearnCount :data="data"></DbLearnCount>
</div> </div>
</template> </template>
@ -9,6 +9,12 @@ import DbLearnCount from '@/components/DbLearnCount/index'
import { reqMycourseCount } from '@/api/mycourse/index' import { reqMycourseCount } from '@/api/mycourse/index'
export default { export default {
components: { DbLearnCount }, components: { DbLearnCount },
props: {
courseInfo: {
type: Object,
default: () => ({})
}
},
data () { data () {
return { return {
data: {} data: {}
@ -28,6 +34,4 @@ export default {
} }
</script> </script>
<style> <style></style>
</style>

View File

@ -9,6 +9,7 @@
:options="playerOptions" :options="playerOptions"
:playsinline="true" :playsinline="true"
@ended="onPlayerEnded($event)" @ended="onPlayerEnded($event)"
@timeupdate="onPlayerTimeupdate"
></video-player> ></video-player>
</div> </div>
</div> </div>
@ -16,7 +17,11 @@
<a-tabs :default-active-key="activeTab" @change="tabChange"> <a-tabs :default-active-key="activeTab" @change="tabChange">
<a-tab-pane key="1" tab="课程目录"> <a-tab-pane key="1" tab="课程目录">
<div class="tab-box"> <div class="tab-box">
<CourseCatalogue @changeVideo="changeVideo" :catalogueList="catalogueList"></CourseCatalogue> <CourseCatalogue
@changeVideo="changeVideo"
:catalogueList="catalogueList"
:curVideo="curVideo"
></CourseCatalogue>
</div> </div>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2" tab="模拟测试"> <a-tab-pane key="2" tab="模拟测试">
@ -31,13 +36,13 @@
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="4" tab="学习统计"> <a-tab-pane key="4" tab="学习统计">
<div class="tab-box"> <div class="tab-box">
<StatisticalLearning></StatisticalLearning> <StatisticalLearning :courseInfo="courseInfo"></StatisticalLearning>
</div> </div>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
</div> </div>
<!-- 课中考试 --> <!-- 课中考试 -->
<ExamDialog ref="examDialog"></ExamDialog> <ExamDialog ref="examDialog" :curVideo="curVideo"></ExamDialog>
</a-card> </a-card>
</template> </template>
@ -53,40 +58,26 @@ import StatisticalLearning from './StatisticalLearning.vue'
import { reqCourseDetail, reqCourseCatalogue } from '@/api/mycourse/index' import { reqCourseDetail, reqCourseCatalogue } from '@/api/mycourse/index'
export default { export default {
components: { CourseCatalogue, OperationModule, SimulationTest, ExamDialog, StatisticalLearning, videoPlayer }, components: {
CourseCatalogue,
OperationModule,
SimulationTest,
ExamDialog,
StatisticalLearning,
videoPlayer
},
data () { data () {
return { return {
activeTab: '1', activeTab: '1',
query: {}, query: {},
courseInfo: {}, courseInfo: {},
catalogueList: [], // catalogueList: [], //
playerOptions: { curVideo: {}, //
height: '360', playerOptions: {},
autoplay: false, isMousedown: false,
muted: false, oldTime: 0,
language: 'zh-CN', newTime: 0,
sources: [ maxTime: 0
{
type: 'video/mp4',
src: 'http://vjs.zencdn.net/v/oceans.mp4'
}
],
controlBar: {
/* 使用children的形式可以控制每一个控件的位置以及显示与否 */
children: [
{ name: 'playToggle' }, //
{ name: 'currentTimeDisplay' }, //
{ name: 'progressControl' }, //
// { name: 'durationDisplay' }, //
{
name: 'volumePanel', //
inline: false // 使
},
{ name: 'FullscreenToggle' } //
]
},
poster: 'https://surmon-china.github.io/vue-quill-editor/static/images/surmon-1.jpg'
}
} }
}, },
mounted () { mounted () {
@ -97,28 +88,121 @@ export default {
methods: { methods: {
initData () { initData () {
const { person } = this.$store.state.user const { person } = this.$store.state.user
//
reqCourseDetail({ personId: person.id, id: this.query.courseId }).then(res => { reqCourseDetail({ personId: person.id, id: this.query.courseId }).then(res => {
console.log('课程详情', res)
this.courseInfo = res.data this.courseInfo = res.data
}) })
//
reqCourseCatalogue({ personId: person.id, projectId: this.query.courseId }).then(res => { reqCourseCatalogue({ personId: person.id, projectId: this.query.courseId }).then(res => {
console.log('课程目录', res) const data = res.data
this.catalogueList = res.data let videoList = []
if (Array.isArray(data)) {
data.map(item => {
videoList = [...videoList, ...item.courseList]
if (Array.isArray(item.courseList)) {
item.courseList.map(j => {
j.courseId = item.id
})
}
})
}
const selected = videoList[0] || ''
if (selected) {
this.curVideo = selected
this.playerOptions = {
height: '360',
autoplay: false,
muted: false,
language: 'zh-CN',
sources: [
{
type: 'video/mp4',
src: selected.videoAddress
}
],
controlBar: {
/* 使用children的形式可以控制每一个控件的位置以及显示与否 */
children: [
{ name: 'playToggle' }, //
{ name: 'currentTimeDisplay' }, //
{ name: 'progressControl' }, //
{ name: 'durationDisplay' }, //
{
name: 'volumePanel', //
inline: false // 使
},
{ name: 'FullscreenToggle' } //
]
},
poster: selected.coverPath
}
}
this.catalogueList = data
}) })
}, },
//
changeVideo ({ item, pItem }) { changeVideo ({ item, pItem }) {
console.log('item', item) const _this = this
this.$refs.videoPlayer.player.src('http://a.3a6.cn' + item.videoAddress) const vid = this.$refs.videoPlayer.player
const change = function () {
_this.curVideo = item
vid.src(item.videoAddress)
vid.play()
_this.openCourseExam() //
}
if (this.oldTime > 0) {
this.$confirm({
title: '确定要切换学习视频吗?',
content: '一但切换学习视频,您现在正在学习的视频学时将清0,确定要切换吗?',
onOk () {
change()
},
onCancel () {}
})
} else {
change()
}
}, },
tabChange (key) { tabChange (key) {
console.log('key', key)
// this.$refs.videoPlayer.player.play() // // this.$refs.videoPlayer.player.play() //
// this.$refs.videoPlayer.player.pause() // // this.$refs.videoPlayer.player.pause() //
// this.$refs.videoPlayer.player.src('src') // // this.$refs.videoPlayer.player.src('src') //
}, },
// //
onPlayerEnded () { onPlayerEnded () {
this.$refs.examDialog.show() console.log('播放完毕')
this.openCourseExam()
},
//
openCourseExam () {
const _this = this
const curVideo = this.curVideo
if (curVideo.status === 1) return
this.$confirm({
title: '课中检查',
content:
'课程学习完成后都会随机出现1道小题答对题目方可继续下一部分学习您有2次机会。否则之前上一小段学习时间不计算学时需要重新学习!',
onOk () {
_this.$refs.examDialog.show()
_this.$refs.examDialog.getExamQuestion()
},
onCancel () {}
})
},
//
onPlayerTimeupdate () {
const { oldTime, maxTime } = this
const vd = this.$refs.videoPlayer.player
var current = vd.currentTime()
if (current < maxTime) {
} else if (current - oldTime > 1) {
vd.currentTime(oldTime)
} else {
this.oldTime = current
if (oldTime >= maxTime) {
this.maxTime = oldTime
}
}
} }
} }
} }

View File

@ -1,26 +1,14 @@
<template> <template>
<a-card <a-card :bordered="false" :loading="loading">
:bordered="false"
:loading="loading"
>
<a-row :gutter="16"> <a-row :gutter="16">
<a-col <a-col :span="6" :md="4" :sm="6" v-for="(item, index) in dataList" :key="index">
:span="6" <a-card @click="handlerItem(item)" hoverable style="width: 100%; margin-bottom: 15px;">
:md="4" <img slot="cover" alt="example" :src="item.coverImage" />
:sm="6"
v-for="(item, index) in 8"
:key="index">
<a-card hoverable style="width: 100%; margin-bottom: 15px;">
<img
slot="cover"
alt="example"
src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
/>
<div> <div>
<h4>建筑安全施工生产注意事项</h4> <h4>{{ item.projectName }}</h4>
<div class="flex-center justify-between"> <div class="flex-center justify-between">
<div>课时: 24小时</div> <div>课时: {{ item.totalCourseHours }}小时</div>
<div>选修课</div> <div>{{ item.trainType === 1 ? '必修课' : '选修课' }}</div>
</div> </div>
</div> </div>
</a-card> </a-card>
@ -32,26 +20,30 @@
<script> <script>
import { reqRecommendList } from '@/api/mycourse/index' import { reqRecommendList } from '@/api/mycourse/index'
export default { export default {
components: { components: {},
}, data () {
data () { return {
return {
dataList: [], dataList: [],
loading: true loading: true
} }
}, },
mounted () { mounted () {
this.initData() this.initData()
}, },
methods: { methods: {
initData () { initData () {
reqRecommendList({ pageSize: 20, pageNum: 1 }).then(res => { reqRecommendList({ pageSize: 20, pageNum: 1 }).then(res => {
this.dataList = res.rows this.dataList = res.rows
this.loading = false this.loading = false
}) })
},
handlerItem (data) {
this.$router.push({
path: '/mycourse/courseLearn',
query: { courseId: data.id }
})
} }
}
}
} }
</script> </script>

View File

@ -51,7 +51,7 @@
<a>添加课程</a> <a>添加课程</a>
</a-popconfirm> </a-popconfirm>
<a v-if="record.status === 1" @click="handlerContinue(record)">继续学习</a> <a v-if="record.status === 1" @click="handlerContinue(record)">继续学习</a>
<a v-if="record.status === 2">已完成学习</a> <a v-if="record.status === 2" @click="handlerContinue(record)">已完成学习</a>
</span> </span>
</s-table> </s-table>
<MycourseDetail ref="aycourseDetail"></MycourseDetail> <MycourseDetail ref="aycourseDetail"></MycourseDetail>

View File

@ -1,8 +1,5 @@
<template> <template>
<a-card <a-card :bordered="false" :loading="loading">
:bordered="false"
:loading="loading"
>
<a-tabs :default-active-key="activeTab" @change="tabChange"> <a-tabs :default-active-key="activeTab" @change="tabChange">
<a-tab-pane key="1" tab="年度培训计划"> <a-tab-pane key="1" tab="年度培训计划">
<s-table <s-table
@ -10,7 +7,12 @@
:pageSize="5" :pageSize="5"
:columns="columns" :columns="columns"
:data="loadDataYear" :data="loadDataYear"
:rowKey="record => record.id"> :rowKey="record => record.id"
>
<span slot="trainType" slot-scope="text, record">
<a-tag v-if="record.trainType === 1" color="red">必修课</a-tag>
<a-tag v-if="record.trainType === 2" color="blue">选修课</a-tag>
</span>
<span slot="action" slot-scope="text, record"> <span slot="action" slot-scope="text, record">
<a-popconfirm <a-popconfirm
v-if="record.status === 1" v-if="record.status === 1"
@ -32,7 +34,12 @@
:pageSize="5" :pageSize="5"
:columns="columns" :columns="columns"
:data="loadDataUnit" :data="loadDataUnit"
:rowKey="record => record.id"> :rowKey="record => record.id"
>
<span slot="trainType" slot-scope="text, record">
<a-tag v-if="record.trainType === 1" color="red">必修课</a-tag>
<a-tag v-if="record.trainType === 2" color="blue">选修课</a-tag>
</span>
<span slot="action" slot-scope="text, record"> <span slot="action" slot-scope="text, record">
<a-popconfirm <a-popconfirm
v-if="record.status === 1" v-if="record.status === 1"
@ -59,26 +66,27 @@ export default {
components: { components: {
STable STable
}, },
data () { data () {
return { return {
dataListYear: [], dataListYear: [],
dataListUnit: [], dataListUnit: [],
activeTab: '1', activeTab: '1',
loading: true, loading: true,
// //
columns: [ columns: [
{ {
title: '课程名称', title: '课程名称',
dataIndex: 'courseName', dataIndex: 'name',
scopedSlots: { customRender: 'courseName' } scopedSlots: { customRender: 'courseName' }
}, },
{ {
title: '课程类别', title: '课程类别',
dataIndex: 'courseTypeName' dataIndex: 'trainType',
scopedSlots: { customRender: 'trainType' }
}, },
{ {
title: '学习时间', title: '学习时间',
dataIndex: 'date' dataIndex: 'totalCourseHours'
}, },
{ {
title: '操作', title: '操作',
@ -90,24 +98,28 @@ export default {
// Promise // Promise
loadDataYear: parameter => { loadDataYear: parameter => {
const { person } = this.$store.state.user const { person } = this.$store.state.user
return reqMyCourseList({ personId: person.id, type: 2, pageNum: 1, pageSize: 5 }).then(res => { return reqMyCourseList({ personId: person.id, type: 2, pageNum: 1, pageSize: 5 }).then(
return res res => {
}) return res
}
)
}, },
loadDataUnit: parameter => { loadDataUnit: parameter => {
const { person } = this.$store.state.user const { person } = this.$store.state.user
return reqMyCourseList({ personId: person.id, type: 3, pageNum: 1, pageSize: 5 }).then(res => { return reqMyCourseList({ personId: person.id, type: 3, pageNum: 1, pageSize: 5 }).then(
return res res => {
}) return res
}
)
} }
} }
}, },
mounted () { mounted () {
setTimeout(() => { setTimeout(() => {
this.loading = false this.loading = false
}, 800) }, 800)
}, },
methods: { methods: {
tabChange (key) { tabChange (key) {
console.log('key', key) console.log('key', key)
if (key == 1) { if (key == 1) {
@ -117,7 +129,7 @@ export default {
this.$refs.unitTable.refresh() this.$refs.unitTable.refresh()
} }
}, },
// //
handlerDetail () { handlerDetail () {
this.$refs.aycourseDetail.visible = true this.$refs.aycourseDetail.visible = true
}, },
@ -127,8 +139,7 @@ export default {
handlerContinue (row) { handlerContinue (row) {
this.$emit('continue', { row: row }) this.$emit('continue', { row: row })
} }
}
}
} }
</script> </script>

View File

@ -6,17 +6,17 @@
</a-card> </a-card>
<br /> <br />
<a-card title="培训计划" :bodyStyle="{padding: '0px !important'}"> <a-card title="培训计划" :bodyStyle="{padding: '0px !important'}">
<a slot="extra" href="#">查看更多</a> <!-- <a slot="extra" href="#">查看更多</a> -->
<TrainingPlan @add="handlerAddCourse" @continue="handlerContinue"></TrainingPlan> <TrainingPlan @add="handlerAddCourse" @continue="handlerContinue"></TrainingPlan>
</a-card> </a-card>
<br /> <br />
<a-card title="集中培训" :bodyStyle="{padding: '0px !important'}"> <a-card title="集中培训" :bodyStyle="{padding: '0px !important'}">
<a slot="extra" href="#">查看更多</a> <!-- <a slot="extra" href="#">查看更多</a> -->
<CentralizedTraining></CentralizedTraining> <CentralizedTraining></CentralizedTraining>
</a-card> </a-card>
<br /> <br />
<a-card title="系统推荐课程" :bodyStyle="{padding: '0px !important'}"> <a-card title="系统推荐课程" :bodyStyle="{padding: '0px !important'}">
<a slot="extra" href="#">查看更多</a> <!-- <a slot="extra" href="#">查看更多</a> -->
<CourseRecommendation></CourseRecommendation> <CourseRecommendation></CourseRecommendation>
</a-card> </a-card>
</a-card> </a-card>

View File

@ -25,8 +25,10 @@
{{ index + 1 }} {{ index + 1 }}
</span> </span>
<template slot="testType" slot-scope="text, record"> <template slot="testType" slot-scope="text, record">
<a-tag v-if="record.testType == '1'" color="red">必修课</a-tag> <a-tag v-if="record.testType == '1'" color="red">线上</a-tag>
<a-tag v-if="record.testType == '2'" color="blue">选修课</a-tag> </template>
<template slot="zige" slot-scope="text, record">
<a-tag color="blue">学完后考试</a-tag>
</template> </template>
<template slot="examTime" slot-scope="text, record"> <template slot="examTime" slot-scope="text, record">
{{ record.examTime }}分钟 {{ record.examTime }}分钟
@ -36,7 +38,9 @@
<a disabled>预约考试</a> <a disabled>预约考试</a>
</template> </template>
<template v-else> <template v-else>
<a @click="handlerGoExam(record)">进入考试</a> <a v-if="record.subscribeStatus === 1 && record.sAttend === 0" @click="handlerMarker(record)">预约考试</a>
<a v-if="record.isAttend === 1 || record.examState === 3" @click="handlerGoReport(record)">查看详情</a>
<a v-if="record.subscribeStatus === 1 || record.isAttendStatus === 3" @click="handlerGoExam(record)">进入考试</a>
</template> </template>
</span> </span>
</s-table> </s-table>
@ -52,14 +56,19 @@
{{ index + 1 }} {{ index + 1 }}
</span> </span>
<template slot="testType" slot-scope="text, record"> <template slot="testType" slot-scope="text, record">
<a-tag v-if="record.testType == '1'" color="red">必修课</a-tag> <a-tag v-if="record.testType == '1'" color="red">线上</a-tag>
<a-tag v-if="record.testType == '2'" color="blue">选修课</a-tag> </template>
<template slot="zige" slot-scope="text, record">
<a-tag color="blue">学完后考试</a-tag>
</template> </template>
<template slot="examTime" slot-scope="text, record"> <template slot="examTime" slot-scope="text, record">
{{ record.examTime }}分钟 {{ record.examTime }}分钟
</template> </template>
<span slot="action" slot-scope="text, record"> <span slot="action" slot-scope="text, record">
<a @click="handlerGoReport(record)">查看详情</a> <a v-if="record.isAttendStatus === 1" @click="handlerGoReport(record)">预约考试</a>
<template v-else>
<a @click="handlerGoReport(record)">查看详情</a>
</template>
</span> </span>
</s-table> </s-table>
</a-tab-pane> </a-tab-pane>
@ -69,7 +78,7 @@
<script> <script>
import { STable, SearchCom } from '@/components' import { STable, SearchCom } from '@/components'
import { reqExamList, reqExamAttendList } from '@/api/myexam/exam' import { reqExamList, reqExamAttendList, reqExamSubscribe } from '@/api/myexam/exam'
export default { export default {
components: { STable, SearchCom }, components: { STable, SearchCom },
@ -114,7 +123,8 @@ export default {
}, },
{ {
title: '考试资格', title: '考试资格',
dataIndex: 'zige' dataIndex: 'zige',
scopedSlots: { customRender: 'zige' }
}, },
{ {
title: '操作', title: '操作',
@ -187,6 +197,21 @@ export default {
this.$refs.examDoneColumns.refresh() this.$refs.examDoneColumns.refresh()
} }
}, },
//
handlerMarker (data) {
const _this = this
this.$confirm({
title: '提示',
content: '确定要预约考试吗?',
onOk () {
reqExamSubscribe({ projectId: data.id }).then(res => {
this.$message.success('预约成功!')
_this.handleRefresh()
})
},
onCancel () {}
})
},
handlerGoExam (row) { handlerGoExam (row) {
// 5(...) // 5(...)
// const diff = new Date().getTime() - new Date(examSdate).getTime() // const diff = new Date().getTime() - new Date(examSdate).getTime()

View File

@ -191,7 +191,7 @@ export default {
} }
}, },
handlerDetail (row) { handlerDetail (row) {
this.$router.push({ path: '/myresult', query: { id: row.id } }) this.$router.push({ path: '/mycourse/courseLearn', query: { courseId: row.courseId } })
} }
} }
} }

View File

@ -8,131 +8,173 @@
import DbExam from '@/components/DbExam/index' import DbExam from '@/components/DbExam/index'
import { practiceStartAnswer, practiceExecuteSubmit } from '@/api/practice/practice' import { practiceStartAnswer, practiceExecuteSubmit } from '@/api/practice/practice'
import { reqExamExam, reqExamSubmit } from '@/api/myexam/exam.js' import { reqExamExam, reqExamSubmit } from '@/api/myexam/exam.js'
import { reqSimulateTestDetail } from '@/api/mycourse/index' import {
reqSimulateTestDetail,
reqOperationDetail,
reqOperationSubmit
} from '@/api/mycourse/index'
import _ from 'lodash' import _ from 'lodash'
export default { export default {
components: { DbExam }, components: { DbExam },
data () { data () {
return { return {
examData: {}, examData: {},
query: {} query: {}
}
},
mounted () {
this.query = this.$route.query
this.$nextTick(() => {
this.initData()
})
},
methods: {
initData () {
const { type } = this.query
if (type === 'practice') {
this.getPracticeDetail()
}
if (type === 'exam') {
this.getExamDetail()
}
if (type === 'test') {
this.getTestDetail()
}
if (type === 'operation') {
this.getOperationDetail()
} }
}, },
mounted () { //
this.query = this.$route.query getOperationDetail () {
this.$nextTick(() => { const query = this.query
this.initData() const { person } = this.$store.state.user
reqOperationDetail({ projectId: Number(query.projectId), personId: person.id }).then(res => {
this.examData = res.data
}) })
}, },
methods: { //
initData () { getTestDetail () {
const { type } = this.query const query = this.query
if (type === 'practice') { const { person } = this.$store.state.user
this.getPracticeDetail() reqSimulateTestDetail({ projectId: Number(query.projectId), personId: person.id }).then(
} res => {
if (type === 'exam') {
this.getExamDetail()
}
if (type === 'test') {
this.getTestDetail()
}
},
//
getTestDetail () {
const query = this.query
const { person } = this.$store.state.user
reqSimulateTestDetail({ projectId: Number(query.projectId), personId: person.id }).then(res => {
this.examData = res.data this.examData = res.data
})
},
//
getPracticeDetail () {
const query = this.query
practiceStartAnswer({ projectId: Number(query.projectId), courseId: Number(query.courseId), type: Number(query.practiceType || 1) }).then(res => {
this.examData = res.data
})
},
//
getExamDetail () {
const { person } = this.$store.state.user
reqExamExam({ personId: person.id, projectId: this.query.projectId }).then((res) => {
this.examData = res.data
})
},
//
handlerSubmit (result) {
const { type } = this.query
if (type === 'practice') {
this.submitPractice(result)
} }
if (type === 'exam') { )
this.submitExam(result) },
} //
}, getPracticeDetail () {
// const query = this.query
formatSubmit (result) { practiceStartAnswer({
const data = { ...result } projectId: Number(query.projectId),
const allQuestion = [] courseId: Number(query.courseId),
const question = data.question type: Number(query.practiceType || 1)
if (question && question.length > 0) { }).then(res => {
question.map(item => { this.examData = res.data
if (item.questionList && item.questionList.length > 0) { })
item.questionList.map(j => { },
let myAnswers = j.myAnswers //
// const myAnswers = j.myAnswers getExamDetail () {
// if (item.type != 2 && _.isArray(myAnswers)) { const { person } = this.$store.state.user
// myAnswers = myAnswers.join(',') reqExamExam({ personId: person.id, projectId: this.query.projectId }).then(res => {
// } this.examData = res.data
if (['1', '3'].indexOf(item.questionType) !== -1 && myAnswers) { })
console.log('item.type', item.questionType) },
myAnswers = [myAnswers] //
} handlerSubmit (result) {
allQuestion.push({ const { type } = this.query
...j, if (type === 'practice' || type === 'operation') {
questionId: j.questionId, this.submitPractice(result)
answerTime: 0, }
myAnswerList: myAnswers if (type === 'exam') {
}) this.submitExam(result)
}
// if (type === 'operation') {
// this.submitOperation(result)
// }
},
//
formatSubmit (result) {
const data = { ...result }
const allQuestion = []
const question = data.question
if (question && question.length > 0) {
question.map(item => {
if (item.questionList && item.questionList.length > 0) {
item.questionList.map(j => {
let myAnswers = j.myAnswers
// const myAnswers = j.myAnswers
// if (item.type != 2 && _.isArray(myAnswers)) {
// myAnswers = myAnswers.join(',')
// }
if (Array.isArray(myAnswers)) {
} else {
myAnswers = [myAnswers]
}
// if (['1', '3'].indexOf(item.questionType) !== -1 && myAnswers) {
// console.log('item.type', item.questionType)
// myAnswers = [myAnswers]
// }
allQuestion.push({
...j,
questionId: j.questionId,
answerTime: 0,
myAnswers: myAnswers,
myAnswerList: myAnswers
}) })
} })
}) }
}
return allQuestion
},
//
submitPractice (result) {
const query = this.query
const params = {
projectId: query.projectId,
courseId: query.courseId,
answerTime: 0,
type: query.practiceType,
questionList: this.formatSubmit(result)
}
practiceExecuteSubmit(params).then(() => {
this.$message.success('交卷成功!')
this.$router.go(-1)
})
},
//
submitExam (result) {
const query = this.query
const params = {
projectId: query.projectId,
courseId: query.courseId,
answerTime: 0,
type: query.practiceType,
questionList: this.formatSubmit(result)
}
reqExamSubmit(params).then(() => {
this.$message.success('交卷成功!')
this.$router.go(-1)
}) })
} }
return allQuestion
},
//
submitOperation (result) {
const query = this.query
const params = {
projectId: query.projectId,
courseId: query.courseId,
answerTime: 0,
type: query.practiceType,
questionList: this.formatSubmit(result)
}
reqOperationSubmit(params).then(() => {
this.$message.success('交卷成功!')
this.$router.go(-1)
})
},
//
submitPractice (result) {
const query = this.query
const params = {
projectId: query.projectId,
courseId: query.courseId,
answerTime: 0,
type: query.practiceType,
questionList: this.formatSubmit(result)
}
practiceExecuteSubmit(params).then(() => {
this.$message.success('交卷成功!')
this.$router.go(-1)
})
},
//
submitExam (result) {
const query = this.query
const params = {
projectId: query.projectId,
courseId: query.courseId,
answerTime: 0,
type: query.practiceType,
questionList: this.formatSubmit(result)
}
reqExamSubmit(params).then(() => {
this.$message.success('交卷成功!')
this.$router.go(-1)
})
} }
}
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped></style>
</style>

View File

@ -2,23 +2,34 @@
<a-card :bordered="false"> <a-card :bordered="false">
<a-tabs v-if="query.type" :default-active-key="query.type"> <a-tabs v-if="query.type" :default-active-key="query.type">
<a-tab-pane key="1" tab="答题报告"> <a-tab-pane key="1" tab="答题报告">
<a-card :bordered="false" :bodyStyle="{padding: '0px !important'}" :headStyle="{paddingLeft: '0px !important'}"> <a-card
:bordered="false"
:bodyStyle="{ padding: '0px !important' }"
:headStyle="{ paddingLeft: '0px !important' }"
>
<template slot="title"> <template slot="title">
<h3>{{ viewReport.courseName }}</h3> <h3>{{ viewReport.courseName }}</h3>
<div class="sub-info"><span>交卷时间{{ viewReport.submitTime }}</span><span v-if="viewReport.totalScore">答题用时{{ viewReport.totalScore }}</span></div> <div class="sub-info">
<span>交卷时间{{ viewReport.submitTime }}</span>
<span v-if="viewReport.totalScore">答题用时{{ viewReport.totalScore }}</span>
</div>
<DbReport :data="viewReport"></DbReport> <DbReport :data="viewReport"></DbReport>
</template> </template>
</a-card> </a-card>
</a-tab-pane> </a-tab-pane>
<a-tab-pane key="2" tab="查看解析"> <a-tab-pane key="2" tab="查看解析">
<a-card :bordered="false" :bodyStyle="{padding: '0px !important'}" :headStyle="{paddingLeft: '0px !important'}"> <a-card
:bordered="false"
:bodyStyle="{ padding: '0px !important' }"
:headStyle="{ paddingLeft: '0px !important' }"
>
<template slot="title"> <template slot="title">
<h4>{{ viewReport.courseName }}</h4> <h4>{{ viewReport.courseName }}</h4>
<!-- <div class="sub-info"><span>选择题30/30</span><span>选择题30/30</span><span>选择题30/30</span></div> --> <!-- <div class="sub-info"><span>选择题30/30</span><span>选择题30/30</span><span>选择题30/30</span></div> -->
</template> </template>
<template v-for="(item, index) in viewResolution" > <template v-for="(item, index) in questionList">
<div :key="index"> <div :key="index">
<DbQuestionInfoItem :data="item" :questionIndex="index+1" ></DbQuestionInfoItem> <DbQuestionInfoItem :data="item" :questionIndex="index + 1"></DbQuestionInfoItem>
<a-divider></a-divider> <a-divider></a-divider>
</div> </div>
</template> </template>
@ -41,33 +52,42 @@ export default {
query: {}, query: {},
activeTab: '', activeTab: '',
viewReport: {}, // viewReport: {}, //
questionList: [],
viewResolution: [] // viewResolution: [] //
} }
}, },
mounted () { mounted () {
const query = this.$route.query const query = this.$route.query
this.query = query this.query = query
if (query.type === 'practice') { // if (query.type === 'practice') {
this.getAnswerViewReport() this.getAnswerViewReport()
this.getAnswerViewResolution() this.getAnswerViewResolution()
} // }
if (query.type === 'exam') { // if (query.type === 'exam') {
this.getExamViewReport() // this.getExamViewReport()
this.getExamViewResolution() // this.getExamViewResolution()
} // }
}, },
methods: { methods: {
// start // start
getExamViewReport () { // getExamViewReport () {
reqExamViewReport({ projectId: this.query.reportId }).then(res => { // reqExamViewReport({ projectId: this.query.reportId }).then(res => {
this.viewReport = res.data // this.viewReport = res.data
}) // })
}, // },
getExamViewResolution () { // getExamViewResolution () {
reqExamViewResolution({ projectId: this.query.reportId }).then(res => { // reqExamViewResolution({ projectId: this.query.reportId }).then(res => {
this.viewResolution = res.data // const data = res.data
}) // let list = []
}, // if (Array.isArray(data)) {
// data.map(item => {
// list = [...list, ...data.questionList]
// })
// }
// console.log('list', list)
// this.viewResolution = list
// })
// },
// start // start
getAnswerViewReport () { getAnswerViewReport () {
answerViewReport({ reportId: Number(this.query.reportId) }).then(res => { answerViewReport({ reportId: Number(this.query.reportId) }).then(res => {
@ -76,7 +96,16 @@ export default {
}, },
getAnswerViewResolution () { getAnswerViewResolution () {
answerViewResolution({ reportId: Number(this.query.reportId) }).then(res => { answerViewResolution({ reportId: Number(this.query.reportId) }).then(res => {
const data = res.data.question
let list = []
if (Array.isArray(data)) {
data.map(item => {
list = [...list, ...item.questionList]
})
}
console.log('list', list)
this.viewResolution = res.data this.viewResolution = res.data
this.questionList = list
}) })
} }
} }
@ -84,10 +113,9 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.sub-info{ .sub-info {
color: #666; color: #666;
font-weight: normal; font-weight: normal;
font-size: 14px; font-size: 14px;
} }
</style> </style>