element-plus
Version:
A Component Library for Vue 3
1 lines • 7.24 kB
Source Map (JSON)
{"version":3,"file":"use-panel-date-range.mjs","names":[],"sources":["../../../../../../../packages/components/date-picker-panel/src/composables/use-panel-date-range.ts"],"sourcesContent":["import { computed, inject, nextTick, ref } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport { PICKER_BASE_INJECTION_KEY } from '@element-plus/components/time-picker'\nimport { getValidDateOfMonth, getValidDateOfYear } from '../utils'\n\nimport type { PanelDateRangeProps } from '../props/panel-date-range'\nimport type { Dayjs } from 'dayjs'\nimport type { ComputedRef, Ref } from 'vue'\n\ntype CurrentView = 'date' | 'year' | 'month'\ntype CurrentViewRef = { focus: () => void }\n\nexport type Emits = (\n event: 'pick' | 'set-picker-option' | 'calendar-change' | 'panel-change',\n ...args: any[]\n) => void\n\nexport const usePanelDateRange = (\n props: PanelDateRangeProps,\n emit: Emits,\n leftDate: Ref<Dayjs>,\n rightDate: Ref<Dayjs>\n) => {\n const leftCurrentView = ref<CurrentView>('date')\n const leftCurrentViewRef = ref<CurrentViewRef>()\n const rightCurrentView = ref<CurrentView>('date')\n const rightCurrentViewRef = ref<CurrentViewRef>()\n const pickerBase = inject(PICKER_BASE_INJECTION_KEY) as any\n const { disabledDate } = pickerBase.props\n const { t, lang } = useLocale()\n\n const leftYear = computed(() => {\n return leftDate.value.year()\n })\n const leftMonth = computed(() => {\n return leftDate.value.month()\n })\n\n const rightYear = computed(() => {\n return rightDate.value.year()\n })\n const rightMonth = computed(() => {\n return rightDate.value.month()\n })\n\n function computedYearLabel(\n currentView: Ref<CurrentView>,\n yearValue: ComputedRef<number>\n ) {\n const yearTranslation = t('el.datepicker.year')\n if (currentView.value === 'year') {\n const startYear = Math.floor(yearValue.value! / 10) * 10\n return yearTranslation\n ? `${startYear} ${yearTranslation} - ${\n startYear + 9\n } ${yearTranslation}`\n : `${startYear} - ${startYear + 9}`\n }\n return `${yearValue.value} ${yearTranslation}`\n }\n\n function focusPicker(currentViewRef?: CurrentViewRef) {\n currentViewRef?.focus()\n }\n\n async function showPicker(\n pickerType: 'left' | 'right',\n view: 'month' | 'year'\n ) {\n if (props.disabled) return\n const currentView =\n pickerType === 'left' ? leftCurrentView : rightCurrentView\n const currentViewRef =\n pickerType === 'left' ? leftCurrentViewRef : rightCurrentViewRef\n currentView.value = view\n await nextTick()\n focusPicker(currentViewRef.value)\n }\n\n async function handlePick(\n mode: 'month' | 'year',\n pickerType: 'left' | 'right',\n value: number\n ) {\n if (props.disabled) return\n const isLeftPicker = pickerType === 'left'\n const startDate = isLeftPicker ? leftDate : rightDate\n const endDate = isLeftPicker ? rightDate : leftDate\n const currentView = isLeftPicker ? leftCurrentView : rightCurrentView\n const currentViewRef = isLeftPicker\n ? leftCurrentViewRef\n : rightCurrentViewRef\n\n if (mode === 'year') {\n const data = startDate.value.year(value)\n startDate.value = getValidDateOfYear(data, lang.value, disabledDate)\n }\n\n if (mode === 'month') {\n startDate.value = getValidDateOfMonth(\n startDate.value,\n startDate.value.year(),\n value,\n lang.value,\n disabledDate\n )\n }\n\n if (!props.unlinkPanels) {\n endDate.value =\n pickerType === 'left'\n ? startDate.value.add(1, 'month')\n : startDate.value.subtract(1, 'month')\n }\n\n currentView.value = mode === 'year' ? 'month' : 'date'\n await nextTick()\n focusPicker(currentViewRef.value)\n handlePanelChange(mode)\n }\n\n function handlePanelChange(mode: 'month' | 'year') {\n emit(\n 'panel-change',\n [leftDate.value.toDate(), rightDate.value.toDate()],\n mode\n )\n }\n\n function adjustDateByView(\n currentView: CurrentView,\n date: Dayjs,\n forward: boolean\n ) {\n const action = forward ? 'add' : 'subtract'\n return currentView === 'year'\n ? date[action](10, 'year')\n : date[action](1, 'year')\n }\n\n return {\n leftCurrentView,\n rightCurrentView,\n leftCurrentViewRef,\n rightCurrentViewRef,\n leftYear,\n rightYear,\n leftMonth,\n rightMonth,\n leftYearLabel: computed(() => computedYearLabel(leftCurrentView, leftYear)),\n rightYearLabel: computed(() =>\n computedYearLabel(rightCurrentView, rightYear)\n ),\n showLeftPicker: (view: 'month' | 'year') => showPicker('left', view),\n showRightPicker: (view: 'month' | 'year') => showPicker('right', view),\n handleLeftYearPick: (year: number) => handlePick('year', 'left', year),\n handleRightYearPick: (year: number) => handlePick('year', 'right', year),\n handleLeftMonthPick: (month: number) => handlePick('month', 'left', month),\n handleRightMonthPick: (month: number) =>\n handlePick('month', 'right', month),\n handlePanelChange,\n adjustDateByView,\n }\n}\n"],"mappings":"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"}