From a083681697e957ae4d41194df3c91afdae264281 Mon Sep 17 00:00:00 2001
From: tsui110 <tsui110@meiyou.email>
Date: Tue, 6 Jan 2026 13:02:51 +0800
Subject: [PATCH] =?UTF-8?q?feat=20=E4=B8=8A=E6=9E=B6=E6=8A=96=E9=9F=B3?=
 =?UTF-8?q?=E5=B9=B3=E5=8F=B0=E7=9A=84=E5=90=84=E7=B1=BB=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 App.vue                               |  17 +++++
 components/custom-tab-bar-toutiao.vue |  93 +++++++++++++++++++++++
 components/custom-tab-bar.vue         | 105 ++++++++++++++++++++++++++
 pages.json                            |   1 +
 pages/cabinet/index.vue               |  15 ++++
 pages/index/index.vue                 |  22 ++++++
 pages/mine/index.vue                  |  44 +++++++++--
 pages/shop/index.vue                  |  18 ++++-
 8 files changed, 309 insertions(+), 6 deletions(-)
 create mode 100644 components/custom-tab-bar-toutiao.vue
 create mode 100644 components/custom-tab-bar.vue

diff --git a/App.vue b/App.vue
index 1a71f18..1a74b74 100644
--- a/App.vue
+++ b/App.vue
@@ -1,3 +1,4 @@
+<script>
 import { getPublicConfig } from '@/api/appUser'
 
 export default {
@@ -18,6 +19,22 @@ export default {
 		}).catch(err => {
 			console.warn('Failed to load public config:', err)
 		})
