UNPKG

element-plus

Version:

A Component Library for Vue 3

1 lines 8.96 kB
{"version":3,"file":"use-calendar.mjs","names":[],"sources":["../../../../../../packages/components/calendar/src/use-calendar.ts"],"sourcesContent":["import { computed, ref } from 'vue'\nimport dayjs from 'dayjs'\nimport { useLocale } from '@element-plus/hooks'\nimport { debugWarn, isArray, isDate } from '@element-plus/utils'\nimport { INPUT_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/constants'\n\nimport type { ComputedRef, SetupContext } from 'vue'\nimport type { Dayjs } from 'dayjs'\nimport type { CalendarDateType, CalendarEmits, CalendarProps } from './calendar'\n\nconst adjacentMonth = (start: Dayjs, end: Dayjs): [Dayjs, Dayjs][] => {\n const firstMonthLastDay = start.endOf('month')\n const lastMonthFirstDay = end.startOf('month')\n\n // Whether the last day of the first month and the first day of the last month is in the same week\n const isSameWeek = firstMonthLastDay.isSame(lastMonthFirstDay, 'week')\n const lastMonthStartDay = isSameWeek\n ? lastMonthFirstDay.add(1, 'week')\n : lastMonthFirstDay\n\n return [\n [start, firstMonthLastDay],\n [lastMonthStartDay.startOf('week'), end],\n ]\n}\n\nconst threeConsecutiveMonth = (start: Dayjs, end: Dayjs): [Dayjs, Dayjs][] => {\n const firstMonthLastDay = start.endOf('month')\n const secondMonthFirstDay = start.add(1, 'month').startOf('month')\n\n // Whether the last day of the first month and the second month is in the same week\n const secondMonthStartDay = firstMonthLastDay.isSame(\n secondMonthFirstDay,\n 'week'\n )\n ? secondMonthFirstDay.add(1, 'week')\n : secondMonthFirstDay\n\n const secondMonthLastDay = secondMonthStartDay.endOf('month')\n const lastMonthFirstDay = end.startOf('month')\n\n // Whether the last day of the second month and the last day of the last month is in the same week\n const lastMonthStartDay = secondMonthLastDay.isSame(lastMonthFirstDay, 'week')\n ? lastMonthFirstDay.add(1, 'week')\n : lastMonthFirstDay\n\n return [\n [start, firstMonthLastDay],\n [secondMonthStartDay.startOf('week'), secondMonthLastDay],\n [lastMonthStartDay.startOf('week'), end],\n ]\n}\n\nexport const useCalendar = (\n props: CalendarProps,\n emit: SetupContext<CalendarEmits>['emit'],\n componentName: string\n) => {\n const { lang } = useLocale()\n\n const selectedDay = ref<Dayjs>()\n const now = dayjs().locale(lang.value)\n\n const realSelectedDay = computed<Dayjs | undefined>({\n get() {\n if (!props.modelValue) return selectedDay.value\n return date.value\n },\n set(val) {\n if (!val) return\n selectedDay.value = val\n const result = val.toDate()\n\n emit(INPUT_EVENT, result)\n emit(UPDATE_MODEL_EVENT, result)\n },\n })\n\n // if range is valid, we get a two-digit array\n const validatedRange = computed(() => {\n if (\n !props.range ||\n !isArray(props.range) ||\n props.range.length !== 2 ||\n props.range.some((item) => !isDate(item))\n )\n return []\n const rangeArrDayjs = props.range.map((_) => dayjs(_).locale(lang.value))\n const [startDayjs, endDayjs] = rangeArrDayjs\n if (startDayjs.isAfter(endDayjs)) {\n debugWarn(componentName, 'end time should be greater than start time')\n return []\n }\n if (startDayjs.isSame(endDayjs, 'month')) {\n // same month\n return calculateValidatedDateRange(startDayjs, endDayjs)\n } else {\n // two months\n if (startDayjs.add(1, 'month').month() !== endDayjs.month()) {\n debugWarn(\n componentName,\n 'start time and end time interval must not exceed two months'\n )\n return []\n }\n return calculateValidatedDateRange(startDayjs, endDayjs)\n }\n })\n\n const date: ComputedRef<Dayjs> = computed(() => {\n if (!props.modelValue) {\n return (\n realSelectedDay.value ||\n (validatedRange.value.length ? validatedRange.value[0][0] : now)\n )\n } else {\n return dayjs(props.modelValue).locale(lang.value)\n }\n })\n const prevMonthDayjs = computed(() => date.value.subtract(1, 'month').date(1))\n const nextMonthDayjs = computed(() => date.value.add(1, 'month').date(1))\n const prevYearDayjs = computed(() => date.value.subtract(1, 'year').date(1))\n const nextYearDayjs = computed(() => date.value.add(1, 'year').date(1))\n\n // https://github.com/element-plus/element-plus/issues/3155\n // Calculate the validate date range according to the start and end dates\n const calculateValidatedDateRange = (\n startDayjs: Dayjs,\n endDayjs: Dayjs\n ): [Dayjs, Dayjs][] => {\n const firstDay = startDayjs.startOf('week')\n const lastDay = endDayjs.endOf('week')\n const firstMonth = firstDay.get('month')\n const lastMonth = lastDay.get('month')\n\n // Current month\n if (firstMonth === lastMonth) {\n return [[firstDay, lastDay]]\n }\n // Two adjacent months\n else if ((firstMonth + 1) % 12 === lastMonth) {\n return adjacentMonth(firstDay, lastDay)\n }\n // Three consecutive months (compatible: 2021-01-30 to 2021-02-28)\n else if (\n firstMonth + 2 === lastMonth ||\n (firstMonth + 1) % 11 === lastMonth\n ) {\n return threeConsecutiveMonth(firstDay, lastDay)\n }\n // Other cases\n else {\n debugWarn(\n componentName,\n 'start time and end time interval must not exceed two months'\n )\n return []\n }\n }\n\n const pickDay = (day: Dayjs) => {\n realSelectedDay.value = day\n }\n\n const selectDate = (type: CalendarDateType) => {\n const dateMap: Record<CalendarDateType, Dayjs> = {\n 'prev-month': prevMonthDayjs.value,\n 'next-month': nextMonthDayjs.value,\n 'prev-year': prevYearDayjs.value,\n 'next-year': nextYearDayjs.value,\n today: now,\n }\n\n const day = dateMap[type]\n\n if (!day.isSame(date.value, 'day')) {\n pickDay(day)\n }\n }\n\n const handleDateChange = (date: Dayjs | 'today') => {\n if (date === 'today') {\n selectDate('today')\n } else {\n pickDay(date)\n }\n }\n\n return {\n calculateValidatedDateRange,\n date,\n realSelectedDay,\n pickDay,\n selectDate,\n validatedRange,\n handleDateChange,\n }\n}\n"],"mappings":"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"}