@das-fed/ui 6.4.0-test.1 → 6.4.0-test.2.1

package/packages/components/calendar/index.js

@@ -1,43 +1,43 @@
 import '@das-fed/ui/packages/components/calendar/style.css';
-import { withInstall as Q } from "@das-fed/utils/with-install/index";
-import { defineComponent as q, ref as O, computed as g, watch as X, nextTick as I, openBlock as i, createElementBlock as y, normalizeClass as B, Fragment as F, renderList as P, createElementVNode as W, toDisplayString as Z, renderSlot as M, createCommentVNode as C, normalizeStyle as ee, onMounted as te, onBeforeUnmount as ae, createVNode as ne, createSlots as x, withCtx as _, normalizeProps as R, mergeProps as V, guardReactiveProps as L, createBlock as se } from "vue";
-import { t as j, setI18nRule as re } from "@das-fed/web/packages/i18n/index";
-import z from "dayjs";
-import le from "dayjs/plugin/localeData";
-import { SizeWatcher as oe } from "@das-fed/utils/size-watcher";
-import { setThemeRule as de } from "@das-fed/web/packages/theme/index";
-const ce = (o, h) => {
-  const d = o.endOf("month"), c = h.startOf("month"), s = d.isSame(c, "week") ? c.add(1, "week") : c;
+import { withInstall as X } from "@das-fed/utils/with-install/index";
+import { defineComponent as G, ref as H, computed as v, watch as ee, nextTick as x, openBlock as u, createElementBlock as m, normalizeClass as A, Fragment as P, renderList as Z, createElementVNode as W, toDisplayString as j, renderSlot as M, createCommentVNode as D, normalizeStyle as te, onMounted as ae, onBeforeUnmount as ne, createVNode as se, createSlots as K, withCtx as _, normalizeProps as V, mergeProps as F, guardReactiveProps as E, createBlock as re } from "vue";
+import { t as J, setI18nRule as le } from "@das-fed/web/packages/i18n/index";
+import C from "dayjs";
+import oe from "dayjs/plugin/localeData";
+import { SizeWatcher as de } from "@das-fed/utils/size-watcher";
+import { setThemeRule as ce } from "@das-fed/web/packages/theme/index";
+const he = (l, i) => {
+  const o = l.endOf("month"), c = i.startOf("month"), n = o.isSame(c, "week") ? c.add(1, "week") : c;
   return [
-    [o, d],
-    [s.startOf("week"), h]
+    [l, o],
+    [n.startOf("week"), i]
   ];
-}, he = (o, h) => {
-  const d = o.endOf("month"), c = o.add(1, "month").startOf("month"), r = d.isSame(
+}, ie = (l, i) => {
+  const o = l.endOf("month"), c = l.add(1, "month").startOf("month"), r = o.isSame(
     c,
     "week"
-  ) ? c.add(1, "week") : c, s = r.endOf("month"), m = h.startOf("month"), N = s.isSame(m, "week") ? m.add(1, "week") : m;
+  ) ? c.add(1, "week") : c, n = r.endOf("month"), f = i.startOf("month"), N = n.isSame(f, "week") ? f.add(1, "week") : f;
   return [
-    [o, d],
-    [r.startOf("week"), s],
-    [N.startOf("week"), h]
+    [l, o],
+    [r.startOf("week"), n],
+    [N.startOf("week"), i]
   ];
-}, K = (o, h) => {
-  const d = o.startOf("week"), c = h.endOf("week"), r = d.get("month"), s = c.get("month");
-  return r === s ? [[d, c]] : (r + 1) % 12 === s ? ce(d, c) : r + 2 === s || (r + 1) % 11 === s ? he(d, c) : [];
-}, $ = (o) => Array.from(Array.from({ length: o }).keys()), ie = (o, h) => {
-  const d = o.subtract(1, "month").endOf("month").date();
-  return $(h).map((c, r) => d - (h - r - 1));
-}, ue = (o) => {
-  const h = o.daysInMonth();
-  return $(h).map((d, c) => c + 1);
-}, ye = (o) => $(o.length / 7).map((h) => {
-  const d = h * 7;
-  return o.slice(d, d + 7);
-}), me = { key: 0 }, pe = { class: "das-calendar-header-box" }, fe = { class: "das-calendar-header-week-line" }, ge = ["onClick"], ke = {
+}, U = (l, i) => {
+  const o = l.startOf("week"), c = i.endOf("week"), r = o.get("month"), n = c.get("month");
+  return r === n ? [[o, c]] : (r + 1) % 12 === n ? he(o, c) : r + 2 === n || (r + 1) % 11 === n ? ie(o, c) : [];
+}, $ = (l) => Array.from(Array.from({ length: l }).keys()), ue = (l, i) => {
+  const o = l.subtract(1, "month").endOf("month").date();
+  return $(i).map((c, r) => o - (i - r - 1));
+}, ye = (l) => {
+  const i = l.daysInMonth();
+  return $(i).map((o, c) => c + 1);
+}, me = (l) => $(l.length / 7).map((i) => {
+  const o = i * 7;
+  return l.slice(o, o + 7);
+}), fe = { key: 0 }, pe = { class: "das-calendar-header-box" }, ge = { class: "das-calendar-header-week-line" }, ke = ["onClick"], ve = {
   name: "calendar-table"
-}, U = /* @__PURE__ */ q({
-  ...ke,
+}, q = /* @__PURE__ */ G({
+  ...ve,
   props: {
     selectedDay: {},
     date: {},
@@ -52,118 +52,117 @@ const ce = (o, h) => {
     cellHeight: {}
   },
   emits: ["pick"],
-  setup(o, { expose: h, emit: d }) {
-    const c = d, r = z(), s = o, m = O("128px"), N = O(), H = 60, b = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"], S = g(() => !!s.range && !!s.range.length), J = g(() => {
-      const e = s.firstDayOfWeek, a = s.showZhou ? "das-calendar-weeks-zhou-" : "das-calendar-weeks-";
-      return e === 0 ? b.map((n) => j(`${a}${n}`)) : b.slice(e).concat(b.slice(0, e)).map((n) => j(`${a}${n}`));
-    }), D = g(() => {
+  setup(l, { expose: i, emit: o }) {
+    const c = o, r = C(), n = l, f = H("128px"), N = H(), Y = 60, b = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"], S = v(() => !!n.range && !!n.range.length), L = v(() => {
+      const e = n.firstDayOfWeek, a = n.showZhou ? "das-calendar-weeks-zhou-" : "das-calendar-weeks-";
+      return e === 0 ? b.map((s) => J(`${a}${s}`)) : b.slice(e).concat(b.slice(0, e)).map((s) => J(`${a}${s}`));
+    }), z = v(() => {
       let e = [];
       if (S.value) {
-        const [a, n] = s.range;
-        let l = [];
-        a.isSame(n, "month") ? l = $(n.date() - a.date() + 1).map((k) => ({
-          text: a.date() + k,
+        const [a, s] = n.range;
+        let h = [];
+        a.isSame(s, "month") ? h = $(s.date() - a.date() + 1).map((w) => ({
+          text: a.date() + w,
           type: "current"
-        })) : l = $(a.endOf("month").date() - a.date() + 1).map((k) => ({
-          text: a.date() + k,
+        })) : h = $(a.endOf("month").date() - a.date() + 1).map((w) => ({
+          text: a.date() + w,
           type: "current"
         }));
-        let p = l.length % 7;
-        p = p === 0 ? 0 : 7 - p;
-        const f = $(p).map((k, T) => ({
-          text: T + 1,
+        let g = h.length % 7;
+        g = g === 0 ? 0 : 7 - g;
+        const k = $(g).map((w, B) => ({
+          text: B + 1,
           type: "next"
         }));
-        e = l.concat(f);
+        e = h.concat(k);
       } else {
-        const a = s.date.startOf("month").day(), n = ie(
-          s.date,
-          (a - s.firstDayOfWeek + 7) % 7
-        ).map((k) => ({
-          text: k,
+        const a = n.date.startOf("month").day(), s = ue(
+          n.date,
+          (a - n.firstDayOfWeek + 7) % 7
+        ).map((w) => ({
+          text: w,
           type: "prev"
-        })), l = ue(s.date).map((k) => ({
-          text: k,
+        })), h = ye(n.date).map((w) => ({
+          text: w,
           type: "current"
         }));
-        e = [...n, ...l];
-        const p = 7 - (e.length % 7 || 7), f = $(p).map((k, T) => ({
-          text: T + 1,
+        e = [...s, ...h];
+        const g = 7 - (e.length % 7 || 7), k = $(g).map((w, B) => ({
+          text: B + 1,
           type: "next"
         }));
-        if (e = e.concat(f), s.calendartType == "simple" && e.length / 7 < 6) {
-          const k = f.length ? f[f.length - 1].text : 0, T = $(7).map((We, G) => ({
-            text: k + G + 1,
+        if (e = e.concat(k), n.calendartType == "simple" && e.length / 7 < 6) {
+          const w = k.length ? k[k.length - 1].text : 0, B = $(7).map((Oe, Q) => ({
+            text: w + Q + 1,
             type: "next"
           }));
-          e = e.concat(T);
+          e = e.concat(B);
         }
       }
-      return ye(e);
-    });
-    X(
-      () => D.value,
+      return me(e);
+    }), T = () => {
+      var s;
+      const e = (s = n.parent) == null ? void 0 : s.offsetHeight;
+      let a = Number(e) - Y - 1;
+      f.value = a / z.value.length - 1 + "px";
+    };
+    ee(
+      () => z.value,
       (e) => {
-        if (s.cellHeight) {
-          m.value = `${s.cellHeight}px`;
+        if (n.cellHeight) {
+          f.value = `${n.cellHeight}px`;
           return;
         }
-        e && e.length ? I(() => {
-          var l;
-          const a = (l = s.parent) == null ? void 0 : l.offsetHeight;
-          let n = Number(a) - H - 1;
-          m.value = n / e.length - 1 + "px";
-        }) : m.value = "128px";
+        e && e.length ? x(() => {
+          T();
+        }) : f.value = "128px";
       },
       { immediate: !0 }
     );
-    const A = () => {
-      if (s.cellHeight) {
-        m.value = `${s.cellHeight}px`;
+    const O = () => {
+      if (n.cellHeight) {
+        f.value = `${n.cellHeight}px`;
         return;
       }
-      I(() => {
-        var n;
-        const e = (n = s.parent) == null ? void 0 : n.offsetHeight;
-        let a = Number(e) - H;
-        m.value = a / D.value.length - 1 * D.value.length + "px";
+      x(() => {
+        T();
       });
-    }, w = (e, a) => {
+    }, p = (e, a) => {
       switch (a) {
         case "prev":
-          return s.date.startOf("month").subtract(1, "month").date(e);
+          return n.date.startOf("month").subtract(1, "month").date(e);
         case "next":
-          return s.date.startOf("month").add(1, "month").date(e);
+          return n.date.startOf("month").add(1, "month").date(e);
         case "current":
-          return s.date.date(e);
+          return n.date.date(e);
       }
-    }, v = ({ text: e, type: a }) => {
-      const n = [a], l = w(e, a);
-      return l.isSame(s.selectedDay, "day") && n.push("is-selected"), l.isSame(r, "day") && n.push("is-today"), n;
-    }, Y = ({ text: e, type: a }) => {
-      const n = w(e, a);
-      c("pick", n);
-    }, E = (e) => {
-      const a = D.value[0];
+    }, R = ({ text: e, type: a }) => {
+      const s = [a], h = p(e, a);
+      return h.isSame(n.selectedDay, "day") && s.push("is-selected"), h.isSame(r, "day") && s.push("is-today"), s;
+    }, I = ({ text: e, type: a }) => {
+      const s = p(e, a);
+      c("pick", s);
+    }, t = (e) => {
+      const a = z.value[0];
       if (a) {
-        const n = a[e];
-        if (n) {
-          const { text: l, type: p } = n;
-          return w(l, p).format("MM/DD");
+        const s = a[e];
+        if (s) {
+          const { text: h, type: g } = s;
+          return p(h, g).format("MM/DD");
         }
       }
       return "";
-    }, t = (e) => {
-      const a = D.value[0];
+    }, y = (e) => {
+      const a = z.value[0];
       if (a) {
-        const n = a[e];
-        if (n) {
-          const { text: l, type: p } = n, f = w(l, p);
+        const s = a[e];
+        if (s) {
+          const { text: h, type: g } = s, k = p(h, g);
           return {
-            isSelected: f.isSame(s.selectedDay),
-            type: `${p}-month`,
-            day: f.format("YYYY-MM-DD"),
-            date: f.toDate()
+            isSelected: k.isSame(n.selectedDay),
+            type: `${g}-month`,
+            day: k.format("YYYY-MM-DD"),
+            date: k.toDate()
           };
         }
       }
@@ -173,95 +172,145 @@ const ce = (o, h) => {
         day: null,
         date: null
       };
-    }, u = ({ text: e, type: a }) => {
-      const n = w(e, a);
+    }, d = ({ text: e, type: a }) => {
+      const s = p(e, a);
       return {
-        isSelected: n.isSame(s.selectedDay),
+        isSelected: s.isSame(n.selectedDay),
         type: `${a}-month`,
-        day: n.format("YYYY-MM-DD"),
-        date: n.toDate()
+        day: s.format("YYYY-MM-DD"),
+        date: s.toDate()
       };
     };
-    return h({
-      getHeight: A
-    }), (e, a) => D.value.length ? (i(), y("table", {
-      key: 0,
-      class: B(["das-calendar-table", { "is-range": S.value, "is-week": e.calendartType == "week", simple: e.calendartType == "simple" }]),
-      cellspacing: "0",
-      cellpadding: "0",
-      ref_key: "tableRef",
-      ref: N
-    }, [
-      e.hideHeader ? C("", !0) : (i(), y("thead", me, [
-        (i(!0), y(F, null, P(J.value, (n, l) => (i(), y("th", {
-          class: "das-calendar-table-header",
-          key: n
-        }, [
-          W("div", pe, [
-            W("div", fe, [
-              W("div", {
-                class: B(["das-calendar-header-week", { highlight: e.highlightWeek }])
-              }, Z(n), 3),
-              e.calendartType == "week" ? M(e.$slots, "week-type", {
-                key: 0,
-                data: t(l)
-              }) : C("", !0)
-            ]),
-            e.calendartType == "week" ? (i(), y("div", {
-              key: 0,
-              class: B(["das-calendar-header-day", { highlight: e.highlightDay }])
-            }, Z(E(l)), 3)) : C("", !0)
-          ])
-        ]))), 128))
-      ])),
-      W("tbody", null, [
-        (i(!0), y(F, null, P(D.value, (n, l) => (i(), y("tr", {
-          key: l,
-          class: B({
-            "das-calendar-table-row": !0,
-            "hide-border": l === 0 && e.hideHeader
-          })
-        }, [
-          (i(!0), y(F, null, P(n, (p, f) => (i(), y("td", {
-            key: f,
-            class: B(v(p)),
-            onClick: (k) => Y(p)
-          }, [
-            W("div", {
-              class: "das-calendar-day",
-              style: ee({ height: m.value })
+    return i({
+      getHeight: O
+    }), (e, a) => z.value.length ? (u(), m(
+      "table",
+      {
+        key: 0,
+        class: A(["das-calendar-table", { "is-range": S.value, "is-week": e.calendartType == "week", simple: e.calendartType == "simple" }]),
+        cellspacing: "0",
+        cellpadding: "0",
+        ref_key: "tableRef",
+        ref: N
+      },
+      [
+        e.hideHeader ? D("v-if", !0) : (u(), m("thead", fe, [
+          (u(!0), m(
+            P,
+            null,
+            Z(L.value, (s, h) => (u(), m("th", {
+              class: "das-calendar-table-header",
+              key: s
             }, [
-              M(e.$slots, "date-cell", {
-                data: u(p)
-              })
-            ], 4)
-          ], 10, ge))), 128))
-        ], 2))), 128))
-      ])
-    ], 2)) : C("", !0);
+              W("div", pe, [
+                W("div", ge, [
+                  W(
+                    "div",
+                    {
+                      class: A(["das-calendar-header-week", { highlight: e.highlightWeek }])
+                    },
+                    j(s),
+                    3
+                    /* TEXT, CLASS */
+                  ),
+                  e.calendartType == "week" ? M(e.$slots, "week-type", {
+                    key: 0,
+                    data: y(h)
+                  }) : D("v-if", !0)
+                ]),
+                e.calendartType == "week" ? (u(), m(
+                  "div",
+                  {
+                    key: 0,
+                    class: A(["das-calendar-header-day", { highlight: e.highlightDay }])
+                  },
+                  j(t(h)),
+                  3
+                  /* TEXT, CLASS */
+                )) : D("v-if", !0)
+              ])
+            ]))),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ])),
+        W("tbody", null, [
+          (u(!0), m(
+            P,
+            null,
+            Z(z.value, (s, h) => (u(), m(
+              "tr",
+              {
+                key: h,
+                class: A({
+                  "das-calendar-table-row": !0,
+                  "hide-border": h === 0 && e.hideHeader
+                })
+              },
+              [
+                (u(!0), m(
+                  P,
+                  null,
+                  Z(s, (g, k) => (u(), m("td", {
+                    key: k,
+                    class: A(R(g)),
+                    onClick: (w) => I(g)
+                  }, [
+                    D(" v-scrollbar "),
+                    D(' :style="{ height: trHeight }" '),
+                    W(
+                      "div",
+                      {
+                        class: "das-calendar-day",
+                        style: te({ height: f.value })
+                      },
+                      [
+                        M(e.$slots, "date-cell", {
+                          data: d(g)
+                        })
+                      ],
+                      4
+                      /* STYLE */
+                    )
+                  ], 10, ke))),
+                  128
+                  /* KEYED_FRAGMENT */
+                ))
+              ],
+              2
+              /* CLASS */
+            ))),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ])
+      ],
+      2
+      /* CLASS */
+    )) : D("v-if", !0);
   }
 }), De = {
   key: 0,
   class: "das-calendar-body 1"
-}, ve = {
+}, we = {
   key: 1,
   class: "das-calendar-cell-date"
-}, we = {
+}, ze = {
   key: 2,
   class: "das-calendar-cell-cont"
-}, ze = {
+}, Ce = {
   key: 1,
   class: "das-calendar-body 2"
-}, Ce = {
+}, Ne = {
   key: 1,
   class: "das-calendar-cell-date"
-}, Ne = {
+}, Me = {
   key: 2,
   class: "das-calendar-cell-cont"
-}, Me = {
+}, Se = {
   name: "test"
-}, Se = /* @__PURE__ */ q({
-  ...Me,
+}, $e = /* @__PURE__ */ G({
+  ...Se,
   props: {
     modelValue: {},
     range: {},
@@ -275,134 +324,170 @@ const ce = (o, h) => {
     cellHeight: { default: 0 }
   },
   emits: ["update:model-value", "itemClick"],
-  setup(o, { expose: h, emit: d }) {
-    z.extend(le);
-    const c = z.localeData().firstDayOfWeek(), r = o, s = d, m = O(), N = O(), H = O(), b = g(() => r.firstDayOfWeek || c), S = O(), J = z(), D = g({
+  setup(l, { expose: i, emit: o }) {
+    C.extend(oe);
+    const c = C.localeData().firstDayOfWeek(), r = l, n = o, f = H(), N = H(), Y = H(), b = v(() => r.firstDayOfWeek || c), S = H(), L = C(), z = v({
       get() {
-        return r.modelValue ? (S.value = v.value, v.value) : S.value;
+        return r.modelValue ? (S.value = p.value, p.value) : S.value;
       },
       set(t) {
         if (!t) return;
         S.value = t;
-        const u = t.toDate();
-        r.isSwitchMonth && s("update:model-value", u);
+        const y = t.toDate();
+        r.isSwitchMonth && n("update:model-value", y);
       }
-    }), A = g(() => {
+    }), T = v(() => {
       if (r.type == "week") {
         if (r.range) return r.range;
-        const u = (z(r.modelValue).day() - b.value + 7) % 7, e = 7 - (u + 1), a = [];
-        return a.push(z(r.modelValue).subtract(u, "day").toDate()), a.push(z(r.modelValue).add(e, "day").toDate()), a;
+        const y = (C(r.modelValue).day() - b.value + 7) % 7, d = 7 - (y + 1), e = [];
+        return e.push(C(r.modelValue).subtract(y, "day").toDate()), e.push(C(r.modelValue).add(d, "day").toDate()), e;
       } else
         return r.range ? r.range : void 0;
-    }), w = g(() => {
-      if (!A.value) return [];
-      const t = A.value.map((a) => z(a)), [u, e] = t;
-      return r.type == "week" ? [[u, e]] : u.isAfter(e) ? [] : u.isSame(e, "month") ? K(u, e) : u.add(1, "month").month() !== e.month() ? [] : K(u, e);
-    }), v = g(() => r.modelValue ? z(r.modelValue) : D.value || (w.value.length ? w.value[0][0] : J));
-    g(() => v.value.subtract(1, "month").date(1)), g(() => v.value.add(1, "month").date(1)), g(() => v.value.subtract(1, "year").date(1)), g(() => v.value.add(1, "year").date(1)), g(() => {
-      const t = `das-calendar-month${v.value.format("M")}`;
-      return `${v.value.year()} ${j("das-calendar-year")} ${j(t)}`;
-    }), te(() => {
-      H.value = oe(() => {
-        var t, u;
-        Array.isArray(N.value) ? (t = N.value[0]) == null || t.getHeight() : (u = N.value) == null || u.getHeight();
-      }, m.value);
+    }), O = v(() => {
+      if (!T.value) return [];
+      const t = T.value.map((e) => C(e)), [y, d] = t;
+      return r.type == "week" ? [[y, d]] : y.isAfter(d) ? [] : y.isSame(d, "month") ? U(y, d) : y.add(1, "month").month() !== d.month() ? [] : U(y, d);
+    }), p = v(() => r.modelValue ? C(r.modelValue) : z.value || (O.value.length ? O.value[0][0] : L));
+    v(() => p.value.subtract(1, "month").date(1)), v(() => p.value.add(1, "month").date(1)), v(() => p.value.subtract(1, "year").date(1)), v(() => p.value.add(1, "year").date(1)), v(() => {
+      const t = `das-calendar-month${p.value.format("M")}`;
+      return `${p.value.year()} ${J("das-calendar-year")} ${J(t)}`;
     }), ae(() => {
-      H.value.disconnect();
+      Y.value = de(() => {
+        var t, y;
+        Array.isArray(N.value) ? (t = N.value[0]) == null || t.getHeight() : (y = N.value) == null || y.getHeight();
+      }, f.value);
+    }), ne(() => {
+      Y.value.disconnect();
     });
-    const Y = (t) => {
-      r.isSwitchSelection && (D.value = t), s("itemClick", t.toDate());
+    const R = (t) => {
+      r.isSwitchSelection && (z.value = t), n("itemClick", t.toDate());
     };
-    return h({
-      $calendar: m,
+    return i({
+      $calendar: f,
       setActive: (t) => {
-        D.value = z(t), s("itemClick", t);
+        z.value = C(t), n("itemClick", t);
       }
-    }), (t, u) => (i(), y("div", {
-      ref_key: "$calendar",
-      ref: m,
-      class: "das-ui-calendar"
-    }, [
-      w.value.length === 0 ? (i(), y("div", De, [
-        ne(U, {
-          ref_key: "$calendarTable",
-          ref: N,
-          date: v.value,
-          firstDayOfWeek: b.value,
-          parent: m.value,
-          calendartType: t.type,
-          highlightWeek: t.highlightWeek,
-          highlightDay: t.highlightDay,
-          showZhou: t.showZhou,
-          cellHeight: t.cellHeight,
-          "selected-day": S.value,
-          onPick: Y
-        }, x({
-          "date-cell": _((e) => [
-            t.$slots.custom ? M(t.$slots, "custom", R(V({ key: 0 }, e))) : C("", !0),
-            t.type != "week" && !t.$slots.custom ? (i(), y("p", ve, [
-              W("span", null, Z(Number(e.data.day.split("-").slice(2)).toString()), 1),
-              M(t.$slots, "date-type", R(L(e)))
-            ])) : C("", !0),
-            t.$slots.custom ? C("", !0) : (i(), y("div", we, [
-              M(t.$slots, "date-cell", R(L(e)))
-            ]))
-          ]),
-          _: 2
-        }, [
-          t.$slots["week-type"] && t.type == "week" ? {
-            name: "week-type",
-            fn: _((e) => [
-              M(t.$slots, "week-type", R(L(e)))
-            ]),
-            key: "0"
-          } : void 0
-        ]), 1032, ["date", "firstDayOfWeek", "parent", "calendartType", "highlightWeek", "highlightDay", "showZhou", "cellHeight", "selected-day"])
-      ])) : (i(), y("div", ze, [
-        (i(!0), y(F, null, P(w.value, (e, a) => (i(), se(U, {
-          ref_for: !0,
-          ref_key: "$calendarTable",
-          ref: N,
-          key: a,
-          firstDayOfWeek: b.value,
-          date: e[0],
-          calendartType: t.type,
-          highlightWeek: t.highlightWeek,
-          highlightDay: t.highlightDay,
-          showZhou: t.showZhou,
-          cellHeight: t.cellHeight,
-          "selected-day": S.value,
-          range: e,
-          parent: m.value,
-          "hide-header": a !== 0,
-          onPick: Y
-        }, x({
-          "date-cell": _((n) => [
-            t.$slots.custom ? M(t.$slots, "custom", V({
-              key: 0,
-              ref_for: !0
-            }, n)) : C("", !0),
-            t.type != "week" && !t.$slots.custom ? (i(), y("p", Ce, [
-              W("span", null, Z(Number(n.data.day.split("-").slice(2)).toString()), 1)
-            ])) : C("", !0),
-            t.$slots.custom ? C("", !0) : (i(), y("div", Ne, [
-              M(t.$slots, "date-cell", V({ ref_for: !0 }, n))
-            ]))
-          ]),
-          _: 2
-        }, [
-          t.$slots["week-type"] && t.type == "week" ? {
-            name: "week-type",
-            fn: _((n) => [
-              M(t.$slots, "week-type", V({ ref_for: !0 }, n))
+    }), (t, y) => (u(), m(
+      "div",
+      {
+        ref_key: "$calendar",
+        ref: f,
+        class: "das-ui-calendar"
+      },
+      [
+        D(` <div class="das-calendar-header" >\r
+      <slot name="header" :date="i18nDate">\r
+        <div class="das-calendar-title" >{{ i18nDate }}</div>\r
+        <div class="das-calendar-button-group" v-if="validatedRange.length === 0" >\r
+          <das-button @click="selectDate('prev-month')" >  {{ t('das-calendar-prevMonth') }}</das-button>\r
+          <das-button @click="selectDate('today')" >  {{ t('das-calendar-today') }}</das-button>\r
+          <das-button @click="selectDate('next-month')" >  {{ t('das-calendar-nextMonth') }}</das-button>\r
+        </div>\r
+      </slot>\r
+    </div> `),
+        O.value.length === 0 ? (u(), m("div", De, [
+          se(q, {
+            ref_key: "$calendarTable",
+            ref: N,
+            date: p.value,
+            firstDayOfWeek: b.value,
+            parent: f.value,
+            calendartType: t.type,
+            highlightWeek: t.highlightWeek,
+            highlightDay: t.highlightDay,
+            showZhou: t.showZhou,
+            cellHeight: t.cellHeight,
+            "selected-day": S.value,
+            onPick: R
+          }, K({
+            "date-cell": _((d) => [
+              t.$slots.custom ? M(t.$slots, "custom", V(F({ key: 0 }, d))) : D("v-if", !0),
+              t.type != "week" && !t.$slots.custom ? (u(), m("p", we, [
+                W(
+                  "span",
+                  null,
+                  j(Number(d.data.day.split("-").slice(2)).toString()),
+                  1
+                  /* TEXT */
+                ),
+                M(t.$slots, "date-type", V(E(d)))
+              ])) : D("v-if", !0),
+              t.$slots.custom ? D("v-if", !0) : (u(), m("div", ze, [
+                M(t.$slots, "date-cell", V(E(d)))
+              ]))
             ]),
-            key: "0"
-          } : void 0
-        ]), 1032, ["firstDayOfWeek", "date", "calendartType", "highlightWeek", "highlightDay", "showZhou", "cellHeight", "selected-day", "range", "parent", "hide-header"]))), 128))
-      ]))
-    ], 512));
+            _: 2
+            /* DYNAMIC */
+          }, [
+            t.$slots["week-type"] && t.type == "week" ? {
+              name: "week-type",
+              fn: _((d) => [
+                M(t.$slots, "week-type", V(E(d)))
+              ]),
+              key: "0"
+            } : void 0
+          ]), 1032, ["date", "firstDayOfWeek", "parent", "calendartType", "highlightWeek", "highlightDay", "showZhou", "cellHeight", "selected-day"])
+        ])) : (u(), m("div", Ce, [
+          (u(!0), m(
+            P,
+            null,
+            Z(O.value, (d, e) => (u(), re(q, {
+              ref_for: !0,
+              ref_key: "$calendarTable",
+              ref: N,
+              key: e,
+              firstDayOfWeek: b.value,
+              date: d[0],
+              calendartType: t.type,
+              highlightWeek: t.highlightWeek,
+              highlightDay: t.highlightDay,
+              showZhou: t.showZhou,
+              cellHeight: t.cellHeight,
+              "selected-day": S.value,
+              range: d,
+              parent: f.value,
+              "hide-header": e !== 0,
+              onPick: R
+            }, K({
+              "date-cell": _((a) => [
+                t.$slots.custom ? M(t.$slots, "custom", F({
+                  key: 0,
+                  ref_for: !0
+                }, a)) : D("v-if", !0),
+                t.type != "week" && !t.$slots.custom ? (u(), m("p", Ne, [
+                  W(
+                    "span",
+                    null,
+                    j(Number(a.data.day.split("-").slice(2)).toString()),
+                    1
+                    /* TEXT */
+                  )
+                ])) : D("v-if", !0),
+                t.$slots.custom ? D("v-if", !0) : (u(), m("div", Me, [
+                  M(t.$slots, "date-cell", F({ ref_for: !0 }, a))
+                ]))
+              ]),
+              _: 2
+              /* DYNAMIC */
+            }, [
+              t.$slots["week-type"] && t.type == "week" ? {
+                name: "week-type",
+                fn: _((a) => [
+                  M(t.$slots, "week-type", F({ ref_for: !0 }, a))
+                ]),
+                key: "0"
+              } : void 0
+            ]), 1032, ["firstDayOfWeek", "date", "calendartType", "highlightWeek", "highlightDay", "showZhou", "cellHeight", "selected-day", "range", "parent", "hide-header"]))),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ]))
+      ],
+      512
+      /* NEED_PATCH */
+    ));
   }
-}), $e = {
+}), be = {
   "--das-ui-calendar-color-primary": "#5582F3",
   // 主题色
   "--das-ui-calendar-color-text": "#212121",
@@ -421,7 +506,7 @@ const ce = (o, h) => {
   // 上/下一个月文字颜色
   // '--das-ui-calendar-head-height': '60px', // 日历表头高度
   // '--das-ui-calendar-cell-height': '128px', // 单元格高度
-}, be = {
+}, We = {
   "das-calendar-prevMonth": { "zh-CN": "上个月", en: "Previous Month" },
   "das-calendar-nextMonth": { "zh-CN": "下个月", en: "Next Month" },
   "das-calendar-prevYear": { "zh-CN": "前一年", en: "Previous Year" },
@@ -467,10 +552,10 @@ const ce = (o, h) => {
   "das-calendar-months-nov": { "zh-CN": "十一月", en: "Nov" },
   "das-calendar-months-dec": { "zh-CN": "十二月", en: "Dec" }
 };
-re(be);
-de($e);
-const Re = Q(Se), Ve = { name: "calendar 日历" };
+le(We);
+ce(be);
+const Ve = X($e), Fe = { name: "calendar 日历" };
 export {
-  Re as DasCalendar,
-  Ve as default
+  Ve as DasCalendar,
+  Fe as default
 };