<wxs src="../wxs/utils.wxs" module="utils" />
<wxs src="./index.wxs" module="computed" />

<view wx:if="{{ fixed && placeholder }}" style="height: {{ height }}px;" />

<view class="{{ utils.bem('nav-bar', { fixed }) }} custom-class {{ border ? 'van-hairline--bottom' : '' }}" style="{{ computed.barStyle({ zIndex, statusBarHeight, safeAreaInsetTop }) }}; color:{{color}}; background:{{background}}; {{ customStyle }}">
  <view class="van-nav-bar__content">
    <view class="van-nav-bar__left" style="padding:0 20rpx;height:{{menuHeight}}px;margin-top: {{menuTop}}px;border-radius:{{menuHeight/2}}px;border: 1px solid {{borderColor}};">
      <block wx:if="{{ back || leftText || homeButton}}">
        <block wx:if="{{back || leftText}}">
          <van-icon wx:if="{{ back }}" size="22px" name="arrow-left" custom-class="van-nav-bar__arrow" bindtap="back" color="{{iconColor}}"/>
          <view wx:if="{{ leftText }}" class="van-nav-bar__text" hover-class="van-nav-bar__text--hover" hover-stay-time="70" bindtap="back">{{ leftText }}</view>
        </block>
        <!-- 返回首页 -->
        <view wx:if="{{homeButton}}" style="height: 34rpx;margin:0 20rpx;border-right: 1px solid {{borderColor}};"></view>
        <block wx:if="{{homeButton}}">
          <van-icon size="22px" name="wap-home" custom-class="van-nav-bar__home" bindtap="home" color="{{iconColor}}"/>
        </block>
      </block>
      <slot wx:else name="left" />
    </view>
    <view class="van-nav-bar__title title-class van-ellipsis" style="color:{{color}};">
      <block wx:if="{{ title }}">{{ title }}</block>
      <slot wx:else name="title" />
    </view>
    <view class="van-nav-bar__right" bind:tap="onClickRight">
      <view wx:if="{{ rightText }}" class="van-nav-bar__text" hover-class="van-nav-bar__text--hover" hover-stay-time="70">{{ rightText }}</view>
      <slot wx:else name="right" />
    </view>
  </view>
</view>