mine-h5-ui/es/MeCalendar/index.vue.js

一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍

import { defineComponent as A, useModel as w, openBlock as l, createElementBlock as n, Fragment as c, unref as e, withModifiers as x, normalizeStyle as F, normalizeClass as m, createElementVNode as t, createVNode as i, toDisplayString as a, renderList as g, createCommentVNode as M, mergeModels as V } from "vue";
import { useHandle as H, useShow as L } from "./hooks.js";
import { name as u } from "./config.js";
import { MeIcon as d } from "../MeIcon/index.js";
const R = { class: "calendar-year" }, Y = { class: "year-center" }, j = { class: "month" }, q = { class: "calendar-week" }, G = { class: "item-box fixed" }, J = { class: "calendar-day" }, K = ["onClick"], X = /* @__PURE__ */ A({
  name: u,
  __name: "index",
  props: /* @__PURE__ */ V({
    themeColor: { default: "#409eff" },
    closable: { type: Boolean, default: !1 },
    style: {}
  }, {
    modelValue: { default: "" },
    modelModifiers: {},
    visible: { type: Boolean, default: !1 },
    visibleModifiers: {}
  }),
  emits: /* @__PURE__ */ V(["change"], ["update:modelValue", "update:visible"]),
  setup(r, { emit: h }) {
    const z = h, $ = r, I = w(r, "modelValue"), v = w(r, "visible"), { days: B, getStyle: S, week: _, dateInfo: f, onDayItem: D, initData: N, onYearItem: y, onMonthItem: p } = H({ props: $, emit: z, modelValue: I, visible: v }), { showAnimation: E, destroy: k, onClose: C } = L({ visible: v }, N);
    return (O, s) => (l(), n(c, null, [
      e(k) ? (l(), n("div", {
        key: 0,
        ref: "calendarRef",
        class: m([e(u), e(E) ? "show" : ""]),
        style: F(e(S)),
        onClick: s[4] || (s[4] = x(() => {
        }, ["stop"]))
      }, [
        t("div", R, [
          t("view", {
            class: "icon",
            onClick: s[0] || (s[0] = (o) => e(y)(-1))
          }, [
            i(e(d), {
              name: "icon-left-double",
              size: "18px"
            })
          ]),
          t("view", {
            class: "icon",
            onClick: s[1] || (s[1] = (o) => e(p)(-1))
          }, [
            i(e(d), {
              name: "icon-left",
              size: "14px"
            })
          ]),
          t("div", Y, [
            t("div", j, a(e(f).m) + "月", 1),
            t("div", null, a(e(f).y), 1)
          ]),
          t("view", {
            class: "icon",
            onClick: s[2] || (s[2] = (o) => e(p)(1))
          }, [
            i(e(d), {
              name: "icon-right1",
              size: "14px"
            })
          ]),
          t("view", {
            class: "icon",
            onClick: s[3] || (s[3] = (o) => e(y)(1))
          }, [
            i(e(d), {
              name: "icon-right-double",
              size: "18px"
            })
          ])
        ]),
        t("div", q, [
          (l(!0), n(c, null, g(e(_), (o) => (l(), n("div", {
            key: o,
            class: "item"
          }, [
            t("div", G, a(o), 1)
          ]))), 128))
        ]),
        t("div", J, [
          (l(!0), n(c, null, g(e(B), (o, b) => (l(), n("div", {
            key: b,
            class: "item",
            onClick: (P) => e(D)(o, b)
          }, [
            t("div", {
              class: m(["item-box", { disabled: o.disabled, selected: o.selected, today: o.today }])
            }, a(o.value), 3)
          ], 8, K))), 128))
        ])
      ], 6)) : M("", !0),
      e(k) ? (l(), n("div", {
        key: 1,
        class: m(`${e(u)}-mask`),
        onClick: s[5] || (s[5] = x(
          //@ts-ignore
          (...o) => e(C) && e(C)(...o),
          ["stop"]
        ))
      }, null, 2)) : M("", !0)
    ], 64));
  }
});
export {
  X as default
};