charge-front/src/custom-tab-bar/index.wxml

<view class="tab-bar {{hidden ? 'tab-bar-hidden' : ''}}">
  <image class="tab-bar-bg" src="/static/images/custom-tab-bar/bg.png" mode="widthFix" />
  <view class="tab-bar-main">
    <view wx:for="{{tabs}}" wx:key="index" class="tab-bar-item" data-path="{{item.path}}" data-index="{{index}}" bindtap="switchTab">
      <block wx:if="{{index === 1}}">
        <image class="image image-big" src="/static/images/custom-tab-bar/2.png"></image>
        <image class="image" style="opacity: 0;" src="/static/images/custom-tab-bar/2.png"></image>
        <view class="text {{tabIndex === index ? 'selected-color' : ''}}">{{item.text}}</view>
      </block>
      <block wx:else>
        <image wx:if="{{tabIndex === index}}" class="image" src="/static/images/custom-tab-bar/{{index+1}}-1.png"></image>
        <image wx:else class="image" src="/static/images/custom-tab-bar/{{index+1}}.png" mode="widthFix" />
        <view class="text {{tabIndex === index ? 'selected-color' : ''}}">{{item.text}}</view>
      </block>
    </view>
  </view>
  <button class="tab-bar-login" wx:if="{{!token}}" style="width: 100vw;height: var(--tab-bar-height);border: none;" open-type="getPhoneNumber" bindgetphonenumber="login"></button>
</view>

<view class="tab-bar-charge" style="height: {{dialog ? '100vh':'0px'}};" bindtap="switchDialog">
  <view style="padding-left: {{charging ? '92' : '112'}}rpx;">
    <view class="tab-bar-charge_menu" catchtouchend="scanCode" style="margin-right: {{charging ? '100' : '140'}}rpx;">
      <image class="tab-bar-charge_menu--icon" src="/static/images/custom-tab-bar/2-2.png" mode="widthFix" />
      <view class="tab-bar-charge_menu--text">扫二维码</view>
    </view>
    <view class="tab-bar-charge_menu" catchtouchend="inputCode" style="margin-right: {{charging ? '100' : '140'}}rpx;">
      <image class="tab-bar-charge_menu--icon" src="/static/images/custom-tab-bar/2-3.png" mode="widthFix" />
      <view class="tab-bar-charge_menu--text">输入编码</view>
    </view>
    <view class="tab-bar-charge_menu" catchtouchend="toCharging" wx:if="{{charging}}">
      <image class="tab-bar-charge_menu--icon" src="/static/images/custom-tab-bar/2-4.png" mode="widthFix" />
      <view class="tab-bar-charge_menu--text">充电中</view>
    </view>
  </view>
</view>