element-plus-secondary 0.4.13 → 0.4.16

package/es/components/date-picker/src/date-picker-com/panel-date-pick.vue.d.ts

@@ -7460,6 +7460,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        readonly startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         readonly minDate: {
             readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;
@@ -7504,6 +7510,12 @@ declare const _default: import("vue").DefineComponent<{
                 readonly validator: ((val: unknown) => boolean) | undefined;
                 __epPropKey: true;
             };
+            readonly startDate: {
+                readonly type: import("vue").PropType<dayjs.Dayjs>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            };
             readonly minDate: {
                 readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
                 readonly required: false;
@@ -8068,6 +8080,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        readonly startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         readonly minDate: {
             readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;
@@ -8113,6 +8131,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         minDate: {
             readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;
@@ -8151,6 +8175,12 @@ declare const _default: import("vue").DefineComponent<{
                 readonly validator: ((val: unknown) => boolean) | undefined;
                 __epPropKey: true;
             };
+            startDate: {
+                readonly type: import("vue").PropType<dayjs.Dayjs>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            };
             minDate: {
                 readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
                 readonly required: false;
@@ -8267,6 +8297,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         minDate: {
             readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;

package/es/components/date-picker/src/date-picker-com/panel-date-range.vue.d.ts

@@ -7588,6 +7588,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        readonly startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         readonly minDate: {
             readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;
@@ -7632,6 +7638,12 @@ declare const _default: import("vue").DefineComponent<{
                 readonly validator: ((val: unknown) => boolean) | undefined;
                 __epPropKey: true;
             };
+            readonly startDate: {
+                readonly type: import("vue").PropType<dayjs.Dayjs>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            };
             readonly minDate: {
                 readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
                 readonly required: false;
@@ -8196,6 +8208,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        readonly startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         readonly minDate: {
             readonly type: import("vue").PropType<import("element-plus-secondary/es/utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;

package/es/components/date-picker/src/date-picker-com/panel-month-range.vue.d.ts

@@ -382,6 +382,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         minDate: {
             readonly type: import("vue").PropType<import("../../../../utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;
@@ -420,6 +426,12 @@ declare const _default: import("vue").DefineComponent<{
                 readonly validator: ((val: unknown) => boolean) | undefined;
                 __epPropKey: true;
             };
+            startDate: {
+                readonly type: import("vue").PropType<dayjs.Dayjs>;
+                readonly required: false;
+                readonly validator: ((val: unknown) => boolean) | undefined;
+                __epPropKey: true;
+            };
             minDate: {
                 readonly type: import("vue").PropType<import("../../../../utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
                 readonly required: false;
@@ -536,6 +548,12 @@ declare const _default: import("vue").DefineComponent<{
             readonly validator: ((val: unknown) => boolean) | undefined;
             __epPropKey: true;
         };
+        startDate: {
+            readonly type: import("vue").PropType<dayjs.Dayjs>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
         minDate: {
             readonly type: import("vue").PropType<import("../../../../utils").EpPropMergeType<(new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null) | ((new (...args: any[]) => dayjs.Dayjs) | (() => dayjs.Dayjs | null))[], unknown, unknown>>;
             readonly required: false;

package/es/components/date-picker/src/date-picker-com/panel-year-range.mjs

@@ -0,0 +1,286 @@
+import { defineComponent, inject, toRef, ref, computed, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, renderSlot, Fragment, renderList, toDisplayString, createCommentVNode, createVNode, withCtx, normalizeStyle } from 'vue';
+import dayjs from 'dayjs';
+import { ElIcon } from '../../../icon/index.mjs';
+import '../../../../hooks/index.mjs';
+import { DArrowLeft, DArrowRight } from '@element-plus/icons-vue';
+import { panelMonthRangeProps, panelMonthRangeEmits } from '../props/panel-month-range.mjs';
+import { useMonthRangeHeader } from '../composables/use-month-range-header.mjs';
+import { useYearRangePicker } from '../composables/use-range-picker.mjs';
+import MonthTable from './basic-year-range-table.mjs';
+import '../../../../utils/index.mjs';
+import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../../hooks/use-namespace/index.mjs';
+import { useLocale } from '../../../../hooks/use-locale/index.mjs';
+import { isArray } from '@vue/shared';
+import { formatterStyle } from '../../../../utils/types.mjs';
+
+const _hoisted_1 = ["onClick"];
+const _hoisted_2 = ["disabled"];
+const _hoisted_3 = ["disabled"];
+const unit = "year";
+const __default__ = defineComponent({
+  name: "DatePickerMonthRange"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: panelMonthRangeProps,
+  emits: panelMonthRangeEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const dpNs = useNamespace("date-picker");
+    const { lang, t } = useLocale();
+    const pickerBase = inject("EP_PICKER_BASE");
+    const { shortcuts, disabledDate, format } = pickerBase.props;
+    const defaultValue = toRef(pickerBase.props, "defaultValue");
+    const leftDate = ref(dayjs().locale(lang.value));
+    const rightDate = ref(dayjs().locale(lang.value).add(1, unit));
+    const customStyle = inject("$custom-style-filter", {});
+    const {
+      minDate,
+      maxDate,
+      rangeState,
+      ppNs,
+      drpNs,
+      handleChangeRange,
+      handleRangeConfirm,
+      handleShortcutClick,
+      onSelect
+    } = useYearRangePicker(props, {
+      defaultValue,
+      leftDate,
+      rightDate,
+      unit,
+      onParsedValueChanged
+    });
+    const hasShortcuts = computed(() => !!shortcuts.length);
+    const innerDate = ref(dayjs().locale(lang.value));
+    const beginDate = ref(dayjs().locale(lang.value));
+    const endDate = ref(dayjs().locale(lang.value));
+    const year = computed(() => {
+      return innerDate.value.year();
+    });
+    const yearLabel = computed(() => {
+      const yearTranslation = t("el.datepicker.year");
+      const startYear = year.value;
+      if (yearTranslation) {
+        return `${startYear} ${yearTranslation} - ${startYear + 23} ${yearTranslation}`;
+      }
+      return `${startYear} - ${startYear + 23}`;
+    });
+    const {
+      leftNextYear,
+      rightPrevYear,
+      leftYear,
+      rightYear
+    } = useMonthRangeHeader({
+      unlinkPanels: toRef(props, "unlinkPanels"),
+      leftDate,
+      rightDate
+    });
+    const enableYearArrow = computed(() => {
+      return props.unlinkPanels && rightYear.value > leftYear.value + 1;
+    });
+    const handleRangePick = (val, close = true) => {
+      const minDate_ = val.minDate;
+      const maxDate_ = val.maxDate;
+      if (maxDate.value === maxDate_ && minDate.value === minDate_) {
+        return;
+      }
+      maxDate.value = maxDate_;
+      minDate.value = minDate_;
+      if (!close)
+        return;
+      handleRangeConfirm();
+    };
+    const formatToString = (days) => {
+      if (isArray(days)) {
+        return days.map((day) => day.format(format));
+      }
+      return days.format(format);
+    };
+    const moveByYear = (forward) => {
+      const currentDate = innerDate.value;
+      const action = forward ? "add" : "subtract";
+      innerDate.value = currentDate[action](24, "year");
+      beginDate.value = innerDate.value.add(0, "year");
+      endDate.value = beginDate.value.add(12, "year");
+    };
+    const setDefaultValue = () => {
+      var _a;
+      if ((_a = props.parsedValue) == null ? void 0 : _a[0]) {
+        innerDate.value = props.parsedValue[0].clone().subtract(24, "year");
+      } else {
+        innerDate.value = innerDate.value.subtract(24, "year");
+      }
+      moveByYear(true);
+    };
+    setDefaultValue();
+    function onParsedValueChanged(minDate2, maxDate2) {
+      if (props.unlinkPanels && maxDate2) {
+        const minDateYear = (minDate2 == null ? void 0 : minDate2.year()) || 0;
+        const maxDateYear = maxDate2.year();
+        rightDate.value = minDateYear === maxDateYear ? maxDate2.add(1, unit) : maxDate2;
+      } else {
+        rightDate.value = leftDate.value.add(1, unit);
+      }
+    }
+    const parseUserInput = (days) => {
+      if (!days)
+        return null;
+      if (isArray(days)) {
+        return days.map((d) => dayjs(d, "YYYY").locale(lang.value));
+      }
+      return dayjs(days, "YYYY").locale(lang.value);
+    };
+    const isValidValue = (_date) => {
+      const parsedDate = dayjs(_date).locale(lang.value);
+      return parsedDate;
+    };
+    emit("set-picker-option", ["formatToString", formatToString]);
+    emit("set-picker-option", ["parseUserInput", parseUserInput]);
+    emit("set-picker-option", ["isValidValue", isValidValue]);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          unref(ppNs).b(),
+          unref(drpNs).b(),
+          {
+            "has-sidebar": Boolean(_ctx.$slots.sidebar) || unref(hasShortcuts)
+          }
+        ])
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(unref(ppNs).e("body-wrapper"))
+        }, [
+          renderSlot(_ctx.$slots, "sidebar", {
+            class: normalizeClass(unref(ppNs).e("sidebar"))
+          }),
+          unref(hasShortcuts) ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(unref(ppNs).e("sidebar"))
+          }, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(unref(shortcuts), (shortcut, key) => {
+              return openBlock(), createElementBlock("button", {
+                key,
+                type: "button",
+                class: normalizeClass(unref(ppNs).e("shortcut")),
+                onClick: ($event) => unref(handleShortcutClick)(shortcut)
+              }, toDisplayString(shortcut.text), 11, _hoisted_1);
+            }), 128))
+          ], 2)) : createCommentVNode("v-if", true),
+          createElementVNode("div", {
+            class: normalizeClass(unref(ppNs).e("body"))
+          }, [
+            createElementVNode("div", {
+              class: normalizeClass([[unref(ppNs).e("content"), unref(drpNs).e("content")], "is-left"])
+            }, [
+              createElementVNode("div", {
+                class: normalizeClass(unref(drpNs).e("header"))
+              }, [
+                createElementVNode("button", {
+                  type: "button",
+                  class: normalizeClass([unref(ppNs).e("icon-btn"), "d-arrow-left"]),
+                  onClick: _cache[0] || (_cache[0] = ($event) => moveByYear(false))
+                }, [
+                  createVNode(unref(ElIcon), null, {
+                    default: withCtx(() => [
+                      createVNode(unref(DArrowLeft))
+                    ]),
+                    _: 1
+                  })
+                ], 2),
+                _ctx.unlinkPanels ? (openBlock(), createElementBlock("button", {
+                  key: 0,
+                  type: "button",
+                  disabled: !unref(enableYearArrow),
+                  class: normalizeClass([[
+                    unref(ppNs).e("icon-btn"),
+                    { [unref(ppNs).is("disabled")]: !unref(enableYearArrow) }
+                  ], "d-arrow-right"]),
+                  onClick: _cache[1] || (_cache[1] = (...args) => unref(leftNextYear) && unref(leftNextYear)(...args))
+                }, [
+                  createVNode(unref(ElIcon), null, {
+                    default: withCtx(() => [
+                      createVNode(unref(DArrowRight))
+                    ]),
+                    _: 1
+                  })
+                ], 10, _hoisted_2)) : createCommentVNode("v-if", true),
+                createElementVNode("div", {
+                  class: normalizeClass(unref(dpNs).e("header-label")),
+                  style: normalizeStyle([unref(formatterStyle)(unref(customStyle), ["text"])])
+                }, toDisplayString(unref(yearLabel)), 7)
+              ], 2),
+              createVNode(MonthTable, {
+                "selection-mode": "range",
+                date: leftDate.value,
+                startDate: beginDate.value,
+                "min-date": unref(minDate),
+                "max-date": unref(maxDate),
+                "range-state": unref(rangeState),
+                "disabled-date": unref(disabledDate),
+                onChangerange: unref(handleChangeRange),
+                onPick: handleRangePick,
+                onSelect: unref(onSelect)
+              }, null, 8, ["date", "startDate", "min-date", "max-date", "range-state", "disabled-date", "onChangerange", "onSelect"])
+            ], 2),
+            createElementVNode("div", {
+              class: normalizeClass([[unref(ppNs).e("content"), unref(drpNs).e("content")], "is-right"])
+            }, [
+              createElementVNode("div", {
+                class: normalizeClass(unref(drpNs).e("header"))
+              }, [
+                _ctx.unlinkPanels ? (openBlock(), createElementBlock("button", {
+                  key: 0,
+                  type: "button",
+                  disabled: !unref(enableYearArrow),
+                  class: normalizeClass([[unref(ppNs).e("icon-btn"), { "is-disabled": !unref(enableYearArrow) }], "d-arrow-left"]),
+                  onClick: _cache[2] || (_cache[2] = (...args) => unref(rightPrevYear) && unref(rightPrevYear)(...args))
+                }, [
+                  createVNode(unref(ElIcon), null, {
+                    default: withCtx(() => [
+                      createVNode(unref(DArrowLeft))
+                    ]),
+                    _: 1
+                  })
+                ], 10, _hoisted_3)) : createCommentVNode("v-if", true),
+                createElementVNode("button", {
+                  type: "button",
+                  class: normalizeClass([unref(ppNs).e("icon-btn"), "d-arrow-right"]),
+                  onClick: _cache[3] || (_cache[3] = ($event) => moveByYear(true))
+                }, [
+                  createVNode(unref(ElIcon), null, {
+                    default: withCtx(() => [
+                      createVNode(unref(DArrowRight))
+                    ]),
+                    _: 1
+                  })
+                ], 2),
+                createElementVNode("div", {
+                  class: normalizeClass(unref(dpNs).e("header-label")),
+                  style: normalizeStyle([unref(formatterStyle)(unref(customStyle), ["text"])])
+                }, toDisplayString(unref(yearLabel)), 7)
+              ], 2),
+              createVNode(MonthTable, {
+                "selection-mode": "range",
+                date: rightDate.value,
+                startDate: endDate.value,
+                "min-date": unref(minDate),
+                "max-date": unref(maxDate),
+                "range-state": unref(rangeState),
+                "disabled-date": unref(disabledDate),
+                onChangerange: unref(handleChangeRange),
+                onPick: handleRangePick,
+                onSelect: unref(onSelect)
+              }, null, 8, ["date", "startDate", "min-date", "max-date", "range-state", "disabled-date", "onChangerange", "onSelect"])
+            ], 2)
+          ], 2)
+        ], 2)
+      ], 2);
+    };
+  }
+});
+var YearRangePickPanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/st/Desktop/vue/nxx-ui/packages/components/date-picker/src/date-picker-com/panel-year-range.vue"]]);
+
+export { YearRangePickPanel as default };
+//# sourceMappingURL=panel-year-range.mjs.map

package/es/components/date-picker/src/date-picker-com/panel-year-range.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-year-range.mjs","sources":["../../../../../../../packages/components/date-picker/src/date-picker-com/panel-year-range.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      ppNs.b(),\n      drpNs.b(),\n      {\n        'has-sidebar': Boolean($slots.sidebar) || hasShortcuts,\n      },\n    ]\"\n  >\n    <div :class=\"ppNs.e('body-wrapper')\">\n      <slot name=\"sidebar\" :class=\"ppNs.e('sidebar')\" />\n      <div v-if=\"hasShortcuts\" :class=\"ppNs.e('sidebar')\">\n        <button\n          v-for=\"(shortcut, key) in shortcuts\"\n          :key=\"key\"\n          type=\"button\"\n          :class=\"ppNs.e('shortcut')\"\n          @click=\"handleShortcutClick(shortcut)\"\n        >\n          {{ shortcut.text }}\n        </button>\n      </div>\n      <div :class=\"ppNs.e('body')\">\n        <div :class=\"[ppNs.e('content'), drpNs.e('content')]\" class=\"is-left\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              type=\"button\"\n              :class=\"ppNs.e('icon-btn')\"\n              class=\"d-arrow-left\"\n              @click=\"moveByYear(false)\"\n            >\n              <el-icon><d-arrow-left /></el-icon>\n            </button>\n            <button\n              v-if=\"unlinkPanels\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow\"\n              :class=\"[\n                ppNs.e('icon-btn'),\n                { [ppNs.is('disabled')]: !enableYearArrow },\n              ]\"\n              class=\"d-arrow-right\"\n              @click=\"leftNextYear\"\n            >\n              <el-icon><d-arrow-right /></el-icon>\n            </button>\n            <div\n              :class=\"dpNs.e('header-label')\"\n              :style=\"[formatterStyle(customStyle, ['text'])]\"\n              >{{ yearLabel }}</div\n            >\n          </div>\n          <month-table\n            selection-mode=\"range\"\n            :date=\"leftDate\"\n            :startDate=\"beginDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n        <div :class=\"[ppNs.e('content'), drpNs.e('content')]\" class=\"is-right\">\n          <div :class=\"drpNs.e('header')\">\n            <button\n              v-if=\"unlinkPanels\"\n              type=\"button\"\n              :disabled=\"!enableYearArrow\"\n              :class=\"[ppNs.e('icon-btn'), { 'is-disabled': !enableYearArrow }]\"\n              class=\"d-arrow-left\"\n              @click=\"rightPrevYear\"\n            >\n              <el-icon><d-arrow-left /></el-icon>\n            </button>\n            <button\n              type=\"button\"\n              :class=\"ppNs.e('icon-btn')\"\n              class=\"d-arrow-right\"\n              @click=\"moveByYear(true)\"\n            >\n              <el-icon><d-arrow-right /></el-icon>\n            </button>\n            <div\n              :class=\"dpNs.e('header-label')\"\n              :style=\"[formatterStyle(customStyle, ['text'])]\"\n              >{{ yearLabel }}</div\n            >\n          </div>\n          <month-table\n            selection-mode=\"range\"\n            :date=\"rightDate\"\n            :startDate=\"endDate\"\n            :min-date=\"minDate\"\n            :max-date=\"maxDate\"\n            :range-state=\"rangeState\"\n            :disabled-date=\"disabledDate\"\n            @changerange=\"handleChangeRange\"\n            @pick=\"handleRangePick\"\n            @select=\"onSelect\"\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, ref, toRef } from 'vue'\nimport dayjs from 'dayjs'\nimport ElIcon from '@element-plus/components/icon'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { DArrowLeft, DArrowRight } from '@element-plus/icons-vue'\nimport {\n  panelMonthRangeEmits,\n  panelMonthRangeProps,\n} from '../props/panel-month-range'\nimport { useMonthRangeHeader } from '../composables/use-month-range-header'\nimport { useYearRangePicker } from '../composables/use-range-picker'\nimport MonthTable from './basic-year-range-table.vue'\nimport { formatterStyle } from '@element-plus/utils'\nimport type { CustomStyle } from '@element-plus/utils'\nimport { isArray } from '@element-plus/utils'\n\nimport type { Dayjs } from 'dayjs'\n\ndefineOptions({\n  name: 'DatePickerMonthRange',\n})\n\nconst props = defineProps(panelMonthRangeProps)\nconst emit = defineEmits(panelMonthRangeEmits)\nconst unit = 'year'\nconst dpNs = useNamespace('date-picker')\n\nconst { lang, t } = useLocale()\nconst pickerBase = inject('EP_PICKER_BASE') as any\nconst { shortcuts, disabledDate, format } = pickerBase.props\nconst defaultValue = toRef(pickerBase.props, 'defaultValue')\nconst leftDate = ref(dayjs().locale(lang.value))\nconst rightDate = ref(dayjs().locale(lang.value).add(1, unit))\nconst customStyle = inject('$custom-style-filter', {}) as CustomStyle\n\nconst {\n  minDate,\n  maxDate,\n  rangeState,\n  ppNs,\n  drpNs,\n\n  handleChangeRange,\n  handleRangeConfirm,\n  handleShortcutClick,\n  onSelect,\n} = useYearRangePicker(props, {\n  defaultValue,\n  leftDate,\n  rightDate,\n  unit,\n  onParsedValueChanged,\n})\nconst hasShortcuts = computed(() => !!shortcuts.length)\nconst innerDate = ref(dayjs().locale(lang.value))\nconst beginDate = ref(dayjs().locale(lang.value))\nconst endDate = ref(dayjs().locale(lang.value))\n\nconst year = computed(() => {\n  return innerDate.value.year()\n})\nconst yearLabel = computed(() => {\n  const yearTranslation = t('el.datepicker.year')\n  const startYear = year.value\n    if (yearTranslation) {\n      return `${startYear} ${yearTranslation} - ${\n        startYear + 23\n      } ${yearTranslation}`\n    }\n    return `${startYear} - ${startYear + 23}`\n})\nconst {\n  leftNextYear,\n  rightPrevYear,\n  leftYear,\n  rightYear,\n} = useMonthRangeHeader({\n  unlinkPanels: toRef(props, 'unlinkPanels'),\n  leftDate,\n  rightDate,\n})\n\nconst enableYearArrow = computed(() => {\n  return props.unlinkPanels && rightYear.value > leftYear.value + 1\n})\n\ntype RangePickValue = {\n  minDate: Dayjs\n  maxDate: Dayjs\n}\n\nconst handleRangePick = (val: RangePickValue, close = true) => {\n  // const defaultTime = props.defaultTime || []\n  // const minDate_ = modifyWithTimeString(val.minDate, defaultTime[0])\n  // const maxDate_ = modifyWithTimeString(val.maxDate, defaultTime[1])\n  // todo\n  const minDate_ = val.minDate\n  const maxDate_ = val.maxDate\n  if (maxDate.value === maxDate_ && minDate.value === minDate_) {\n    return\n  }\n  maxDate.value = maxDate_\n  minDate.value = minDate_\n\n  if (!close) return\n  handleRangeConfirm()\n}\n\nconst formatToString = (days: Dayjs[] | Dayjs) => {\n  if (isArray(days)) {\n    return days.map((day) => day.format(format))\n  }\n  return days.format(format)\n}\n\n\n\nconst moveByYear = (forward: boolean) => {\n  const currentDate = innerDate.value\n  const action = forward ? 'add' : 'subtract'\n  innerDate.value = currentDate[action](24, 'year')\n  beginDate.value = innerDate.value.add(0, 'year')\n  endDate.value = beginDate.value.add(12, 'year')\n}\n\n\n\nconst setDefaultValue = () => {\n  if (props.parsedValue?.[0]) {\n    innerDate.value = props.parsedValue[0].clone().subtract(24, 'year')\n  } else {\n    innerDate.value = innerDate.value.subtract(24, 'year')\n  }\n  \n  moveByYear(true)\n}\n\nsetDefaultValue()\n\n\nfunction onParsedValueChanged(\n  minDate: Dayjs | undefined,\n  maxDate: Dayjs | undefined\n) {\n  if (props.unlinkPanels && maxDate) {\n    const minDateYear = minDate?.year() || 0\n    const maxDateYear = maxDate.year()\n    rightDate.value =\n      minDateYear === maxDateYear ? maxDate.add(1, unit) : maxDate\n  } else {\n    rightDate.value = leftDate.value.add(1, unit)\n  }\n}\nconst parseUserInput = (days: Dayjs[] | Dayjs) => {\n  if (!days) return null\n  if (isArray(days)) {\n    return days.map((d) => dayjs(d, 'YYYY').locale(lang.value))\n  }\n  return dayjs(days, 'YYYY').locale(lang.value)\n}\nconst isValidValue = (_date: Dayjs) => {\n  const parsedDate = dayjs(_date).locale(lang.value)\n  return parsedDate\n}\n\n\nemit('set-picker-option', ['formatToString', formatToString])\nemit('set-picker-option', ['parseUserInput', parseUserInput])\nemit('set-picker-option', ['isValidValue', isValidValue])\n</script>\n"],"names":[],"mappings":"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"}