perf: 优化页面

packages/app/src/pages/home/index.vue

@@ -1,5 +1,8 @@
 <template>
-  <view class="home-page">
+  <view class="home-page" :style="pageStyle">
+    <!-- ──────────── Custom nav bar ──────────── -->
+    <CustomNavBar title="场馆首页" />
+
     <!-- Pull-to-refresh wrapper -->
     <scroll-view
       class="page-scroll"
@@ -36,9 +39,10 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 import { onShow } from '@dcloudio/uni-app'
 
+import CustomNavBar from '../../components/CustomNavBar.vue'
 import BrandBanner from '../../components/BrandBanner.vue'
 import StudioInfo from '../../components/StudioInfo.vue'
 import QuickEntry from '../../components/QuickEntry.vue'
@@ -53,6 +57,24 @@ const userStore = useUserStore()
 const studioStore = useStudioStore()
 const bookingStore = useBookingStore()
 
+// ─── Layout ───────────────────────────────────────────────
+const navBarHeight = ref('64px')
+
+function updateLayout() {
+  const sysInfo = uni.getSystemInfoSync()
+  const ratio = sysInfo.windowWidth / 750
+  const statusBarPx = sysInfo.statusBarHeight ?? 20
+  const navTitlePx = 88 * ratio
+  const navBarPx = Math.round(statusBarPx + navTitlePx)
+  navBarHeight.value = `${navBarPx}px`
+}
+
+updateLayout()
+
+const pageStyle = computed(() => ({
+  '--nav-bar-height': navBarHeight.value,
+}))
+
 const refreshing = ref(false)
 const cardShopRef = ref<InstanceType<typeof CardShop> | null>(null)
 const cardShopAnchorId = 'card-shop-anchor'
@@ -99,10 +121,11 @@ function scrollToCardShop() {
 .home-page {
   min-height: 100vh;
   background: #f5f5f5;
+  padding-top: var(--nav-bar-height);
 }
 
 .page-scroll {
-  height: 100vh;
+  height: calc(100vh - var(--nav-bar-height));
 }
 
 .section-divider {