版本大改

subpages/main/main.wxml

@@ -33,13 +33,22 @@
       <view class="menu-tab">
         <view
           class="{{!modelList1.length ? 'menu-tab-disenable' : currentMenuTabIndex == 0 ? 'menu-tab-item-active' :  'menu-tab-item'}}"
-          data-index="0" bindtap="checkMenuTap">起床模式</view>
+          data-index="0" bindtap="checkMenuTap">
+          <image class="menu-tab-icon" src="/subpages/images/ic_qcms.png" />
+          <text class="menu-tab-title">起床模式</text>
+        </view>
         <view
           class="{{!modelList2.length ? 'menu-tab-disenable' : currentMenuTabIndex == 1 ? 'menu-tab-item-active' : 'menu-tab-item'}}"
-          data-index="1" bindtap="checkMenuTap">观影模式</view>
+          data-index="1" bindtap="checkMenuTap">
+          <image class="menu-tab-icon" src="/subpages/images/ic_gyms.png" />
+          <text class="menu-tab-title">观影模式</text>
+        </view>
         <view
           class="{{!modelList3.length ? 'menu-tab-disenable' : currentMenuTabIndex == 2 ? 'menu-tab-item-active' :  'menu-tab-item'}}"
-          data-index="2" bindtap="checkMenuTap">睡眠模式</view>
+          data-index="2" bindtap="checkMenuTap">
+          <image class="menu-tab-icon" src="/subpages/images/ic_smms.png" />
+          <text class="menu-tab-title">睡眠模式</text>
+        </view>
       </view>
       <view wx:if="{{isLoading}}" class="loading-container">
         <text class="loading-text">数据正在加载，请耐心等待...</text>

subpages/main/main.wxss

@@ -1063,15 +1063,18 @@ page {
   margin: 40rpx;
   align-items: center;
   flex-wrap: nowrap;
+  gap: 24rpx;
   border-radius: 40rpx;
 }
 
 .menu-tab-item {
   font-size: 28rpx;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
   padding: 14rpx 20rpx;
   flex: auto;
-  text-align: center;
-  margin: 0 12rpx;
   background: #FFFFFF;
   white-space: nowrap;
   border-radius: 16rpx;
@@ -1081,22 +1084,41 @@ page {
 .menu-tab-disenable {
   font-size: 28rpx;
   padding: 14rpx 20rpx;
-  margin: 0 12rpx;
+  flex: auto;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
   white-space: nowrap;
   border-radius: 16rpx;
   color: #cccccc;
+  filter: grayscale(100%);
 }
 
 .menu-tab-item-active {
   color: #FFFFFF;
   font-size: 28rpx;
+  flex: auto;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
   padding: 14rpx 20rpx;
   white-space: nowrap;
   border-radius: 16rpx;
-  margin: 0 12rpx;
   background: #0BC3AA;
 }
 
+.menu-tab-icon {
+  width: 40rpx;
+  height: 40rpx;
+  display: block;
+}
+
+.menu-tab-title {
+  margin-left: 16rpx;
+}
+
 .dialog-sure-btn {
   position: absolute;
   width: 312rpx;