Star.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. import { createVNode as _createVNode } from "vue";
  2. import { defineComponent, computed } from 'vue';
  3. import { getPropsSlot } from '../_util/props-util';
  4. import PropTypes from '../_util/vue-types';
  5. export var starProps = {
  6. value: Number,
  7. index: Number,
  8. prefixCls: String,
  9. allowHalf: {
  10. type: Boolean,
  11. default: undefined
  12. },
  13. disabled: {
  14. type: Boolean,
  15. default: undefined
  16. },
  17. character: PropTypes.any,
  18. characterRender: Function,
  19. focused: {
  20. type: Boolean,
  21. default: undefined
  22. },
  23. count: Number,
  24. onClick: Function,
  25. onHover: Function
  26. };
  27. export default defineComponent({
  28. compatConfig: {
  29. MODE: 3
  30. },
  31. name: 'Star',
  32. inheritAttrs: false,
  33. props: starProps,
  34. emits: ['hover', 'click'],
  35. setup: function setup(props, _ref) {
  36. var slots = _ref.slots,
  37. emit = _ref.emit;
  38. var onHover = function onHover(e) {
  39. var index = props.index;
  40. emit('hover', e, index);
  41. };
  42. var onClick = function onClick(e) {
  43. var index = props.index;
  44. emit('click', e, index);
  45. };
  46. var onKeyDown = function onKeyDown(e) {
  47. var index = props.index;
  48. if (e.keyCode === 13) {
  49. emit('click', e, index);
  50. }
  51. };
  52. var cls = computed(function () {
  53. var prefixCls = props.prefixCls,
  54. index = props.index,
  55. value = props.value,
  56. allowHalf = props.allowHalf,
  57. focused = props.focused;
  58. var starValue = index + 1;
  59. var className = prefixCls;
  60. if (value === 0 && index === 0 && focused) {
  61. className += " ".concat(prefixCls, "-focused");
  62. } else if (allowHalf && value + 0.5 >= starValue && value < starValue) {
  63. className += " ".concat(prefixCls, "-half ").concat(prefixCls, "-active");
  64. if (focused) {
  65. className += " ".concat(prefixCls, "-focused");
  66. }
  67. } else {
  68. className += starValue <= value ? " ".concat(prefixCls, "-full") : " ".concat(prefixCls, "-zero");
  69. if (starValue === value && focused) {
  70. className += " ".concat(prefixCls, "-focused");
  71. }
  72. }
  73. return className;
  74. });
  75. return function () {
  76. var disabled = props.disabled,
  77. prefixCls = props.prefixCls,
  78. characterRender = props.characterRender,
  79. index = props.index,
  80. count = props.count,
  81. value = props.value;
  82. var character = getPropsSlot(slots, props, 'character');
  83. var star = _createVNode("li", {
  84. "class": cls.value
  85. }, [_createVNode("div", {
  86. "onClick": disabled ? null : onClick,
  87. "onKeydown": disabled ? null : onKeyDown,
  88. "onMousemove": disabled ? null : onHover,
  89. "role": "radio",
  90. "aria-checked": value > index ? 'true' : 'false',
  91. "aria-posinset": index + 1,
  92. "aria-setsize": count,
  93. "tabindex": disabled ? -1 : 0
  94. }, [_createVNode("div", {
  95. "class": "".concat(prefixCls, "-first")
  96. }, [character]), _createVNode("div", {
  97. "class": "".concat(prefixCls, "-second")
  98. }, [character])])]);
  99. if (characterRender) {
  100. star = characterRender(star, props);
  101. }
  102. return star;
  103. };
  104. }
  105. });