examintext.vue 9.6 KB
<template>
	<view class="content">
		<view class="nodata" v-if="present_data==''">暂无考试内容</view>
		<view v-else>
			<view class="texttitle">
				{{present_data.question_name}}({{present_data.type==1?'单选':'多选'}})
			</view>
			<view class="textlist" v-if="issure">
				<view class='textitem flex' :class="item.chose==true?'selright':''" v-for="(item,index) in present_data.option" :key="index" @click="selchose(index)">
					<view class="flex">
						<view class="textitemleft" >
							<image src="../../static/selright.png" mode="" v-if="item.chose==true"></image>
							<image src="../../static/meisel.png" mode="" v-else></image>
						</view>
						<view class="textitemright">
							{{item.sel}}、{{item.option_name}}
						</view>
					</view>
					<!-- <view class="wrongimg" v-if="item.answer==2&&item.chose==true">
						<image src="../../static/wrong.png" mode=""></image>
					</view> -->
				</view>
				
				
			</view>
			<view class="textlist" v-else>
				<view class='textitem flex' :class="item.answer==1?'selright':item.answer==2&&item.chose==true?'selwrong flextwo':''" v-for="(item,index) in present_data.option" :key="index" >
					<view class="flex">
						<view class="textitemleft" >
							<image src="../../static/selright.png" mode="" v-if="item.answer==1"></image>
							<image src="../../static/slewrong.png" mode="" v-else-if="item.answer==2&&item.chose==true"></image>
							<image src="../../static/meisel.png" mode="" v-else></image>
						</view>
						<view class="textitemright">
							{{item.sel}}、{{item.option_name}}
						</view>
					</view>
					<view class="wrongimg" v-if="item.answer==2&&item.chose==true">
						<image src="../../static/wrong.png" mode=""></image>
					</view>
				</view>
			</view>
			<view class="huiyuanbot boxsizing">
				<!-- v-if="next_data!=''&&last_data==''" -->
				<!-- <view class="behuiyuanbtn" v-if="issure" @click="next_data==''?sureti:sure">确认{{next_data==''?'1':'2'}}</view> -->
				<view  v-if="issure">
					<view class="behuiyuanbtn"  @click="sureti">确认</view>
					<!-- <view class="behuiyuanbtn"  @click="sure" v-else>确认</view> -->
				</view>
				<view v-else>
					<view class="behuiyuanbtn"  @click="nextquestion" v-if="next_data!=''">下一题</view>
					<view class="behuiyuanbtn"  @click="sure" v-else>完成</view>
				</view>
				
				<!-- <view  v-else>
					<view class="behuiyuanbtn"  @click="nextquestion" v-if="next_data!=''">下一题</view>
					
				</view> -->
				
				<!-- <view class="flextwo" v-else-if="last_data!=''&&next_data!==''">
					<view class="behuiyuanbtn btnitem" @click="prequestion">上一题</view>
					<view class="behuiyuanbtn btnitem" @click="nextquestion">下一题</view>
				</view> -->
				<!--  v-else -->
			</view>
				
		</view>
		
	</view>
