完成首页布局

2026-06-01 19:57:43 +08:00
parent 2b58b672d5
commit f0d97e58d1
32 changed files with 4009 additions and 48 deletions
@@ -1,52 +1,41 @@
 <template>
-	<view class="content">
-		<image class="logo" src="/static/logo.png"></image>
-		<view class="text-area">
-			<text class="title">{{title}}</text>
-		</view>
-	</view>
+<view class="home-page">
+    <!-- Banner轮播 -->
+    <BannerSwiper />
+
+    <!-- 功能入口 -->
+    <QuickEntry />
+
+    <!-- 推荐课程 -->
+    <RecommendCourses />
+
+    <!-- 今日推荐 -->
+    <TodayRecommend />
+
+    <!-- 底部占位 -->
+    <view class="bottom-placeholder"></view>
+
+    <!-- 底部导航 -->
+    <TabBar />
+  </view>
 </template>

-<script>
-	export default {
-		data() {
-			return {
-				title: 'Hello'
-			}
-		},
-		onLoad() {
-
-		},
-		methods: {
-
-		}
-	}
+<script setup>
+import BannerSwiper from '@/components/index/BannerSwiper.vue'
+import QuickEntry from '@/components/index/QuickEntry.vue'
+import RecommendCourses from '@/components/index/RecommendCourses.vue'
+import TodayRecommend from '@/components/index/TodayRecommend.vue'
+import TabBar from '@/components/TabBar.vue'
 </script>

-<style>
-	.content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
+<style lang="scss" scoped>
+.home-page {
+  min-height: 100vh;
+  background-color: #f0f4f8;
+  padding-bottom: 160rpx;
+}

-	.logo {
-		height: 200rpx;
-		width: 200rpx;
-		margin-top: 200rpx;
-		margin-left: auto;
-		margin-right: auto;
-		margin-bottom: 50rpx;
-	}
-
-	.text-area {
-		display: flex;
-		justify-content: center;
-	}
-
-	.title {
-		font-size: 36rpx;
-		color: #8f8f94;
-	}
-</style>
+.bottom-placeholder {
+  height: 40rpx;
+}
+</style>