<wxs
  src="./index.wxs"
  module="utils"
></wxs>
<wxs
  src="../_util/isPropsEmpty.wxs"
  module="u"
></wxs>
<view
  wx:if="{{visible}}"
  class="ant-guide-tour {{className || ''}}"
  style="{{style || ''}}"
>
  <ant-mask
    show
    className="{{maskClassName}}"
    style="z-index:9999;{{maskStyle || ''}}"
  ></ant-mask>
  <ant-icon
    type="CloseOutline"
    className="ant-guide-tour-clear"
    bindtap="onCancel"
  ></ant-icon>
  <view class="ant-guide-tour-button">
    <ant-button
      wx:if="{{utils.checkShowJump(mixin.value, items)}}"
      inline
      size="small"
      bindtap="onCancel"
    >{{u.isPropsEmpty(jumpText) ? locale.guideTour.jumpText : jumpText}}</ant-button>
    <ant-button
      wx:if="{{utils.checkShowPrev(mixin.value, items)}}"
      inline
      size="small"
      bindtap="onPrev"
      data-current-value="{{mixin.value}}"
    >{{u.isPropsEmpty(prevStepText) ? locale.guideTour.prevStepText : prevStepText}}</ant-button>
    <ant-button
      wx:if="{{utils.checkShowNext(mixin.value, items)}}"
      inline
      size="small"
      bindtap="onNext"
      data-current-value="{{mixin.value}}"
    >{{u.isPropsEmpty(nextStepText) ? locale.guideTour.nextStepText : nextStepText}}</ant-button>
    <ant-button
      wx:if="{{utils.checkShowKnow(mixin.value, items)}}"
      inline
      size="small"
      bindtap="onCancel"
    >{{u.isPropsEmpty(gotItText) ? locale.guideTour.gotItText : gotItText}}</ant-button>
  </view>
  <block wx:if="{{swiperable}}">
    <view class="ant-guide-tour-indicator">
      <block
        wx:for="{{items}}"
        wx:for-index="index"
        wx:for-item="item"
        wx:key="imageUrl"
      >
        <view class="ant-guide-tour-indicator-dot {{index === mixin.value ? 'ant-guide-tour-indicator-dot-active' : ''}}"></view>
      </block>
    </view>
    <swiper
      class="ant-guide-tour-swiper"
      current="{{mixin.value}}"
      adjustHeight="none"
      style="height: 100vh"
      bindchange="onSwiperChange"
    >
      <block
        wx:for="{{items}}"
        wx:for-index="index"
        wx:for-item="item"
        wx:key="imageUrl"
      >
        <swiper-item>
          <view
            class="ant-guide-tour-item {{item.className || ''}}"
            style="top:{{item.top}}px; left:{{item.left}}px"
          >
            <image
              wx:if="{{item.imageUrl}}"
              class="ant-guide-tour-item-img"
              src="{{item.imageUrl}}"
              style="{{item.imageStyle}}"
              mode="{{item.imageMode}}"
            ></image>
            <slot
              name="step"
              wx:else
              index="{{mixin.current}}"
            ></slot>
          </view>
        </swiper-item>
      </block>
    </swiper>
  </block>
  <block wx:else>
    <block
      wx:for="{{items}}"
      wx:for-index="index"
      wx:for-item="item"
      wx:key="imageUrl"
    >
      <view
        wx:if="{{mixin.value === index}}"
        class="ant-guide-tour-item {{item.className || ''}}"
        style="top:{{item.top}}px; left:{{item.left}}px"
      >
        <image
          wx:if="{{item.imageUrl}}"
          class="ant-guide-tour-item-img"
          src="{{item.imageUrl}}"
          style="{{item.imageStyle}}"
          mode="{{item.imageMode}}"
        ></image>
        <slot
          name="step"
          wx:else
          index="{{index}}"
        ></slot>
      </view>
    </block>
  </block>
</view>