learning-system-mobile/components/course-exam/course-exam.vue

<template>
	<view>
		<u-toast ref="messager"></u-toast>
		<view v-if="has" class="paperinfo">
			<view class="paperinfo-item">
				<u-cell-group :border="false">
					<u-cell :border="false" icon="/static/images/icon/exam-duration.png" title="考试时长" :value="info.testDuration+'分钟'"></u-cell>
					<u-cell :border="false" icon="/static/images/icon/exam-times.png" title="考试次数" :value="allowTimes"></u-cell>
					<u-cell :border="false" icon="/static/images/icon/exam-score.png" title="及格线" :value="info.passLine"></u-cell>
					<u-cell :border="false" v-if="studyItemId!=''" title="考试成绩" :value="lastScore"></u-cell>
					<!--应该再显示最终成绩，最高一次或最后一次得分-->
				</u-cell-group>
			</view>
			<view v-if="info.info" style="padding: 40upx;color: #333333;">
				{{info.info}}
			</view>
			<view style="padding: 20px;">
				<u-button @click="startTest" type="primary" text="开始考试"></u-button> 
			</view>
			<!--考试记录-->
			<view>
				<view class="endurance" v-for="(item,idx) in records" :key="idx" @click="toExamDetail(item)">
					<view class="exam-time">提交时间：{{item.lastTime}}</view>
					<view class="endurance-cen">
						<view>
							<view style="display: flex;margin-top: 9px;">
								<view class="schedule">考试成绩:</view>
								<view class="schscore">{{item.score}}分</view>
							</view>
							<view style="display: flex;margin-top: 6px;">
								<view class="patiently">考试用时</view>
								<view class="patientlys" style="">{{item.testDuration}}秒</view>
							</view>
						</view>
						<view>
							<view class="endurance-btn"><text>查看试卷</text> </view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view v-else style="text-align: center;color: #ff0000;padding-top: 20px; ">
			此课程没有考试
		</view>
	</view>
</template>

<script>
	import apiStudy from '@/api/modules/courseStudy.js';
	import apiCourse from '@/api/modules/course.js';
	import {formatDate,getQuestionType,correctJudgment,numberToLetter} from '@/utils/tools.js';
	export default {
	  props:{
	      studyId: {
	        type: String,
	      },
		  courseType:{
			type:Number,
			required:true
		  },
	      showRecord:{
	        type:Boolean,
	        default:true
	      },
	      showSubmit:{
	        type:Boolean,
	        default:true
	      },
	      content: {
	        type: Object,
	        default:()=>{}
	      }
	  },
	  data() {
	    return {
	      correctJudgment:correctJudgment,
	      show:0,
		  toLetter:numberToLetter,
	      testType:getQuestionType,
		  allowTimes:'无限制',
	      has:true,
	      startTime:null,
	      testStart: false,
	      info:{},
	      paper:[],
		  lastScore:0,//最终得分
	      studyItemId:'',
	      records:[] ,//考试记录
	      allowSubmit:true,//是否允许考试，尝试次数达到后不能再考试
	    };
	  },
	  mounted() {
	    this.loadExamInfo();
		this.loadRecord();
	  },
	  watch:{
		  content(newObj){
			  this.loadExamInfo();
			  this.loadRecord();
		  },
		  deep:true
	  },
	  methods: {
	    loadExamInfo(){
	        apiCourse.getExam(this.content.id).then(res=>{
	            if(res.status==200){
					if(res.result.times>0){
						this.allowTimes=res.result.times;
					}
					this.info=res.result;
	            }else if(res.status==404){
	              //没有找到考试信息
	            }else{
					this.$refs.messager.show({message:res.message,type:'error'});
	            }
	        })
	    },
		loadExamContent(){
			apiStudy.getStudyContentItem(this.studyId,this.content.id).then(rs=>{
				if(rs.status==200){
					this.lastScore=rs.result.score;
					this.studyItemId=rs.result.id;
				}
			});
		},
	    loadRecord(){
			if(this.studyId==''){
				return;
			}
			this.records=[];
			this.loadExamContent();
			//if(this.records.length==0){
				let params={
				  studyId:this.studyId,
				  contentId:this.content.id
				}
				apiStudy.myExamList2(params).then(examRs=>{
				  if(examRs.status==200){
					this.records=examRs.result;
					let len=examRs.result.length;
					if(this.info.times>len){
					  this.allowSubmit=true;
					}else{
					  this.allowSubmit=false;
					}
				  }
				})
			//}
	    },
	    startTest(){
			//转向详细页面
			uni.redirectTo({
				url:'/pages/study/exam?studyId='+this.studyId+'&ctype='+this.courseType+'&ccid='+this.content.id
			})
	    },
		toExamDetail(item){
			uni.navigateTo({
				url:'/pages/study/examDetail?id='+item.id
			})
		}
	  }
	}
</script>

<style  scoped lang="scss">
	.paperinfo{
		padding-top: 10px;
		.paperinfo-title{
			text-align: center;
			font-size: 30upx;
			font-weight: 600;
			padding: 10px;
		}
		.paperinfo-item{
			background-color: #FFFFFF;
		}
	}
	.endurance{
	    height: 90px;
	    background: #F9F9F9;
	    margin-top: 10px;
	    padding-bottom: 10px;
	    .exam-time{
	        font-size: 15px;
			font-weight: Medium;
	        color: #333333;
	        padding-top: 15px;
	        margin-left: 15px;
	    }
	    
	    .endurance-cen{
	        display: flex;
	        justify-content: space-between;
	        margin-right: 11px;
	        .endurance-btn{
				margin-top: 40upx;
				background-color: #EAF1FF;
				padding: 8upx 20upx;
				color:#387DF7;
				border-radius: 6upx;
				font-size: 28upx;
			}
	        .schedule{
	            font-size: 14px;
	            color: #868686;
	            margin-left: 16px;
	        }
	        
	        .schscore{
	            font-size: 14px;
	            color: #000000;
	            margin-left: 13px;
	        }
	        
	        .patiently{
	            font-size: 14px;
	            color: #868686;
	            margin-left: 16px;
	        }
	        
	        .patientlys{
	            font-size: 14px;
	            color: #000000;
	            margin-left: 13px;
	        }
	    }
	}
</style>