feat: 考试接口对接

This commit is contained in:
cgd_mac 2022-01-13 22:35:16 +08:00
parent 5f943d2c40
commit 103ad546cb
5 changed files with 133 additions and 56 deletions

View File

@ -1,18 +1,21 @@
<template>
<div>
<div class="sub-title">单选题</div>
<div class="options">
<a-row :gutter="[16, 16]">
<a-anchor :affix="false">
<a-col v-for="(item, index) in 12" :key="index" :span="4">
<div class="option-item flex-center" :class="{ 'option-item-active': index === 0 }">
<a-anchor-link :href="`#type1-${index}`" :title="index + 1"></a-anchor-link>
</div>
</a-col>
</a-anchor>
</a-row>
<div v-for="(item, index) in data.question" :key="index">
<div class="sub-title">{{$getCapitalizeNumber(index)}}{{$getQuestionTypeText(item.questionType)}}</div>
<div class="options">
<a-row :gutter="[16, 16]">
<a-anchor :affix="false">
<a-col v-for="(j, k) in item.questionList" :key="`${index}-${k}`" :span="4">
<div class="option-item flex-center" :class="{ 'option-item-active': j.myAnswers }">
<a-anchor-link :href="`#type${item.questionType}-${k}`" :title="k + 1"></a-anchor-link>
</div>
</a-col>
</a-anchor>
</a-row>
</div>
</div>
<div class="sub-title">多选题</div>
<!-- <div class="sub-title">多选题</div>
<div class="options">
<a-row :gutter="[16, 16]">
<a-anchor :affix="false">
@ -37,7 +40,7 @@
</a-row>
</div>
<div class="sub-title">填空题</div>
<div class="options"></div>
<div class="options"></div> -->
</div>
</template>
@ -45,7 +48,10 @@
import { Anchor } from 'ant-design-vue'
export default {
props: {
pref: Object
data: {
type: Object,
default: () => ({})
}
},
components: {
'a-anchor': Anchor,

View File

@ -7,28 +7,29 @@
倒计时:
<b style="margin-left: 5px;"><a-statistic-countdown :value="deadline" :valueStyle="{ fontSize: '16px' }" @finish="onFinish"/></b>
</div>
<DbAnswerCard :pref="$refs"></DbAnswerCard>
<DbAnswerCard :data="data"></DbAnswerCard>
<div class="answer-cart-footer flex-center">
<a-button type="primary" size="large">交卷</a-button>
<a-button @click="handlerSubmit" type="primary" size="large">交卷</a-button>
</div>
</a-card>
</div>
<div class="exam-line"></div>
<div class="exam-box">
<a-card :bordered="false" ref="question">
<div class="exam-title">建筑施工安全培训第一期课程学习(模拟考试)</div>
<div class="exam-title">{{ data.courseName }}</div>
<div class="exam-main">
<template>
<div class="sub-title">单选题共30题每题1.5共45分</div>
<div v-for="(item, index) in data.question" :key="index">
<div class="sub-title">{{ $getCapitalizeNumber(index) }}{{ $getQuestionTypeText(item.questionType) }}共30题每题1.5共45分</div>
<DbQuestionItem
:id="`type1-${index}`"
:index="index + 1"
:type="1"
v-for="(item, index) in 5"
:key="`type1-${index}`"
:id="`type${item.questionType}-${k}`"
:index="j.orderNumber"
:type="item.questionType"
:data="j"
v-for="(j, k) in item.questionList"
:key="`type${item.questionType}-${k}`"
></DbQuestionItem>
</template>
<template>
</div>
<!-- <template>
<div class="sub-title">多选题共10题每题1.5共15分</div>
<DbQuestionItem
:id="`type2-${index}`"
@ -55,7 +56,7 @@
<template>
<div class="sub-title">简答题共10题每题1.5共15分</div>
<DbQuestionItem :index="index + 1" :type="5" v-for="(item, index) in 5" :key="`type5-${index}`"></DbQuestionItem>
</template>
</template> -->
</div>
</a-card>
</div>
@ -66,20 +67,30 @@
import DbQuestionItem from '@/components/DbQuestionItem/index'
import DbAnswerCard from '@/components/DbAnswerCard/index'
export default {
props: {
data: {
type: Object,
default: () => ({})
}
},
components: {
DbQuestionItem,
DbAnswerCard
},
data() {
data () {
return {
capitalizeNumber: ['一', '二', '三', '四', '五', '六'],
deadline: Date.now() + 1000 * 60 * 60 * 1.5
}
},
methods: {
//
onFinish() {},
handlerBack(){
onFinish () {},
handlerBack () {
this.$router.go(-1)
},
handlerSubmit () {
this.$emit('submit', this.data)
}
}
}

View File

@ -1,50 +1,70 @@
<template>
<div class="question-item">
<div class="question-title">
<span>{{index || 1}}</span>
<span>({{ type | QuestionTypeFormat }})</span>
<span>{{ index || 1 }}</span>
<span>({{ $getQuestionTypeText(type) }})</span>
<span v-html="title"></span>
</div>
<div class="options-box">
<!-- 单选题选项 -->
<template v-if="type == 1">
<a-radio-group v-model="answer">
<a-radio v-for="(item, index) in options" :key="index" :style="radioStyle" :value="item.value">
<span>{{ optionKeys[index] }}</span>{{ item.label }}
</a-radio>
<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.answerB" :style="radioStyle" value="B"><span>B</span>{{ data.answerB }}</a-radio>
<a-radio v-if="data.answerC" :style="radioStyle" value="C"><span>C</span>{{ data.answerC }}</a-radio>
<a-radio v-if="data.answerD" :style="radioStyle" value="D"><span>D</span>{{ data.answerD }}</a-radio>
<a-radio v-if="data.answerE" :style="radioStyle" value="E"><span>E</span>{{ data.answerE }}</a-radio>
<a-radio v-if="data.answerF" :style="radioStyle" value="F"><span>F</span>{{ data.answerF }}</a-radio>
</a-radio-group>
</template>
<!-- 多选题选项 -->
<template v-if="type == 2">
<a-checkbox-group v-model="answer">
<a-col :span="24" v-for="(item, index) in options" :key="index">
<a-checkbox :value="item.value" :style="radioStyle">
<span>{{ optionKeys[index] }}</span>{{ item.label }}
</a-checkbox>
<a-checkbox-group v-model="data.myAnswers">
<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.answerB" value="B" :style="radioStyle"><span>B</span>{{ data.answerB }}</a-checkbox>
<a-checkbox v-if="data.answerC" value="C" :style="radioStyle"><span>C</span>{{ data.answerC }}</a-checkbox>
<a-checkbox v-if="data.answerD" value="D" :style="radioStyle"><span>D</span>{{ data.answerD }}</a-checkbox>
<a-checkbox v-if="data.answerE" value="E" :style="radioStyle"><span>E</span>{{ data.answerE }}</a-checkbox>
<a-checkbox v-if="data.answerF" value="F" :style="radioStyle"><span>F</span>{{ data.answerF }}</a-checkbox>
</a-col>
</a-checkbox-group>
</template>
<!-- 判断题选项 -->
<template v-if="type == 3">
<a-radio-group v-model="answer">
<a-radio :style="radioStyle" :value="1"> <span>A</span>正确</a-radio>
<a-radio :style="radioStyle" :value="2"> <span>B</span>错误</a-radio>
<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.answerB" :style="radioStyle" value="B"><span>B</span>{{ data.answerB }}</a-radio>
</a-radio-group>
</template>
<!-- 填空题 -->
<template v-if="type == 4">
<a-row :gutter="50" style="font-size: 14px;">
<a-col :span="12" class="flex-center" style="margin-bottom: 10px;"
><span class="flex-center nowrap">填空1:&nbsp;&nbsp;</span> <a-input placeholder="请填写答案"
<a-col
:span="12"
class="flex-center"
style="margin-bottom: 10px;"
><span class="flex-center nowrap">填空1:&nbsp;&nbsp;</span> <a-input
placeholder="请填写答案"
/></a-col>
<a-col :span="12" class="flex-center" style="margin-bottom: 10px;"
><span class="flex-center nowrap">填空2:&nbsp;&nbsp;</span> <a-input placeholder="请填写答案"
<a-col
:span="12"
class="flex-center"
style="margin-bottom: 10px;"
><span class="flex-center nowrap">填空2:&nbsp;&nbsp;</span> <a-input
placeholder="请填写答案"
/></a-col>
<a-col :span="12" class="flex-center"
><span class="flex-center nowrap">填空3:&nbsp;&nbsp;</span> <a-input placeholder="请填写答案"
<a-col
:span="12"
class="flex-center"
><span class="flex-center nowrap">填空3:&nbsp;&nbsp;</span> <a-input
placeholder="请填写答案"
/></a-col>
<a-col :span="12" class="flex-center"
><span class="flex-center nowrap">填空4:&nbsp;&nbsp;</span> <a-input placeholder="请填写答案"
<a-col
:span="12"
class="flex-center"
><span class="flex-center nowrap">填空4:&nbsp;&nbsp;</span> <a-input
placeholder="请填写答案"
/></a-col>
</a-row>
</template>
@ -62,13 +82,19 @@
<script>
export default {
props: {
index: Number, //
index: {
type: Number
}, //
type: {
type: [String, Number], // 1: , 2: , 3: , 4: , 5:
default: 1
},
data: {
type: Object,
default: () => ({})
}
},
data() {
data () {
return {
optionKeys: ['A', 'B', 'C', 'D', 'E'],
radioStyle: {
@ -101,4 +127,8 @@ export default {
.options-box {
padding-left: 30px;
}
::v-deep .ant-checkbox-wrapper + .ant-checkbox-wrapper{
margin-left: 0;
}
</style>

View File

@ -1,6 +1,30 @@
import Vue from 'vue'
import store from '@/store/index'
Vue.prototype.$getDictByCode = function(code) {
Vue.prototype.$getDictByCode = function (code) {
console.log('dictList', store)
}
Vue.prototype.$getQuestionTypeText = function (value) {
switch (Number(value)) {
case 1:
return '单选题'
case 2:
return '多选题'
case 3:
return '判断题'
case 4:
return '填空题'
case 5:
return '简答题'
default:
return '其他'
}
}
Vue.prototype.$getCapitalizeNumber = function (value) {
const capitalizeNumber = ['一', '二', '三', '四', '五', '六']
if (value || value === 0) {
return capitalizeNumber[Number(value)]
}
}

View File

@ -1,6 +1,6 @@
<template>
<div>
<DbExam :type="$route.query.type"></DbExam>
<DbExam :type="$route.query.type" :data="examData" @submit="handlerSubmit"></DbExam>
</div>
</template>
@ -11,6 +11,7 @@ export default {
components: { DbExam },
data () {
return {
examData: {},
query: {}
}
},
@ -33,7 +34,12 @@ export default {
const query = this.query
practiceStartAnswer({ projectId: Number(query.projectId), courseId: Number(query.courseId), type: Number(query.practiceType || 1) }).then(res => {
console.log('res', res)
this.examData = res.data
})
},
//
handlerSubmit (data) {
console.log('this.data', data)
}
}
}