feat: 1.学习中心直播课页面布局 2.进入刷题页面布局 3.所以课程页面布局

pages/learn/index.scss

@@ -0,0 +1,295 @@
+@mixin threeDot {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+.contents {
+	width: 100%;
+	.diatance{
+		width: 100%;
+		height: 85rpx;
+		background-color: #007AFF;
+		display: flex;
+    	align-items: center;
+		margin-top: 8rpx;
+		.clock {
+			width: 44rpx;
+			height: 41rpx;
+			margin: 0rpx 22rpx 0rpx 65rpx;
+		}
+		>text {
+			color: #fff;
+			font-size: 28rpx;
+		}
+	}
+}
+.had_courses{
+	width: 100%;
+	padding: 39rpx 24rpx 31rpx;
+}
+.lives {
+	width: 100%;
+	.live_item {
+		position: relative;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 150rpx;
+		border-radius: 16rpx;
+		padding: 14rpx 0rpx 0rpx 43rpx;
+		.my_bg {
+			position:absolute;
+			left:0;
+			top:0;
+			width:100%;
+			height:100%;
+		}
+		.live_con {
+			position: relative;
+			z-index: 10;
+		}
+		.live_status {
+			display: flex;
+    		align-items: center;
+			.liv_icon {
+				width: 32rpx;
+				height: 23rpx;
+				margin-right: 14rpx;
+			}
+			.status_s {
+				font-size: 24rpx;
+				font-weight: 500;
+				color: #DBE3FF;
+				width: 160rpx;
+				margin-right: 20rpx;
+			}
+			.look_bt {
+				height: 37rpx;
+				line-height: 37rpx;
+				font-size: 24rpx;
+				padding: 0rpx 18rpx;
+				text-align: center;
+				// background-color: #FFB102;
+				// color: #fff;
+				background-color: #fff;
+				// background-color: #007AFF;
+				color: #9356DE;
+				border-radius: 19rpx;
+			}
+		}
+		.liv_time {
+			font-size: 20rpx;
+			color: #fff;
+			margin-top: 17rpx;
+		}
+		.liv_title {
+			font-size: 28rpx;
+			color: #fff;
+			font-weight: bold;
+			width: 100%;
+			@include threeDot();
+		}
+	}
+	
+}
+.my_courses {
+	.titles {
+		font-size: 32rpx;
+		color: #333333;
+		margin: 44rpx 0rpx 24rpx 43rpx;
+		font-weight: bold;
+		display: block;
+	}
+	.course_item {
+		width: 100%;
+		height: 278rpx;
+		background: #FFFFFF;
+		box-shadow: 0rpx 0rpx 20rpx 1rpx rgba(1,99,235,0.1000);
+		border-radius: 24rpx;
+		padding: 29rpx 29rpx 20rpx 24rpx;
+		display: flex;
+		align-items: center;
+		margin-bottom: 20rpx;
+	}
+	.lefts {
+		width: 202rpx;
+		height: 223rpx;
+		border-radius: 12rpx;
+		margin-right: 35rpx;
+		position: relative;
+		top: 0;
+		left: 0;
+		.lefet_img {
+			width: 100%;
+			height: 100%;
+			display: block;
+		}
+		.live_icon {
+			width: 65rpx;
+			height: 35rpx;
+			line-height: 35rpx;
+			border-radius: 22rpx 0rpx 22rpx 0rpx;
+			background-color: #FFB102;
+			color: #fff;
+			font-size: 20rpx;
+			text-align: center;
+			position: absolute;
+			top: 0;
+			left: 0;
+		}
+	}
+	.rights {
+		width: 400rpx;
+		height: 223rpx;
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;;
+		.cou_titles {
+			margin-top: 14rpx;
+			color: #333333;
+			font-size: 28rpx;
+			font-weight: bold;
+			width: 100%;
+			@include threeDot();
+		}
+		.learn_ranges {
+			color: #999;
+			font-size: 24rpx;
+			margin-top: 24rpx;
+			.l_range {
+				width: 20rpx;
+				height: 24rpx;
+				margin-right: 9rpx;
+			}
+			.l_time {
+				color: #333;
+			}
+		}
+		.learn_progress {
+			width: 100%;
+		}
+		.progress_up {
+			font-size: 24rpx;
+			// font-weight: 400;
+			color: #999999;
+			display: flex;
+			align-items: center;
+			.wk_icon {
+				width: 24rpx;
+				height: 24rpx;
+				margin-right: 8rpx;
+			}
+		}
+		.progress_down {
+			width: 100%;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+		}
+		.enter_into {
+			width: 165rpx;
+			height: 48rpx;
+			line-height: 48rpx;
+			background: #FFB102;
+			border-radius: 0rpx 16rpx 16rpx 16rpx;
+			font-size: 24rpx;
+			font-weight: 400;
+			color: #FFFFFF;
+			text-align: center;
+		}
+	}
+	// 收藏集，做题记录
+	.bottoms {
+		display: flex;
+		justify-content: space-between;
+		margin-bottom: 32rpx;
+		.item {
+			width: 335rpx;
+			&.collect {
+				position: relative;
+				font-size: 32rpx;
+				color: #FFFFFF;
+				height: 240rpx;
+				border-radius: 24rpx;
+				padding:32rpx;
+				
+				.text {
+					position:relative;
+					z-index: 10;
+					font-size: 32rpx;
+					font-weight: bold;
+					color: #FFFFFF;
+				}
+				
+				.img {
+					position:absolute;
+					left:0;
+					top:0;
+					width:100%;
+					height:100%;
+					
+				}
+			}
+			
+			&.list {
+				.list-in {
+					position:relative;
+					width: 335rpx;
+					height: 112rpx;
+					background: #007AFF;
+					border-radius: 24rpx;
+					display: flex;
+					align-items: center;
+					font-size: 32rpx;
+					color: #fff;
+					
+					&:first-of-type {
+						margin-bottom:16rpx;
+					}
+					
+					.text {
+						padding-left:91rpx;
+						position:relative;
+						z-index: 10;
+						font-size: 32rpx;
+						font-weight: bold;
+						color: #FFFFFF;
+					}
+					
+					.img {
+						position:absolute;
+						left:0;
+						top:0;
+						width:100%;
+						height:100%;
+					}
+				}
+			}
+		}
+	}
+}
+.no_datas {
+	margin-top: 70rpx;
+	display: flex;
+    flex-direction: column;
+    align-items: center;
+	.courses {
+		width: 360rpx;
+		height: 349rpx;
+	}
+	.no_learns {
+		font-size: 32rpx;
+		color: #999;
+		margin: 46rpx 0rpx 56rpx;
+	}
+	.choose {
+		width: 280rpx;
+		height: 64rpx;
+		line-height: 64rpx;
+		border-radius: 32rpx;
+		background-color: #007AFF;
+		color: #fff;
+		font-size: 30rpx;
+		text-align: center;
+	}
+}

pages/learn/index.vue

@@ -15,7 +15,22 @@
 			<view class="had_courses">
 				<!-- 直播 -->
 				<view class="lives">
-
+					<view class="live_item">
+						<view class="live_con">
+							<view class="live_status">
+								<image src="/static/learn/living.png" class="liv_icon"></image>
+								<!-- <image src="/static/learn/wlive.png" class="my_bg"></image> -->
+								<text class="status_s">正在直播中...</text>
+								<view class="look_bt">点击观看</view>
+							</view>
+							<view class="liv_time">
+								7月19日 15:00
+							</view>
+							<view class="liv_title">一级建造师《水利实务》拔高训练直播</view>
+						</view>
+						<!-- <image src="/static/learn/wlive_bg.png" class="my_bg"></image> -->
+						<image src="/static/learn/living_bg.png" class="my_bg"></image>
+					</view>
 				</view>
 				<!-- 我的课程 -->
 				<view class="my_courses">
@@ -172,7 +187,7 @@ export default {
 				url:'/pages/course/index'
 			})
 		},
