126 lines
3.0 KiB
XML
126 lines
3.0 KiB
XML
<import-sjs
|
|
from="./index.sjs"
|
|
name="utils"
|
|
></import-sjs>
|
|
<view
|
|
a:if="{{visible}}"
|
|
class="ant-guide-tour {{className || ''}}"
|
|
style="{{style || ''}}"
|
|
>
|
|
<mask
|
|
show
|
|
className="{{maskClassName}}"
|
|
style="z-index:9999;{{maskStyle || ''}}"
|
|
></mask>
|
|
<ant-icon
|
|
type="CloseOutline"
|
|
className="ant-guide-tour-clear"
|
|
onTap="onCancel"
|
|
></ant-icon>
|
|
<view class="ant-guide-tour-button">
|
|
<ant-button
|
|
a:if="{{utils.checkShowJump(mixin.value, items)}}"
|
|
inline
|
|
size="small"
|
|
onTap="onCancel"
|
|
>
|
|
{{jumpText}}
|
|
</ant-button>
|
|
<ant-button
|
|
a:if="{{utils.checkShowPrev(mixin.value, items)}}"
|
|
inline
|
|
size="small"
|
|
onTap="onPrev"
|
|
data-currentValue="{{mixin.value}}"
|
|
>
|
|
{{prevStepText}}
|
|
</ant-button>
|
|
<ant-button
|
|
a:if="{{utils.checkShowNext(mixin.value, items)}}"
|
|
inline
|
|
size="small"
|
|
onTap="onNext"
|
|
data-currentValue="{{mixin.value}}"
|
|
>
|
|
{{nextStepText}}
|
|
</ant-button>
|
|
<ant-button
|
|
a:if="{{utils.checkShowKnow(mixin.value, items)}}"
|
|
inline
|
|
size="small"
|
|
onTap="onCancel"
|
|
>
|
|
{{gotItText}}
|
|
</ant-button>
|
|
</view>
|
|
<block a:if="{{swiperable}}">
|
|
<view class="ant-guide-tour-indicator">
|
|
<block
|
|
a:for="{{items}}"
|
|
a:for-index="index"
|
|
a:for-item="item"
|
|
>
|
|
<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"
|
|
onChange="onSwiperChange"
|
|
>
|
|
<block
|
|
a:for="{{items}}"
|
|
a:for-index="index"
|
|
a:for-item="item"
|
|
>
|
|
<swiper-item>
|
|
<view
|
|
class="ant-guide-tour-item {{item.className || ''}}"
|
|
style="top:{{item.top}}px; left:{{item.left}}px"
|
|
>
|
|
<slot
|
|
name="step"
|
|
index="{{mixin.current}}"
|
|
>
|
|
<image
|
|
a:if="{{item.imageUrl}}"
|
|
class="ant-guide-tour-item-img"
|
|
src="{{item.imageUrl}}"
|
|
style="{{item.imageStyle}}"
|
|
mode="{{item.imageMode}}"
|
|
></image>
|
|
</slot>
|
|
</view>
|
|
</swiper-item>
|
|
</block>
|
|
</swiper>
|
|
</block>
|
|
<block a:else>
|
|
<block
|
|
a:for="{{items}}"
|
|
a:for-index="index"
|
|
a:for-item="item"
|
|
>
|
|
<view
|
|
a:if="{{mixin.value === index}}"
|
|
class="ant-guide-tour-item {{item.className || ''}}"
|
|
style="top:{{item.top}}px; left:{{item.left}}px"
|
|
>
|
|
<slot
|
|
name="step"
|
|
index="{{index}}"
|
|
>
|
|
<image
|
|
a:if="{{item.imageUrl}}"
|
|
class="ant-guide-tour-item-img"
|
|
src="{{item.imageUrl}}"
|
|
style="{{item.imageStyle}}"
|
|
mode="{{item.imageMode}}"
|
|
></image>
|
|
</slot>
|
|
</view>
|
|
</block>
|
|
</block>
|
|
</view> |