{"version":3,"file":"panel-month-range.mjs","sources":["../../../../../../../packages/components/date-picker/src/date-picker-com/panel-month-range.vue"],"sourcesContent":["<template>\r\n  <div\r\n    class=\"sg-picker-panel sg-date-range-picker\"\r\n    :class=\"[\r\n      {\r\n        'has-sidebar': $slots.sidebar || hasShortcuts,\r\n      },\r\n    ]\"\r\n  >\r\n    <div class=\"sg-picker-panel__body-wrapper\">\r\n      <slot name=\"sidebar\" class=\"sg-picker-panel__sidebar\"></slot>\r\n      <div v-if=\"hasShortcuts\" class=\"sg-picker-panel__sidebar\">\r\n        <button\r\n          v-for=\"(shortcut, key) in shortcuts\"\r\n          :key=\"key\"\r\n          type=\"button\"\r\n          class=\"sg-picker-panel__shortcut\"\r\n          @click=\"handleShortcutClick(shortcut)\"\r\n        >\r\n          {{ shortcut.text }}\r\n        </button>\r\n      </div>\r\n      <div class=\"sg-picker-panel__body\">\r\n        <div\r\n          class=\"sg-picker-panel__content sg-date-range-picker__content is-left\"\r\n        >\r\n          <div class=\"sg-date-range-picker__header\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"sg-picker-panel__icon-btn d-arrow-left\"\r\n              @click=\"leftPrevYear\"\r\n            >\r\n              <sg-icon><DoubleArrowLeft /></sg-icon>\r\n            </button>\r\n            <button\r\n              v-if=\"unlinkPanels\"\r\n              type=\"button\"\r\n              :disabled=\"!enableYearArrow\"\r\n              :class=\"{ 'is-disabled': !enableYearArrow }\"\r\n              class=\"sg-picker-panel__icon-btn d-arrow-right\"\r\n              @click=\"leftNextYear\"\r\n            >\r\n              <sg-icon><DoubleArrowRight /></sg-icon>\r\n            </button>\r\n            <div>{{ leftLabel }}</div>\r\n          </div>\r\n          <month-table\r\n            selection-mode=\"range\"\r\n            :date=\"leftDate\"\r\n            :min-date=\"(minDate as Dayjs | undefined)\"\r\n            :max-date=\"(maxDate as Dayjs | undefined)\"\r\n            :range-state=\"rangeState\"\r\n            :disabled-date=\"disabledDate\"\r\n            @changerange=\"handleChangeRange\"\r\n            @pick=\"handleRangePick\"\r\n            @select=\"onSelect\"\r\n          />\r\n        </div>\r\n        <div\r\n          class=\"sg-picker-panel__content sg-date-range-picker__content is-right\"\r\n        >\r\n          <div class=\"sg-date-range-picker__header\">\r\n            <button\r\n              v-if=\"unlinkPanels\"\r\n              type=\"button\"\r\n              :disabled=\"!enableYearArrow\"\r\n              :class=\"{ 'is-disabled': !enableYearArrow }\"\r\n              class=\"sg-picker-panel__icon-btn d-arrow-left\"\r\n              @click=\"rightPrevYear\"\r\n            >\r\n              <sg-icon><DoubleArrowLeft /></sg-icon>\r\n            </button>\r\n            <button\r\n              type=\"button\"\r\n              class=\"sg-picker-panel__icon-btn d-arrow-right\"\r\n              @click=\"rightNextYear\"\r\n            >\r\n              <sg-icon><DoubleArrowRight /></sg-icon>\r\n            </button>\r\n            <div>{{ rightLabel }}</div>\r\n          </div>\r\n          <month-table\r\n            selection-mode=\"range\"\r\n            :date=\"rightDate\"\r\n            :min-date=\"(minDate as Dayjs | undefined)\"\r\n            :max-date=\"(maxDate as Dayjs | undefined)\"\r\n            :range-state=\"rangeState\"\r\n            :disabled-date=\"disabledDate\"\r\n            @changerange=\"handleChangeRange\"\r\n            @pick=\"handleRangePick\"\r\n            @select=\"onSelect\"\r\n          />\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { defineComponent, computed, ref, watch, inject, toRef } from 'vue'\r\nimport dayjs from 'dayjs'\r\nimport SgIcon from '@sgui-plus/components/icon'\r\nimport { TimePickerContextKey } from '@sgui-plus/components/time-picker'\r\nimport { useLocale } from '@sgui-plus/hooks'\r\nimport { DoubleArrowLeft, DoubleArrowRight } from '@sgui-plus/icons-vue'\r\nimport MonthTable from './basic-month-table.vue'\r\n\r\nimport type { PropType } from 'vue'\r\nimport type { Dayjs } from 'dayjs'\r\n\r\nexport default defineComponent({\r\n  components: { MonthTable, SgIcon, DoubleArrowLeft, DoubleArrowRight },\r\n\r\n  props: {\r\n    unlinkPanels: Boolean,\r\n    parsedValue: {\r\n      type: Array as PropType<Dayjs[]>,\r\n    },\r\n  },\r\n\r\n  emits: ['pick', 'set-picker-option'],\r\n\r\n  setup(props, ctx) {\r\n    const { t, lang } = useLocale()\r\n    const leftDate = ref(dayjs().locale(lang.value))\r\n    const rightDate = ref(dayjs().locale(lang.value).add(1, 'year'))\r\n\r\n    const hasShortcuts = computed(() => !!shortcuts.length)\r\n\r\n    const handleShortcutClick = (shortcut) => {\r\n      const shortcutValues =\r\n        typeof shortcut.value === 'function' ? shortcut.value() : shortcut.value\r\n      if (shortcutValues) {\r\n        ctx.emit('pick', [\r\n          dayjs(shortcutValues[0]).locale(lang.value),\r\n          dayjs(shortcutValues[1]).locale(lang.value),\r\n        ])\r\n        return\r\n      }\r\n      if (shortcut.onClick) {\r\n        shortcut.onClick(ctx)\r\n      }\r\n    }\r\n\r\n    const leftPrevYear = () => {\r\n      leftDate.value = leftDate.value.subtract(1, 'year')\r\n      if (!props.unlinkPanels) {\r\n        rightDate.value = rightDate.value.subtract(1, 'year')\r\n      }\r\n    }\r\n\r\n    const rightNextYear = () => {\r\n      if (!props.unlinkPanels) {\r\n        leftDate.value = leftDate.value.add(1, 'year')\r\n      }\r\n      rightDate.value = rightDate.value.add(1, 'year')\r\n    }\r\n\r\n    const leftNextYear = () => {\r\n      leftDate.value = leftDate.value.add(1, 'year')\r\n    }\r\n\r\n    const rightPrevYear = () => {\r\n      rightDate.value = rightDate.value.subtract(1, 'year')\r\n    }\r\n    const leftLabel = computed(() => {\r\n      return `${leftDate.value.year()} ${t('sg.datepicker.year')}`\r\n    })\r\n\r\n    const rightLabel = computed(() => {\r\n      return `${rightDate.value.year()} ${t('sg.datepicker.year')}`\r\n    })\r\n\r\n    const leftYear = computed(() => {\r\n      return leftDate.value.year()\r\n    })\r\n\r\n    const rightYear = computed(() => {\r\n      return rightDate.value.year() === leftDate.value.year()\r\n        ? leftDate.value.year() + 1\r\n        : rightDate.value.year()\r\n    })\r\n\r\n    const enableYearArrow = computed(() => {\r\n      return props.unlinkPanels && rightYear.value > leftYear.value + 1\r\n    })\r\n\r\n    const minDate = ref<Dayjs | null>(null)\r\n    const maxDate = ref<Dayjs | null>(null)\r\n\r\n    const rangeState = ref({\r\n      endDate: null,\r\n      selecting: false,\r\n    })\r\n\r\n    const handleChangeRange = (val) => {\r\n      rangeState.value = val\r\n    }\r\n\r\n    const handleRangePick = (val, close = true) => {\r\n      // const defaultTime = props.defaultTime || []\r\n      // const minDate_ = modifyWithTimeString(val.minDate, defaultTime[0])\r\n      // const maxDate_ = modifyWithTimeString(val.maxDate, defaultTime[1])\r\n      // todo\r\n      const minDate_ = val.minDate\r\n      const maxDate_ = val.maxDate\r\n      if (maxDate.value === maxDate_ && minDate.value === minDate_) {\r\n        return\r\n      }\r\n      maxDate.value = maxDate_\r\n      minDate.value = minDate_\r\n\r\n      if (!close) return\r\n      handleConfirm()\r\n    }\r\n\r\n    const isValidValue = (value) => {\r\n      return (\r\n        Array.isArray(value) &&\r\n        value &&\r\n        value[0] &&\r\n        value[1] &&\r\n        value[0].valueOf() <= value[1].valueOf()\r\n      )\r\n    }\r\n\r\n    const handleConfirm = (visible = false) => {\r\n      if (isValidValue([minDate.value, maxDate.value])) {\r\n        ctx.emit('pick', [minDate.value, maxDate.value], visible)\r\n      }\r\n    }\r\n\r\n    const onSelect = (selecting) => {\r\n      rangeState.value.selecting = selecting\r\n      if (!selecting) {\r\n        rangeState.value.endDate = null\r\n      }\r\n    }\r\n\r\n    const formatToString = (value) => {\r\n      return value.map((_) => _.format(format))\r\n    }\r\n\r\n    const getDefaultValue = () => {\r\n      let start: Dayjs\r\n      if (Array.isArray(defaultValue.value)) {\r\n        const left = dayjs(defaultValue.value[0])\r\n        let right = dayjs(defaultValue.value[1])\r\n        if (!props.unlinkPanels) {\r\n          right = left.add(1, 'year')\r\n        }\r\n        return [left, right]\r\n      } else if (defaultValue.value) {\r\n        start = dayjs(defaultValue.value)\r\n      } else {\r\n        start = dayjs()\r\n      }\r\n      start = start.locale(lang.value)\r\n      return [start, start.add(1, 'year')]\r\n    }\r\n\r\n    // pickerBase.hub.emit('SetPickerOption', ['isValidValue', isValidValue])\r\n    ctx.emit('set-picker-option', ['formatToString', formatToString])\r\n    const pickerBase = inject(TimePickerContextKey) as any\r\n    const { shortcuts, disabledDate, format } = pickerBase.props\r\n    const defaultValue = toRef(pickerBase.props, 'defaultValue')\r\n\r\n    watch(\r\n      () => defaultValue.value,\r\n      (val) => {\r\n        if (val) {\r\n          const defaultArr = getDefaultValue()\r\n          leftDate.value = defaultArr[0]\r\n          rightDate.value = defaultArr[1]\r\n        }\r\n      },\r\n      { immediate: true }\r\n    )\r\n\r\n    watch(\r\n      () => props.parsedValue,\r\n      (newVal) => {\r\n        if (newVal && newVal.length === 2) {\r\n          minDate.value = newVal[0]\r\n          maxDate.value = newVal[1]\r\n          leftDate.value = minDate.value\r\n          if (props.unlinkPanels && maxDate.value) {\r\n            const minDateYear = minDate.value.year()\r\n            const maxDateYear = maxDate.value.year()\r\n            rightDate.value =\r\n              minDateYear === maxDateYear\r\n                ? maxDate.value.add(1, 'year')\r\n                : maxDate.value\r\n          } else {\r\n            rightDate.value = leftDate.value.add(1, 'year')\r\n          }\r\n        } else {\r\n          const defaultArr = getDefaultValue()\r\n          minDate.value = null\r\n          maxDate.value = null\r\n          leftDate.value = defaultArr[0]\r\n          rightDate.value = defaultArr[1]\r\n        }\r\n      },\r\n      { immediate: true }\r\n    )\r\n\r\n    return {\r\n      shortcuts,\r\n      disabledDate,\r\n      onSelect,\r\n      handleRangePick,\r\n      rangeState,\r\n      handleChangeRange,\r\n      minDate,\r\n      maxDate,\r\n      enableYearArrow,\r\n      leftLabel,\r\n      rightLabel,\r\n      leftNextYear,\r\n      leftPrevYear,\r\n      rightNextYear,\r\n      rightPrevYear,\r\n      t,\r\n      leftDate,\r\n      rightDate,\r\n      hasShortcuts,\r\n      handleShortcutClick,\r\n    }\r\n  },\r\n})\r\n</script>\r\n"],"names":["_resolveComponent","_createElementVNode","_renderSlot","_openBlock","_createElementBlock","_Fragment","_renderList","_createCommentVNode","_withCtx","_normalizeClass","_toDisplayString"],"mappings":"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"}