-		// 商品/课程列表
+		// 查询用户拥有的商品/课程列表/course/goodsList
 		getcourseList() {
 			this.$api.courseGoodsList(this.paramC).then(res => {
 				if (res.data.code == 200) {
@@ -196,12 +211,15 @@ export default {
 			})
 		},
 		async studyIn(v, i, item, index) {
+			console.log('item', item)
 			this.activeItem = item
 			if (item.interfaceAccountId > 0) { //学习账号已开通
 
 				if (item.learnStatus == 1) { //跳转第三方h5
 					// this.showMark = true;
+					console.log('dshfisdgfo')
 					uni.navigateTo({
+						
 						url: `/pages3/polyv/detail?goodsId=${item.goodsId}&orderGoodsId=${item.orderGoodsId}&isOther=1`
 					})
 					return;
@@ -261,16 +279,17 @@ export default {
 				return;
 			}
 			
-			var confirmDetail = true
-			if (item.educationName == '继续教育') { 
-				if(item.officialName && item.businessName == '二级' && item.projectName == '建造师') { 
-					confirmDetail = await this.userConfirmInfoDetail()
-				}
-			}
+			// 这里的一建先不用
+			// var confirmDetail = true
+			// if (item.educationName == '继续教育') { 
+			// 	if(item.officialName && item.businessName == '二级' && item.projectName == '建造师') { 
+			// 		confirmDetail = await this.userConfirmInfoDetail()
+			// 	}
+			// }
 			
-			if(!confirmDetail) {
-				return;
-			}
+			// if(!confirmDetail) {
+			// 	return;
+			// }
 			
 			// //内部系统
 			// if (item.interfacePushId > 0 && item.officialStatus != 1) {
@@ -281,17 +300,16 @@ export default {
 			// 	return;
 			// }
 
+			// 这里的一建先不用
+			// this.itemIndex = index;
+			// if (item.gradeStatus == 1 && item.status == 1 && (item.serviceEndTime > this.sysTime) && (item
+			// 		.classEndTime && (item.classEndTime < this.sysTime)) && (item.periodStatus == 0 || item
+			// 		.periodStatus == -1) && item.studyCount > 0) {
+			// 	this.selectClass(item, index);
+			// 	return;
+			// }
 
-			this.itemIndex = index;
-
-			if (item.gradeStatus == 1 && item.status == 1 && (item.serviceEndTime > this.sysTime) && (item
-					.classEndTime && (item.classEndTime < this.sysTime)) && (item.periodStatus == 0 || item
-					.periodStatus == -1) && item.studyCount > 0) {
-				this.selectClass(item, index);
-				return;
-			}
-
-
+			// /course/goodsRebuildStatus查询用户商品重修状态
 			let rebuildStatus = await this.courseGoodsRebuildStatus(item.goodsId, item.gradeId)
 
 			if (rebuildStatus == 0) {
@@ -318,8 +336,8 @@ export default {
 						})
 					} else if (res.data.code == 500) { //可以学习
 
-						if (item.courseNum == 1) {
-							
+						if (item.courseNum == 1) { // 课程数量
+							// /course/courseList查询商品下的课程列表
 							this.$api.courseCourseList({
 								pageNum: 1,
 								pageSize: 1,
@@ -465,238 +483,5 @@ page {
 }
 </style>
 <style lang="scss" scoped>
-.contents {
-	width: 100%;
-	.diatance {
-		width: 100%;
-		height: 85rpx;
-		background-color: #007AFF;
-		display: flex;
-    	align-items: center;
-		margin-top: 8rpx;
-		.clock {
-			width: 44rpx;
-			height: 41rpx;
-			margin: 0rpx 22rpx 0rpx 65rpx;
-		}
-		>text {
-			color: #fff;
-			font-size: 28rpx;
-		}
-	}
-}
-.had_courses{
-	width: 100%;
-	padding: 39rpx 24rpx 31rpx;
-	.lives {
-		widows: 100%;
-		height: 150rpx;
-	}
-}
-.my_courses {
-	
-	.titles {
-		font-size: 32rpx;
-		color: #333333;
-		margin: 44rpx 0rpx 24rpx 43rpx;
-		font-weight: bold;
-		display: block;
-	}
-	.course_item {
-		width: 100%;
-		height: 278rpx;
-		background: #FFFFFF;
-		box-shadow: 0rpx 0rpx 20rpx 1rpx rgba(1,99,235,0.1000);
-		border-radius: 24rpx;
-		padding: 29rpx 29rpx 20rpx 24rpx;
-		display: flex;
-		align-items: center;
-		margin-bottom: 20rpx;
-	}
-	.lefts {
-		width: 202rpx;
-		height: 223rpx;
-		border-radius: 12rpx;
-		margin-right: 35rpx;
-		position: relative;
-		top: 0;
-		left: 0;
-		border: 1rpx solid #ddd;
-		.lefet_img {
-			width: 100%;
-			height: 100%;
-			display: block;
-		}
-		.live_icon {
-			width: 65rpx;
-			height: 35rpx;
-			line-height: 35rpx;
-			border-radius: 22rpx 0rpx 22rpx 0rpx;
-			background-color: #FFB102;
-			color: #fff;
-			font-size: 20rpx;
-			text-align: center;
-			position: absolute;
-			top: 0;
-			left: 0;
-		}
-	}
-	.rights {
-		width: 400rpx;
-		height: 223rpx;
-		display: flex;
-		flex-direction: column;
-		justify-content: space-between;;
-		.cou_titles {
-			margin-top: 14rpx;
-			color: #333333;
-			font-size: 28rpx;
-			font-weight: bold;
-			width: 100%;
-			overflow: hidden;
-			text-overflow: ellipsis;
-			white-space: nowrap;
-		}
-		.learn_ranges {
-			color: #999;
-			font-size: 24rpx;
-			margin-top: 24rpx;
-			.l_range {
-				width: 20rpx;
-				height: 24rpx;
-				margin-right: 9rpx;
-			}
-			.l_time {
-				color: #333;
-			}
-		}
-		.learn_progress {
-			width: 100%;
-		}
-		.progress_up {
-			font-size: 24rpx;
-			// font-weight: 400;
-			color: #999999;
-			display: flex;
-			align-items: center;
-			.wk_icon {
-				width: 24rpx;
-				height: 24rpx;
-				margin-right: 8rpx;
-			}
-		}
-		.progress_down {
-			width: 100%;
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-		}
-		.enter_into {
-			width: 165rpx;
-			height: 48rpx;
-			line-height: 48rpx;
-			background: #FFB102;
-			border-radius: 0rpx 16rpx 16rpx 16rpx;
-			font-size: 24rpx;
-			font-weight: 400;
-			color: #FFFFFF;
-			text-align: center;
-		}
-	}
-	// 收藏集，做题记录
-	.bottoms {
-		display: flex;
-		justify-content: space-between;
-		margin-bottom: 32rpx;
-		.item {
-			width: 335rpx;
-			&.collect {
-				position: relative;
-				font-size: 32rpx;
-				color: #FFFFFF;
-				height: 240rpx;
-				border-radius: 24rpx;
-				padding:32rpx;
-				
-				.text {
-					position:relative;
-					z-index: 10;
-					font-size: 32rpx;
-					font-weight: bold;
-					color: #FFFFFF;
-				}
-				
-				.img {
-					position:absolute;
-					left:0;
-					top:0;
-					width:100%;
-					height:100%;
-					
-				}
-			}
-			
-			&.list {
-				.list-in {
-					position:relative;
-					width: 335rpx;
-					height: 112rpx;
-					background: #007AFF;
-					border-radius: 24rpx;
-					display: flex;
-					align-items: center;
-					font-size: 32rpx;
-					color: #fff;
-					
-					&:first-of-type {
-						margin-bottom:16rpx;
-					}
-					
-					.text {
-						padding-left:91rpx;
-						position:relative;
-						z-index: 10;
-						font-size: 32rpx;
-						font-weight: bold;
-						color: #FFFFFF;
-					}
-					
-					.img {
-						position:absolute;
-						left:0;
-						top:0;
-						width:100%;
-						height:100%;
-					}
-				}
-			}
-		}
-	}
-}
-.no_datas {
-	margin-top: 70rpx;
-	display: flex;
-    flex-direction: column;
-    align-items: center;
-	.courses {
-		width: 360rpx;
-		height: 349rpx;
-	}
-	.no_learns {
-		font-size: 32rpx;
-		color: #999;
-		margin: 46rpx 0rpx 56rpx;
-	}
-	.choose {
-		width: 280rpx;
-		height: 64rpx;
-		line-height: 64rpx;
-		border-radius: 32rpx;
-		background-color: #007AFF;
-		color: #fff;
-		font-size: 30rpx;
-		text-align: center;
-	}
-}
-
+@import './index.scss';
 </style>

pages2/bank/my_question.vue

@@ -29,7 +29,7 @@
 			
 		</view>
 		<view v-if="list.length==0">
-			<u-empty text="暂无题库" margin-top="500" mode="list"></u-empty></view>
+			<u-empty text="暂无题库" margin-top="500" mode="list"></u-empty>
 			
 		</view>
 	</view>
@@ -72,15 +72,15 @@
 			},
 			studyIn(item,index){
 				console.log(item)
-				this.itemIndex = index;
-				let sysTime = this.$method.timest()
-				if (item.serviceStartTime && item.serviceEndTime && (sysTime <= item.serviceStartTime || this.sysTime >= item.serviceEndTime)) {
-					uni.showToast({
-						icon: 'none',
-						title: '不在学习服务期，不能进入学习'
-					})
-					return;
-				}
+				this.itemIndex = index
+				// let sysTime = this.$method.timest()
+				// if (item.serviceStartTime && item.serviceEndTime && (sysTime <= item.serviceStartTime || this.sysTime >= item.serviceEndTime)) {
+				// 	uni.showToast({
+				// 		icon: 'none',
+				// 		title: '不在学习服务期，不能进入学习'
+				// 	})
+				// 	return;
+				// }
 				uni.navigateTo({
 					url:'/pages2/bank/question_detail?id='+item.goodsId+'&orderGoodsId='+item.orderGoodsId
 				})

pages2/bank/question_detail.vue

@@ -4,7 +4,10 @@
 		<view class="top">
 			<navigator  hover-class="none" :url="'/pages2/bank/question_statistics?orderGoodsId='+orderGoodsId+'&id=' + id">
 				<view class="left">
-					<view class="title">做题统计</view>
+					<view class="title">
+						做题统计
+						<u-icon name="arrow-right"></u-icon>
+					</view>
 					<view class="progress">
 						<view class="item-left">
 							<view class="desc"><text>总进度</text></view>
@@ -66,11 +69,11 @@
 						<template v-if="item1.showList">
 							<view v-for="(item2, index2) in item1.list" :key="index2">
 								<view class="section" @click="changeItem(index1, item2.chapterExamId, item1.type, index2,item1.majorId)">
-									<image src="/static/icon/up1.png" class="icon_up" v-if="!item2.showList"></image>
-									<image src="/static/icon/down1.png" class="icon_up" v-if="item2.showList"></image>
-									<!-- <u-icon name="arrow-up" color="#999" size="24" v-if="item2.showList"></u-icon>
-									<u-icon name="arrow-down" color="#999" size="24" v-if="!item2.showList"></u-icon> -->
-									<text style="margin-left:34rpx;">{{ item2.name }}</text>
+									<!-- <image src="/static/icon/up1.png" class="icon_up" v-if="!item2.showList"></image>
+									<image src="/static/icon/down1.png" class="icon_up" v-if="item2.showList"></image> -->
+									<u-icon name="arrow-up" color="#999" size="24" v-if="!item2.showList"></u-icon>
+									<u-icon name="arrow-down" color="#999" size="24" v-if="item2.showList"></u-icon>
+									<text style="margin-left:14rpx;">{{ item2.name }}</text>
 								</view>
 								<view v-if="item2.showList">
 									<view class="article active" style="margin-left:62rpx;" v-for="(article, index3) in item2.list" :key="index3">
@@ -87,11 +90,11 @@
 
 					<template v-if="item1.type == 2">
 						<view class="section" @click="changeItem(index1, item1.majorId, item1.type,'',0)">
-							<image src="/static/icon/up1.png" class="icon_up" v-if="!item1.showList"></image>
-							<image src="/static/icon/down1.png" class="icon_up" v-if="item1.showList"></image>
-							<!-- <u-icon name="arrow-up" color="#999" size="24" v-if="item1.showList"></u-icon>
-							<u-icon name="arrow-down" color="#999" size="24" v-if="!item1.showList"></u-icon> -->
-							<text style="margin-left:34rpx;">{{ item1.name }}</text>
+							<!-- <image src="/static/icon/up1.png" class="icon_up" v-if="!item1.showList"></image>
+							<image src="/static/icon/down1.png" class="icon_up" v-if="item1.showList"></image> -->
+							<u-icon name="arrow-up" color="#999" size="24" v-if="!item1.showList"></u-icon>
+							<u-icon name="arrow-down" color="#999" size="24" v-if="item1.showList"></u-icon>
+							<text style="margin-left:14rpx;">{{ item1.name }}</text>
 						</view>
 						<view v-if="item1.showList">
 							<view class="article active" style="margin-left:64rpx;" v-for="(article, index2) in item1.list" :key="index2">
@@ -503,8 +506,8 @@ page {
 }
 
 .courseName {
-	font-size: 30rpx;
-	color:#666;
+	font-size: 24rpx;
+	color:#333;
 	white-space: nowrap;
 	overflow: hidden;
 	text-overflow: ellipsis;
@@ -513,11 +516,12 @@ page {
 .moduleItem {
 	height: 80rpx;
 	color: #333333;
-	font-size: 32rpx;
+	font-size: 24rpx;
 	line-height: 80rpx;
 	font-weight: bold;
 	display: flex;
 	justify-content: space-between;
+	border-bottom: 1rpx solid #eee;
 }
 
 .icon_up {
@@ -546,16 +550,17 @@ page {
 			}
 
 			.section {
-				font-size: 30rpx;
+				font-size: 24rpx;
 				font-family: PingFang SC;
 				font-weight: bold;
-				color: #666;
+				color: #333;
 				white-space: nowrap;
 				overflow: hidden;
 				text-overflow: ellipsis;
-				margin: 20rpx 0;
+				padding: 20rpx 0;
 				display: flex;
 				align-items: center;
+				border-bottom: 1rpx solid #eee;
 			}
 
 			.article {

pages2/wd/course.vue

@@ -1,5 +1,5 @@
 <template>
-  <view style="padding: 30rpx">
+  <view style="padding: 24rpx">
     <nav-bar title="所有课程"></nav-bar>
     <view v-if="!courseList.length">
       <u-empty text="暂无课程" mode="list"></u-empty>
@@ -21,7 +21,7 @@
         }}</view>
       </view>
       <view class="bottomBox">
-        <view class=".content_box">
+        <view class="content_box">
           <image src="/static/icon/wk_icon3.png" class="wk_icon"></image>
           学习进度：{{ item.stuAllNum + item.recordNum }}/{{
             item.secAllNum + item.examNum
@@ -30,20 +30,20 @@
         <view class="box_progress">
           <view style="width: 60%"
             ><u-line-progress
-              height="22"
+              height="32"
               :show-percent="false"
               active-color="#ff9900"
               :percent="((item.stuAllNum + item.recordNum) / (item.secAllNum + item.examNum)) * 100"
             ></u-line-progress
           ></view>
-          <view
-            ><u-button
+          <view class="learing_bt" @click="jump(item, index)">
+            进入学习
+            <!-- <u-button
               type="warning"
               size="mini"
               @click.stop="jump(item, index)"
-              >进入学习</u-button
-            ></view
-          >
+              >进入学习</u-button> -->
+            </view>
         </view>
       </view>
     </view>
@@ -283,6 +283,7 @@ export default {
       let self = this;
       this.param.goodsId = this.goodsId;
       this.param.gradeId = this.gradeId;
+      // /course/courseList查询商品下的课程列表
       this.$api.courseCourseList(this.param).then((res) => {
         if (res.data.code == 200) {
           self.courseList.push.apply(self.courseList, res.data.rows);
@@ -305,7 +306,7 @@ page {
   background: #eaeef1;
 }
 </style>
-<style scope>
+<style lang="scss" scope>
 .box_progress {
   display: flex;
   justify-content: space-between;
@@ -319,6 +320,17 @@ page {
   border-bottom-right-radius: 24rpx;
   margin: 0 auto;
   padding: 20rpx;
+  .learing_bt {
+			width: 165rpx;
+			height: 48rpx;
+			line-height: 48rpx;
+			background: #FFB102;
+			border-radius: 16rpx;
+			font-size: 24rpx;
+			font-weight: 400;
+			color: #FFFFFF;
+			text-align: center;
+		}
 }
 .content_box {
   display: flex;
@@ -339,10 +351,11 @@ page {
 .class_item {
   width: 100%;
   background: #ffffff;
-  box-shadow: 0rpx 10rpx 9rpx 1rpx rgba(165, 196, 239, 0.1);
   border-radius: 24rpx;
-  padding: 20rpx;
+  padding: 20rpx 20rpx 30rpx 20rpx;
   z-index: 999;
   position: relative;
+  background: #FFFFFF;
+  box-shadow: 0px 0px 20px 1px rgba(1,99,235,0.1000);
 }
 </style>