import { getCurrentInstance, inject, ref, unref, watch } from 'vue';
|
import '../../../../utils/index.mjs';
|
import '../../../../hooks/index.mjs';
|
import { isValidRange, getDefaultValue } from '../utils.mjs';
|
import { ROOT_PICKER_INJECTION_KEY } from '../constants.mjs';
|
import { useShortcut } from './use-shortcut.mjs';
|
import { useNamespace } from '../../../../hooks/use-namespace/index.mjs';
|
import { useLocale } from '../../../../hooks/use-locale/index.mjs';
|
import { isArray } from '@vue/shared';
|
|
const useRangePicker = (props, {
|
defaultValue,
|
leftDate,
|
rightDate,
|
unit,
|
onParsedValueChanged
|
}) => {
|
const { emit } = getCurrentInstance();
|
const { pickerNs } = inject(ROOT_PICKER_INJECTION_KEY);
|
const drpNs = useNamespace("date-range-picker");
|
const { t, lang } = useLocale();
|
const handleShortcutClick = useShortcut(lang);
|
const minDate = ref();
|
const maxDate = ref();
|
const rangeState = ref({
|
endDate: null,
|
selecting: false
|
});
|
const handleChangeRange = (val) => {
|
rangeState.value = val;
|
};
|
const handleRangeConfirm = (visible = false) => {
|
const _minDate = unref(minDate);
|
const _maxDate = unref(maxDate);
|
if (isValidRange([_minDate, _maxDate])) {
|
emit("pick", [_minDate, _maxDate], visible);
|
}
|
};
|
const onSelect = (selecting) => {
|
rangeState.value.selecting = selecting;
|
if (!selecting) {
|
rangeState.value.endDate = null;
|
}
|
};
|
const restoreDefault = () => {
|
const [start, end] = getDefaultValue(unref(defaultValue), {
|
lang: unref(lang),
|
unit,
|
unlinkPanels: props.unlinkPanels
|
});
|
minDate.value = void 0;
|
maxDate.value = void 0;
|
leftDate.value = start;
|
rightDate.value = end;
|
};
|
watch(defaultValue, (val) => {
|
if (val) {
|
restoreDefault();
|
}
|
}, { immediate: true });
|
watch(() => props.parsedValue, (parsedValue) => {
|
if (isArray(parsedValue) && parsedValue.length === 2) {
|
const [start, end] = parsedValue;
|
minDate.value = start;
|
leftDate.value = start;
|
maxDate.value = end;
|
onParsedValueChanged(unref(minDate), unref(maxDate));
|
} else {
|
restoreDefault();
|
}
|
}, { immediate: true });
|
return {
|
minDate,
|
maxDate,
|
rangeState,
|
lang,
|
ppNs: pickerNs,
|
drpNs,
|
handleChangeRange,
|
handleRangeConfirm,
|
handleShortcutClick,
|
onSelect,
|
t
|
};
|
};
|
|
export { useRangePicker };
|
//# sourceMappingURL=use-range-picker.mjs.map
|