notice-bar.wxml 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <import src="../common/template/icon.wxml" />
  2. <wxs src="../common/utils.wxs" module="_" />
  3. <view
  4. wx:if="{{visible}}"
  5. style="{{_._style([style, customStyle])}}"
  6. class="{{classPrefix}} {{classPrefix}}--{{theme}} class {{prefix}}-class"
  7. >
  8. <!-- prefixIcon -->
  9. <view class="{{classPrefix}}__prefix-icon" bind:tap="clickPrefixIcon">
  10. <slot name="prefix-icon" />
  11. <template
  12. wx:if="{{_prefixIcon}}"
  13. is="icon"
  14. data="{{tClass: prefix + '-class-prefix-icon', ..._prefixIcon }}"
  15. ></template>
  16. </view>
  17. <!-- content -->
  18. <view class="{{classPrefix}}__content-wrap" bind:tap="clickContent">
  19. <!-- 垂直滚动通知:基于swiper实现,适用信息量短的多条公告消息,超出省略 -->
  20. <view wx:if="{{ direction === 'vertical' && _.isArray(content) }}">
  21. <swiper
  22. autoplay="true"
  23. vertical="true"
  24. circular="true"
  25. interval="2000"
  26. display-multiple-items="1"
  27. class="{{classPrefix}}__content--vertical"
  28. >
  29. <block wx:for="{{content}}" wx:key="index">
  30. <swiper-item>
  31. <view class="{{classPrefix}}__content--vertical-item"> {{item}} </view>
  32. </swiper-item>
  33. </block>
  34. </swiper>
  35. </view>
  36. <view
  37. wx:else
  38. class="{{classPrefix}}__content {{prefix}}-class-content {{ !marquee ? classPrefix + '__content-wrapable' : ''}}"
  39. animation="{{ animationData }}"
  40. >
  41. <block wx:if="{{content}}">{{content}}</block>
  42. <slot name="content" />
  43. <view class="{{classPrefix}}__operation {{prefix}}-class-operation" catch:tap="clickOperation">
  44. <block wx:if="{{ operation }}">{{operation}}</block>
  45. <slot name="operation" />
  46. </view>
  47. </view>
  48. </view>
  49. <!-- suffixIcon -->
  50. <view class="{{classPrefix}}__suffix-icon" bind:tap="clickSuffixIcon">
  51. <slot name="suffix-icon" />
  52. <template
  53. wx:if="{{_suffixIcon}}"
  54. is="icon"
  55. data="{{tClass: prefix + '-class-suffix-icon', ..._suffixIcon }}"
  56. ></template>
  57. </view>
  58. </view>