examintext.vue 9.0 KB
<template>
	<view class="content">
		<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&&item.chose==true?'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&&item.chose==true"></image>
						<image src="../../static/wrong.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>
</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);
					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");
					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)
				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
						})
					},1500)
				
				}).catch((err) => {
				that.score,	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: 28rpx;
		height: 28rpx;
		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>