rate.wxml 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. <wxs src="../common/utils.wxs" module="_" />
  2. <wxs src="./rate.wxs" module="utils" />
  3. <view class="{{classPrefix}} class" style="{{_._style([style, customStyle])}}">
  4. <view
  5. class="{{classPrefix}}__wrapper {{prefix}}-class"
  6. style="font-size:{{ utils.regSize(size) }}"
  7. bind:touchstart="{{ !disabled ? 'onTouchStart' : '' }}"
  8. bind:touchmove="{{ !disabled ? 'onTouchMove' : '' }}"
  9. bind:tap="onTap"
  10. bind:touchend="{{ !disabled ? 'onTouchEnd' : ''}}"
  11. bind:touchcancel="{{ !disabled ? 'onTouchEnd' : ''}}"
  12. aria-role="slider"
  13. aria-valuemax="{{count}}"
  14. aria-valuemin="{{0}}"
  15. aria-valuenow="{{value}}"
  16. aria-valuetext="{{utils.getText(texts,value,defaultTexts)}}"
  17. >
  18. <t-icon
  19. wx:for="{{ count }}"
  20. wx:key="*this"
  21. class="{{classPrefix }}__icon {{utils.getIconClass(classPrefix + '__icon', defaultValue, value, index, allowHalf, disabled, scaleIndex)}}"
  22. style="margin-right: {{ count - index > 1 ? _.addUnit(gap) : 0 }}; {{utils.getColor(color)}}"
  23. t-class="{{prefix}}-class-icon"
  24. name="{{utils.getIconName(defaultValue, value, index, icon)}}"
  25. size="{{ size }}"
  26. prefix="{{iconPrefix}}"
  27. />
  28. </view>
  29. <text
  30. wx:if="{{showText}}"
  31. class="{{_.cls(classPrefix + '__text', [['active', value > 0]])}} {{prefix}}-class-text"
  32. aria-hidden="{{true}}"
  33. >{{utils.getText(texts,value,defaultTexts)}}</text
  34. >
  35. <text
  36. wx:if="{{isVisibleToScreenReader}}"
  37. class="{{_.cls(classPrefix + '__text', [['active', value > 0], ['sr-only', isVisibleToScreenReader]])}} {{prefix}}-class-text"
  38. aria-role="alert"
  39. aria-live="assertive"
  40. >{{value+'星'}} {{utils.getText(texts,value,defaultTexts)}}</text
  41. >
  42. <view
  43. wx:if="{{tipsVisible && placement}}"
  44. class="{{_.cls(classPrefix + '__tips', [placement])}}"
  45. style="left: {{tipsLeft}}px"
  46. aria-hidden="{{true}}"
  47. >
  48. <block wx:if="{{actionType == 'tap'}}">
  49. <view
  50. wx:if="{{allowHalf}}"
  51. class="{{_.cls(classPrefix + '__tips-item', [['active', utils.ceil(value) - 0.5 == value]])}}"
  52. bind:tap="onSelect"
  53. data-value="{{utils.ceil(value) - 0.5}}"
  54. >
  55. <t-icon
  56. class="{{classPrefix }}__icon {{classPrefix }}__icon--selected-half"
  57. name="{{utils.getIconName(defaultValue, value, index, icon)}}"
  58. size="{{ size }}"
  59. style="{{utils.getColor(color)}}"
  60. />
  61. <view class="{{classPrefix}}__tips-text">{{utils.ceil(value) - 0.5}}</view>
  62. </view>
  63. <view
  64. class="{{_.cls(classPrefix + '__tips-item', [['active', utils.ceil(value) == value]])}}"
  65. bind:tap="onSelect"
  66. data-value="{{utils.ceil(value)}}"
  67. >
  68. <t-icon
  69. class="{{_.cls(classPrefix + '__icon', ['selected'])}}"
  70. name="{{utils.getIconName(defaultValue, 0, 0, icon)}}"
  71. size="{{ size }}"
  72. style="{{utils.getColor(color)}}"
  73. />
  74. <view class="{{classPrefix}}__tips-text">{{utils.ceil(value)}}</view>
  75. </view>
  76. </block>
  77. <view
  78. wx:else
  79. class="{{_.cls(classPrefix + '__tips-item', [['active', utils.ceil(value) == value && actionType == 'tap']])}}"
  80. bind:tap="onSelect"
  81. data-value="{{utils.ceil(value)}}"
  82. >
  83. <t-icon
  84. class="{{_.cls(classPrefix + '__icon', [['selected', utils.ceil(value) == value], ['selected-half', utils.ceil(value) != value]]) }}"
  85. name="{{utils.getIconName(defaultValue, 0, 0, icon)}}"
  86. size="{{ size }}"
  87. style="{{utils.getColor(color)}}"
  88. />
  89. <view class="{{classPrefix}}__tips-text">{{value}}</view>
  90. </view>
  91. </view>
  92. </view>