<view class="custom-tab-bar">
  <view class="bar-row">
    <view class="tab-capsule">
      <block wx:for="{{tabList}}" wx:key="index">
        <view
          class="tab-item {{selectedIndex === index ? 'active' : ''}}"
          data-path="{{item.pagePath}}"
          data-index="{{index}}"
          catchtap="switchTab"
        >
          <view class="badge-container" wx:if="{{item.pagePath === 'pages/messages/messages' && badgeText}}">
            <view class="tab-badge">{{badgeText}}</view>
          </view>
          <image
            class="tab-icon"
            src="{{selectedIndex === index ? item.selectedIconPath : item.iconPath}}"
            mode="aspectFit"
          />
          <text class="tab-text">{{item.text}}</text>
        </view>
      </block>
    </view>
  </view>
</view>
