UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

1,714 lines (1,713 loc) 98.7 kB
var xt = Object.defineProperty; var Ft = (e, t, n) => t in e ? xt(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n; var Be = (e, t, n) => Ft(e, typeof t != "symbol" ? t + "" : t, n); import { defineComponent as ee, ref as B, watch as Y, computed as A, createVNode as l, inject as le, nextTick as Ne, onMounted as ie, createTextVNode as se, provide as Et, onUnmounted as It, Fragment as Ae } from "vue"; import { resolveAppearance as Nt, createPropsResolver as Ot, getPropsResolverGenerator as Vt } from "../dynamic-resolver/index.esm.js"; import { DgControl as ye, useDesignerComponent as Pt } from "../designer-canvas/index.esm.js"; import { cloneDeep as ce, isFunction as Te, isPlainObject as Re } from "lodash-es"; import { resolveField as K, useDateFormat as Wt, useResizeObserver as $e, getCustomClass as Lt, getCustomStyle as jt, EVENT_PROPERTY_TAB_IDS as Bt } from "../common/index.esm.js"; import Rt from "../popover/index.esm.js"; import { LocaleService as $t } from "../locale/index.esm.js"; import { BaseControlProperty as At } from "../property-panel/index.esm.js"; const ze = /* @__PURE__ */ new Map([ ["appearance", Nt] ]), zt = "root-viewmodel"; function Yt(e, t) { const { formSchemaUtils: n, designViewModelUtils: o } = t; function d(v) { return { id: `${v.componentId}-component-viewmodel`, code: `${v.componentId}-component-viewmodel`, name: v.componentName, bindTo: v.bindTo, parent: zt, fields: [], commands: [], states: [], enableValidation: !0 }; } function m(v) { const a = e.getSchemaByType("component-ref"); return Object.assign(a, { id: `${v.componentId}-component-ref`, component: `${v.componentId}-component` }), a; } function h(v, a, c) { var y, u, E, s; const p = (u = (y = a == null ? void 0 : a.parentComponentInstance) == null ? void 0 : y.schema) == null ? void 0 : u.type, r = (s = (E = n.getFormSchema()) == null ? void 0 : E.module) == null ? void 0 : s.templateId; if (["double-list-template", "tree-list-template", "list-template"].includes(r)) return v; const i = [ye["content-container"].type, ye["response-layout-item"].type, ye["splitter-pane"].type, ye.drawer.type]; if (p && i.includes(p)) { const g = e.getSchemaByType( "section", { parentComponentInstance: a.parentComponentInstance, mainTitle: a.componentName }, t ); if (g && g.contents && g.contents.length) { const O = g.contents[0]; return O.contents = [v], g; } } return v; } function D(v) { const a = e.getSchemaByType("calendar"); return Object.assign(a, { id: v.componentId + "-calendar", appearance: { class: "" }, type: "calendar", dataSource: v.dataSource || "", pagination: { enable: !1 } }), [a]; } function V(v) { var i, y, u; const a = e.getSchemaByType("component"), c = D(v); let p = !1; const r = (u = (y = (i = v.parentComponentInstance) == null ? void 0 : i.schema) == null ? void 0 : y.appearance) == null ? void 0 : u.class; return r && r.includes("f-page-main") && (p = !0), Object.assign(a, { id: `${v.componentId}-component`, viewModel: `${v.componentId}-component-viewmodel`, componentType: v.componentType, appearance: { class: p ? "f-utils-fill-flex-column f-utils-overflow-auto" : "f-grid-is-sub f-utils-overflow-auto" }, contents: c }), a; } function C(v) { const a = m(v), c = V(v), p = d(v), r = n.getFormSchema(); return r.module.viewmodels.push(p), r.module.components.push(c), o.assembleDesignViewModel(), h(a, v); } return { createComponent: C }; } function Ye(e, t, n, o) { var m, h, D, V, C, v; const d = n.parentComponentInstance; if (d && o) { const a = Math.random().toString(36).slice(2, 6), c = { componentId: `calendar-${a}`, componentName: ((m = n.bindingSourceContext) == null ? void 0 : m.entityTitle) || ((D = (h = n.bindingSourceContext) == null ? void 0 : h.bindingEntity) == null ? void 0 : D.name) || `日历-${a}`, componentType: "calendar", parentContainerId: d.schema.id, parentComponentInstance: d, bindTo: ((V = n.bindingSourceContext) == null ? void 0 : V.bindTo) || "", dataSource: (v = (C = n.bindingSourceContext) == null ? void 0 : C.bindingEntity) == null ? void 0 : v.label }, { createComponent: p } = Yt(e, o); return p(c); } else return t; } const qt = "https://json-schema.org/draft/2020-12/schema", Ht = "https://farris-design.gitee.io/calendar.schema.json", Gt = "calendar", _t = "A Farris Input Component", Ut = "object", Jt = { id: { description: "The unique identifier for calendar", type: "string" }, type: { description: "The type string of calendar", type: "string", default: "calendar" }, appearance: { description: "", type: "object", properties: { class: { type: "string" }, style: { type: "string" } }, default: {} }, dataSource: { description: "", type: "string", default: "" }, visible: { description: "", type: "boolean", default: !0 }, fit: { description: "填充父容器", type: "boolean", default: !0 }, width: { description: "宽度", type: "Number", default: 600 }, height: { description: "高度", type: "Number", default: 500 }, firstDayOfTheWeek: { description: "每周起始日", type: "String", default: "Sun" }, highLightWeekend: { description: "是否高亮周末", type: "Boolean", default: !0 }, eventDateField: { description: "事件日期字段", type: "String", default: "" }, activeDate: { description: "默认日期", type: "String", default: "" }, eventItemFormatter: { description: "自定义事件内容格式化", type: "String", default: "" }, customEventStyles: { description: "自定义事件样式", type: "String", default: "" }, textField: { description: "事件文本字段", type: "String", default: "title" }, idField: { description: "事件id字段", type: "String", default: "id" }, enableMoreView: { description: "是否启用多视图", type: "Boolean", default: !1 }, defaultView: { description: "默认视图", type: "String", default: "month" }, enableCrossDay: { description: "是否允许跨天", type: "Boolean", default: !1 }, startDateField: { description: "事件开始日期字段", type: "String", default: "" }, endDateField: { description: "事件结束日期字段", type: "String", default: "" } }, Xt = [ "id", "type" ], Qt = { onEventClick: "日程点击事件", onDateChange: "日期切换事件", onMoreClick: "更多点击事件", onViewChange: "视图切换事件" }, ke = { $schema: qt, $id: Ht, title: Gt, description: _t, type: Ut, properties: Jt, required: Xt, events: Qt }, Oe = { /** * 事件列表 * @default [] */ events: { type: Array, default: [] }, /** * 每周起始日, 可选值:`Sun` `Mon` * @default Sun */ firstDayOfTheWeek: { type: String, default: "Sun" }, enableMoreView: { type: Boolean, default: !1 }, defaultView: { type: String, default: "month" }, /** * 是否适应父容器宽度 * @default true */ fit: { type: Boolean, default: !0 }, /** * 高度, fit为false时生效 * @default 600 */ height: { type: Number, default: 600 }, /** * 宽度, fit为false时生效 * @default 800 */ width: { type: Number, default: 800 }, highLightWeekend: { type: Boolean, default: !1 }, eventItemFormatter: { type: Function }, customEventStyles: { type: Function }, /** * 事件日期字段, `enableCrossDay`为false时生效 * @default startDate */ eventDateField: { type: String, default: "startDate" }, customClass: { type: String, default: "" }, /** * 事件开始日期字段, `enableCrossDay`为true时生效 * @default startDate */ startDateField: { type: String, default: "startDate" }, /** * 事件结束日期字段, `enableCrossDay`为true时生效 * @default endDate */ endDateField: { type: String, default: "endDate" }, /** * 是否允许跨天事件 * @default false */ enableCrossDay: { type: Boolean, default: !1 }, /** * 事件id字段 * @default id */ idField: { type: String, default: "id" }, /** * 显示日期 * @default new Date() */ activeDate: { type: Date, default: /* @__PURE__ */ new Date() }, textField: { type: String, default: "title" }, customStyle: { type: String, default: "" }, enableWeekdayBorder: { type: Boolean, default: !1 }, visible: { type: Boolean, default: !0 } }, sa = Ot(Oe, ke, ze, Ye), qe = Vt( ke, ke, ze, Ye ), Q = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]; var te = /* @__PURE__ */ ((e) => (e[e.previous = 1] = "previous", e[e.current = 2] = "current", e[e.next = 3] = "next", e))(te || {}); function ue() { function e() { return { year: 0, month: 0, day: 0 }; } function t(a) { return new Date( a.year || 0, a.month ? a.month - 1 : 0, a.day || 0, a.hour ? a.hour : 0, a.minute ? a.minute : 0, a.second ? a.second : 0, 0 ); } function n(a) { const c = /* @__PURE__ */ new Date(); return a.year || (a.year = c.getFullYear()), a.month || (a.month = c.getMonth() + 1), a.day || (a.day = 1), new Date( a.year, a.month - 1, a.day, a.hour ? a.hour : 0, a.minute ? a.minute : 0, a.second ? a.second : 0, 0 ); } function o(a) { return new Date( a.year || 1, (a.month || 1) - 1, a.day, a.hour ? a.hour : 0, a.minute ? a.minute : 0, a.second ? a.second : 0, 0 ).getDay(); } function d(a) { return Q.indexOf(a); } function m(a) { return t(a).getTime(); } function h(a) { return Math.round(m(a) / 1e3); } function D(a, c, p) { const r = m(c), i = m(p), y = m(a); return i - y > y - r ? c : p; } function V() { const a = /* @__PURE__ */ new Date(); return { year: a.getFullYear(), month: a.getMonth() + 1, day: a.getDate(), hour: a.getHours(), minute: a.getMinutes(), second: a.getSeconds() }; } function C(a) { return a ? { year: a.getFullYear(), month: a.getMonth() + 1, day: a.getDate(), hour: a.getHours(), minute: a.getMinutes(), second: a.getSeconds() } : e(); } function v(a) { const c = o(a); return c === 0 || c === 6; } return { convertDateToDateObject: C, emptyDate: e, getDate: t, getDate2: n, getDayNumber: o, getEpocTime: h, getNearDate: D, getWeekdayIndex: d, getTimeInMilliseconds: m, getToday: V, isWeekEnd: v }; } function Zt() { function e(m, h) { return new Date(h, m, 0).getDate(); } function t(m, h, D) { return new Date(m, h - 1, D, 0, 0, 0, 0); } function n(m, h) { const D = t(h, m, 1); return D.setMonth(D.getMonth() - 1), e(D.getMonth() + 1, D.getFullYear()); } function o(m, h) { const D = { year: m === 12 ? h + 1 : h }, V = m === 12 ? 1 : m + 1; return D.month = V, D; } function d(m, h) { const D = { year: m === 1 ? h - 1 : h }, V = m === 1 ? 12 : m - 1; return D.month = V, D; } return { daysInMonth: e, daysInPreMonth: n, getNextMonth: o, getPreviousMonth: d }; } function Kt() { const { getToday: e, getDayNumber: t, isWeekEnd: n } = ue(), { daysInMonth: o, daysInPreMonth: d, getNextMonth: m, getPreviousMonth: h } = Zt(); function D(u) { const { day: E, month: s, year: g } = u; if (E === void 0 || s === void 0 || g === void 0) throw new Error("invalided date."); const O = E === 1, k = O ? d(s, g) : E - 1, R = O ? s - 1 : s, S = R < 1, I = S ? 12 : R; return { year: S ? g - 1 : g, month: I, day: k }; } function V(u) { const { day: E, month: s, year: g } = u; if (E === void 0 || s === void 0 || g === void 0) throw new Error("invalided date."); const O = o(s, g), k = E === O, R = k ? 1 : E + 1, S = k ? s + 1 : s, I = S > 12, x = I ? 1 : S; return { year: I ? g + 1 : g, month: x, day: R }; } function C(u) { const E = h(u.month || 1, u.year || 1), s = o(E.month || 1, E.year || 1); return { day: (u.day || 1) <= s ? u.day : s, month: E.month, year: E.year }; } function v(u) { const E = m(u.month || 1, u.year || 1), s = o(E.month || 1, E.year || 1); return { day: (u.day || 1) <= s ? u.day : s, month: E.month, year: E.year }; } function a(u) { return { day: u.day, month: u.month, year: (u.year || 1) + 1 }; } function c(u) { return { day: u.day, month: u.month, year: (u.year || 1) - 1 }; } function p(u) { const s = (u.day || 1) - 7, g = s < 1, O = g ? o(u.month || 1, u.year || 1) + s : s, k = g ? h(u.month || 1, u.year || 1) : u; return { day: O, month: k.month, year: k.year }; } function r(u) { const s = (u.day || 1) + 7, g = o(u.month || 1, u.year || 1), O = s > g, k = O ? s - g : s, R = O ? m(u.month || 1, u.year || 1) : u; return { day: k, month: R.month, year: R.year }; } function i(u, E, s, g, O) { if (u < 1 || E < 1 || s < 1) throw new Error("Invalid date input"); const k = { day: u, month: E, year: s }, R = Q.indexOf(g); if (R === -1) throw new Error("Invalid firstDayOfWeek value"); const I = (t(k) - R + 7) % 7, x = e(), b = (P) => P.day === x.day && P.month === x.month && P.year === x.year, f = []; let T = { ...k }; for (let P = 0; P < I; P++) T = D(T); for (let P = 0; P < 7; P++) { let w; if (T.month === O.month && T.year === O.year) w = te.current; else { const F = h(k.month, k.year); T.month === F.month && T.year === F.year ? w = te.previous : w = te.next; } const j = b(T), N = n(T); f.push({ date: T, monthTag: w, isCurrent: j, weekEnd: N }), P < 6 && (T = V(T)); } return { days: f, weekNumber: 0, year: s }; } function y(u, E, s, g) { const O = [], k = { day: 1, month: u, year: E }, R = t(k), S = Q.indexOf(s); if (S === -1) throw new Error("Invalid firstDayOfWeek value"); const I = (R - S + 7) % 7; let x = k; for (let f = 0; f < I; f++) x = D(x); let b = x; for (let f = 0; f < 6; f++) { const T = i(b.day, b.month, b.year, s, g); O.push(T); for (let L = 0; L < 7; L++) b = V(b); } return O; } return { getMonthlyCalendar: y, getWeeklyCalendar: i, getPreviousDay: D, getNextDay: V, getDayInPreviousWeek: p, getDayInNextWeek: r, getDayInPreviousMonth: C, getDayInNextMonth: v, getNextYear: a, getPreviousYear: c }; } const oe = ["year", "month", "week", "day"]; var Me = /* @__PURE__ */ ((e) => (e[e.Equal = 0] = "Equal", e[e.NotEqual = 1] = "NotEqual", e[e.Greater = 2] = "Greater", e[e.GreaterOrEqual = 3] = "GreaterOrEqual", e[e.Less = 4] = "Less", e[e.LessOrEqual = 5] = "LessOrEqual", e[e.Like = 6] = "Like", e[e.LikeStartWith = 7] = "LikeStartWith", e[e.LikeEndWith = 8] = "LikeEndWith", e[e.NotLike = 9] = "NotLike", e[e.NotLikeStartWith = 10] = "NotLikeStartWith", e[e.NotLikeEndWith = 11] = "NotLikeEndWith", e[e.Is = 12] = "Is", e[e.IsNot = 13] = "IsNot", e[e.In = 14] = "In", e[e.NotIn = 15] = "NotIn", e))(Me || {}), Se = /* @__PURE__ */ ((e) => (e[e.Empty = 0] = "Empty", e[e.And = 1] = "And", e[e.Or = 2] = "Or", e))(Se || {}); function Ve() { const { getTimeInMilliseconds: e } = ue(); function t(r) { return r && r.year !== 0 && r.month !== 0 && r.day !== 0; } function n(r) { return r && r.year !== 0 && r.month !== 0; } function o(r) { return r && r.year !== 0; } function d(r, i) { return e(r) < e(i); } function m(r) { return e({ year: r.year, month: r.month, day: r.day }); } function h(r, i, y = !0) { return y ? e(r) <= e(i) : m(r) <= m(i); } function D(r, i) { return e(r) === e(i); } function V(r, i) { const y = e(i); return e(r.from) === y || e(r.to) === y; } function C(r, i) { return !i || !t(i.to) || !t(i.from) ? !1 : h(i.from, r) && h(r, i.to); } function v(r, i) { return t(i) && e(r) >= e(i); } function a(r, i) { return t(i) && e(r) <= e(i); } function c(r, i) { return e({ year: r.year, month: r.month, day: r.day }) === e({ year: i.year, month: i.month, day: i.day }); } function p(r, i) { return e({ hour: r.hour, minute: r.minute, second: r.second }) === e({ hour: i.hour, minute: i.minute, second: i.second }); } return { isDateEarlier: d, equal: D, inPeriod: C, isPoint: V, equalOrEarlier: h, isInitializedDate: t, isInitializedMonth: n, isInitializedYear: o, isMonthDisabledByDisableSince: v, isMonthDisabledByDisableUntil: a, sameTime: p, sameDay: c }; } const en = { activeView: { type: Number, default: 3 }, title: { type: String, default: "" }, dailyViewTitle: { type: String, default: "Day" }, weeklyViewTitle: { type: String, default: "Week" }, monthlyViewTitle: { type: String, default: "Month" }, todayText: { type: String, default: "Today" }, previousText: { type: String, default: "Previous" }, nextText: { type: String, default: "Next" }, enableMoreView: { type: Boolean, default: !1 }, isCurrent: { type: Boolean, default: !1 }, yearViewTitle: { type: String, default: "Year" } }, xe = /* @__PURE__ */ ee({ name: "FCalendarHeader", props: en, emits: ["viewChange", "previous", "next", "resetToToday"], setup(e, t) { const n = B(e.title), o = B(e.dailyViewTitle), d = B(e.weeklyViewTitle), m = B(e.monthlyViewTitle), h = B(e.yearViewTitle), D = 2, V = 62, C = B(e.activeView); Y(() => e.activeView, (y, u) => { C.value = y; }), Y(() => e.title, () => { n.value = e.title; }); const v = A(() => ({ top: `${D}px`, left: `${C.value * (D + 1) + (C.value - 1) * (V + 1)}px` })), a = A(() => C.value === 4 ? o.value : C.value === 3 ? d.value : C.value === 1 ? h.value : m.value); function c(y) { const u = oe.indexOf(y) + 1; C.value = u, t.emit("viewChange", u); } function p() { t.emit("previous", C.value); } function r() { t.emit("next", C.value); } function i() { t.emit("resetToToday"); } return () => l("div", { class: "f-calendar-header align-items-center" }, [l("div", { class: "f-calendar-title" }, [n.value]), l("div", { class: "f-calendar-navigator pl-3", style: "height:26px" }, [l("button", { class: "btn btn-secondary mr-2", onClick: () => i(), disabled: e.isCurrent }, [e.todayText || "Today"]), l("div", { class: "f-calendar-navigator-button-group" }, [l("div", { class: "f-calendar-navigator-previous btn btn-default", onClick: () => p(), title: e.previousText }, [l("i", { class: "f-icon f-icon-arrow-chevron-left" }, null)]), l("div", { class: "f-calendar-navigator-next btn btn-default", onClick: () => r(), title: e.nextText }, [l("i", { class: "f-icon f-icon-arrow-chevron-right" }, null)])])]), e.enableMoreView && l("div", { class: "f-calendar-view-switch" }, [l("div", { class: "f-calendar-view-switch-panel", style: "width: 134px;" }, [l("span", { class: "f-calendar-view-switch-monthly", onClick: (y) => c("year") }, [h.value]), l("span", { class: "f-calendar-view-switch-monthly", onClick: (y) => c("month") }, [m.value])]), l("div", { class: "f-calendar-view-switch-active-view", style: v.value }, [a.value])])]); } }), tn = { dates: { type: Array, default: [] }, daysInWeek: { type: Array, default: Q }, enableKeyboadNavigate: { type: Boolean, default: !0 }, enableMarkCurrent: { type: Boolean, default: !0 }, events: { type: Array, default: [] }, activeDay: { type: Object, default: null }, width: { type: Number, default: 0 }, height: { type: Number, default: 0 }, disabled: { type: Boolean, default: !1 }, monthLabels: { type: Object, default: {} }, eventDateField: { type: String, default: "startDate" }, enableCrossDay: { type: Boolean, default: !1 }, startDateField: { type: String, default: "startDate" }, endDateField: { type: String, default: "endDate" }, idField: { type: String, default: "id" }, customEventStyles: { type: Function, default: null }, eventItemFormatter: { type: Function, default: null }, popoverRef: { type: Object, default: null }, /** 月视图头部应用边框线条与背景色,默认不启用 */ showBorder: { type: Boolean, default: !1 }, moreText: { type: String, default: "更多" } }, Fe = /* @__PURE__ */ ee({ name: "FCalendarMonthView", props: tn, emits: ["click", "keyDown", "moreClick"], setup(e, t) { const n = B(e.daysInWeek); B(e.enableKeyboadNavigate); const o = B(e.enableMarkCurrent), d = B(e.activeDay), m = B(e.events), { assignEventsToWeeks: h, assignEventsToDays: D, renderEventItem: V, useCompareCompsition: C } = le("eventsComposition"), { equal: v } = C, a = B(); function c(b, f) { return e.enableCrossDay ? h(b, f) : D(b, f); } const p = B(c(e.dates, m.value)); Y(() => e.enableCrossDay, () => { p.value = c(e.dates, e.events); }), Y(() => e.dates, () => { p.value = c(e.dates, m.value); }), Y(() => e.activeDay, () => { d.value = e.activeDay; }), Y(() => e.events, () => { m.value = e.events, p.value = c(e.dates, e.events); }), Y(() => e.daysInWeek, (b, f) => { n.value = b; }); function r(b) { return !!d.value && v({ year: d.value.year, month: d.value.month, day: d.value.day }, b); } const i = (b, f, T) => { const P = { "f-datepicker-no-currmonth": b.monthTag === te.previous || b.monthTag === te.next, "f-calendar-weekday": b.weekEnd, "f-calendar-workday": !b.weekEnd, "f-calendar-today": b.isCurrent }, w = `d_${f}_${T}`; return P[w] = !0, P; }, y = (b) => { const f = b.monthTag === te.current && r(b.date), T = b.isCurrent && o.value; return { "f-calendar-month-view-date": !0, "f-calendar-month-view-selected": f, "f-calendar-month-view-current": T }; }; function u(b, f) { e.disabled || f.showMore || (b.stopPropagation(), t.emit("click", { date: f.date, view: "month" })); } function E(b, f) { e.disabled || t.emit("moreClick", { date: f.date, view: "month" }); } const s = A(() => ({ width: `${e.width}px`, height: `${e.height}px` })), g = B(0), O = () => { const b = a.value; if (!b) return 0; const f = b.querySelector(".f-calendar--daygrid-row"); if (!f) return 0; const T = f.offsetHeight; return Math.max(0, Math.floor(T / 19) - 1); }; function k() { return l("div", { class: "w-100" }, [l("table", { class: { "w-100": !0, "show-border": e.showBorder } }, [n.value && n.value.map((b) => l("th", null, [b]))])]); } function R(b, f) { return l("div", { class: "f-calendar--daygrid-row-header" }, [l("table", null, [l("tbody", null, [l("tr", null, [b.days && b.days.map((T, L) => l("td", { class: i(T, f, L), onClick: (P) => u(P, T), style: "position: relative;" }, null))])])])]); } function S(b, f) { return b.days && b.days.map((T, L) => l("td", { class: i(T, f, L) }, [l("div", { class: "f-calendar-month-view-title" }, [l("div", { class: y(T) }, [T.date.day]), l("div", { class: "f-calendar-month-view-date-month" }, [T.date.day === 1 ? e.monthLabels[T.date.month || 1] : ""])])])); } function I(b) { const f = Math.max(0, g.value || O()), T = !!(b.events && b.events.length > f), L = ce([...b.events || []]), P = T ? L.slice(0, f) : L; return T && P && P.length > 0 && P[P.length - 1].forEach((w) => { w.data && (w.showMore = !0, w.moreCount = b.events.length - f + 1); }), P.map((w, j) => l("tr", null, [w.map((N, F) => N.showMore ? l("td", { colspan: 1, rowspan: 1, onClick: (q) => u(q, N) }, [l("a", { class: "f-calendar-event p-0 m-0 pl-1 more-events ", onClick: (q) => E(q, b.days[F]) }, [l("div", { class: "event-title" }, [e.moreText.replace("#count#", N.moreCount)])])]) : l("td", { colspan: N.colspan || 1, rowspan: N.rowspan || 1, onClick: (q) => u(q, b.days[F]) }, [N.data && V(N)]))])); } function x() { return l("div", { class: "w-100 h-100" }, [l("div", { class: "f-calendar--daygrid" }, [p.value.map((b, f) => l("div", { class: "f-calendar--daygrid-row" }, [R(b, f), l("div", { class: "f-calendar--daygrid-content" }, [l("table", null, [l("thead", null, [l("tr", null, [S(b, f)])]), l("tbody", null, [I(b)])])])]))])]); } return Y(() => e.height, (b, f) => { b !== f && Ne(() => { g.value = O(), p.value = [...p.value]; }); }), ie(() => { g.value = O(); }), () => l("div", { class: "f-calendar-month-view", ref: a }, [l("table", { class: "f-calendar-table", cellpadding: "0", style: s.value }, [l("thead", null, [l("tr", null, [l("td", { class: "f-calendar-header" }, [k()])])]), l("tbody", null, [l("tr", { style: "height: 100%" }, [l("td", { class: "f-calendar-content" }, [x()])])])])]); } }), nn = { daysInWeek: { type: Array, default: Q }, enableMarkCurrent: { type: Boolean, default: !0 }, events: { type: Array, default: [] }, week: { type: Object, default: { days: [], weekNumber: 0, year: 0 } }, dateField: { type: String, default: "date" }, startDateField: { type: String, default: "startDate" }, endDateField: { type: String, default: "endDate" } }, Ee = /* @__PURE__ */ ee({ name: "FCalendarWeekView", props: nn, emits: [], setup(e) { const t = B(), n = B(), o = B(e.daysInWeek), d = B(e.week), m = B(e.enableMarkCurrent), h = B(e.events), D = B([]), { equal: V } = Ve(), { convertDateToDateObject: C } = ue(); function v(s) { return d.value.days.map((O) => { const k = { year: O.date.year, month: O.date.month, day: O.date.day, hour: s.hour, minute: s.minute, second: s.second }, R = h.value.filter((S) => V(C(S[e.startDateField]), k)); return { day: k, events: R }; }); } function a() { const s = []; for (let g = 0; g < 24; g++) { const O = { hour: g, minute: 0, second: 0 }, k = { hour: g, minute: 30, second: 0 }, R = v(O), S = v(k); s.push({ time: O, events: R, title: g > 0 ? `${g}:00` : "", part: "upper" }), s.push({ time: k, events: S, title: `${g}:30`, part: "lower" }); } D.value = s; } a(), Y(() => e.week, () => { d.value = e.week, a(); }), Y(() => e.events, () => { h.value = e.events, a(); }); const c = (s) => ({ "f-calendar-week-view-date": !0, "f-calendar-week-view-current": s.isCurrent && m.value }); function p() { return l("div", { class: "f-calendar-week-view-header" }, [l("div", { class: "f-calendar-week-view-header-corner" }, null), l("div", { class: "f-calendar-week-view-header-primary" }, [l("div", { class: "f-calendar-week-view-header-columns" }, [o.value.map((s, g) => l("div", { class: "f-calendar-week-view-header-cell" }, [l("div", { class: c(d.value.days[g]) }, [d.value.days[g].date.day]), l("span", null, [s])]))])])]); } function r() { return l("div", { class: "f-calendar-week-view-content-side" }, [l("div", { class: "f-calendar-side" }, [D.value.map((s) => l("div", { class: "f-calendar-side-row" }, [l("div", { class: "f-calendar-side-row-number" }, [s.part === "upper" ? s.title : ""])]))])]); } function i(s) { return { "f-calendar-week-view-item": !0, "f-calendar-week-view-item-upper": s.part === "upper", "f-calendar-week-view-item-lower": s.part === "lower" }; } function y(s) { const I = (s[e.startDateField].hour || 0) + (s[e.startDateField].minute || 0) / 60; return { height: `${44 * ((s.ends.hour || 0) + (s.ends.minute || 0) / 60 - I) - 2 - 2 - 1 - 1}px` }; } function u() { return D.value.map((s) => l("div", { class: i(s) }, [s.events.map((g) => l("div", { class: "f-calendar-week-view-item-cell" }, [g.events.length > 0 && g.events.map((O) => l("div", { class: "f-calendar-event", style: y(O) }, [O.title]))]))])); } function E() { return l("div", { ref: n, class: "f-calendar-content-primary" }, [l("div", { class: "f-calendar-content-data" }, [u()])]); } return ie(() => { t.value && t.value.scrollTo(0, 250); }), () => l("div", { class: "f-calendar-week-view" }, [p(), l("div", { class: "f-calendar-week-view-content", ref: t }, [r(), E()])]); } }), an = { day: { type: Object, default: {} }, dayInWeek: { type: String, default: "" }, enableMarkCurrent: { type: Boolean, default: !0 }, events: { type: Array, default: [] }, dateField: { type: String, default: "date" } }, Ie = /* @__PURE__ */ ee({ name: "FCalendarDayView", props: an, emits: [], setup(e) { const t = B(), n = B(), o = B(e.dayInWeek), d = B(e.day), m = B(e.enableMarkCurrent), h = B(e.events), D = B([]), { convertDateToDateObject: V } = ue(), { equal: C } = Ve(); function v(s) { const g = { year: d.value.date.year, month: d.value.date.month, day: d.value.date.day, hour: s.hour, minute: s.minute, second: s.second }, O = h.value.filter((k) => C(V(k[e.dateField]), g)); return [{ day: g, events: O }]; } function a() { const s = []; for (let g = 0; g < 24; g++) { const O = { hour: g, minute: 0, second: 0 }, k = { hour: g, minute: 30, second: 0 }, R = v(O), S = v(k); s.push({ time: O, events: R, title: g > 0 ? `${g}:00` : "", part: "upper" }), s.push({ time: k, events: S, title: `${g}:30`, part: "lower" }); } D.value = s; } a(), Y(() => e.day, () => { d.value = e.day, a(); }), Y(() => e.events, () => { h.value = e.events, a(); }); const c = (s) => ({ "f-calendar-day-view-date": !0, "f-calendar-day-view-current": s.isCurrent && m.value }); function p() { return l("div", { class: "f-calendar-day-view-header" }, [l("div", { class: "f-calendar-day-view-header-corner" }, null), l("div", { class: "f-calendar-day-view-header-primary" }, [l("div", { class: "f-calendar-day-view-header-columns" }, [l("div", { class: "f-calendar-day-view-header-cell" }, [l("div", { class: c(d.value) }, [d.value.date.day]), l("span", null, [o.value])])])])]); } function r() { return l("div", { class: "f-calendar-day-view-content-side" }, [l("div", { class: "f-calendar-side" }, [D.value.map((s) => l("div", { class: "f-calendar-side-row" }, [l("div", { class: "f-calendar-side-row-number" }, [s.part === "upper" ? s.title : ""])]))])]); } function i(s) { return { "f-calendar-day-view-item": !0, "f-calendar-day-view-item-upper": s.part === "upper", "f-calendar-day-view-item-lower": s.part === "lower" }; } function y(s) { var T, L, P, w; const I = (((T = s.starts) == null ? void 0 : T.hour) || 0) + (((L = s.starts) == null ? void 0 : L.minute) || 0) / 60; return { height: `${44 * ((((P = s.ends) == null ? void 0 : P.hour) || 0) + (((w = s.ends) == null ? void 0 : w.minute) || 0) / 60 - I) - 2 - 2 - 1 - 1}px` }; } function u() { return D.value.map((s) => l("div", { class: i(s) }, [s.events.map((g) => l("div", { class: "f-calendar-day-view-item-cell" }, [g.events.length > 0 && g.events.map((O) => l("div", { class: "f-calendar-event", style: y(O) }, [O.title]))]))])); } function E() { return l("div", { ref: n, class: "f-calendar-content-primary" }, [l("div", { class: "f-calendar-content-data" }, [u()])]); } return ie(() => { t.value && t.value.scrollTo(0, 250); }), () => l("div", { class: "f-calendar-day-view" }, [p(), l("div", { class: "f-calendar-day-view-content", ref: t }, [r(), E()])]); } }), rn = /* @__PURE__ */ ee({ name: "FCalendarYearView", props: { monthLabels: { type: Object, default: null }, height: { type: Number, default: 300 }, events: { type: Array, default: [] }, dateField: { type: String, default: "date" }, activeYear: { type: Number, default: 2025 }, moreText: { type: String, default: "更多" } }, emits: ["moreClick"], setup(e, t) { const n = B(), o = B(e.monthLabels), { assignEventsToMonths: d, renderEventItemForMonths: m } = le("eventsComposition"), h = B(0), D = () => { const a = n.value; if (!a) return 0; const p = a.querySelector(".yearview-monthitem").offsetHeight; return Math.max(0, Math.floor((p - 40) / 24)); }, V = (a) => { const c = !!(a && a.length > h.value); if (c) { const p = ce(a), r = c ? p == null ? void 0 : p.slice(0, h.value) : p; if (r && r.length > 0) { const i = r[r.length - 1]; i.data && (i.showMore = !0, i.moreCount = a.length - h.value + 1); } return r; } return a; }, C = A(() => d(e.activeYear, e.events)); function v(a, c) { const p = { year: e.activeYear, month: parseInt(c, 10) }; t.emit("moreClick", a, { date: p, view: "year" }); } return Y(() => e.height, (a, c) => { a !== c && Ne(() => { h.value = D(), o.value = { ...e.monthLabels }; }); }), ie(() => { h.value = D(); }), () => l("div", { class: "h-100 w-100 f-calendar-year-view", ref: n }, [l("ul", { style: "height: 100%;overflow: auto; display: flex;flex-wrap: wrap;" }, [Object.keys(e.monthLabels).map((a, c) => { var p; return l("li", { key: c, class: "col-md-4 col-lg-3 col-sm-12 yearview-monthitem" }, [l("div", { class: "f-calendar-year-view-content w-100 h-100 d-flex flex-column", style: "overflow: hidden;" }, [l("div", { class: "f-calendar-month-view-title px-2" }, [e.monthLabels[a]]), l("div", { class: "f-calendar-month-events p-2" }, [l("ul", { class: "events" }, [(p = V(C.value[a])) == null ? void 0 : p.map((r, i) => r.showMore ? l("li", { class: "event-item more-events ", key: i }, [l("a", { class: "f-calendar-event p-0 mt-0 pl-1 ", onClick: (y) => v(y, a) }, [e.moreText.replace("#count#", r.moreCount)])]) : m(r))])])])]); })])]); } }), on = /* @__PURE__ */ ee({ name: "MoreEventList", props: { events: Array, popoverOffsetX: Number }, setup(e, t) { const n = B(), o = A(() => n), d = A(() => e.events), { renderEventItemForMore: m } = le("eventsComposition"), h = B(0); return t.expose({ popoverRef: o }), () => l(Rt, { id: "calendar-more-events", customStyles: { filter: "drop-shadow(#c5c5c5 0px 0px 6px)" }, offsetX: h, ref: n, placement: "auto", keepWidthWithReference: !1, fitContent: !0 }, { default: () => { var D; return [l("div", { style: "height: 400px; width: 300px;overflow: hidden;" }, [l("div", { class: "f-calendar-more-events-list h-100", style: "overflow:auto;" }, [l("ul", null, [(D = d.value) == null ? void 0 : D.map((V) => m(V))])])])]; } }); } }); function ln() { const { getLocaleValue: e, getLocale: t } = $t, n = { 1: e("calendar.monthLabels.1"), 2: e("calendar.monthLabels.2"), 3: e("calendar.monthLabels.3"), 4: e("calendar.monthLabels.4"), 5: e("calendar.monthLabels.5"), 6: e("calendar.monthLabels.6"), 7: e("calendar.monthLabels.7"), 8: e("calendar.monthLabels.8"), 9: e("calendar.monthLabels.9"), 10: e("calendar.monthLabels.10"), 11: e("calendar.monthLabels.11"), 12: e("calendar.monthLabels.12") }, o = { Sun: e("calendar.dayLabels.Sun"), Mon: e("calendar.dayLabels.Mon"), Tue: e("calendar.dayLabels.Tue"), Wed: e("calendar.dayLabels.Wed"), Thu: e("calendar.dayLabels.Thu"), Fri: e("calendar.dayLabels.Fri"), Sat: e("calendar.dayLabels.Sat") }, d = e("calendar.today"), m = e("calendar.thisYear"), h = e("calendar.yearView"), D = e("calendar.monthView"), V = e("calendar.weekView"), C = e("calendar.dayView"), v = e("calendar.titleFormat"), a = e("calendar.yearViewTitleFormat"), c = e("calendar.prevMonth"), p = e("calendar.nextMonth"), r = e("calendar.prevWeek"), i = e("calendar.nextWeek"), y = e("calendar.prevDay"), u = e("calendar.nextDay"), E = e("calendar.prevYear"), s = e("calendar.nextYear"), g = e("calendar.more", "") || "还有 #count# 项..."; return { monthLabels: n, weekDayLabels: o, today: d, monthViewTitle: D, weekViewTitle: V, dayViewTitle: C, titleFormat: v, prevMonth: c, nextMonth: p, prevWeek: r, nextWeek: i, prevDay: y, nextDay: u, yearViewTitle: h, yearViewTitleFormat: a, thisYear: m, prevYear: E, nextYear: s, moreText: g, locale: t() }; } function sn(e) { const t = Object.prototype.toString.call(e); return e instanceof Date || typeof e == "object" && t === "[object Date]" ? new e.constructor(+e) : typeof e == "number" || t === "[object Number]" || typeof e == "string" || t === "[object String]" ? new Date(e) : /* @__PURE__ */ new Date(NaN); } function cn(e) { return e instanceof Date || typeof e == "object" && Object.prototype.toString.call(e) === "[object Date]"; } function un(e) { if (!cn(e) && typeof e != "number") return !1; const t = sn(e); return !isNaN(Number(t)); } function dn(e, t, n, o, d, m, h) { const { equalOrEarlier: D, sameDay: V } = o, { convertDateToDateObject: C } = t, { parseToDate: v, formatTo: a } = n; function c(S, I) { S.forEach((f) => { f.days.forEach((T) => { T.events = []; }); }); const x = /* @__PURE__ */ new Map(), b = (f) => { if (!f) return null; if (x.has(f)) return x.get(f); const T = v(f, "yyyy-MM-dd"); if (!T) return null; const L = C(T); return x.set(f, L), L; }; return I.forEach((f) => { const { eventDateField: T, startDateField: L } = e, P = K(f, T) || K(f, L), w = b(P); w && S.forEach((j) => { j.days.forEach((N) => { var F; V(N.date, w) && ((F = N.events) == null || F.push({ id: f[e.idField], data: { ...f }, eventDate: w, isSingleDay: !0 })); }); }); }), S.forEach((f) => { const T = [], L = f.days.map((w, j) => w.events && w.events.length > 0 ? w.events.map((N, F) => ({ ...N, // 在非跨天模式下,colspan为1,rowspan为1 colspan: 1, rowspan: 1, // 添加位置信息 startIndex: j, endIndex: j })) : []), P = Math.max(...L.map((w) => w.length), 0); for (let w = 0; w < P; w++) { const j = []; for (let N = 0; N < 7; N++) L[N][w] ? j.push(L[N][w]) : j.push({ colspan: 1, rowspan: 1, data: null }); T.push(j); } f.events = T; }), S; } function p(S, I) { S.forEach((f) => { f.events = []; }); const x = /* @__PURE__ */ new Map(), b = (f) => { if (!f) return null; if (x.has(f)) return x.get(f); const T = v(f, "yyyy-MM-dd"); if (!T) return null; const L = C(T); return x.set(f, L), L; }; return I.forEach((f) => { const { startDateField: T, endDateField: L } = e, P = b(K(f, T)), w = b(K(f, L)); !P || !w || S.forEach((j) => { var W, z, G, U; const N = j.days[0].date, F = j.days[j.days.length - 1].date; if (!(D(w, N, !1) || D(F, P, !1))) if (V(P, w)) (W = j.events) == null || W.push({ id: f[e.idField], data: { ...f }, eventDate: P, isSingleDay: !0 }); else { const J = D(N, P, !1) ? P : N, H = D(w, F, !1) ? w : F; let X = -1, ae = -1; j.days.forEach((de, fe) => { V(de.date, J) && (X = fe), V(de.date, H) && (ae = fe); }), X !== -1 && ae !== -1 && ((z = j.events) == null || z.push({ id: f[e.idField], data: { ...f }, // 修复:eventDate 应该是事件在整个事件范围内的起始日期 eventDate: P, // 添加在当前周的起始和结束日期 startDate: J, endDate: H, // 添加在当前周的起始和结束索引 startIndex: X, endIndex: ae, colspan: ae - X + 1, isCrossDay: !0 })); } else V(P, F) && !V(w, F) && ((G = j.events) == null || G.push({ id: `${f[e.idField]}_start`, data: { ...f }, eventDate: P, isSingleDay: !0, isOverlapping: !0, originalId: f[e.idField] })), V(w, N) && !V(P, N) && ((U = j.events) == null || U.push({ id: `${f[e.idField]}_end`, data: { ...f }, eventDate: w, isSingleDay: !0, isOverlapping: !0, originalId: f[e.idField] })); }); }), S.forEach((f) => { f.days.forEach((T, L) => { var N; const P = (N = f.events) == null ? void 0 : N.filter((F) => F.isCrossDay ? L >= F.startIndex && L <= F.endIndex : F.isSingleDay ? V({ year: F.eventDate.year, month: F.eventDate.month, day: F.eventDate.day }, { year: T.date.year, month: T.date.month, day: T.date.day }) : !1), w = P == null ? void 0 : P.find((F) => F.isCrossDay), j = (P == null ? void 0 : P.filter((F) => F.isSingleDay)) || []; w && j.length > 0 && j.forEach((F) => { var W, z; ((W = f.events) == null ? void 0 : W.some((G) => (G.originalId === F.id || G.id === F.id) && V({ year: G.eventDate.year, month: G.eventDate.month, day: G.eventDate.day }, { year: T.date.year, month: T.date.month, day: T.date.day }))) || (z = f.events) == null || z.push({ id: F.id, data: { ...F.data }, eventDate: T.date, isSingleDay: !0, isOverlapping: !0, originalId: F.id }); }); }); }), S.forEach((f) => { const T = []; for (let w = 0; w < 10; w++) T[w] = Array(7).fill(null); [...f.events].sort((w, j) => { if (w.isCrossDay && !j.isCrossDay) return -1; if (!w.isCrossDay && j.isCrossDay) return 1; if (w.isCrossDay && j.isCrossDay) return w.startIndex - j.startIndex; const N = w.eventDate, F = j.eventDate; return N.year !== F.year ? N.year - F.year : N.month !== F.month ? N.month - F.month : N.day - F.day; }).forEach((w) => { let j = 0, N = !1, F = 0, q = 1; for (w.isCrossDay ? (F = w.startIndex, q = w.colspan) : (F = f.days.findIndex((W) => V({ year: w.eventDate.year, month: w.eventDate.month, day: w.eventDate.day }, { year: W.date.year, month: W.date.month, day: W.date.day })), q = 1); !N && j < T.length; ) { let W = !0; for (let z = F; z < F + q; z++) if (T[j][z] !== null) { W = !1; break; } if (W) { for (let z = F; z < F + q; z++) T[j][z] = z === F ? w : { ...w, isPlaceholder: !0, colspan: z === F ? q : 0 }; N = !0; } else j++; } }); const P = []; T.forEach((w) => { if (w.some((j) => j !== null)) { const j = []; for (let N = 0; N < w.length; N++) { const F = w[N]; F === null ? j.push({ colspan: 1, rowspan: 1, data: null }) : F.isPlaceholder || j.push(F), F && (F.colspan = F.colspan || 1, F.colspan > 1 && (N += F.colspan - 1)); } P.push(j); } }), f.events = P; }), S; } function r(S, I) { const x = {}; return I.forEach((b) => { const { eventDateField: f, startDateField: T } = e, L = K(b, f) || K(b, T); if (!L) return; const P = C(v(L, "yyyy-MM-dd")); if (P.year === S) { const w = "" + P.month; x[w] = x[w] || [], x[w].push({ data: { ...b }, eventDate: P }); } }), x; } function i() { return oe[m.value - 1]; } function y(S, I) { S.stopPropagation(), !e.disabled && d.emit("eventClick", { data: I.data, view: i() }); } const u = (S, I, x) => { const b = K(S, I); return typeof b == "string" ? b : b !== null && typeof b == "object" && !Array.isArray(b) && x ? b[x] || "" : b || ""; }; function E(S) { return Te(e.eventItemFormatter) ? e.eventItemFormatter(S.data, { parseToDate: v, formatTo: a, getValue: u, view: i(), locale: h }) : K(S.data, e.textField || "title"); } function s(S) { return Te(e.eventItemFormatter) ? "" : u(S.data, e.textField || "title", h); } const g = (S) => { if (!S || !S.data) return {}; if (!Te(e.customEventStyles)) return { styles: { "background-color": "#f3f3f3" } }; const I = e.customEventStyles(S.data, { parseToDate: v, formatTo: a, getValue: u, view: i(), locale: h }); return I && Object.keys(I).length > 0 ? I : {}; }; function O(S) { const { cls: I, styles: x } = g(S); return l("a", { onClick: (b) => y(b, S), style: x || {}, class: "f-calendar-event p-0 mx-1 my-0 " + (I || "") }, [l("div", { class: "event-title", innerHTML: E(S), title: s(S) }, null)]); } function k(S) { return l("li", null, [se(" "), E(S)]); } function R(S) { const { cls: I, styles: x } = g(S); return l("li", { style: { ...x || {}, "padding-bottom": "2px" }, class: I, onClick: (b) => y(b, S) }, [l("div", { class: "event-title pb-0 text-truncate", innerHTML: E(S), title: s(S) }, null)]); } return { assignEventsToDays: c, assignEventsToWeeks: p, renderEventItem: O, useCompareCompsition: o, useDateComposition: t, useDateFormatComposition: n, renderEventItemForMore: k, assignEventsToMonths: r, renderEventItemForMonths: R, getEventItemStyles: g }; } const ne = /* @__PURE__ */ ee({ name: "FCalendar", props: Oe, emits: ["dayClick", "dateChange", "eventClick", "moreClick", "viewChange"], setup(e, t) { const { titleFormat: n, today: o, prevMonth: d, nextMonth: m, dayViewTitle: h, monthViewTitle: D, weekViewTitle: V, weekDayLabels: C, monthLabels: v, prevWeek: a, nextWeek: c, prevDay: p, nextDay: r, yearViewTitle: i, yearViewTitleFormat: y, thisYear: u, prevYear: E, nextYear: s, moreText: g, locale: O } = ln(), k = Ve(), R = Wt(), S = ue(), { sameDay: I } = k, { getToday: x, convertDateToDateObject: b } = S, { parseToDate: f