导航新增

app.js

@@ -7,6 +7,9 @@ App({
   onload() {
     wx.hideTabBar();
   },
+  onShow() {
+    wx.hideTabBar();
+  },
   onLaunch() {
     // 展示本地存储能力
     const logs = wx.getStorageSync('logs') || []
@@ -38,7 +41,7 @@ App({
       this.startTokenRefreshTimer()
     } else {
       // 未登录，显示授权弹窗
-      this.showLoginModal()
+      // this.showLoginModal()
     }
   },
 

app.json

@@ -1,7 +1,7 @@
 {
   "pages": [
-    "pages/cover/index",
     "pages/index/index",
+    "pages/cover/index",
     "pages/collection/index",
     "pages/exhibition/index",
     "pages/user/index",
@@ -36,6 +36,7 @@
     "enablePullDownRefresh": false
   },
   "tabBar": {
+    "custom": true,
     "color": "#412A12",
     "selectedColor": "#B1967B",
     "borderStyle": "black",
@@ -54,6 +55,12 @@
         "text": "展览"
       },
       {
+        "pagePath": "pages/cover/index",
+        "iconPath": "imgs/icon_ar.png",
+        "selectedIconPath": "imgs/icon_ar.png",
+        "text": "钻头列阵"
+      },
+      {
         "pagePath": "pages/collection/index",
         "iconPath": "imgs/icon_culture_normal.png",
         "selectedIconPath": "imgs/icon_culture_active.png",

custom-tab-bar/index.js

@@ -5,41 +5,69 @@ Component({
       selectedColor: "#B1967B",
       borderStyle: "black",
       backgroundColor: "#ffffff",
-      list: [{
-        "pagePath": "/pages/index/index",
-        "iconPath": "/imgs/icon_home_normal.png",
-        "selectedIconPath": "/imgs/icon_home_active.png",
-        "text": "首页"
-      },
-      {
-        "pagePath": "/pages/exhibition/index",
-        "iconPath": "/imgs/icon_exhibition_normal.png",
-        "selectedIconPath": "/imgs/icon_exhibition_active.png",
-        "text": "展览"
-      },
-      {
-        "pagePath": "/pages/collection/index",
-        "iconPath": "/imgs/icon_culture_normal.png",
-        "selectedIconPath": "/imgs/icon_culture_active.png",
-        "text": "典藏"
-      },
-      {
-        "pagePath": "/pages/user/index",
-        "iconPath": "/imgs/icon_user_normal.png",
-        "selectedIconPath": "/imgs/icon_user_active.png",
-        "text": "我的"
-      }]
+      isShowTabar: true,
+      list: [
+        {
+          "pagePath": "/pages/index/index",
+          "iconPath": "/imgs/icon_home_normal.png",
+          "selectedIconPath": "/imgs/icon_home_active.png",
+          "text": "首页"
+        },
+        {
+          "pagePath": "/pages/exhibition/index",
+          "iconPath": "/imgs/icon_exhibition_normal.png",
+          "selectedIconPath": "/imgs/icon_exhibition_active.png",
+          "text": "展览"
+        },
+        {
+          "pagePath": "/pages/cover/index",
+          "iconPath": "/imgs/icon_ar.png",
+          "selectedIconPath": "/imgs/icon_ar.png",
+          "text": "钻头列阵",
+          "center": true,
+        },
+        {
+          "pagePath": "/pages/collection/index",
+          "iconPath": "/imgs/icon_culture_normal.png",
+          "selectedIconPath": "/imgs/icon_culture_active.png",
+          "text": "藏品"
+        },
+        {
+          "pagePath": "/pages/user/index",
+          "iconPath": "/imgs/icon_user_normal.png",
+          "selectedIconPath": "/imgs/icon_user_active.png",
+          "text": "我的"
+        }
+      ]
     },
     attached() {
+      const pages = getCurrentPages() || []
+      const current = pages[pages.length - 1]
+      const route = current ? ('/' + current.route) : ''
+      const idx = this.data.list.findIndex(i => i.pagePath === route)
+      if (idx !== -1) {
+        this.setData({ selected: idx })
+      }
     },
     methods: {
       switchTab(e) {
         const data = e.currentTarget.dataset
         const url = data.path
-        wx.switchTab({url})
-        this.setData({
-          selected: data.index
-        })
+        const item = this.data.list[data.index]
+        if (item && item.navigate) {
+          wx.navigateTo({ url })
+        } else {
+          const pages = getCurrentPages() || []
+          const current = pages[pages.length - 1]
+          const currentRoute = current ? ('/' + current.route) : ''
+          // 如果已在当前页，避免重复切换导致页面重载与导航闪烁
+          if (currentRoute === url) {
+            this.setData({ selected: data.index })
+            return
+          }
+          wx.switchTab({ url })
+          // this.setData({ selected: data.index })
+        }
       }
     }
   })

custom-tab-bar/index.wxml

@@ -1,8 +1,13 @@
 <!--miniprogram/custom-tab-bar/index.wxml-->
-<view class="tab-bar">
+<view class="tab-bar" wx:if="{{isShowTabar}}">
   <view class="tab-bar-border"></view>
-  <view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">
-    <image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></image>
-    <view style="color: {{selected === index ? selectedColor : color}}">{{item.text}}</view>
+  <view wx:for="{{list}}" wx:key="index" class="tab-bar-item {{item.center ? 'tab-bar-item-center' : ''}}" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab">
+    <view wx:if="{{!item.center}}">
+      <image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></image>
+    </view>
+    <view wx:if="{{item.center}}" class="tab-bar-item-center-border">
+      <image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></image>
+    </view>
+    <view style="color: {{selected === index ? selectedColor : color}}" class="{{item.center ? 'tab-bar-item-text' : ''}}">{{item.text}}</view>
   </view>
 </view>

custom-tab-bar/index.wxss

@@ -3,7 +3,7 @@
   bottom: 0;
   left: 0;
   right: 0;
-  height: 48px;
+  height: 78px;
   background: white;
   display: flex;
   padding-bottom: env(safe-area-inset-bottom);
@@ -20,6 +20,7 @@
 }
 
 .tab-bar-item {
+  position: relative;
   flex: 1;
   text-align: center;
   display: flex;
@@ -27,12 +28,37 @@
   align-items: center;
   flex-direction: column;
 }
-
+.tab-bar-item-center{
+  flex: 1.5;
+}
+.tab-bar-item-center-border{
+  position: absolute;
+  top: -16px;
+  width: 84px;
+  height: 74px;
+  border-radius: 43px 43px 43px 43px;
+  box-shadow: 0px -4px 4px 0px rgba(0,0,0,0.25);
+  background: #fff;
+  padding-top: 10px;
+}
+.tab-bar-item-text{
+  position: absolute;
+  top: 58px;
+}
 .tab-bar-item image {
-  width: 27px;
-  height: 27px;
+  width: 48px;
+  height: 48px;
 }
 
 .tab-bar-item view {
   font-size: 10px;
 }
+
+/* 中间特殊按钮样式 */
+.tab-bar-item-center image {
+  width: 54px;
+  height: 54px;
+}
+.tab-bar-item-center view {
+  font-size: 10px;
+}

pages/collection/index.js

@@ -32,6 +32,18 @@ Page({
   },
 
   /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    if (typeof this.getTabBar === 'function' && this.getTabBar()) {
+      this.getTabBar().setData({
+        selected: 3,
+        isShowTabar: true
+      })
+    }
+  },
+
+  /**
    * 初始化数据
    */
   async initData() {

pages/cover/index.js

@@ -26,7 +26,12 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow() {
-
+    if (typeof this.getTabBar === 'function' && this.getTabBar()) {
+      this.getTabBar().setData({
+        selected: 2,
+        isShowTabar: true
+      })
+    }
   },
 
   /**

pages/cover/index.wxml

@@ -6,10 +6,10 @@
     <image class="ar-cover__btn__icon" src="./imgs/icon_ar@2x.png" />
     <view class="ar-cover__btn__label">开启AR相机</view>
   </navigator>
-  <navigator class="ar-cover__btn home" open-type="switchTab" url="/pages/index/index">
+  <!-- <navigator class="ar-cover__btn home" open-type="switchTab" url="/pages/index/index">
     <image class="ar-cover__btn__icon" src="./imgs/icon_home@2x.png" />
     <view class="ar-cover__btn__label">小程序首页</view>
-  </navigator>
+  </navigator> -->
 
   <image class="ar-cover__bg" src="./imgs/bg_home@2x-min.jpg" />
 </view>

pages/exhibition/index.js

@@ -28,6 +28,18 @@ Page({
   },
 
   /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    if (typeof this.getTabBar === 'function' && this.getTabBar()) {
+      this.getTabBar().setData({
+        selected: 1,
+        isShowTabar: true
+      })
+    }
+  },
+
+  /**
    * 页面相关事件处理函数--监听用户下拉动作
    */
   onPullDownRefresh() {

pages/exhibition/index.wxss

@@ -3,8 +3,9 @@
   background-image: url('https://klmybwg.4dage.com/mini/wxImg/bg.png');
   background-size: cover;
   background-repeat: no-repeat;
-  min-height: 100vh;
+  height: calc(100vh - 176rpx);
   box-sizing: border-box;
+  overflow: auto;
 }
 
 /* 轮播图样式 */

pages/index/index.js

@@ -29,11 +29,12 @@ Page({
     // 检查是否首次访问
     const hasVisited = wx.getStorageSync('hasVisited');
     if (!hasVisited) {
-      // 首次访问，显示loading组件并隐藏导航栏
-      // wx.hideNavigationBarLoading();
-      // wx.setNavigationBarTitle({
-      //   title: ''
-      // });
+      if(typeof this.getTabBar === 'function' && this.getTabBar()){
+        console.log(this.getTabBar());
+      this.getTabBar().setData({
+        isShowTabar: false
+      })
+    }
       wx.hideTabBar();
       this.setData({
         showLoading: true,
@@ -57,17 +58,18 @@ Page({
   onStartExplore() {
     // 设置已访问标记
     wx.setStorageSync('hasVisited', true);
-    wx.showTabBar();
+    if(typeof this.getTabBar === 'function' && this.getTabBar()){
+      this.getTabBar().setData({
+        isShowTabar: true,
+        selected: 0
+      })
+    }
+    // 显示系统TabBar以呈现自定义导航，避免加载过程闪烁
+    // wx.showTabBar();
     this.setData({
       showLoading: false,
       isFirstOpen: false
     });
-    // 恢复导航栏
-    // wx.setNavigationBarTitle({
-    //   title: '克拉玛依博物馆'
-    // });
-    // 初始化数据
-    // this.initAllData();
   },
   
   // 轮播图点击事件
@@ -307,6 +309,14 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow() {
+    // 同步高亮与显示状态（非首次打开时显示）
+    const hasVisited = wx.getStorageSync('hasVisited');
+    if (typeof this.getTabBar === 'function' && this.getTabBar()) {
+      this.getTabBar().setData({
+        selected: 0,
+        isShowTabar: !!hasVisited
+      })
+    }
     // 每次显示页面时检查登录状态
     this.checkLoginStatus();
   },

pages/index/index.wxss

@@ -2,18 +2,20 @@
 .home-container {
   position: relative;
   height: 100vh;
+  background: url('https://klmybwg.4dage.com/mini/wxImg/bg.png') no-repeat center top;
   overflow: hidden;
 }
 .all-content{
   position: absolute;
   top: 340rpx;
   width: 100vw;
-  height: calc(100vh - 360rpx);
+  height: calc(100vh - 560rpx);
   padding-top: 40rpx;
   background: url('https://klmybwg.4dage.com/mini/wxImg/bg.png') no-repeat center top;
   background-size: 100% auto;
   overflow-y: auto;
-  border-radius: 30rpx;
+  border-top-left-radius: 30rpx;
+  border-top-right-radius: 30rpx;
 }
 .home-not-overflow {
   overflow: hidden;

pages/user/index.js

@@ -24,6 +24,13 @@ Page({
   },
 
   onShow() {
+    // 同步底部导航高亮
+    if (typeof this.getTabBar === 'function' && this.getTabBar()) {
+      this.getTabBar().setData({
+        selected: 4,
+        isShowTabar: true
+      })
+    }
     // 每次显示页面时检查登录状态
     this.checkLoginStatus();
   },

project.config.json

@@ -1,6 +1,6 @@
 {
   "compileType": "miniprogram",
-  "libVersion": "3.8.7",
+  "libVersion": "3.8.10",
   "packOptions": {
     "ignore": [],
     "include": []

project.private.config.json

@@ -20,17 +20,5 @@
     "ignoreDevUnusedFiles": true
   },
   "libVersion": "3.8.10",
-  "condition": {
-    "miniprogram": {
-      "list": [
-        {
-          "name": "subPackages/ar/index",
-          "pathName": "subPackages/pages/ar/index",
-          "query": "",
-          "launchMode": "default",
-          "scene": null
-        }
-      ]
-    }
-  }
+  "condition": {}
 }

utils/util.js

@@ -49,7 +49,7 @@ const navigateToWebview = (path, mode) => {
       // 开发环境和测试环境
       development: 'https://klmybwg.4dage.com/mini/#',
       // 正式环境
-      production: 'https://kelamayi.4dage.com/mini/#'
+      production: 'https://klmybwg.4dage.com/mini/#'
     };
     
     // 获取当前环境