index.wxml 1.1 KB

1234567891011121314151617181920212223242526272829303132333435
  1. <wxs src="../wxs/utils.wxs" module="utils" />
  2. <view class="custom-class {{ utils.bem('steps', [direction]) }}">
  3. <view class="van-step__wrapper">
  4. <view
  5. wx:for="{{ steps }}"
  6. wx:key="index"
  7. class="{{ utils.bem('step', [direction, status(index, active)]) }} van-hairline"
  8. >
  9. <view class="van-step__title" style="{{ index === active ? 'color: ' + activeColor : '' }}">
  10. <view>{{ item.text }}</view>
  11. <view>{{ item.desc }}</view>
  12. </view>
  13. <view class="van-step__circle-container">
  14. <view class="van-step__circle" wx:if="{{ index !== active }}" style="{{ index < active ? 'background-color: ' + activeColor : '' }}" />
  15. <van-icon wx:else name="checked" color="{{ activeColor }}" custom-class="van-step__active" />
  16. </view>
  17. <view wx:if="{{ index !== steps.length - 1 }}" class="van-step__line" style="{{ index < active ? 'background-color: ' + activeColor : '' }}" />
  18. </view>
  19. </view>
  20. </view>
  21. <wxs module="status">
  22. function get(index, active) {
  23. if (index < active) {
  24. return 'finish';
  25. } else if (index === active) {
  26. return 'process';
  27. }
  28. return '';
  29. }
  30. module.exports = get;
  31. </wxs>