2

src/components/word/choiceQuestion.vue

 <style scoped>
-	.choiceQuestion{
+	.choiceQuestion {
 		width: 100vw;
 		height: 100vh;
 		background: #F5F5F5;
 		box-sizing: border-box;
 	}
-	.box{
+
+	.box {
 		width: 100%;
 		box-sizing: border-box;
 		padding: 0 20px;
@@ -13,112 +14,140 @@
 		flex-direction: column;
 		align-items: center;
 	}
-	.dc{
-		font-size: 30px;
+
+	.dc {
+		font-size: 60rpx;
 		color: #111111;
 		font-weight: bold;
 		margin-top: 160rpx;
-		
+
 	}
-	.dclx{
-		padding:4px 6px ;
+
+	.dc2 {
+		font-size: 30rpx;
+		color: #111111;
+		font-weight: 500;
+		margin-top: 160rpx;
+
+	}
+
+	.dclx {
+		padding: 4px 6px;
 		border-radius: 3px;
 		background: #E8E9EA;
 		font-size: 14px;
 		color: #666666;
 		margin-top: 18px;
 	}
-	.choicelist{
+
+	.choicelist {
 		margin-top: 100px;
 		width: 100%;
 	}
-	.choice-item{
+
+	.choice-item {
 		height: 106rpx;
 		border-radius: 54rpx;
 		background: #FFFFFF;
 		display: flex;
 		align-items: center;
 		justify-content: center;
-		font-size: 16px;
+		font-size: 32rpx;
 		color: #111111;
 		margin-bottom: 19px;
 		position: relative;
 	}
-	.correct{
+
+	.correct {
 		background: #4C50E7;
 		color: #FFFFFF;
 	}
-	.sign{
+
+	.sign {
 		position: absolute;
 		right: 33px;
 		top: 36rpx;
 	}
-	.error{
+
+	.error {
 		background: #F66633;
 		color: #FFFFFF;
 	}
-
 </style>
 <template>
 	<view class="choiceQuestion">
-		<view class="box">
-			<view class="dc">火曜日</view>
-			<view class="dclx">名词</view>
+		<view class="box" v-if="!isShowExplain">
+			<!-- <view class="dc">{{item.Title}}</view> -->
+			<view class="dc2">{{item.Title}}</view>
+			<view class="dclx">{{item.WordType}} <text @click="isShowExplain=true">查看解析</text></view>
 			<view class="choicelist">
-				<view class="choice-item"
-				 :class="{'correct':(current ==answer && current!=0 && x.Id == current) || (x.Id==answer && current!=answer && current!=0),
-				 'error':current!=0 && x.Id ==current && current!=answer
-				 }" 
-				 v-for="(x,y) in list" :key='y' @click="choice(x)">
-					{{x.Name}}
-					<view class="sign" v-if="(current ==answer && current!=0 && x.Id == current) || (x.Id==answer && current!=answer && current!=0)">
-						<van-icon name="success" color="#5DE3A6" size='40rpx'/>
+				<view class="choice-item" :class="{'correct':item.Answer==x.Name&&current==item.Answer,
+				 'error':current==x.Name&&current!==item.Answer}" v-for="(x,y) in item.QuestionContent" :key='y' @click="choice(x)">
+					{{x.Content}}
+					<view class="sign" v-if="item.Answer==x.Name&&current==item.Answer">
+						<van-icon name="success" color="#5DE3A6" size='40rpx' />
 					</view>
-					<view class="sign" v-if="current!=0 && x.Id ==current && current!=answer ">
-						<van-icon name="cross"  color="#FFF" size='40rpx' />
+					<view class="sign" v-if="current==x.Name&&current!==item.Answer">
+						<van-icon name="cross" color="#FFF" size='40rpx' />
 					</view>
 				</view>
 			</view>
 		</view>
-			
+		<Explain v-if="isShowExplain"></Explain>
 	</view>
 </template>
 
 <script>
-	import {ref,reactive,toRefs,toRef,getCurrentInstance,watch,computed,onMounted,provide} from "vue";
-	
+	import {
+		ref,
+		reactive,
+		toRefs,
+		toRef,
+		getCurrentInstance,
+		watch,
+		computed,
+		onMounted,
+		provide
+	} from "vue";
+	import Explain from '../../components/word/explain.vue'
 	export default {
-		props: ['current','answer'],
-		setup(props,{attrs,slots,emit}) {
+		components:{
+			Explain
+		},
+		props: {
+			current: {
+				type: String,
+				default: ''
+			},
+			item: {
+				type: Object,
+				default: () => {
+					return {}
+				}
+			}
+		},
+		setup(props, {
+			attrs,
+			slots,
+			emit
+		}) {
 			let data = reactive({
-				list:[//选择列表
-					{Id:1,Name:'ないこと'},
-					{Id:2,Name:'ざってい'},
-					{Id:3,Name:'ないこと'},
-					{Id:4,Name:'ないこと'},
-				],
-				current:props.current!=''?props.current:0,//用户选择
-				answer:props.answer,//答案
+				current: '', //用户选择
+				isShowExplain:false,
 			})
 			let methods = {
-				choice(x){
-					if(data.current ==0){
-						data.current = x.Id;
-						//调取页面
-						emit('choice',data.current)
-					}
+				choice(x) {
+					data.current = x.Name;
 				}
 			}
-			onMounted(()=>{
-				
-				
+			onMounted(() => {
+				console.log(136, props.item)
 			})
 			let that = methods;
 			return {
-			  ...toRefs(data),
-			  ...methods,
+				...toRefs(data),
+				...methods,
 			};
 		}
 	}
 </script>
-

src/components/word/explain.vue

@@ -4,29 +4,29 @@
 		height: 100vh;
 		background: #F5F5F5;
 		box-sizing: border-box;
-		padding: 18px;
+		padding: 36rpx;
 		
 	}
 	.box{
 		width: 100%;
+		
 		box-sizing: border-box;
-		padding:  20px;
+		padding:  40rpx;
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-		border-radius: 12px;
+		border-radius: 24rpx;
 		background: #FFF;
 		
 	}
 	.box-top{
-		height: calc(100vh - 90rpx - 36px);
 		overflow-y: auto;
 		width: 100%;
 		
 	}
 	.box-b{
 		width: 292rpx;
-		height: 90rpx;
+		height: calc( 100vh - 166rpx);
 		background: #E4E5FB;
 		display: flex;
 		align-items: center;

src/components/word/fillInTheBlanks.vue

@@ -74,9 +74,9 @@
 	<view class="fillInTheBlanks">
 		<view class="box">
 			
-			<view class="dc row" >
-				<view style="font-size:26rpx;width:100%">{{item.Title}}</view>
-				<mypone :maxlength="getNum(item)" v-model="test" style="display: inline-block;"></mypone>
+			<view class="dc " >
+				<view style="font-size:26rpx;width:100%；font-weight: 600;">{{item.Title}}</view>
+				<mypone :maxlength="getNum(item)" v-model="test" style="display: inline-block;" @input="input"></mypone>
 			</view>
 			<view class="dclx">{{item.WordType}}</view>
 			<view class="dclx2">{{item.ChineseMean}}</view>
@@ -121,9 +121,9 @@
 			let methods = {
 				getNum(item){
 					const answer=item.Answer
-					const index =answer.indexOf("(")
+					const index =answer.indexOf("（")||answer.indexOf("(")
 					if(index>-1){
-						return index+1
+						return index
 					}else{
 						return answer.length
 					}
@@ -138,14 +138,18 @@
 						return
 					}
 					//去掉接口
-					
-					
-					
-					
+					if(data.test==props.item.Answer||props.item.Answer.indexOf(data.test)>-1){
+						data.type=1
+					}else{
+						data.type=2
+					}
+				},
+				input(){
+					data.type=0
 				}
 			}
 			onMounted(()=>{
-				console.log(137,props.item)
+				// console.log(137,props.item)
 			})
 			let that = methods;
 			return {

src/pages/word/test.vue

@@ -2,8 +2,7 @@
 	<view class="wordTest">
 		<swiper class="swiper"  >
 			<swiper-item v-for="(item,index) in reviewGroupList" :key="index" class="swiper-item">
-				<Choice v-if="item.QuestionTypeId==1"></Choice>
-				<!-- <Explain v-if="item.QuestionTypeId==3"></Explain> -->
+				<Choice v-if="item.QuestionTypeId==1" :item="item"></Choice>
 				<FillIn v-if="item.QuestionTypeId==3" :item="item"></FillIn>
 			</swiper-item>
 			<swiper-item v-for="(item,index) in prepGroupList" :key="index" class="swiper-item">
@@ -23,12 +22,10 @@
 		onMounted,
 	} from "vue";
 	import Choice from '../../components/word/choiceQuestion.vue'
-	import Explain from '../../components/word/explain.vue'
 	import FillIn from '../../components/word/fillInTheBlanks.vue'
 	export default {
 		components: {
 			Choice,
-			Explain,
 			FillIn
 		},
 		setup(props) {

src/pages/word/word.vue

@@ -74,10 +74,7 @@
 					}
 					const total = data.StudyList.length + data.ReviewList.length + 1
 					if (val.detail.current + 1 == total && total > 1) {
-						uni.navigateTo({
-							url: "/pages/word/studyComplete?CourseId=" + data.readMsg.CourseId + '&&ChapterId=' + data.readMsg.ChapterId +
-								'&&NextChapterId=' + '0'
-						})
+						
 					}
 				},
 				completeRead(n, type) {
@@ -88,7 +85,12 @@
 					}
 					data.readMsg.StudyType = type;
 					proxy.$request('/AppletWords/SetStuWordsPrep', data.readMsg).then(res => {
-						console.log(74, res)
+						if(res.Data.StudyNum==res.Data.TotalNum){
+							uni.navigateTo({
+								url: "/pages/word/studyComplete?CourseId=" + data.readMsg.CourseId + '&&ChapterId=' + data.readMsg.ChapterId +
+									'&&NextChapterId=' + '0'
+							})
+						}
 					})
 				}
 			}