rate.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  2. var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  3. if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  4. else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  5. return c > 3 && r && Object.defineProperty(target, key, r), r;
  6. };
  7. /*
  8. * @Author: rileycai
  9. * @Date: 2021-09-21 19:01:54
  10. * @LastEditTime: 2021-11-10 14:30:02
  11. * @LastEditors: rileycai
  12. * @Description: Rate组件
  13. * @FilePath: /tdesign-miniprogram/src/rate/rate.ts
  14. */
  15. import { SuperComponent, wxComponent } from '../common/src/index';
  16. import config from '../common/config';
  17. import props from './props';
  18. const { prefix } = config;
  19. const name = `${prefix}-rate`;
  20. const rpx2px = (() => {
  21. let systemInfo = null;
  22. return (rpx) => {
  23. if (!systemInfo) {
  24. systemInfo = wx.getSystemInfoSync();
  25. }
  26. return (rpx * (systemInfo ? systemInfo.screenWidth : 750)) / 750;
  27. };
  28. })();
  29. let Rate = class Rate extends SuperComponent {
  30. constructor() {
  31. super(...arguments);
  32. this.externalClasses = ['t-class', 't-class-icon', 't-class-desc'];
  33. this.properties = props;
  34. this.controlledProps = [
  35. {
  36. key: 'value',
  37. event: 'change',
  38. },
  39. ];
  40. this.data = {
  41. classPrefix: name,
  42. icon: 'star-filled',
  43. halfIcon: 'star-filled',
  44. defaultTexts: ['极差', '失望', '一般', '满意', '惊喜'],
  45. disabledColor: '#999999',
  46. };
  47. }
  48. onTouch(e) {
  49. const { count, allowHalf, gap, value: currentValue } = this.properties;
  50. const [touch] = e.touches;
  51. const margin = rpx2px(gap);
  52. const selQuery = this.createSelectorQuery();
  53. selQuery
  54. .select(`.${name}__wrapper`)
  55. .boundingClientRect((rect) => {
  56. const { width, left } = rect;
  57. const starWidth = (width - (count - 1) * margin) / count;
  58. const offsetX = touch.pageX - left;
  59. const num = (offsetX + margin) / (starWidth + margin);
  60. const remainder = num % 1;
  61. const integral = num - remainder;
  62. let value = remainder <= 0.5 && allowHalf ? integral + 0.5 : integral + 1;
  63. if (value > count) {
  64. value = count;
  65. }
  66. else if (value < 0) {
  67. value = 0;
  68. }
  69. if (value !== currentValue) {
  70. this._trigger('change', { value });
  71. }
  72. })
  73. .exec();
  74. }
  75. };
  76. Rate = __decorate([
  77. wxComponent()
  78. ], Rate);
  79. export default Rate;
  80. //# sourceMappingURL=rate.js.map