+
+		// #ifdef MP-TOUTIAO
+		// 抖音平台：跳转到"我的"页面作为首页
+		// 检查是否已经登录，如果未登录则跳转到登录页
+		const token = uni.getStorageSync('token')
+		if (!token) {
+			uni.reLaunch({
+				url: '/pages/login/index'
+			})
+		} else {
+			// 已登录，跳转到我的页面
+			uni.reLaunch({
+				url: '/pages/mine/index'
+			})
+		}
+		// #endif
 	},
 	onShow: function() {
 		console.log('App Show')
diff --git a/components/custom-tab-bar-toutiao.vue b/components/custom-tab-bar-toutiao.vue
new file mode 100644
index 0000000..c4e8b33
--- /dev/null
+++ b/components/custom-tab-bar-toutiao.vue
@@ -0,0 +1,93 @@
+<template>
+  <view class="custom-tab-bar">
+    <view class="tab-bar-item" @tap="switchTab('pages/shop/index')">
+      <image class="tab-icon" :src="selected === 0 ? '/static/tab/shop_active.png' : '/static/tab/shop.png'" mode="aspectFit"></image>
+      <text class="tab-text" :class="{ active: selected === 0 }">商城</text>
+    </view>
+
+    <view class="tab-bar-item" @tap="switchTab('pages/cabinet/index')">
+      <image class="tab-icon" :src="selected === 1 ? '/static/tab/box_active.png' : '/static/tab/box.png'" mode="aspectFit"></image>
+      <text class="tab-text" :class="{ active: selected === 1 }">盒柜</text>
+    </view>
+
+    <view class="tab-bar-item" @tap="switchTab('pages/mine/index')">
+      <image class="tab-icon" :src="selected === 2 ? '/static/tab/profile_active.png' : '/static/tab/profile.png'" mode="aspectFit"></image>
+      <text class="tab-text" :class="{ active: selected === 2 }">我的</text>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      selected: 2 // 默认选中"我的"
+    }
+  },
+  mounted() {
+    this.updateSelected()
+  },
+  onShow() {
+    this.updateSelected()
+  },
+  methods: {
+    updateSelected() {
+      const pages = getCurrentPages()
+      if (pages.length > 0) {
+        const currentPage = pages[pages.length - 1]
+        const route = currentPage.route
+
+        if (route === 'pages/shop/index') this.selected = 0
+        else if (route === 'pages/cabinet/index') this.selected = 1
+        else if (route === 'pages/mine/index') this.selected = 2
+      }
+    },
+    switchTab(url) {
+      uni.switchTab({
+        url: '/' + url
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.custom-tab-bar {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 100rpx;
+  background: #FFFFFF;
+  border-top: 1rpx solid #E5E5E5;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  padding-bottom: env(safe-area-inset-bottom);
+  z-index: 999;
+}
+
+.tab-bar-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+.tab-icon {
+  width: 48rpx;
+  height: 48rpx;
+  margin-bottom: 4rpx;
+}
+
+.tab-text {
+  font-size: 22rpx;
+  color: #7A7E83;
+
+  &.active {
+    color: #007AFF;
+  }
+}
+</style>
diff --git a/components/custom-tab-bar.vue b/components/custom-tab-bar.vue
new file mode 100644
index 0000000..279d78a
--- /dev/null
+++ b/components/custom-tab-bar.vue
@@ -0,0 +1,105 @@
+<template>
+  <!-- #ifndef MP-TOUTIAO -->
+  <view class="custom-tab-bar">
+    <view class="tab-bar-item" @tap="switchTab('pages/index/index')">
+      <image class="tab-icon" :src="selected === 0 ? '/static/tab/home_active.png' : '/static/tab/home.png'" mode="aspectFit"></image>
+      <text class="tab-text" :class="{ active: selected === 0 }">首页</text>
+    </view>
+
+    <view class="tab-bar-item" @tap="switchTab('pages/shop/index')">
+      <image class="tab-icon" :src="selected === 1 ? '/static/tab/shop_active.png' : '/static/tab/shop.png'" mode="aspectFit"></image>
+      <text class="tab-text" :class="{ active: selected === 1 }">商城</text>
+    </view>
+
+    <view class="tab-bar-item" @tap="switchTab('pages/cabinet/index')">
+      <image class="tab-icon" :src="selected === 2 ? '/static/tab/box_active.png' : '/static/tab/box.png'" mode="aspectFit"></image>
+      <text class="tab-text" :class="{ active: selected === 2 }">盒柜</text>
+    </view>
+
+    <view class="tab-bar-item" @tap="switchTab('pages/mine/index')">
+      <image class="tab-icon" :src="selected === 3 ? '/static/tab/profile_active.png' : '/static/tab/profile.png'" mode="aspectFit"></image>
+      <text class="tab-text" :class="{ active: selected === 3 }">我的</text>
+    </view>
+  </view>
+  <!-- #endif -->
+</template>
+
+<script>
+export default {
+  // #ifndef MP-TOUTIAO
+  data() {
+    return {
+      selected: 0 // 默认选中"首页"
+    }
+  },
+  mounted() {
+    this.updateSelected()
+  },
+  onShow() {
+    this.updateSelected()
+  },
+  methods: {
+    updateSelected() {
+      const pages = getCurrentPages()
+      if (pages.length > 0) {
+        const currentPage = pages[pages.length - 1]
+        const route = currentPage.route
+
+        if (route === 'pages/index/index') this.selected = 0
+        else if (route === 'pages/shop/index') this.selected = 1
+        else if (route === 'pages/cabinet/index') this.selected = 2
+        else if (route === 'pages/mine/index') this.selected = 3
+      }
+    },
+    switchTab(url) {
+      uni.switchTab({
+        url: '/' + url
+      })
+    }
+  }
+  // #endif
+}
+</script>
+
+<style lang="scss" scoped>
+/* #ifndef MP-TOUTIAO */
+.custom-tab-bar {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 100rpx;
+  background: #FFFFFF;
+  border-top: 1rpx solid #E5E5E5;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  padding-bottom: env(safe-area-inset-bottom);
+  z-index: 999;
+}
+
+.tab-bar-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+}
+
+.tab-icon {
+  width: 48rpx;
+  height: 48rpx;
+  margin-bottom: 4rpx;
+}
+
+.tab-text {
+  font-size: 22rpx;
+  color: #7A7E83;
+
+  &.active {
+    color: #007AFF;
+  }
+}
+/* #endif */
+</style>
diff --git a/pages.json b/pages.json
index 5e99261..11a0dba 100644
--- a/pages.json
+++ b/pages.json
@@ -219,6 +219,7 @@
 		}
 	],
 	"tabBar": {
+		"custom": true,
 		"color": "#7A7E83",
 		"selectedColor": "#007AFF",
 		"backgroundColor": "#FFFFFF",
diff --git a/pages/cabinet/index.vue b/pages/cabinet/index.vue
index c98200d..41f9982 100644
--- a/pages/cabinet/index.vue
+++ b/pages/cabinet/index.vue
@@ -2,6 +2,15 @@
   <view class="wrap">
     <!-- 顶部装饰背景 - 漂浮光球 -->
     <view class="bg-decoration"></view>
+
+    <!-- 自定义 tabBar -->
+    <!-- #ifdef MP-TOUTIAO -->
+    <custom-tab-bar-toutiao />
+    <!-- #endif -->
+    <!-- #ifndef MP-TOUTIAO -->
+    <custom-tab-bar />
+    <!-- #endif -->
+
     <!-- 顶部 Tab -->
     <view class="tabs glass-card">
       <view class="tab-item" :class="{ active: currentTab === 0 }" @tap="switchTab(0)">
@@ -166,6 +175,12 @@ import { onShow, onReachBottom, onShareAppMessage, onPullDownRefresh } from '@dc
 import { getInventory, getProductDetail, redeemInventory, requestShipping, cancelShipping, listAddresses, getShipments, createAddressShare } from '@/api/appUser'
 import { vibrateShort } from '@/utils/vibrate.js'
 import { checkPhoneBound, checkPhoneBoundSync } from '@/utils/checkPhone.js'
+// #ifdef MP-TOUTIAO
+import customTabBarToutiao from '@/components/custom-tab-bar-toutiao.vue'
+// #endif
+// #ifndef MP-TOUTIAO
+import customTabBar from '@/components/custom-tab-bar.vue'
+// #endif
 
 const currentTab = ref(0)
 const aggregatedList = ref([])
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 876c2cd..afa185b 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -6,6 +6,14 @@
     <!-- 品牌级背景装饰系统 - 统一漂浮光球 -->
     <view class="bg-decoration"></view>
 
+    <!-- 自定义 tabBar -->
+    <!-- #ifdef MP-TOUTIAO -->
+    <custom-tab-bar-toutiao />
+    <!-- #endif -->
+    <!-- #ifndef MP-TOUTIAO -->
+    <custom-tab-bar />
+    <!-- #endif -->
+
     <!-- 顶部导航栏 (搜索) -->
     <view class="nav-header">
       <!-- 品牌标识已按需移除 -->
@@ -54,6 +62,7 @@
         </view>
         <view class="gameplay-grid-v2">
           <!-- 上排：两大核心 -->
+          <!-- #ifndef MP-TOUTIAO -->
           <view class="grid-row-top">
             <view class="game-card-large card-yifan" @tap="navigateTo('/pages-activity/activity/list/index?category=一番赏')">
                <view class="card-bg-decoration"></view>
@@ -71,6 +80,7 @@
                </view>
             </view>
           </view>
+          <!-- #endif -->
           
           <!-- 下排：三小功能 -->
           <view class="grid-row-bottom">
@@ -133,10 +143,22 @@
 import { authRequest, request } from '../../utils/request.js'
 import SplashScreen from '@/components/SplashScreen.vue'
 import { checkPhoneBound, checkPhoneBoundSync } from '../../utils/checkPhone.js'
+// #ifdef MP-TOUTIAO
+import customTabBarToutiao from '@/components/custom-tab-bar-toutiao.vue'
+// #endif
+// #ifndef MP-TOUTIAO
+import customTabBar from '@/components/custom-tab-bar.vue'
+// #endif
 
 export default {
   components: {
     SplashScreen
+    // #ifdef MP-TOUTIAO
+    , customTabBarToutiao
+    // #endif
+    // #ifndef MP-TOUTIAO
+    , customTabBar
+    // #endif
   },
   data() {
     return {
diff --git a/pages/mine/index.vue b/pages/mine/index.vue
index 7cafb79..3ced4e2 100644
--- a/pages/mine/index.vue
+++ b/pages/mine/index.vue
@@ -3,6 +3,14 @@
     <!-- 顶部背景装饰 -->
     <view class="bg-decoration"></view>
 
+    <!-- 自定义 tabBar -->
+    <!-- #ifdef MP-TOUTIAO -->
+    <custom-tab-bar-toutiao />
+    <!-- #endif -->
+    <!-- #ifndef MP-TOUTIAO -->
+    <custom-tab-bar />
+    <!-- #endif -->
+
     <!-- 头部区域 -->
     <view class="header-section">
       <view class="user-info-card glass-card">
@@ -187,6 +195,14 @@
             </view>
             <text class="menu-label">{{ douyinUserId ? '已绑定' : '绑定抖音' }}</text>
          </view>
+         <!-- #ifdef MP-TOUTIAO -->
+         <view class="menu-item" @click="toMinesweeper">
+            <view class="menu-icon-box">
+              <image class="menu-icon-img" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI0OCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMzMzMiIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xMCAxNGwtNiA2Ii8+PHBhdGggZD0iTTE0IDEwbDYgLTYiLz48cGF0aCBkPSJNMTEuNSAxMmwzIDNsLTMgM2wtMy0zeiIvPjxwYXRoIGQ9Ik0xMCAxNGw2IDZtLTItMmwtNiA2bTYtNjYgNm0tMi0ybDItMiIvPjwvc3ZnPg==" mode="aspectFit"></image>
+            </view>
+            <text class="menu-label">扫雷</text>
+         </view>
+         <!-- #endif -->
       </view>
     </view>
 
@@ -477,8 +493,22 @@ import {
   getUserTasks, getTaskProgress, getInviteRecords, modifyUser, getUserProfile, bindDouyinID
 } from '../../api/appUser.js'
 import { checkPhoneBoundSync } from '../../utils/checkPhone.js'
+// #ifdef MP-TOUTIAO
+import customTabBarToutiao from '@/components/custom-tab-bar-toutiao.vue'
+// #endif
+// #ifndef MP-TOUTIAO
+import customTabBar from '@/components/custom-tab-bar.vue'
+// #endif
 
 export default {
+  components: {
+    // #ifdef MP-TOUTIAO
+    customTabBarToutiao
+    // #endif
+    // #ifndef MP-TOUTIAO
+    customTabBar
+    // #endif
+  },
   data() {
     return {
       userId: '',
@@ -946,7 +976,7 @@ export default {
     },
     toBindDouyinOrder() {
       if (!this.checkPhoneBound()) return
-      
+
       // 检查是否已绑定
       if (this.douyinUserId) {
         uni.showToast({
@@ -955,7 +985,7 @@ export default {
         })
         return
       }
-      
+
       uni.showModal({
         title: '绑定抖音',
         editable: true,
@@ -967,17 +997,17 @@ export default {
               uni.showToast({ title: '抖音号不能为空', icon: 'none' })
               return
             }
-            
+
             try {
               uni.showLoading({ title: '绑定中...' })
               const data = await bindDouyinID(douyinId)
               this.douyinUserId = data.douyin_id
-              
+
               // 更新缓存
               const userInfo = uni.getStorageSync('user_info') || {}
               userInfo.douyin_user_id = data.douyin_id
               uni.setStorageSync('user_info', userInfo)
-              
+
               uni.hideLoading()
               uni.showToast({ title: '绑定成功', icon: 'success' })
             } catch (err) {
@@ -988,6 +1018,10 @@ export default {
         }
       })
     },
+    toMinesweeper() {
+      if (!this.checkPhoneBound()) return
+      uni.navigateTo({ url: '/pages-game/game/minesweeper/index' })
+    },
     handleInvite() {
       const code = this.getInviteCode()
       const path = this.getInviteSharePath()
diff --git a/pages/shop/index.vue b/pages/shop/index.vue
index 8618642..9baa30e 100644
--- a/pages/shop/index.vue
+++ b/pages/shop/index.vue
@@ -1,7 +1,15 @@
 <template>
   <view class="page">
     <view class="bg-decoration"></view>
-    
+
+    <!-- 自定义 tabBar -->
+    <!-- #ifdef MP-TOUTIAO -->
+    <custom-tab-bar-toutiao />
+    <!-- #endif -->
+    <!-- #ifndef MP-TOUTIAO -->
+    <custom-tab-bar />
+    <!-- #endif -->
+
     <!-- 顶部固定区域 -->
     <view class="header-section">
       <view class="search-box">
@@ -164,6 +172,14 @@ import { onShow, onReachBottom } from '@dcloudio/uni-app'
 import { ref, watch, onUnmounted } from 'vue'
 import { getStoreItems, redeemProductByPoints, redeemCouponByPoints, redeemItemCardByPoints } from '../../api/appUser'
 import { checkPhoneBound, checkPhoneBoundSync } from '../../utils/checkPhone.js'
+// #ifdef MP-TOUTIAO
+import customTabBarToutiao from '@/components/custom-tab-bar-toutiao.vue'
+// #endif
+// #ifndef MP-TOUTIAO
+import customTabBar from '@/components/custom-tab-bar.vue'
+// #endif
+
+// 由于是 setup 语法，组件会自动注册，无需手动声明
 
 const loading = ref(false)
 const keyword = ref('')