考试点击实训参数调整
This commit is contained in:
fan
parent
4fbc4900e3
commit
9e4b499399
@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div class="examPanel" v-if="show">
|
||||
<div class="header">
|
||||
<div>满分: {{ composition.fullScore }}</div>
|
||||
<div>考试时间: {{ composition.validDuration }}分钟</div>
|
||||
</div>
|
||||
<!-- <div class="legend-area">
|
||||
<div v-if="show" class="examPanel">
|
||||
<div class="header">
|
||||
<div>满分: {{ composition.fullScore }}</div>
|
||||
<div>考试时间: {{ composition.validDuration }}分钟</div>
|
||||
</div>
|
||||
<!-- <div class="legend-area">
|
||||
<div class="legend">
|
||||
<div class="box finished"></div>
|
||||
<div class="text">已作答</div>
|
||||
@ -14,130 +14,130 @@
|
||||
<div class="text">未作答</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div>理论题</div>
|
||||
<div class="questionList">
|
||||
<div
|
||||
class="item theory"
|
||||
v-for="(question, index) in questionList[0]"
|
||||
:key="index"
|
||||
@click="questionSelect(index, 1)"
|
||||
:class="{
|
||||
current: currentQuestionIndex === index && currentQuestionType === 1,
|
||||
submited: questionStateList[0][index],
|
||||
}"
|
||||
>
|
||||
{{ index + 1 }}
|
||||
</div>
|
||||
</div>
|
||||
<div>实训题</div>
|
||||
<div class="questionList">
|
||||
<div
|
||||
class="item training"
|
||||
v-for="(question, index) in questionList[1]"
|
||||
:key="index"
|
||||
@click="questionSelect(index, 2)"
|
||||
:class="{ current: currentQuestionIndex === index && currentQuestionType === 2 }"
|
||||
>
|
||||
{{ index + 1 }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<el-button @click="submitExam" size="small" type="primary">交卷</el-button>
|
||||
</div>
|
||||
<TheoryQuestion
|
||||
ref="theoryQuestion"
|
||||
:question-info="
|
||||
questionList[0][currentQuestionIndex]
|
||||
? {
|
||||
...questionList[0][currentQuestionIndex],
|
||||
index: currentQuestionIndex,
|
||||
total: questionList[0].length,
|
||||
}
|
||||
: {}
|
||||
"
|
||||
@submit="recordSubmit"
|
||||
@navigate="navigate"
|
||||
/>
|
||||
</div>
|
||||
<div>理论题</div>
|
||||
<div class="questionList">
|
||||
<div
|
||||
v-for="(question, index) in questionList[0]"
|
||||
:key="index"
|
||||
class="item theory"
|
||||
:class="{
|
||||
current: currentQuestionIndex === index && currentQuestionType === 1,
|
||||
submited: questionStateList[0][index],
|
||||
}"
|
||||
@click="questionSelect(index, 1)"
|
||||
>
|
||||
{{ index + 1 }}
|
||||
</div>
|
||||
</div>
|
||||
<div>实训题</div>
|
||||
<div class="questionList">
|
||||
<div
|
||||
v-for="(question, index) in questionList[1]"
|
||||
:key="index"
|
||||
class="item training"
|
||||
:class="{ current: currentQuestionIndex === index && currentQuestionType === 2 }"
|
||||
@click="questionSelect(index, 2)"
|
||||
>
|
||||
{{ index + 1 }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<el-button size="small" type="primary" @click="submitExam">交卷</el-button>
|
||||
</div>
|
||||
<TheoryQuestion
|
||||
ref="theoryQuestion"
|
||||
:question-info="
|
||||
questionList[currentQuestionType][currentQuestionIndex]
|
||||
? {
|
||||
...questionList[currentQuestionType][currentQuestionIndex],
|
||||
index: currentQuestionIndex,
|
||||
total: questionList[currentQuestionType].length,
|
||||
}
|
||||
: {}
|
||||
"
|
||||
@submit="recordSubmit"
|
||||
@navigate="navigate"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TheoryQuestion from './theoryQuestion'
|
||||
import { submitPaper } from '@/api/management/exam'
|
||||
import TheoryQuestion from './theoryQuestion';
|
||||
import { submitPaper } from '@/api/management/exam';
|
||||
export default {
|
||||
name: 'ExamPanel',
|
||||
emits: ['select'],
|
||||
components: { TheoryQuestion },
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
composition: {},
|
||||
paper: {},
|
||||
questionList: [[], []],
|
||||
questionStateList: [[], []],
|
||||
currentQuestionIndex: 0,
|
||||
currentQuestionType: 0, //1-理论, 2-实训
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init(data) {
|
||||
this.show = true
|
||||
this.currentQuestionIndex = -1
|
||||
this.composition = data.composition
|
||||
this.paper = data.paper
|
||||
this.questionList = [
|
||||
data.questionList.filter(e => e.type === 1),
|
||||
data.questionList.filter(e => e.type === 2),
|
||||
]
|
||||
this.questionStateList = [
|
||||
Array.from(this.questionList[0], () => false),
|
||||
Array.from(this.questionList[1], () => false),
|
||||
]
|
||||
},
|
||||
questionSelect(index, type) {
|
||||
this.currentQuestionIndex = index
|
||||
this.currentQuestionType = type
|
||||
if (type === 1) {
|
||||
this.$refs.theoryQuestion.doShow()
|
||||
}
|
||||
},
|
||||
recordSubmit(index) {
|
||||
this.$set(this.questionStateList[0], index, true)
|
||||
},
|
||||
navigate(direction) {
|
||||
if (direction === '+') {
|
||||
this.currentQuestionIndex++
|
||||
} else if (direction === '-') {
|
||||
this.currentQuestionIndex--
|
||||
}
|
||||
},
|
||||
submitExam() {
|
||||
const execSubmit = () => {
|
||||
submitPaper(this.paper.id).then(resp => {
|
||||
const { score, passScore, commonScore, trainingScore } = resp.data
|
||||
const pass = score >= passScore
|
||||
this.$alert(
|
||||
`${pass ? '恭喜您考试合格' : '考试不通过'}
|
||||
name: 'ExamPanel',
|
||||
emits: ['select'],
|
||||
components: { TheoryQuestion },
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
composition: {},
|
||||
paper: {},
|
||||
questionList: [[], []],
|
||||
questionStateList: [[], []],
|
||||
currentQuestionIndex: 0,
|
||||
currentQuestionType: 0 // 1-理论, 2-实训
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
init(data) {
|
||||
this.show = true;
|
||||
this.currentQuestionIndex = -1;
|
||||
this.composition = data.composition;
|
||||
this.paper = data.paper;
|
||||
this.questionList = [
|
||||
data.questionList.filter(e => e.type === 1),
|
||||
data.questionList.filter(e => e.type === 2)
|
||||
];
|
||||
this.questionStateList = [
|
||||
Array.from(this.questionList[0], () => false),
|
||||
Array.from(this.questionList[1], () => false)
|
||||
];
|
||||
},
|
||||
questionSelect(index, type) {
|
||||
this.currentQuestionIndex = index;
|
||||
this.currentQuestionType = type;
|
||||
if (type === 1) {
|
||||
this.$refs.theoryQuestion.doShow();
|
||||
}
|
||||
},
|
||||
recordSubmit(index) {
|
||||
this.$set(this.questionStateList[0], index, true);
|
||||
},
|
||||
navigate(direction) {
|
||||
if (direction === '+') {
|
||||
this.currentQuestionIndex++;
|
||||
} else if (direction === '-') {
|
||||
this.currentQuestionIndex--;
|
||||
}
|
||||
},
|
||||
submitExam() {
|
||||
const execSubmit = () => {
|
||||
submitPaper(this.paper.id).then(resp => {
|
||||
const { score, passScore, commonScore, trainingScore } = resp.data;
|
||||
const pass = score >= passScore;
|
||||
this.$alert(
|
||||
`${pass ? '恭喜您考试合格' : '考试不通过'}
|
||||
总分: ${score}
|
||||
理论: ${commonScore}
|
||||
实训: ${trainingScore}`,
|
||||
'考试结果'
|
||||
).then(() => {
|
||||
this.show = false
|
||||
})
|
||||
})
|
||||
}
|
||||
const finished = this.questionStateList.every(list => list.every(item => item === true))
|
||||
if (!finished) {
|
||||
this.$confirm('您还有题目未答完, 确认交卷吗?').then(() => {
|
||||
execSubmit()
|
||||
})
|
||||
} else {
|
||||
execSubmit()
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
'考试结果'
|
||||
).then(() => {
|
||||
this.show = false;
|
||||
});
|
||||
});
|
||||
};
|
||||
const finished = this.questionStateList.every(list => list.every(item => item === true));
|
||||
if (!finished) {
|
||||
this.$confirm('您还有题目未答完, 确认交卷吗?').then(() => {
|
||||
execSubmit();
|
||||
});
|
||||
} else {
|
||||
execSubmit();
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -1,130 +1,131 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="`第 ${index + 1} 题`"
|
||||
:visible.sync="show"
|
||||
width="860px"
|
||||
:close-on-click-modal="false"
|
||||
:before-close="doClose"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="questionTitle">[{{ questionData.typeString }}] {{ questionData.title }}</div>
|
||||
<div class="options">
|
||||
<component
|
||||
:is="type === 2 ? 'el-checkbox-group' : 'el-radio-group'"
|
||||
v-model="questionData.answer"
|
||||
class="options-container"
|
||||
>
|
||||
<component
|
||||
class="option"
|
||||
:is="type === 2 ? 'el-checkbox' : 'el-radio'"
|
||||
v-for="el in questionData.options"
|
||||
:key="el.value"
|
||||
:label="el.value"
|
||||
>{{ el.label }}</component
|
||||
>
|
||||
</component>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<el-button size="small" :disabled="index === 0" @click="navigate('-')">上一题</el-button>
|
||||
<el-button type="danger" size="small" @click="navigate()">关闭</el-button>
|
||||
<el-button size="small" :disabled="index >= questionInfo.total - 1" @click="navigate('+')"
|
||||
>下一题</el-button
|
||||
>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="`第 ${index + 1} 题`"
|
||||
:visible.sync="show"
|
||||
width="860px"
|
||||
:close-on-click-modal="false"
|
||||
:before-close="doClose"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="questionTitle">[{{ questionData.typeString }}] {{ questionData.title }}</div>
|
||||
<div class="options">
|
||||
<component
|
||||
:is="type === 2 ? 'el-checkbox-group' : 'el-radio-group'"
|
||||
v-model="questionData.answer"
|
||||
class="options-container"
|
||||
>
|
||||
<component
|
||||
:is="type === 2 ? 'el-checkbox' : 'el-radio'"
|
||||
v-for="el in questionData.options"
|
||||
:key="el.value"
|
||||
class="option"
|
||||
:label="el.value"
|
||||
>{{ el.label }}</component>
|
||||
</component>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<el-button size="small" :disabled="index === 0" @click="navigate('-')">上一题</el-button>
|
||||
<el-button type="danger" size="small" @click="navigate()">关闭</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
:disabled="index >= questionInfo.total - 1"
|
||||
@click="navigate('+')"
|
||||
>下一题</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const types = ['', '单选题', '多选题', '判断题']
|
||||
import { loadQuestion, submitAnswer } from '@/api/management/exam'
|
||||
const types = ['', '单选题', '多选题', '判断题'];
|
||||
import { loadQuestion, submitAnswer } from '@/api/management/exam';
|
||||
export default {
|
||||
name: 'theoryQuestion',
|
||||
emits: ['submit'],
|
||||
props: {
|
||||
questionInfo: {
|
||||
type: Object,
|
||||
require: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
type: 0,
|
||||
questionData: {
|
||||
title: '',
|
||||
typeString: '',
|
||||
options: [],
|
||||
answer: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
index() {
|
||||
return this.questionInfo.index
|
||||
},
|
||||
puId() {
|
||||
return this.questionInfo.puId
|
||||
},
|
||||
questionId() {
|
||||
return this.questionInfo.questionId
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
index() {
|
||||
if (this.questionId && this.questionInfo.puId) {
|
||||
this.loadQuestion()
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
doShow() {
|
||||
this.show = true
|
||||
},
|
||||
loadQuestion() {
|
||||
loadQuestion({ /* 理论题 */ type: 1, questionId: this.questionId, puId: this.questionInfo.puId }).then(
|
||||
resp => {
|
||||
const data = resp.data.common
|
||||
this.questionData = {
|
||||
title: data.question,
|
||||
typeString: types[data.type],
|
||||
options: data.optionList.map(opt => ({ label: opt.content, value: opt.id })),
|
||||
answer: data.type === 2 ? [] : NaN,
|
||||
}
|
||||
this.type = data.type
|
||||
if (resp.data.tmpAnswer) {
|
||||
const tmpAnswer = resp.data.tmpAnswer.split(',').map(s => Number(s))
|
||||
this.questionData.answer = data.type === 2 ? tmpAnswer : tmpAnswer[0]
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
doClose() {
|
||||
this.show = false
|
||||
},
|
||||
submit() {
|
||||
const data = {
|
||||
puId: this.puId,
|
||||
pqId: this.questionId,
|
||||
type: 1,
|
||||
subType: this.type,
|
||||
answer: this.type === 2 ? this.questionData.answer : [this.questionData.answer],
|
||||
}
|
||||
submitAnswer(data).then(resp => {
|
||||
// console.log(resp)
|
||||
})
|
||||
},
|
||||
navigate(direction) {
|
||||
const selected = this.type === 2 ? !!this.questionData.answer.length : !isNaN(this.questionData.answer)
|
||||
if (selected) {
|
||||
this.submit()
|
||||
this.$emit('submit', this.index, direction)
|
||||
}
|
||||
this.$emit('navigate', direction)
|
||||
if (!direction) this.doClose()
|
||||
},
|
||||
},
|
||||
}
|
||||
name: 'TheoryQuestion',
|
||||
emits: ['submit'],
|
||||
props: {
|
||||
questionInfo: {
|
||||
type: Object,
|
||||
require: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
type: 0,
|
||||
questionData: {
|
||||
title: '',
|
||||
typeString: '',
|
||||
options: [],
|
||||
answer: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
index() {
|
||||
return this.questionInfo.index;
|
||||
},
|
||||
puId() {
|
||||
return this.questionInfo.puId;
|
||||
},
|
||||
questionId() {
|
||||
return this.questionInfo.questionId;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
index() {
|
||||
if (this.questionId && this.questionInfo.puId) {
|
||||
this.loadQuestion();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow() {
|
||||
this.show = true;
|
||||
},
|
||||
loadQuestion() {
|
||||
loadQuestion({ /* 理论题 */ type: this.questionInfo.type, questionId: this.questionId, puId: this.questionInfo.puId }).then(
|
||||
resp => {
|
||||
const data = resp.data.common;
|
||||
this.questionData = {
|
||||
title: data.question,
|
||||
typeString: types[data.type],
|
||||
options: data.optionList.map(opt => ({ label: opt.content, value: opt.id })),
|
||||
answer: data.type === 2 ? [] : NaN
|
||||
};
|
||||
this.type = data.type;
|
||||
if (resp.data.tmpAnswer) {
|
||||
const tmpAnswer = resp.data.tmpAnswer.split(',').map(s => Number(s));
|
||||
this.questionData.answer = data.type === 2 ? tmpAnswer : tmpAnswer[0];
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
doClose() {
|
||||
this.show = false;
|
||||
},
|
||||
submit() {
|
||||
const data = {
|
||||
puId: this.puId,
|
||||
pqId: this.questionId,
|
||||
type: 1,
|
||||
subType: this.type,
|
||||
answer: this.type === 2 ? this.questionData.answer : [this.questionData.answer]
|
||||
};
|
||||
submitAnswer(data).then(resp => {
|
||||
// console.log(resp)
|
||||
});
|
||||
},
|
||||
navigate(direction) {
|
||||
const selected = this.type === 2 ? !!this.questionData.answer.length : !isNaN(this.questionData.answer);
|
||||
if (selected) {
|
||||
this.submit();
|
||||
this.$emit('submit', this.index, direction);
|
||||
}
|
||||
this.$emit('navigate', direction);
|
||||
if (!direction) this.doClose();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user