xdesign-vue-next/es/date-picker/hooks/useRange.mjs.map

XDesign Component for vue-next

{"version":3,"file":"useRange.mjs","sources":["../../../src/date-picker/hooks/useRange.tsx"],"sourcesContent":["import { ref, computed, watch } from 'vue';\n\nimport { useTNodeJSX } from '../../hooks/tnode';\nimport { usePrefixClass, useConfig } from '../../hooks/useConfig';\n\nimport { TdDateRangePickerProps, DateValue } from '../type';\nimport { isValidDate, formatDate, getDefaultFormat, parseToDayjs } from '../../_common/js/date-picker/format';\nimport useRangeValue from './useRangeValue';\n\nexport const PARTIAL_MAP = { first: 'start', second: 'end' };\n\nexport default function useRange(props: TdDateRangePickerProps) {\n  const COMPONENT_NAME = usePrefixClass('date-range-picker');\n  const { globalConfig } = useConfig('datePicker');\n  const renderTNodeJSX = useTNodeJSX();\n\n  const isMountedRef = ref(false);\n  const inputRef = ref();\n\n  const { value, onChange, time, month, year, cacheValue, isFirstValueSelected } = useRangeValue(props);\n\n  const formatRef = computed(() =>\n    getDefaultFormat({\n      mode: props.mode,\n      format: props.format,\n      valueType: props.valueType,\n      enableTimePicker: props.enableTimePicker,\n    }),\n  );\n\n  const popupVisible = ref(false);\n  const isHoverCell = ref(false);\n  const activeIndex = ref(0); // 确定当前选中的输入框序号\n  const inputValue = ref(formatDate(props.value, { format: formatRef.value.format })); // 未真正选中前可能不断变更输入框的内容\n\n  // input 设置\n  const rangeInputProps = computed(() => ({\n    ...props.rangeInputProps,\n    size: props.size,\n    ref: inputRef,\n    clearable: props.clearable,\n    prefixIcon: () => renderTNodeJSX('prefixIcon'),\n    readonly: !props.allowInput,\n    separator: props.separator || globalConfig.value.rangeSeparator,\n    placeholder: props.placeholder || globalConfig.value.placeholder[props.mode],\n    activeIndex: popupVisible.value ? activeIndex.value : undefined,\n    suffixIcon: () => {\n      return renderTNodeJSX('suffixIcon') || <icon-ri-calendar-line />;\n    },\n    class: {\n      [`${COMPONENT_NAME.value}__input--placeholder`]: isHoverCell.value,\n    },\n    onClick: ({ position }: any) => {\n      activeIndex.value = position === 'first' ? 0 : 1;\n    },\n    onClear: ({ e }: { e: MouseEvent }) => {\n      e.stopPropagation();\n      popupVisible.value = false;\n      onChange?.([], { dayjsValue: [], trigger: 'clear' });\n    },\n    onBlur: (newVal: string[], { e, position }: any) => {\n      props.onBlur?.({ value: newVal, partial: PARTIAL_MAP[position], e });\n    },\n    onFocus: (newVal: string[], { e, position }: any) => {\n      props.onFocus?.({ value: newVal, partial: PARTIAL_MAP[position], e });\n      activeIndex.value = position === 'first' ? 0 : 1;\n    },\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    onChange: (newVal: string[], { e, position }: any) => {\n      inputValue.value = newVal;\n\n      // 跳过不符合格式化的输入框内容\n      if (!isValidDate(newVal, formatRef.value.format)) return;\n      cacheValue.value = newVal;\n      const newYear: Array<number> = [];\n      const newMonth: Array<number> = [];\n      const newTime: Array<string> = [];\n      newVal.forEach((v) => {\n        newYear.push(parseToDayjs(v, formatRef.value.format).year());\n        newMonth.push(parseToDayjs(v, formatRef.value.format).month());\n        newTime.push(parseToDayjs(v, formatRef.value.format).format(formatRef.value.timeFormat));\n      });\n      year.value = newYear;\n      month.value = newMonth;\n      time.value = newTime;\n    },\n    onEnter: (newVal: string[]) => {\n      if (!isValidDate(newVal, formatRef.value.format) && !isValidDate(value.value, formatRef.value.format)) return;\n\n      popupVisible.value = false;\n      if (isValidDate(newVal, formatRef.value.format)) {\n        onChange?.(\n          formatDate(newVal, {\n            format: formatRef.value.format,\n            targetFormat: formatRef.value.valueType,\n            autoSwap: true,\n          }) as DateValue[],\n          {\n            dayjsValue: newVal.map((v) => parseToDayjs(v, formatRef.value.format)),\n            trigger: 'enter',\n          },\n        );\n      } else if (isValidDate(value.value, formatRef.value.format)) {\n        inputValue.value = formatDate(value.value, {\n          format: formatRef.value.format,\n        });\n      } else {\n        inputValue.value = [];\n      }\n    },\n  }));\n\n  // popup 设置\n  const popupProps = computed(() => ({\n    expandAnimation: true,\n    ...props.popupProps,\n    overlayInnerStyle: props.popupProps?.overlayInnerStyle ?? { width: 'auto' },\n    overlayClassName: [props.popupProps?.overlayClassName, `${COMPONENT_NAME.value}__panel-container`],\n    onVisibleChange: (visible: boolean, context: any) => {\n      // 这里劫持了进一步向 popup 传递的 onVisibleChange 事件，为了保证可以在 Datepicker 中使用 popupProps.onVisibleChange，故此处理\n      props.popupProps?.onVisibleChange?.(visible, context);\n      // 输入框点击不关闭面板\n      if (context.trigger === 'trigger-element-click') {\n        const indexMap = { 0: 'first', 1: 'second' };\n        inputRef.value.focus({ position: indexMap[activeIndex.value] });\n        popupVisible.value = true;\n        return;\n      }\n\n      popupVisible.value = visible;\n    },\n  }));\n\n  // 输入框响应 value 变化\n  watch(\n    value,\n    (value) => {\n      if (!value) {\n        inputValue.value = [];\n        return;\n      }\n      if (!isValidDate(value, formatRef.value.format)) return;\n\n      inputValue.value = formatDate(value, {\n        format: formatRef.value.format,\n      });\n    },\n    {\n      immediate: true,\n    },\n  );\n\n  // activeIndex 变化自动 focus 对应输入框\n  watch(\n    activeIndex,\n    (index) => {\n      if (!isMountedRef.value) {\n        isMountedRef.value = true;\n        return;\n      }\n      if (!popupVisible.value) return;\n      const indexMap = { 0: 'first', 1: 'second' };\n      inputRef.value?.focus?.({ position: indexMap[index] });\n    },\n    {\n      immediate: true,\n    },\n  );\n\n  return {\n    year,\n    month,\n    value,\n    time,\n    inputValue,\n    popupVisible,\n    rangeInputProps,\n    popupProps,\n    isHoverCell,\n    activeIndex,\n    isFirstValueSelected,\n    cacheValue,\n    onChange,\n  };\n}\n"],"names":["first","second","format","ref","readonly","placeholder","_resolveComponent","onClick","onClear","onChange","dayjsValue","trigger","onBlur","value","partial","e","onFocus","newVal","newYear","newMonth","onEnter","targetFormat","autoSwap","expandAnimation","overlayInnerStyle","width","overlayClassName","onVisibleChange","inputRef","position","watch","inputValue","immediate","year","month","time","popupVisible","rangeInputProps","popupProps","isHoverCell","activeIndex","isFirstValueSelected","cacheValue"],"mappings":"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"}