vuux/dist/es/DatePicker/src/index.vue.mjs

Vue3 Nuxt3 Nuxt4 组件库

import { defineComponent as N, mergeModels as v, useModel as b, useTemplateRef as I, createElementBlock as s, openBlock as o, normalizeClass as i, unref as e, createElementVNode as r, createVNode as p, withModifiers as f, withDirectives as h, createBlock as k, toDisplayString as d, vShow as y, Transition as P, withCtx as z, createCommentVNode as C, Fragment as T, renderList as $ } from "vue";
import j from "./day/index.mjs";
import F from "./date.vue.mjs";
import { useDatePicker as L } from "./hook/useDatePicker.mjs";
import { Icon as V } from "@vuux/icons";
const R = {
  key: 0,
  class: "presets"
}, U = ["onClick"], Q = /* @__PURE__ */ N({
  name: "DatePicker",
  __name: "index",
  props: /* @__PURE__ */ v({
    clear: { type: Boolean },
    readonly: { type: Boolean },
    disabled: { type: Boolean },
    placeholder: { default: "请选择日期" },
    shadow: { type: Boolean },
    presets: { default: () => [] }
  }, {
    modelValue: {},
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ v(["change", "clear"], ["update:modelValue"]),
  setup(a, { emit: g }) {
    const c = a, w = g, l = b(a, "modelValue"), m = I("selectEl"), { classNames: B, visible: E, onChange: S, handleShow: u, handleClear: x, handleSelectPresets: D } = L(c, m, l, w);
    return (q, n) => (o(), s("div", {
      class: i(e(B))
    }, [
      r("div", {
        class: "date-input",
        onClick: n[0] || (n[0] = f(
          //@ts-ignore
          (...t) => e(u) && e(u)(...t),
          ["stop"]
        ))
      }, [
        h(r("div", { class: "date-value" }, d(a.placeholder), 513), [
          [y, !l.value]
        ]),
        h(r("div", { class: "date-value" }, d(l.value), 513), [
          [y, l.value]
        ]),
        l.value && a.clear && !a.readonly ? (o(), k(e(V), {
          key: 0,
          name: "Icon9176904",
          class: "is-icon is-clear",
          size: 14,
          onClick: f(e(x), ["stop"])
        }, null, 8, ["onClick"])) : (o(), k(e(V), {
          key: 1,
          name: "Icon3109624",
          class: "is-icon",
          opacity: 0.9
        }))
      ]),
      p(P, { name: "ease-drop" }, {
        default: z(() => [
          e(E) ? (o(), s("div", {
            key: 0,
            ref_key: "selectEl",
            ref: m,
            class: i(["date-select", { "is-shadow": a.shadow }])
          }, [
            c.presets.length > 0 ? (o(), s("div", R, [
              (o(!0), s(T, null, $(a.presets, (t, M) => (o(), s("div", {
                key: M,
                class: i(["item", [e(j)(l.value).isSame(t.value, "day") ? "is-active" : ""]]),
                onClick: (A) => e(D)(t)
              }, d(t.label), 11, U))), 128))
            ])) : C("", !0),
            p(F, {
              ref: "dateEl",
              modelValue: l.value,
              "onUpdate:modelValue": n[1] || (n[1] = (t) => l.value = t),
              onChange: e(S)
            }, null, 8, ["modelValue", "onChange"])
          ], 2)) : C("", !0)
        ]),
        _: 1
      })
    ], 2));
  }
});
export {
  Q as default
};