factory_mp_old/pages/exam/result.vue

108 lines
2.4 KiB
Vue

<template>
<view>
<image v-if="currentExam.is_pass" class="examImage" :src="imageSrcPass" mode="aspectFit"></image>
<image v-else class="examImage" :src="imageSrc" mode="aspectFit"></image>
<view v-if="currentExam.is_pass" class="finishText">恭喜您完成考试!</view>
<view v-else class="finishText">很遗憾,本次考试您未达标!</view>
<view class="finishText">
<view><text>{{currentExam.name}}</text></view>
<view>总分:<text>{{currentExam.paper_total_score}}</text>分</view>
<view>得分:<text>{{currentExam.score}}</text> 分 </view>
</view>
<view class="btnArea">
<!-- <u-button class="btnClass" type="primary" :ripple="true" shape="circle" @click="goDetail">查看答卷</u-button> -->
<u-button class="btnClass" type="primary" :ripple="true" shape="circle" @click="backToHome">返回首页</u-button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
imageSrcPass: '/static/exam/cross.png',
imageSrc: '/static/exam/error.png',
currentExam:{}
}
},
methods: {
goDetail(){
this.$u.api.examRecordDetail(this.currentExam.id).then(res=>{
uni.hideLoading()
uni.setStorageSync('currentExam', res.data);
debugger;
if (res.data.questions_.length>0){
uni.navigateTo({
url:'/pages/exam/detail?examrecord='+res.data.id
})
}
else{
uni.showToast({
title:'获取失败',
icon:'none'
})
return
}
}).catch(e=>{
})
},
backToHome(){
uni.reLaunch({
url:'/pages/exam/exam'
})
}
},
onLoad(options){
this.currentExam = uni.getStorageSync('currentExam');
},
beforeRouteUpdate(){
uni.removeStorageSync('currentExam');
},
}
</script>
<style lang="scss" scoped>
.examImage {
width: 200rpx;
justify-content: center;
margin-top: 100rpx;
height: 200rpx;
margin: auto;
display: block;
margin-top: 100rpx;
}
.finishText {
// margin: 100rpx 200rpx;
padding: 50rpx;
letter-spacing: 0.2em;
font-size: 32rpx;
display: flex;
flex-direction: column;
align-items: center;
text {
color: #2979ff;
font-weight: bold;
}
}
.btnArea {
display: flex;
margin-top: 50rpx;
justify-content: center;
align-items: center;
.btnClass {
width: 300rpx;
}
}
.infoArea {
display: flex;
flex-direction: column;
justify-content: center;
}
</style>