常志远 il y a 2 ans
Parent
commit
daeeb7db96
2 fichiers modifiés avec 194 ajouts et 60 suppressions
  1. 57 56
      components/ParentsTabbar.vue
  2. 137 4
      pages/parents/course/course.vue

+ 57 - 56
components/ParentsTabbar.vue

@@ -1,89 +1,90 @@
-<template >
+<template>
 	<view>
-		<u-tabbar v-model="myCurrent" :list="tabbarList" 
-		:before-switch="beforeSwitch" active-color="#0DBAC7"  ></u-tabbar>
-		
+		<u-tabbar v-model="myCurrent" :list="tabbarList" :before-switch="beforeSwitch" active-color="#0DBAC7">
+		</u-tabbar>
+
 	</view>
 </template>
 
 <script>
- 	
- 	export default {
-		name:"ParentsTabbar",
-		props:{
+	export default {
+		name: "ParentsTabbar",
+		props: {
 			current: 0,
 			elderStatus: false
 		},
 		data() {
 			return {
-				activeColor:"#5098FF",
-				oldindex:this.current,
-				 myCurrent:this.current,
-				 tabbarList: [
-					 {
-					 
-				 		iconPath: "home",
-				 		selectedIconPath: "home-fill",
-				 		text: '主页 ',
-						pagePath2:"/pages/parents/homePage/homePage",
-				 	},
-				 	{
-				 		iconPath: "bookmark",
-				 		selectedIconPath: "bookmark-fill",
-				 		text: '课程',
-						pagePath2:"/pages/parents/course/course",
-				 	},{
-				 		iconPath: "chat",
-				 		selectedIconPath: "chat-fill",
-				 		text: '消息',
-						pagePath2:"/pages/parents/news/news",
+				activeColor: "#5098FF",
+				oldindex: this.current,
+				myCurrent: this.current,
+				tabbarList: [{
+
+						iconPath: "home",
+						selectedIconPath: "home-fill",
+						text: '主页 ',
+						pagePath2: "/pages/parents/homePage/homePage",
+					},
+					{
+						iconPath: "bookmark",
+						selectedIconPath: "bookmark-fill",
+						text: '课程',
+						pagePath2: "/pages/parents/course/course",
+					}, {
+						iconPath: "chat",
+						selectedIconPath: "chat-fill",
+						text: '消息',
+						pagePath2: "/pages/parents/news/news",
 						count: 99,
-												isDot: false,
-												customIcon: false,
-				 	},
+						isDot: false,
+						customIcon: false,
+					},
 					{
 						iconPath: "account",
 						selectedIconPath: "account-fill",
 						text: '我的',
-						pagePath2:"/pages/parents/mine/mine",
+						pagePath2: "/pages/parents/mine/mine",
 					}
-			 ],
+				],
 			};
-			
-		},methods:{
-			setcount(c){
-				this.myCurrent=c
+
+		},
+		methods: {
+			setcount(c) {
+				this.myCurrent = c
 			},
-			beforeSwitch(index){
-			
-				
-				if(index==this.current){
+			beforeSwitch(index) {
+
+
+				if (index == this.current) {
 					return false
 				}
-				var url =this.tabbarList[index].pagePath2;
-				
+				var url = this.tabbarList[index].pagePath2;
+
 				uni.navigateTo({
 					url: url
 				})
-				if(index==1){
-					this.myCurrent=this.oldindex;
+				if (index == 1) {
+					this.myCurrent = this.oldindex;
 					return false;
-				}else{
+				} else {
 					return true;
 				}
-				
+
 			},
-			
-		},mounted(){
-			
-		},destroyed(){
-			
+
+		},
+		mounted() {
+
+		},
+		destroyed() {
+
 		}
-		
-		
+
+
 	}
 </script>
 
 <style>
-	 
+
 </style>

+ 137 - 4
pages/parents/course/course.vue

@@ -1,6 +1,76 @@
 <template>
 	<view>
-		course
+		<view class="head">
+			<u-search placeholder="搜索课程" :show-action="false" height="80"></u-search>
+		</view>
+		<view class="main">
+			<u-swiper :list="list"></u-swiper>
+			
+			<view class="content">
+				<view class="classify">
+					<view class="item ">
+						推荐
+					</view>
+					<view class="item chosen">
+						体育
+					</view>
+					<view class="item ">
+						声乐
+					</view>
+					<view class="item">
+						器乐
+					</view>
+					<view class="item">
+						书画
+					</view>
+					<view class="item">
+						舞蹈
+					</view>
+					<view class="item ">
+						智力
+					</view>
+					<view class="item">
+						茶艺
+					</view>
+					
+				</view>
+				<view class="details">
+					<view class="title">
+						系列全部课程
+					</view>
+					<view class="details-box">
+						<view class="item">
+							跆拳道
+						</view>
+						<view class="item">
+							围棋
+						</view>
+						<view class="item">
+							象棋
+						</view>
+						<view class="item">
+							乒乓球
+						</view>
+						<view class="item">
+							篮球
+						</view>
+						<view class="item">
+							足球
+						</view>
+						<view class="item">
+							花式跳绳
+						</view>
+						
+					</view>
+				</view>
+				
+			</view>
+		</view>
+		
+		
+		
+		
+		
 		<ParentsTabbar :current="1" ref="tabbarMain"></ParentsTabbar>
 	</view>
 </template>
@@ -13,7 +83,9 @@
 		},
 		data() {
 			return {
-				
+				list: [{
+					image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
+				}, ],
 			}
 		},
 		methods: {
@@ -22,6 +94,67 @@
 	}
 </script>
 
-<style>
-
+<style lang="scss" scoped>
+	.head{
+		padding: 20px 16px 40px 16px;
+		background-color: rgba(13, 186, 199, 1);
+	}
+    .main{
+		background-color: rgba(244, 246, 246, 1);
+		border-radius: 20px 20px 0px 0px;
+		padding: 20px 16px;
+		margin-top: -16px;
+		.content{
+			display: flex;
+			margin-top: 12px;
+			.classify{
+				background-color: #ffffff;
+				border-radius: 12px;
+				width: 28%;
+				text-align: center;
+				padding-bottom: 84px;
+				.item{
+					line-height: 32px;
+					margin-top: 14px;
+					font-size: 16px
+				}
+				.chosen{
+					width: 66.7%;
+					margin:14px auto 0;
+					border-radius: 50px;
+					background-color: rgba(13, 186, 199, 1);
+					color: #ffffff;
+				}
+			}
+			.details{
+				margin-left: 12px;
+				width: 68.3%;
+				.title{
+					color: rgba(51, 51, 51, 1);
+					font-size: 16px;
+					line-height: 44px;
+					border-radius: 12px;
+					background-color: rgba(255, 255, 255, 1);
+					text-align: center;
+					font-weight: bold;
+				}
+				.details-box{
+					display: flex;
+					flex-wrap: wrap;
+					justify-content: space-between;
+					.item{
+						
+						width: 44%;
+						line-height: 44px;
+						border-radius: 12px;
+						background-color: rgba(255, 255, 255, 1);
+						color: rgba(51, 51, 51, 1);
+						margin-top: 12px;
+						text-align: center;
+						
+					}
+				}
+			}
+		}
+	}
 </style>