微信小程序页面迁移校验之前 P5任务处理之前

apps/miniprogram - 副本/miniprogram/components/board-tab-bar/board-tab-bar.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

apps/miniprogram - 副本/miniprogram/components/board-tab-bar/board-tab-bar.ts

@@ -0,0 +1,25 @@
+// 自定义底部导航栏 — 非 TabBar 页面模拟系统导航
+Component({
+  properties: {
+    /** 当前激活的 tab: task / board / my */
+    active: {
+      type: String,
+      value: 'board',
+    },
+  },
+
+  methods: {
+    onTap(e: WechatMiniprogram.TouchEvent) {
+      const tab = e.currentTarget.dataset.tab as string
+      if (tab === this.data.active) return
+
+      if (tab === 'task') {
+        wx.switchTab({ url: '/pages/task-list/task-list' })
+      } else if (tab === 'board') {
+        wx.switchTab({ url: '/pages/board-finance/board-finance' })
+      } else if (tab === 'my') {
+        wx.switchTab({ url: '/pages/my-profile/my-profile' })
+      }
+    },
+  },
+})

apps/miniprogram - 副本/miniprogram/components/board-tab-bar/board-tab-bar.wxml

@@ -0,0 +1,39 @@
+<!-- 自定义底部导航栏 — 用于非 TabBar 的看板子页面，SVG icon 忠于 H5 原型 -->
+<view class="tab-bar">
+  <view
+    class="tab-bar-item {{active === 'task' ? 'tab-bar-item--active' : ''}}"
+    bindtap="onTap"
+    data-tab="task"
+  >
+    <image
+      class="tab-bar-icon"
+      src="{{active === 'task' ? '/assets/icons/tab-task-nav-active.svg' : '/assets/icons/tab-task-nav.svg'}}"
+      mode="aspectFit"
+    />
+    <text class="tab-bar-label">任务</text>
+  </view>
+  <view
+    class="tab-bar-item {{active === 'board' ? 'tab-bar-item--active' : ''}}"
+    bindtap="onTap"
+    data-tab="board"
+  >
+    <image
+      class="tab-bar-icon"
+      src="{{active === 'board' ? '/assets/icons/tab-board-nav-active.svg' : '/assets/icons/tab-board-nav.svg'}}"
+      mode="aspectFit"
+    />
+    <text class="tab-bar-label">看板</text>
+  </view>
+  <view
+    class="tab-bar-item {{active === 'my' ? 'tab-bar-item--active' : ''}}"
+    bindtap="onTap"
+    data-tab="my"
+  >
+    <image
+      class="tab-bar-icon"
+      src="{{active === 'my' ? '/assets/icons/tab-my-nav-active.svg' : '/assets/icons/tab-my-nav.svg'}}"
+      mode="aspectFit"
+    />
+    <text class="tab-bar-label">我的</text>
+  </view>
+</view>

apps/miniprogram - 副本/miniprogram/components/board-tab-bar/board-tab-bar.wxss

@@ -0,0 +1,39 @@
+/* 自定义底部导航栏 — 模拟系统 TabBar 外观 */
+.tab-bar {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  height: 100rpx;
+  background: #ffffff;
+  border-top: 1rpx solid #eeeeee;
+  padding-bottom: env(safe-area-inset-bottom);
+  z-index: 50;
+}
+
+.tab-bar-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  flex: 1;
+  gap: 4rpx;
+}
+
+.tab-bar-icon {
+  width: 44rpx;
+  height: 44rpx;
+}
+
+.tab-bar-label {
+  font-size: 20rpx;
+  color: #8b8b8b;
+}
+
+.tab-bar-item--active .tab-bar-label {
+  color: #0052d9;
+  font-weight: 500;
+}