vft 0.0.428 → 0.0.430

package/es/components/date-picker/date-picker-com/panel-date-pick.vue2.js

@@ -0,0 +1,507 @@
+import { defineComponent as nt, useAttrs as rt, useSlots as st, ref as g, inject as ee, toRef as ut, computed as m, watch as x, createElementBlock as I, openBlock as C, normalizeClass as i, unref as o, createElementVNode as h, withDirectives as P, renderSlot as it, createCommentVNode as S, Fragment as ct, renderList as dt, toDisplayString as te, createVNode as T, vShow as N, withKeys as he, createBlock as ae, withCtx as ye, createTextVNode as ke, nextTick as z } from "vue";
+import w from "dayjs";
+import { VftButton as we } from "../../button/index.js";
+import { ClickOutside as vt } from "@vft/directives";
+import "@vueuse/core";
+import { isArray as A, isFunction as be } from "@vft/utils";
+import "../../config-provider/hooks/use-global-config.js";
+import { EVENT_CODE as k } from "../../../constants/aria.js";
+import "lodash-es";
+import "../../form/index.js";
+import { useNamespace as Ve } from "../../../hooks/use-namespace/index.js";
+import "../../../hooks/use-model-toggle/index.js";
+import "@popperjs/core";
+import "../../../hooks/use-z-index/index.js";
+import { VftInput as De } from "../../input/index.js";
+import "../../time-picker/index.js";
+import { VftIcon as L } from "../../icon/index.js";
+import "../../tooltip/index.js";
+import { panelDatePickProps as mt } from "../props/panel-date-pick.js";
+import { getValidDateOfMonth as ge, getValidDateOfYear as Ce, correctlyParseUserInput as Te } from "../utils.js";
+import { ROOT_PICKER_IS_DEFAULT_FORMAT_INJECTION_KEY as ft } from "../constants.js";
+import pt from "./basic-date-table.vue2.js";
+import ht from "./basic-month-table.vue2.js";
+import yt from "./basic-year-table.vue2.js";
+import { PICKER_BASE_INJECTION_KEY as kt } from "../../time-picker/constants.js";
+import { TOOLTIP_INJECTION_KEY as wt } from "../../tooltip/constants.js";
+import { extractTimeFormat as bt, extractDateFormat as Vt } from "../../time-picker/utils.js";
+import Dt from "../../time-picker/time-picker-com/panel-time-pick.vue2.js";
+const gt = ["onClick"], Zt = /* @__PURE__ */ nt({
+  __name: "panel-date-pick",
+  props: mt,
+  emits: ["pick", "set-picker-option", "panel-change"],
+  setup(Pe, { emit: Fe }) {
+    const $e = (e, t, l) => !0, n = Pe, b = Fe, f = Ve("picker-panel"), V = Ve("date-picker"), Ie = rt(), Ne = st(), d = g("zh-cn"), le = ee(kt), oe = ee(
+      ft
+    ), Ee = ee(wt), { shortcuts: ne, disabledDate: c, cellClassName: Me, defaultTime: J } = le.props, E = ut(le.props, "defaultValue"), _ = g(), a = g(w().locale(d.value)), W = g(!1);
+    let H = !1;
+    const re = m(() => w(J).locale(d.value)), Oe = m(() => a.value.month()), se = m(() => a.value.year()), ue = g([]), F = g(null), $ = g(null), q = (e) => ue.value.length > 0 ? $e(e, ue.value, n.format || "HH:mm:ss") : !0, ie = (e) => J && !fe.value && !W.value && !H ? re.value.year(e.year()).month(e.month()).date(e.date()) : M.value ? e.millisecond(0) : e.startOf("day"), v = (e, ...t) => {
+      if (!e)
+        b("pick", e, ...t);
+      else if (A(e)) {
+        const l = e.map(ie);
+        b("pick", l, ...t);
+      } else
+        b("pick", ie(e), ...t);
+      F.value = null, $.value = null, W.value = !1, H = !1;
+    }, Ye = async (e, t) => {
+      if (u.value === "date") {
+        e = e;
+        let l = n.parsedValue ? n.parsedValue.year(e.year()).month(e.month()).date(e.date()) : e;
+        q(l), a.value = l, v(l, M.value || t), n.type === "datetime" && (await z(), Y());
+      } else u.value === "week" ? v(e.date) : u.value === "dates" && v(e, !0);
+    }, ce = (e) => {
+      const t = e ? "add" : "subtract";
+      a.value = a.value[t](1, "month"), U("month");
+    }, de = (e) => {
+      const t = a.value, l = e ? "add" : "subtract";
+      a.value = s.value === "year" ? t[l](10, "year") : t[l](1, "year"), U("year");
+    }, s = g("date"), Re = m(() => {
+      const e = "年";
+      if (s.value === "year") {
+        const t = Math.floor(se.value / 10) * 10;
+        return `${t} ${e} - ${t + 9} ${e}`;
+      }
+      return `${se.value} ${e}`;
+    }), Ke = (e) => {
+      const t = be(e.value) ? e.value() : e.value;
+      if (t) {
+        H = !0, v(w(t).locale(d.value));
+        return;
+      }
+      e.onClick && e.onClick({
+        attrs: Ie,
+        slots: Ne,
+        emit: b
+      });
+    }, u = m(() => {
+      const { type: e } = n;
+      return ["week", "month", "months", "year", "years", "dates"].includes(e) ? e : "date";
+    }), G = m(() => u.value === "dates" || u.value === "months" || u.value === "years"), Se = m(() => u.value === "date" ? s.value : u.value), ve = m(() => !!ne.length), _e = async (e, t) => {
+      u.value === "month" ? (a.value = ge(
+        a.value,
+        a.value.year(),
+        e,
+        d.value,
+        c
+      ), v(a.value, !1)) : u.value === "months" ? v(e, t ?? !0) : (a.value = ge(
+        a.value,
+        a.value.year(),
+        e,
+        d.value,
+        c
+      ), s.value = "date", ["month", "year", "date", "week"].includes(u.value) && (v(a.value, !0), await z(), Y())), U("month");
+    }, Be = async (e, t) => {
+      if (u.value === "year") {
+        const l = a.value.startOf("year").year(e);
+        a.value = Ce(l, d.value, c), v(a.value, !1);
+      } else if (u.value === "years")
+        v(e, t ?? !0);
+      else {
+        const l = a.value.year(e);
+        a.value = Ce(l, d.value, c), s.value = "month", ["month", "year", "date", "week"].includes(u.value) && (v(a.value, !0), await z(), Y());
+      }
+      U("year");
+    }, B = async (e) => {
+      s.value = e, await z(), Y();
+    }, M = m(
+      () => n.type === "datetime" || n.type === "datetimerange"
+    ), Ue = m(() => {
+      const e = M.value || u.value === "dates", t = u.value === "years", l = u.value === "months", p = s.value === "date", y = s.value === "year", R = s.value === "month";
+      return e && p || t && y || l && R;
+    }), xe = m(() => c ? n.parsedValue ? A(n.parsedValue) ? c(n.parsedValue[0].toDate()) : c(n.parsedValue.toDate()) : !0 : !1), ze = () => {
+      if (G.value)
+        v(n.parsedValue);
+      else {
+        let e = n.parsedValue;
+        if (!e) {
+          const t = w(J).locale(d.value), l = Z();
+          e = t.year(l.year()).month(l.month()).date(l.date());
+        }
+        a.value = e, v(e);
+      }
+    }, Ae = m(() => c ? c(w().locale(d.value).toDate()) : !1), Le = () => {
+      const t = w().locale(d.value).toDate();
+      W.value = !0, (!c || !c(t)) && q(t) && (a.value = w().locale(d.value), v(a.value));
+    }, Q = m(() => n.timeFormat || bt(n.format)), me = m(() => n.dateFormat || Vt(n.format)), fe = m(() => {
+      if ($.value) return $.value;
+      if (!(!n.parsedValue && !E.value))
+        return (n.parsedValue || a.value).format(
+          Q.value
+        );
+    }), Je = m(() => {
+      if (F.value) return F.value;
+      if (!(!n.parsedValue && !E.value))
+        return (n.parsedValue || a.value).format(
+          me.value
+        );
+    }), O = g(!1), We = () => {
+      O.value = !0;
+    }, He = () => {
+      O.value = !1;
+    }, X = (e) => ({
+      hour: e.hour(),
+      minute: e.minute(),
+      second: e.second(),
+      year: e.year(),
+      month: e.month(),
+      date: e.date()
+    }), qe = (e, t, l) => {
+      const { hour: p, minute: y, second: R } = X(e), j = n.parsedValue ? n.parsedValue.hour(p).minute(y).second(R) : e;
+      a.value = j, v(a.value, !0), l || (O.value = t);
+    }, Ge = (e) => {
+      const t = w(e, Q.value).locale(d.value);
+      if (t.isValid() && q(t)) {
+        const { year: l, month: p, date: y } = X(a.value);
+        a.value = t.year(l).month(p).date(y), $.value = null, O.value = !1, v(a.value, !0);
+      }
+    }, Qe = (e) => {
+      const t = Te(
+        e,
+        me.value,
+        d.value,
+        oe
+      );
+      if (t.isValid()) {
+        if (c && c(t.toDate()))
+          return;
+        const { hour: l, minute: p, second: y } = X(a.value);
+        a.value = t.hour(l).minute(p).second(y), F.value = null, v(a.value, !0);
+      }
+    }, Xe = (e) => w.isDayjs(e) && e.isValid() && (c ? !c(e.toDate()) : !0), Ze = (e) => A(e) ? e.map((t) => t.format(n.format)) : e.format(n.format), je = (e) => Te(
+      e,
+      n.format,
+      d.value,
+      oe
+    ), Z = () => {
+      const e = w(E.value).locale(d.value);
+      if (!E.value) {
+        const t = re.value;
+        return w().hour(t.hour()).minute(t.minute()).second(t.second()).locale(d.value);
+      }
+      return e;
+    }, Y = () => {
+      ["week", "month", "year", "date"].includes(u.value) && _.value?.focus();
+    }, et = () => {
+      Y(), u.value === "week" && pe(k.down);
+    }, tt = (e) => {
+      const { code: t } = e;
+      [
+        k.up,
+        k.down,
+        k.left,
+        k.right,
+        k.home,
+        k.end,
+        k.pageUp,
+        k.pageDown
+      ].includes(t) && (pe(t), e.stopPropagation(), e.preventDefault()), [k.enter, k.space, k.numpadEnter].includes(
+        t
+      ) && F.value === null && $.value === null && (e.preventDefault(), v(a.value, !1));
+    }, pe = (e) => {
+      const { up: t, down: l, left: p, right: y, home: R, end: j, pageUp: at, pageDown: lt } = k, ot = {
+        year: {
+          [t]: -4,
+          [l]: 4,
+          [p]: -1,
+          [y]: 1,
+          offset: (r, D) => r.setFullYear(r.getFullYear() + D)
+        },
+        month: {
+          [t]: -4,
+          [l]: 4,
+          [p]: -1,
+          [y]: 1,
+          offset: (r, D) => r.setMonth(r.getMonth() + D)
+        },
+        week: {
+          [t]: -1,
+          [l]: 1,
+          [p]: -1,
+          [y]: 1,
+          offset: (r, D) => r.setDate(r.getDate() + D * 7)
+        },
+        date: {
+          [t]: -7,
+          [l]: 7,
+          [p]: -1,
+          [y]: 1,
+          [R]: (r) => -r.getDay(),
+          [j]: (r) => -r.getDay() + 6,
+          [at]: (r) => -new Date(r.getFullYear(), r.getMonth(), 0).getDate(),
+          [lt]: (r) => new Date(r.getFullYear(), r.getMonth() + 1, 0).getDate(),
+          offset: (r, D) => r.setDate(r.getDate() + D)
+        }
+      }, K = a.value.toDate();
+      for (; Math.abs(a.value.diff(K, "year", !0)) < 1; ) {
+        const r = ot[Se.value];
+        if (!r) return;
+        if (r.offset(
+          K,
+          be(r[e]) ? r[e](K) : r[e] ?? 0
+        ), c && c(K))
+          break;
+        const D = w(K).locale(d.value);
+        a.value = D, b("pick", D, !0);
+        break;
+      }
+    }, U = (e) => {
+      b(
+        "panel-change",
+        a.value.toDate(),
+        e,
+        s.value
+      );
+    };
+    return x(
+      () => u.value,
+      (e) => {
+        if (["month", "year"].includes(e)) {
+          s.value = e;
+          return;
+        } else if (e === "years") {
+          s.value = "year";
+          return;
+        } else if (e === "months") {
+          s.value = "month";
+          return;
+        }
+        s.value = "date";
+      },
+      { immediate: !0 }
+    ), x(
+      () => s.value,
+      () => {
+        Ee?.updatePopper();
+      }
+    ), x(
+      () => E.value,
+      (e) => {
+        e && (a.value = Z());
+      },
+      { immediate: !0 }
+    ), x(
+      () => n.parsedValue,
+      (e) => {
+        if (e) {
+          if (G.value || A(e)) return;
+          a.value = e;
+        } else
+          a.value = Z();
+      },
+      { immediate: !0 }
+    ), b("set-picker-option", ["isValidValue", Xe]), b("set-picker-option", ["formatToString", Ze]), b("set-picker-option", ["parseUserInput", je]), b("set-picker-option", ["handleFocusPicker", et]), (e, t) => (C(), I("div", {
+      class: i([
+        o(f).b(),
+        o(V).b(),
+        {
+          "has-sidebar": e.$slots.sidebar || ve.value,
+          "has-time": M.value
+        }
+      ])
+    }, [
+      h("div", {
+        class: i(o(f).e("body-wrapper"))
+      }, [
+        it(e.$slots, "sidebar", {
+          class: i(o(f).e("sidebar"))
+        }),
+        ve.value ? (C(), I("div", {
+          key: 0,
+          class: i(o(f).e("sidebar"))
+        }, [
+          (C(!0), I(ct, null, dt(o(ne), (l, p) => (C(), I("button", {
+            key: p,
+            type: "button",
+            class: i(o(f).e("shortcut")),
+            onClick: (y) => Ke(l)
+          }, te(l.text), 11, gt))), 128))
+        ], 2)) : S("", !0),
+        h("div", {
+          class: i(o(f).e("body"))
+        }, [
+          M.value ? (C(), I("div", {
+            key: 0,
+            class: i(o(V).e("time-header"))
+          }, [
+            h("span", {
+              class: i(o(V).e("editor-wrap"))
+            }, [
+              T(o(De), {
+                placeholder: "选择日期",
+                "model-value": Je.value,
+                size: "small",
+                "validate-event": !1,
+                onInput: t[0] || (t[0] = (l) => F.value = l),
+                onChange: Qe
+              }, null, 8, ["model-value"])
+            ], 2),
+            P((C(), I("span", {
+              class: i(o(V).e("editor-wrap"))
+            }, [
+              T(o(De), {
+                placeholder: "选择时间",
+                "model-value": fe.value,
+                size: "small",
+                "validate-event": !1,
+                onFocus: We,
+                onInput: t[1] || (t[1] = (l) => $.value = l),
+                onChange: Ge
+              }, null, 8, ["model-value"]),
+              T(o(Dt), {
+                visible: O.value,
+                format: Q.value,
+                "parsed-value": a.value,
+                onPick: qe
+              }, null, 8, ["visible", "format", "parsed-value"])
+            ], 2)), [
+              [o(vt), He]
+            ])
+          ], 2)) : S("", !0),
+          P(h("div", {
+            class: i([
+              o(V).e("header"),
+              (s.value === "year" || s.value === "month") && o(V).e("header--bordered")
+            ])
+          }, [
+            h("span", {
+              class: i(o(V).e("prev-btn"))
+            }, [
+              h("button", {
+                type: "button",
+                class: i(["d-arrow-left", o(f).e("icon-btn")]),
+                onClick: t[2] || (t[2] = (l) => de(!1))
+              }, [
+                T(o(L), { icon: "icon-d-arrow-left" })
+              ], 2),
+              P(h("button", {
+                type: "button",
+                class: i([o(f).e("icon-btn"), "arrow-left"]),
+                onClick: t[3] || (t[3] = (l) => ce(!1))
+              }, [
+                T(o(L), { icon: "icon-arrow-left" })
+              ], 2), [
+                [N, s.value === "date"]
+              ])
+            ], 2),
+            h("span", {
+              role: "button",
+              class: i(o(V).e("header-label")),
+              "aria-live": "polite",
+              tabindex: "0",
+              onKeydown: t[4] || (t[4] = he((l) => B("year"), ["enter"])),
+              onClick: t[5] || (t[5] = (l) => B("year"))
+            }, te(Re.value), 35),
+            P(h("span", {
+              role: "button",
+              "aria-live": "polite",
+              tabindex: "0",
+              class: i([
+                o(V).e("header-label"),
+                { active: s.value === "month" }
+              ]),
+              onKeydown: t[6] || (t[6] = he((l) => B("month"), ["enter"])),
+              onClick: t[7] || (t[7] = (l) => B("month"))
+            }, te(Oe.value + 1), 35), [
+              [N, s.value === "date"]
+            ]),
+            h("span", {
+              class: i(o(V).e("next-btn"))
+            }, [
+              P(h("button", {
+                type: "button",
+                class: i([o(f).e("icon-btn"), "arrow-right"]),
+                onClick: t[8] || (t[8] = (l) => ce(!0))
+              }, [
+                T(o(L), { icon: "icon-arrow-right" })
+              ], 2), [
+                [N, s.value === "date"]
+              ]),
+              h("button", {
+                type: "button",
+                class: i([o(f).e("icon-btn"), "d-arrow-right"]),
+                onClick: t[9] || (t[9] = (l) => de(!0))
+              }, [
+                T(o(L), { icon: "icon-d-arrow-right" })
+              ], 2)
+            ], 2)
+          ], 2), [
+            [N, s.value !== "time"]
+          ]),
+          h("div", {
+            class: i(o(f).e("content")),
+            onKeydown: tt
+          }, [
+            s.value === "date" ? (C(), ae(pt, {
+              key: 0,
+              ref_key: "currentViewRef",
+              ref: _,
+              "selection-mode": u.value,
+              date: a.value,
+              "parsed-value": e.parsedValue,
+              "disabled-date": o(c),
+              "cell-class-name": o(Me),
+              "show-week-number": e.showWeekNumber,
+              onPick: Ye
+            }, null, 8, ["selection-mode", "date", "parsed-value", "disabled-date", "cell-class-name", "show-week-number"])) : S("", !0),
+            s.value === "year" ? (C(), ae(yt, {
+              key: 1,
+              ref_key: "currentViewRef",
+              ref: _,
+              "selection-mode": u.value,
+              date: a.value,
+              "disabled-date": o(c),
+              "parsed-value": e.parsedValue,
+              onPick: Be
+            }, null, 8, ["selection-mode", "date", "disabled-date", "parsed-value"])) : S("", !0),
+            s.value === "month" ? (C(), ae(ht, {
+              key: 2,
+              ref_key: "currentViewRef",
+              ref: _,
+              "selection-mode": u.value,
+              date: a.value,
+              "parsed-value": e.parsedValue,
+              "disabled-date": o(c),
+              onPick: _e
+            }, null, 8, ["selection-mode", "date", "parsed-value", "disabled-date"])) : S("", !0)
+          ], 34)
+        ], 2)
+      ], 2),
+      P(h("div", {
+        class: i(o(f).e("footer"))
+      }, [
+        P(T(o(we), {
+          text: "",
+          size: "small",
+          class: i(o(f).e("link-btn")),
+          disabled: Ae.value,
+          onClick: Le
+        }, {
+          default: ye(() => [...t[10] || (t[10] = [
+            ke(" 现在 ", -1)
+          ])]),
+          _: 1
+        }, 8, ["class", "disabled"]), [
+          [N, !G.value && e.showNow]
+        ]),
+        T(o(we), {
+          plain: "",
+          size: "small",
+          class: i(o(f).e("link-btn")),
+          disabled: xe.value,
+          onClick: ze
+        }, {
+          default: ye(() => [...t[11] || (t[11] = [
+            ke(" 确认 ", -1)
+          ])]),
+          _: 1
+        }, 8, ["class", "disabled"])
+      ], 2), [
+        [N, Ue.value]
+      ])
+    ], 2));
+  }
+});
+export {
+  Zt as default
+};