修改界面中，临时提交

2026-10-02 10:28:44 +08:00
parent 089e0eb081
commit 55a9c7e3e8
41 changed files with 2458 additions and 451 deletions
@@ -0,0 +1,39 @@
+// 自定义 tabBar：原生 tabBar 只能放 PNG 位图，三个图标分别是
+// 实心"手托心" / 气泡里塞"AI"字 / 线框人形，风格互相打架。
+// 改用 TDesign 图标字体后，三个 tab 走同一套线性笔触，只靠颜色区分选中态。
+Component({
+  data: {
+    selected: 0, // 当前选中项，由各 tab 页在 onShow 里同步
+    activeColor: '#C2410C', // 选中：暖橙深一档，白底 4.69:1，过 WCAG AA 正文标准
+    inactiveColor: '#7A7068', // 未选中：暖灰，白底 4.83:1，过 WCAG AA 正文标准
+    list: [{
+      pagePath: '/pages/home/index',
+      text: '首页',
+      icon: 'home'
+    }, {
+      pagePath: '/pages/ai/aichat',
+      text: 'AI客服',
+      icon: 'chat'
+    }, {
+      pagePath: '/pages/mine/mine',
+      text: '我的',
+      icon: 'user'
+    }]
+  },
+
+  methods: {
+    onTap(e) {
+      const {
+        index,
+        path
+      } = e.currentTarget.dataset
+      // 重复点击当前 tab 不做跳转，避免页面被重置
+      if (index === this.data.selected) {
+        return
+      }
+      wx.switchTab({
+        url: path
+      })
+    }
+  }
+})
@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "t-icon": "tdesign-miniprogram/icon/icon"
+  }
+}
@@ -0,0 +1,18 @@
+<view class="tab-bar">
+  <view
+    class="tab-item {{ selected === index ? 'is-active' : '' }}"
+    wx:for="{{ list }}"
+    wx:key="pagePath"
+    data-index="{{ index }}"
+    data-path="{{ item.pagePath }}"
+    bindtap="onTap"
+  >
+    <!-- 三个 tab 共用同一套线性图标，选中态只换颜色、不换图形 -->
+    <t-icon
+      name="{{ item.icon }}"
+      size="44rpx"
+      color="{{ selected === index ? activeColor : inactiveColor }}"
+    />
+    <text class="tab-text">{{ item.text }}</text>
+  </view>
+</view>
@@ -0,0 +1,33 @@
+/* 自定义 tabBar 脱离文档流，fixed 在底部；
+   各 tab 页需自备底部占位（见 home / aichat / mine 的底部留白），否则内容会被盖住 */
+.tab-bar {
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 100;
+  display: flex;
+  padding: 12rpx 0 calc(12rpx + env(safe-area-inset-bottom));
+  background: #FFFFFF;
+  border-top: 2rpx solid #F0E9E0;
+}
+
+.tab-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.tab-text {
+  margin-top: 6rpx;
+  /* 与全局约束一致：中文正文不小于 24rpx(12px) */
+  font-size: 24rpx;
+  line-height: 1;
+  color: #7A7068;
+}
+
+.tab-item.is-active .tab-text {
+  color: #C2410C;
+  font-weight: 600;
+}