feat: 完成分类页开发

miniprogram/pages/home/home.data.ts

@@ -46,6 +46,7 @@ export type HomeDisplayDataset = {
 const HOME_CATEGORY_TABS = [
     { id: 'all', name: '全部' },
     { id: 'math', name: '数感启蒙' },
+    { id: 'pinyin', name: '汉语拼音' },
     { id: 'puzzle', name: '益智游戏' },
     { id: 'chinese', name: '趣味识字' },
     { id: 'english', name: '英语启蒙' },

miniprogram/pages/home/home.json

@@ -6,6 +6,7 @@
     "backgroundColor": "#FEF6E7",
     "enablePullDownRefresh": false,
     "usingComponents": {
+        "nav-bar": "/components3.0/nav-bar/nav-bar",
         "category-tabs": "/components3.0/category-tabs/category-tabs",
         "van-icon": "@vant/weapp/icon/index"
     }

miniprogram/pages/home/home.less

@@ -11,43 +11,6 @@
     color: @text-secondary;
 }
 
-.home-nav {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    z-index: 100;
-    background: fade(@bg-header, 85%);
-    backdrop-filter: blur(40rpx);
-    -webkit-backdrop-filter: blur(40rpx);
-    box-shadow: 0 2rpx 12rpx rgba(50, 46, 37, 0.05);
-    box-sizing: content-box;
-}
-
-.home-nav__inner {
-    height: @nav-inner-height;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    padding: 0 16px;
-    gap: 10px;
-}
-
-.home-nav__logo {
-    width: 32px;
-    height: 32px;
-    flex-shrink: 0;
-    border-radius: 16px;
-}
-
-.home-nav__name {
-    font-size: @fs-nav-title;
-    font-weight: @fw-nav-title;
-    color: @color-nav-title;
-    letter-spacing: @ls-nav-title;
-    line-height: 1;
-}
-
 .home-body {
     width: 100%;
     box-sizing: border-box;

miniprogram/pages/home/home.ts

@@ -106,8 +106,6 @@ console.log('HOME_SECTIONS', HOME_SECTIONS);
 
 Page({
     data: {
-        statusBarHeight: win.statusBarHeight,
-        navBlockHeight: win.statusBarHeight + NAV_INNER_PX,
         searchPlaceholder: HOME_DATA.searchPlaceholder,
         tabs: HOME_TABS,
         activeTab: 'all',

miniprogram/pages/home/home.wxml

@@ -1,15 +1,7 @@
 <view class="home-page">
-    <view class="home-nav" style="padding-top: {{statusBarHeight}}px;">
-        <view class="home-nav__inner">
-            <image
-                src="/assets/imgs/doodle-logo.png"
-                mode="aspectFill"
-                class="home-nav__logo" />
-            <text class="home-nav__name">涂鸦丫</text>
-        </view>
-    </view>
+    <nav-bar title="" />
 
-    <view class="home-body" style="padding-top: {{navBlockHeight}}px;">
+    <view class="home-body">
         <view class="home-search-wrap">
             <view class="home-search">
                 <van-icon