| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219 | 
							- import { createVNode as _createVNode } from "vue";
 
- import { computed, defineComponent, ref } from "vue";
 
- import { addUnit, truthProp, numericProp, preventDefault, makeStringProp, makeNumberProp, makeNumericProp, createNamespace } from "../utils/index.mjs";
 
- import { useRect, useCustomFieldValue, useEventListener } from "@vant/use";
 
- import { useRefs } from "../composables/use-refs.mjs";
 
- import { useTouch } from "../composables/use-touch.mjs";
 
- import { Icon } from "../icon/index.mjs";
 
- const [name, bem] = createNamespace("rate");
 
- function getRateStatus(value, index, allowHalf, readonly) {
 
-   if (value >= index) {
 
-     return {
 
-       status: "full",
 
-       value: 1
 
-     };
 
-   }
 
-   if (value + 0.5 >= index && allowHalf && !readonly) {
 
-     return {
 
-       status: "half",
 
-       value: 0.5
 
-     };
 
-   }
 
-   if (value + 1 >= index && allowHalf && readonly) {
 
-     const cardinal = 10 ** 10;
 
-     return {
 
-       status: "half",
 
-       value: Math.round((value - index + 1) * cardinal) / cardinal
 
-     };
 
-   }
 
-   return {
 
-     status: "void",
 
-     value: 0
 
-   };
 
- }
 
- const rateProps = {
 
-   size: numericProp,
 
-   icon: makeStringProp("star"),
 
-   color: String,
 
-   count: makeNumericProp(5),
 
-   gutter: numericProp,
 
-   readonly: Boolean,
 
-   disabled: Boolean,
 
-   voidIcon: makeStringProp("star-o"),
 
-   allowHalf: Boolean,
 
-   voidColor: String,
 
-   touchable: truthProp,
 
-   iconPrefix: String,
 
-   modelValue: makeNumberProp(0),
 
-   disabledColor: String
 
- };
 
