future
59 lines
1.2 KiB
Vue
59 lines
1.2 KiB
Vue
<template>
|
|
<view class="home-page">
|
|
<!-- 骨架屏 -->
|
|
<HomeSkeleton v-if="loading" />
|
|
|
|
<!-- 实际内容 -->
|
|
<template v-else>
|
|
<!-- Banner轮播 -->
|
|
<BannerSwiper />
|
|
|
|
<!-- 功能入口 -->
|
|
<QuickEntry />
|
|
|
|
<!-- 推荐课程 -->
|
|
<RecommendCourses />
|
|
|
|
<!-- 今日推荐 -->
|
|
<TodayRecommend />
|
|
|
|
<!-- 底部占位 -->
|
|
<view class="bottom-placeholder"></view>
|
|
|
|
<!-- TabBar -->
|
|
<TabBar />
|
|
</template>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue'
|
|
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'
|
|
import HomeSkeleton from '@/components/Skeleton/HomeSkeleton.vue'
|
|
|
|
const loading = ref(true)
|
|
|
|
onMounted(() => {
|
|
setTimeout(() => {
|
|
loading.value = false
|
|
}, 1500)
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.home-page {
|
|
min-height: 100vh;
|
|
background-color: #f0f4f8;
|
|
padding-bottom: 160rpx;
|
|
}
|
|
|
|
.bottom-placeholder {
|
|
height: 40rpx;
|
|
}
|
|
|
|
</style>
|