143 lines
4.1 KiB
Vue
143 lines
4.1 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 ">{{ $t('exam.examResultsDetails') }}</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="this.$t('exam.testQuestionsName')+':'" prop="name">
|
|
<span>{{ resultModel.examName }}</span>
|
|
</el-form-item>
|
|
<el-form-item :label="this.$t('exam.testScores')+':'" prop="score">
|
|
<span>{{ resultModel.score + ' '+ $t('exam.points') }}</span>
|
|
</el-form-item>
|
|
<el-form-item :label="this.$t('exam.whetherThrough')+':'" prop="detail">
|
|
<span v-if="resultModel.result === '01'" style="color:darkgray">{{ $t('exam.didNotCalculate') }}</span>
|
|
<span v-else-if="resultModel.result === '02'" style="color:green">{{ $t('exam.pass') }}</span>
|
|
<span v-else-if="resultModel.result === '03'" style="color:red">{{ $t('exam.notPass') }}</span>
|
|
</el-form-item>
|
|
<el-form-item :label="this.$t('exam.examTime')+':'" prop="detail">
|
|
<span>{{ Math.ceil(resultModel.usedTime/60) + ' '+ $t('global.minutes') }}</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="this.$t('exam.trainingName')" />
|
|
<el-table-column prop="score" :label="this.$t('exam.trainingScore')" />
|
|
</el-table>
|
|
</div>
|
|
</el-scrollbar>
|
|
<div style="position: relative; float: right; right: 60px; bottom: -30px;">
|
|
<el-button type="primary " @click="back">{{ $t('exam.returnToExamList') }}</el-button>
|
|
</div>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { submitExam } from '@/api/management/userexam';
|
|
import { UrlConfig } from '@/router/index';
|
|
|
|
export default {
|
|
name: 'ExamResult',
|
|
props: {
|
|
examDetails: {
|
|
type: Object,
|
|
default: null
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
resultModel: {
|
|
trainingName: '',
|
|
score: 0
|
|
},
|
|
loading: true
|
|
};
|
|
},
|
|
computed: {
|
|
height() {
|
|
return this.$store.state.app.height - 50;
|
|
}
|
|
},
|
|
mounted() {
|
|
this.submitExamData();
|
|
},
|
|
methods: {
|
|
getSummaries(param) {
|
|
const { columns, data } = param;
|
|
const sums = [];
|
|
columns.forEach((column, index) => {
|
|
if (index === 0) {
|
|
sums[index] = this.$t('exam.totalScore');
|
|
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] += this.$t('exam.points');
|
|
} 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(this.$t('error.submitExamFailed'));
|
|
}
|
|
});
|
|
}, 1000);
|
|
|
|
},
|
|
back() {
|
|
const examId = this.resultModel.examId;
|
|
this.$router.push(`${UrlConfig.trainingPlatform.examDetail}/${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>
|