xdesign-vue-next/es/rate/rate.mjs.map

XDesign Component for vue-next

{"version":3,"file":"rate.mjs","sources":["../../src/rate/rate.tsx"],"sourcesContent":["import { defineComponent, computed, toRefs, ref } from 'vue';\nimport useVModel from '../hooks/useVModel';\nimport props from './props';\nimport { useConfig } from '../hooks/useConfig';\nimport { useTNodeJSX } from '../hooks/tnode';\nimport Tooltip from '../tooltip/index';\nimport isArray from 'lodash/isArray';\n\nexport default defineComponent({\n  name: 'XRate',\n  props: { ...props },\n  setup(props, { slots }) {\n    const renderTNodeJSX = useTNodeJSX();\n\n    const activeColor = isArray(props.color) ? props.color[0] : props.color;\n    const defaultColor = isArray(props.color) ? props.color[1] : 'var(--td-bg-color-component)';\n\n    const { value: inputValue, modelValue } = toRefs(props);\n    const [starValue, setStarValue] = useVModel(inputValue, modelValue, props.defaultValue, props.onChange);\n\n    const hoverValue = ref(undefined);\n    const root = ref<HTMLTableElement>();\n\n    const displayValue = computed(() => Number(hoverValue.value || starValue.value));\n    const displayTexts = computed(() =>\n      props.texts.length === 0 ? ['极差', '失望', '一般', '满意', '惊喜'] : props.texts,\n    );\n    const displayText = computed(() => displayTexts.value[Math.ceil(displayValue.value - 1)]);\n\n    // 评分图标\n    const RateIcon = (iconProps: any) => {\n      if (slots.icon !== undefined) {\n        return renderTNodeJSX('icon', {\n          params: iconProps,\n        });\n      }\n\n      return <icon-ri-star-fill {...iconProps} />;\n    };\n\n    const getStarValue = (event: MouseEvent, index: number) => {\n      if (props.allowHalf) {\n        const { left } = root.value.getBoundingClientRect();\n        const firstStar = root.value.firstChild.nextSibling as HTMLElement;\n        const { width } = firstStar.getBoundingClientRect();\n        const { clientX } = event;\n        const starMiddle = width * (index - 0.5) + props.gap * (index - 1);\n\n        if (clientX - left >= starMiddle) return index;\n        if (clientX - left < starMiddle) return index - 0.5;\n      }\n\n      return index;\n    };\n\n    const mouseEnterHandler = (event: MouseEvent, index: number) => {\n      if (props.disabled) return;\n      hoverValue.value = getStarValue(event, index);\n    };\n\n    const mouseLeaveHandler = () => {\n      if (props.disabled) return;\n      hoverValue.value = undefined;\n    };\n\n    const clickHandler = (event: MouseEvent, index: number) => {\n      if (props.disabled) return;\n      setStarValue(getStarValue(event, index));\n    };\n\n    const getStarCls = (index: number) => {\n      if (props.allowHalf && index + 0.5 === displayValue.value) return `${classPrefix.value}-rate__item--half`;\n      if (index >= displayValue.value) return '';\n      if (index < displayValue.value) return `${classPrefix.value}-rate__item--full`;\n    };\n\n    const { classPrefix } = useConfig('classPrefix');\n\n    return () => {\n      return (\n        <div class={`${classPrefix.value}-rate`} onMouseleave={mouseLeaveHandler}>\n          <ul class={`${classPrefix.value}-rate__list`} style={{ gap: `${props.gap}px` }} ref={root}>\n            {[...Array(Number(props.count))].map((_, index) => (\n              <li\n                key={index}\n                class={[`${classPrefix.value}-rate__item`, getStarCls(index)]}\n                onClick={(event) => clickHandler(event, index + 1)}\n                onMousemove={(event: MouseEvent) => {\n                  return mouseEnterHandler(event, index + 1);\n                }}\n              >\n                {props.showText ? (\n                  <Tooltip key={index} content={displayText.value}>\n                    <div class={`${classPrefix.value}-rate__star-top`}>\n                      <RateIcon size={props.size} color={activeColor} />\n                    </div>\n                    <div class={`${classPrefix.value}-rate__star-bottom`}>\n                      <RateIcon size={props.size} color={defaultColor} />\n                    </div>\n                  </Tooltip>\n                ) : (\n                  <>\n                    <div class={`${classPrefix.value}-rate__star-top`}>\n                      <RateIcon size={props.size} color={activeColor} />\n                    </div>\n                    <div class={`${classPrefix.value}-rate__star-bottom`}>\n                      <RateIcon size={props.size} color={defaultColor} />\n                    </div>\n                  </>\n                )}\n              </li>\n            ))}\n          </ul>\n          {props.showText && <div className={`${classPrefix.value}-rate__text`}>{displayText.value}</div>}\n        </div>\n      );\n    };\n  },\n});\n"],"names":["name","props","setup","isArray","starValue","setStarValue","params","_createVNode","_resolveComponent","hoverValue","gap","_Fragment"],"mappings":"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"}