lingling
/
welfare-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/components/DbAnswerCard/index.vue
View File

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

43
src/components/DbExam/index.vue
View File

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

78
src/components/DbQuestionItem/index.vue
View File

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

26
src/utils/prototype.js vendored
View File

@ -1,6 +1,30 @@
import Vue from 'vue' import Vue from 'vue'
import store from '@/store/index' import store from '@/store/index'
Vue.prototype.$getDictByCode = function(code) { Vue.prototype.$getDictByCode = function (code) {
console.log('dictList', store) 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)]
}
}

8
src/views/myexamDetail/index.vue
View File

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