42 lines
1.8 KiB
Plaintext
42 lines
1.8 KiB
Plaintext
<view class="custom-tab-bar">
|
|
<view class="bar-row">
|
|
<!-- 左侧椭圆身份按钮 -->
|
|
<view class="role-switch-btn" catchtap="toggleRolePicker">
|
|
<image class="role-switch-icon" src="/images/role-switch.png" mode="aspectFit" />
|
|
<text class="role-switch-text">切换身份</text>
|
|
</view>
|
|
|
|
<!-- 右侧纯黑闪光胶囊 -->
|
|
<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">
|
|
<!-- 🔥 根据页面路径判断是否显示角标,不再写死 index -->
|
|
<view class="badge-container" wx:if="{{item.pagePath === 'pages/xiaoxi/xiaoxi' && 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 wx:if="{{showRolePicker}}" class="picker-mask" catchtap="toggleRolePicker"></view>
|
|
<view wx:if="{{showRolePicker}}" class="picker-panel">
|
|
<view class="picker-header">
|
|
<text class="picker-title">切换身份</text>
|
|
<text class="picker-close" catchtap="toggleRolePicker">✕</text>
|
|
</view>
|
|
<block wx:for="{{availableRoles}}" wx:key="key">
|
|
<view class="role-option {{currentRole === item.key ? 'active' : ''}}"
|
|
data-role="{{item.key}}" catchtap="selectRole">
|
|
<text>{{item.name}}</text>
|
|
<text wx:if="{{currentRole === item.key}}" class="check-mark">✓</text>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</view> |