44 lines
1.9 KiB
XML
44 lines
1.9 KiB
XML
<view class="am-hor-steps {{className}}" a:if="{{direction == 'horizontal'}}">
|
|
<view class="am-hor-step" a:for="{{items}}" style="{{width: 100 / (items.length - 1) + '%'}}">
|
|
<view class="am-hor-step-line {{index < activeIndex - 1 ? 'is-active' : ''}} {{index >= items.length - 1 ? 'is-last' : ''}}">
|
|
<view class="am-hor-step-icon {{index <= activeIndex - 1 ? 'is-active' : ''}}"></view>
|
|
</view>
|
|
<view class="am-hor-step-text">
|
|
<view class="am-hor-step-title">
|
|
<text>{{item.title}}</text>
|
|
</view>
|
|
<view class="am-hor-step-description">
|
|
<text>{{item.description}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="am-vertical-steps {{className}}" a:if="{{direction == 'vertical'}}">
|
|
<view class="am-vertical-step" a:for="{{items}}">
|
|
<view class="am-vertical-step-left">
|
|
<view
|
|
class="am-vertical-step-line am-vertical-step-line-top {{index < activeIndex ? 'is-active' : ''}}"
|
|
a:if="{{index < items.length - 1}}"
|
|
></view>
|
|
<view
|
|
class="am-vertical-step-line am-vertical-step-line-bottom {{index < activeIndex - 1 ? 'is-active' : ''}}"
|
|
a:if="{{index < items.length - 1}}"
|
|
></view>
|
|
<view class="am-vertical-step-icon is-fail" a:if="{{index == failIndex - 1}}">
|
|
<icon type="cancel" size="24"/>
|
|
</view>
|
|
<view class="am-vertical-step-icon is-active" a:elif="{{index <= activeIndex - 1}}">
|
|
<icon type="success" size="24"/>
|
|
</view>
|
|
<view class="am-vertical-step-icon is-normal" a:else></view>
|
|
</view>
|
|
<view class="am-vertical-step-right">
|
|
<view class="am-vertical-step-title {{index <= activeIndex - 1 ? 'is-active' : ''}} {{index == failIndex - 1 ? 'is-fail' : ''}}">
|
|
<text>{{item.title}}</text>
|
|
</view>
|
|
<view class="am-vertical-step-description">
|
|
<text>{{item.description}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view> |