</template>
<script>
	import app from "../../App.vue";
	export default {
		data() {
			return {
				questionnaire_id: '',
				present_data: '',
				last_data: '',
				next_data: '',
				question_id:'',
				score:0,
				selitem:0,
				//是否在上一题返回的下一题
				islast:0,
				present_datakarr:[],
				issure:true
				
			}
		},
		onLoad(options) {

			this.questionnaire_id = options.id;
			this.getqusetion();

		},
		methods: {
			getqusetion() {
				let that = this;
				var url = 'question/get_question';
				var params = {
					questionnaire_id: that.questionnaire_id,
					question_id:that.question_id
				}
				console.log(params)
				app.post(url, params, "post").then((res) => {
					console.log(res);
					console.log(res.data.data.present_data)
					that.present_data = res.data.data.present_data;
					that.present_data.canchose=0;
					that.present_data.option.forEach(function(value, index, array) {
						value.chose=false;
						switch (index) {
							case 0:
								value.sel = 'A';
								break;
							case 1:
								value.sel = 'B';
									break;
							case 2:
								value.sel = 'C';
									break;
							case 3:
								value.sel = 'D';
								break;
						}
					})
					that.present_data = that.present_data;
					that.last_data = res.data.data.last_data;
					that.next_data = res.data.data.next_data;
					// 查看题目答案是否正确
					let newpresent_datakarr=uni.getStorageSync("present_datakarr");
					if(newpresent_datakarr!=""){
						console.log(newpresent_datakarr)
						newpresent_datakarr.forEach(function(value,index,array){
							// console.log(348934,value)
							// console.log('1111',that.present_data)
							if(value.id==that.present_data.id){
								that.present_data=value;
								// console.log(that.present_data)
							}
						})
					}
					
				}).catch((err) => {
					console.log(err)

				})
			},
			// 选择题目
			selchose(index){
				let that=this;
				that.selitem++;
				that.present_data.canchose++;
				console.log('选中的题数',that.present_data.canchose)
				that.present_data.option.forEach(function(value,indexk,array){
					if(that.present_data.correct_number==1){
						if(index==indexk){
							value.chose=true;
							// value.canchose++;
							that.$forceUpdate();
						}else{
							value.chose=false;
							that.$forceUpdate();
						}
					}else{
						if(index==indexk){
							value.chose=true;
							that.$forceUpdate();
						}
						
					}
					
				})
				that.present_data=that.present_data;
				if(that.present_data.correct_number==1){
					that.present_data.option.forEach(function(value,index,array){
						if(value.chose==true&&value.answer==1){
							that.score=that.score+that.present_data.score;
						}
					})
				}else{
					let arr=[]
					that.present_data.option.forEach(function(value,index,array){
						if(value.chose==true&&value.answer==1){
							arr.push(1)
						}
						if(arr.length==that.present_data.correct_number){
							that.score=that.score+that.present_data.score;
						}
					})
				}
				
				console.log(that.present_data)
				console.log('考试得分',that.score)
				uni.setStorageSync("present_datak",that.present_data);
				uni.setStorageSync("last_datak",that.last_data);
				uni.setStorageSync("next_datak",that.next_data);
				this.present_datakarr.push(this.present_data);
				
				// console.log(this.present_datakarr)
				uni.setStorageSync("present_datakarr",this.present_datakarr);
				console.log('xiaadsk',that.next_data)
			},
			//下一题
			nextquestion(){
				let that=this;
				 this.question_id=this.next_data.id;
				console.log('判断是否答题',that.selitem);
				// 判断是否答题
				if(that.selitem==0){
					uni.showToast({
						title:"请答题",
						icon:"none"
					})
				}else{
					that.selitem=0;
					that.getqusetion();
					that.issure=true
					// uni.setStorageSync("present_data",that.present_data);
					// uni.setStorageSync("last_data",that.last_data);
					// uni.setStorageSync("next_data",that.next_data);
					
					// // 判断是否是在上一题过来的
					// if(that.islast==1){
						
					// 	that.islast=0
					// 	this.present_data=uni.getStorageSync("present_datak");
					// 	that.present_data.canchose=that.present_data.correct_number;
					// 	console.log('dangqian',this.present_data.canchose)
					// 	this.last_data=uni.getStorageSync("last_datak");
					// 	this.next_data=uni.getStorageSync("next_datak");
					// }else{
					// 	that.selitem=0;
					// 	this.getqusetion();
					// }
					
				}
				
			},
			// 上一题
			prequestion(){
				// this.present_data=uni.getStorageSync("present_data");
				// this.last_data=uni.getStorageSync("last_data");
				// this.next_data=uni.getStorageSync("next_data");
				
				this.question_id=this.last_data.id;
				this.islast=1;
				this.getqusetion();
				
			},
			
			sureti(){
				console.log(343348989)
				let that=this;
				let arr=[]
				console.log(that.present_data.option);
				that.present_data.option.forEach(function(value,indexk,array){
					if(value.chose==false){
						arr.push(1)
					}
				})
				console.log(arr)
				
				if(arr.length==that.present_data.option.length){
					uni.showToast({
						title:'请答题',
						icon:'none'
					})
					return false
				}
				this.issure=false
				this.question_id=this.present_data.id;
				this.getqusetion()
			},
			sure(){
				let that = this;
				var url = 'question/submit_answer';
				var params = {
					questionnaire_id: that.questionnaire_id,
					score:that.score
				}
				console.log('7766554', params)
				app.post(url, params).then((res) => {
					console.log(res);
					uni.showToast({
						title:'提交成功',
						icon:'none'
					})
					setTimeout(function(){
						uni.navigateTo({
							url:'/pages/luntan/examineresult?score='+that.score+'&id='+that.questionnaire_id
						})
					},1500)
				
				}).catch((err) => {
				console.log(err)
				
				})
			}
				

		},
		onShow(){
			uni.setStorageSync("present_datakarr","")
		}

	}
</script>

<style>
	page {
		padding: 38rpx 32rpx;
		box-sizing: border-box;
	}

	.texttitle {
		color: #06121F;
		font-size: 32rpx;
	}

	.textlist {
		margin-top: 32rpx;
		border-top: 1rpx solid #f5f5f5;
	}

	.textitem {
		padding: 16rpx 32rpx;
		box-sizing: border-box;
		border: 2rpx solid rgba(238, 238, 238, 1);
		margin-bottom: 16rpx;
	}

	.selright {
		background: #FEF0D7;
	}

	.textitemleft {
		width: 48rpx;
		height: 48rpx;
		font-size: 0;
	}

	.textitemright {
		color: #06121F;
		font-size: 32rpx;
		margin-left: 16rpx;
	}

	.wrongimg {
		width: 30rpx;
		height: 30rpx;
		font-size: 0;
	}

	.selwrong {
		background: #FFE0DB;
	}

	.behuiyuanbtn {
		width: 686rpx;
		height: 88rpx;
		background: #C29445;
		color: #fff;
		font-size: 32rpx;
		text-align: center;
		line-height: 88rpx;
		border-radius: 10rpx;

	}
	.btnitem{
		width:300rpx;
	}

	.huiyuanbot {
		position: fixed;
		background: #fff;
		bottom: 100rpx;
		left: 0;
		width: 750rpx;
		height: 116rpx;
		padding: 14rpx 32rpx;
	}
</style>