You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.7 KiB
54 lines
1.7 KiB
<wxs src="../wxs/utils.wxs" module="utils" /> |
|
|
|
<view class="custom-class {{ utils.bem('steps', [direction]) }}"> |
|
<view class="van-step__wrapper"> |
|
<view |
|
wx:for="{{ steps }}" |
|
wx:key="index" |
|
bindtap="onClick" |
|
data-index="{{ index }}" |
|
class="{{ utils.bem('step', [direction, status(index, active)]) }} van-hairline" |
|
style="{{ status(index, active) === 'inactive' ? 'color: ' + inactiveColor: '' }}" |
|
> |
|
<view class="van-step__title" style="{{ index === active ? 'color: ' + activeColor : '' }}"> |
|
<view>{{ item.text }}</view> |
|
<view class="desc-class">{{ item.desc }}</view> |
|
</view> |
|
<view class="van-step__circle-container"> |
|
<block wx:if="{{ index !== active }}"> |
|
<van-icon |
|
wx:if="{{ item.inactiveIcon || inactiveIcon }}" |
|
color="{{ status(index, active) === 'inactive' ? inactiveColor: activeColor }}" |
|
name="{{ item.inactiveIcon || inactiveIcon }}" |
|
class="van-step__icon" |
|
/> |
|
<view |
|
wx:else |
|
class="van-step__circle" |
|
style="{{ 'background-color: ' + (index < active ? activeColor : inactiveColor) }}" |
|
/> |
|
</block> |
|
|
|
<van-icon wx:else name="{{ item.activeIcon || activeIcon }}" color="{{ activeColor }}" class="van-step__icon" /> |
|
</view> |
|
<view |
|
wx:if="{{ index !== steps.length - 1 }}" |
|
class="van-step__line" style="{{ 'background-color: ' + (index < active ? activeColor : inactiveColor) }}" |
|
/> |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<wxs module="status"> |
|
function get(index, active) { |
|
if (index < active) { |
|
return 'finish'; |
|
} else if (index === active) { |
|
return 'process'; |
|
} |
|
|
|
return 'inactive'; |
|
} |
|
|
|
module.exports = get; |
|
</wxs>
|
|
|