146 lines
3.9 KiB
Vue
146 lines
3.9 KiB
Vue
<template>
|
|
<div v-loading="loading">
|
|
<el-card class="paper" :style="{height: height - 10 + 'px'}">
|
|
<div slot="header" style="text-align: center;">
|
|
<span style="font-weight:bold ">考试结果详情</span>
|
|
</div>
|
|
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: height - 150 + 'px'}">
|
|
<div class="context">
|
|
<el-form ref="form" :model="resultModel" size="mini">
|
|
<el-form-item label="试题名称:" prop="name">
|
|
<span>{{ resultModel.examName }}</span>
|
|
</el-form-item>
|
|
<el-form-item label="考试得分:" prop="score">
|
|
<span>{{ resultModel.score + ' 分' }}</span>
|
|
</el-form-item>
|
|
<el-form-item label="是否通过:" prop="detail">
|
|
<span v-if="resultModel.result === '01'" style="color:darkgray">未计算</span>
|
|
<span v-else-if="resultModel.result === '02'" style="color:green">通过</span>
|
|
<span v-else-if="resultModel.result === '03'" style="color:red">未通过</span>
|
|
</el-form-item>
|
|
<el-form-item label="考试用时:" prop="detail">
|
|
<span>{{ Math.ceil(resultModel.usedTime/60) + ' 分钟' }}</span>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-table
|
|
:data="resultModel.userExamQuestionsVOs"
|
|
border
|
|
style="width: 100%"
|
|
:summary-method="getSummaries"
|
|
show-summary
|
|
>
|
|
<el-table-column prop="trainingName" label="实训名称" />
|
|
<el-table-column prop="score" label="实训得分" />
|
|
</el-table>
|
|
</div>
|
|
</el-scrollbar>
|
|
<div style="position: relative; float: right; right: 60px; bottom: -30px;">
|
|
<el-button type="primary " @click="back">返回考试列表</el-button>
|
|
</div>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import WindowResizeHandler from '@/mixin/WindowResizeHandler';
|
|
import { submitExam } from '@/api/management/userexam';
|
|
import { UrlConfig } from '@/router/index';
|
|
|
|
export default {
|
|
name: 'ExamResult',
|
|
mixins: [
|
|
WindowResizeHandler
|
|
],
|
|
props: {
|
|
examDetails: {
|
|
type: Object,
|
|
default: null
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
height: '',
|
|
resultModel: {
|
|
trainingName: '',
|
|
score: 0
|
|
},
|
|
loading: true
|
|
};
|
|
},
|
|
mounted() {
|
|
this.submitExamData();
|
|
},
|
|
methods: {
|
|
resizeHandler: function () {
|
|
this.height = this._clientHeight;
|
|
},
|
|
getSummaries(param) {
|
|
const { columns, data } = param;
|
|
const sums = [];
|
|
columns.forEach((column, index) => {
|
|
if (index === 0) {
|
|
sums[index] = '总分';
|
|
return;
|
|
}
|
|
const values = data.map(item => Number(item[column.property]));
|
|
if (!values.every(value => isNaN(value))) {
|
|
sums[index] = values.reduce((prev, curr) => {
|
|
const value = Number(curr);
|
|
if (!isNaN(value)) {
|
|
return prev + curr;
|
|
} else {
|
|
return prev;
|
|
}
|
|
}, 0);
|
|
sums[index] += ' 分';
|
|
} else {
|
|
sums[index] = 'N/A';
|
|
}
|
|
});
|
|
return sums;
|
|
},
|
|
submitExamData() {
|
|
this.loading = true;
|
|
let count = 3;
|
|
const userExamId = this.$route.params.userExamId;
|
|
let interval = setInterval(() => {
|
|
submitExam(userExamId).then(response => {
|
|
this.loading = false;
|
|
this.resultModel = response.data;
|
|
clearInterval(interval);
|
|
interval = null;
|
|
}).catch(() => {
|
|
if (count-- < 0) {
|
|
this.loading = false;
|
|
clearInterval(interval);
|
|
interval = null;
|
|
this.$messageBox('自动提交考试结果失败');
|
|
}
|
|
});
|
|
}, 1000);
|
|
|
|
},
|
|
back() {
|
|
const examId = this.resultModel.examId;
|
|
this.$router.push(`${UrlConfig.exam.detail}/${examId}`);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
/deep/ {
|
|
.scrollbar-wrapper {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
}
|
|
|
|
.paper {
|
|
width: 900px;
|
|
margin: 0 auto;
|
|
border: 1px solid #F8F8F8;
|
|
}
|
|
|
|
.context {
|
|
margin: 30px 60px;
|
|
}
|
|
</style>
|