- var stdin_default = defineComponent({
 
-   name,
 
-   props: rateProps,
 
-   emits: ["change", "update:modelValue"],
 
-   setup(props, {
 
-     emit
 
-   }) {
 
-     const touch = useTouch();
 
-     const [itemRefs, setItemRefs] = useRefs();
 
-     const groupRef = ref();
 
-     const untouchable = () => props.readonly || props.disabled || !props.touchable;
 
-     const list = computed(() => Array(+props.count).fill("").map((_, i) => getRateStatus(props.modelValue, i + 1, props.allowHalf, props.readonly)));
 
-     let ranges;
 
-     let groupRefRect;
 
-     let minRectTop = Number.MAX_SAFE_INTEGER;
 
-     let maxRectTop = Number.MIN_SAFE_INTEGER;
 
-     const updateRanges = () => {
 
-       groupRefRect = useRect(groupRef);
 
-       const rects = itemRefs.value.map(useRect);
 
-       ranges = [];
 
-       rects.forEach((rect, index) => {
 
-         minRectTop = Math.min(rect.top, minRectTop);
 
-         maxRectTop = Math.max(rect.top, maxRectTop);
 
-         if (props.allowHalf) {
 
-           ranges.push({
 
-             score: index + 0.5,
 
-             left: rect.left,
 
-             top: rect.top,
 
-             height: rect.height
 
-           }, {
 
-             score: index + 1,
 
-             left: rect.left + rect.width / 2,
 
-             top: rect.top,
 
-             height: rect.height
 
-           });
 
-         } else {
 
-           ranges.push({
 
-             score: index + 1,
 
-             left: rect.left,
 
-             top: rect.top,
 
-             height: rect.height
 
-           });
 
-         }
 
-       });
 
-     };
 
-     const getScoreByPosition = (x, y) => {
 
-       for (let i = ranges.length - 1; i > 0; i--) {
 
-         if (y >= groupRefRect.top && y <= groupRefRect.bottom) {
 
-           if (x > ranges[i].left && y >= ranges[i].top && y <= ranges[i].top + ranges[i].height) {
 
-             return ranges[i].score;
 
-           }
 
-         } else {
 
-           const curTop = y < groupRefRect.top ? minRectTop : maxRectTop;
 
-           if (x > ranges[i].left && ranges[i].top === curTop) {
 
-             return ranges[i].score;
 
-           }
 
-         }
 
-       }
 
-       return props.allowHalf ? 0.5 : 1;
 
-     };
 
-     const select = (index) => {
 
-       if (!props.disabled && !props.readonly && index !== props.modelValue) {
 
-         emit("update:modelValue", index);
 
-         emit("change", index);
 
-       }
 
-     };
 
-     const onTouchStart = (event) => {
 
-       if (untouchable()) {
 
-         return;
 
-       }
 
-       touch.start(event);
 
-       updateRanges();
 
-     };
 
-     const onTouchMove = (event) => {
 
-       if (untouchable()) {
 
-         return;
 
-       }
 
-       touch.move(event);
 
-       if (touch.isHorizontal()) {
 
-         const {
 
-           clientX,
 
-           clientY
 
-         } = event.touches[0];
 
-         preventDefault(event);
 
-         select(getScoreByPosition(clientX, clientY));
 
-       }
 
-     };
 
-     const renderStar = (item, index) => {
 
-       const {
 
-         icon,
 
-         size,
 
-         color,
 
-         count,
 
-         gutter,
 
-         voidIcon,
 
-         disabled,
 
-         voidColor,
 
-         allowHalf,
 
-         iconPrefix,
 
-         disabledColor
 
-       } = props;
 
-       const score = index + 1;
 
-       const isFull = item.status === "full";
 
-       const isVoid = item.status === "void";
 
-       const renderHalf = allowHalf && item.value > 0 && item.value < 1;
 
-       let style;
 
-       if (gutter && score !== +count) {
 
-         style = {
 
-           paddingRight: addUnit(gutter)
 
-         };
 
-       }
 
-       const onClickItem = (event) => {
 
-         updateRanges();
 
-         select(allowHalf ? getScoreByPosition(event.clientX, event.clientY) : score);
 
-       };
 
-       return _createVNode("div", {
 
-         "key": index,
 
-         "ref": setItemRefs(index),
 
-         "role": "radio",
 
-         "style": style,
 
-         "class": bem("item"),
 
-         "tabindex": disabled ? void 0 : 0,
 
-         "aria-setsize": count,
 
-         "aria-posinset": score,
 
-         "aria-checked": !isVoid,
 
-         "onClick": onClickItem
 
-       }, [_createVNode(Icon, {
 
-         "size": size,
 
-         "name": isFull ? icon : voidIcon,
 
-         "class": bem("icon", {
 
-           disabled,
 
-           full: isFull
 
-         }),
 
-         "color": disabled ? disabledColor : isFull ? color : voidColor,
 
-         "classPrefix": iconPrefix
 
-       }, null), renderHalf && _createVNode(Icon, {
 
-         "size": size,
 
-         "style": {
 
-           width: item.value + "em"
 
-         },
 
-         "name": isVoid ? voidIcon : icon,
 
-         "class": bem("icon", ["half", {
 
-           disabled,
 
-           full: !isVoid
 
-         }]),
 
-         "color": disabled ? disabledColor : isVoid ? voidColor : color,
 
-         "classPrefix": iconPrefix
 
-       }, null)]);
 
-     };
 
-     useCustomFieldValue(() => props.modelValue);
 
-     useEventListener("touchmove", onTouchMove, {
 
-       target: groupRef
 
-     });
 
-     return () => _createVNode("div", {
 
-       "ref": groupRef,
 
-       "role": "radiogroup",
 
-       "class": bem({
 
-         readonly: props.readonly,
 
-         disabled: props.disabled
 
-       }),
 
-       "tabindex": props.disabled ? void 0 : 0,
 
-       "aria-disabled": props.disabled,
 
-       "aria-readonly": props.readonly,
 
-       "onTouchstartPassive": onTouchStart
 
-     }, [list.value.map(renderStar)]);
 
-   }
 
- });
 
- export {
 
-   stdin_default as default
 
- };
 
 
  |