UNPKG

@opensig/opendesign

Version:

127 lines (126 loc) 4.81 kB
import { defineComponent, ref, inject, computed, createBlock, openBlock, unref, withCtx, createVNode, normalizeClass, createElementVNode, createElementBlock, createCommentVNode, Fragment, renderSlot } from "vue"; import { until } from "@vueuse/core"; import { OPopup } from "../../popup/index.mjs"; import ClientOnly from "../../_components/client-only.mjs"; import { ODivider } from "../../divider/index.mjs"; import { isEmptySlot } from "../../_utils/vue-utils.mjs"; import { datePickerInjectKey } from "../provide.mjs"; import _sfc_main$1 from "./DateRangePanelContent.vue.mjs"; const _hoisted_1 = { class: "o-date-panel-footer" }; const _hoisted_2 = { class: "o-date-panel-shortcut" }; const _sfc_main = /* @__PURE__ */ defineComponent({ __name: "DateRangePanel", props: { target: {}, optionTitle: {} }, emits: ["change"], setup(__props, { expose: __expose, emit: __emit }) { const props = __props; const emits = __emit; const visible = ref(false); const currentView = ref("date"); const datePickerCtx = inject(datePickerInjectKey); const { size, mode: effectiveMode, transition, popupPosition, popupWrapper } = datePickerCtx; const popupRef = ref(); const contentRef = ref(); const isMainPanel = computed(() => { if (effectiveMode.value === "year") return currentView.value === "year"; if (effectiveMode.value === "month") return currentView.value === "month"; return currentView.value === "date"; }); const getValue = () => { var _a; return ((_a = contentRef.value) == null ? void 0 : _a.getValue()) ?? { start: void 0, end: void 0 }; }; const setValue = (start, end) => { var _a; (_a = contentRef.value) == null ? void 0 : _a.setValue(start, end); }; const open = async (start, end) => { var _a; if (visible.value) return; visible.value = true; await until(contentRef).toBeTruthy(); (_a = contentRef.value) == null ? void 0 : _a.init(start, end); }; const close = () => { visible.value = false; }; const handleContentChange = (start, end) => { emits("change", start, end); }; __expose({ getPopupEl: () => popupRef.value, getValue, setValue, open, close }); return (_ctx, _cache) => { return openBlock(), createBlock(unref(ClientOnly), null, { default: withCtx(() => [ createVNode(unref(OPopup), { visible: visible.value, "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => visible.value = $event), class: normalizeClass(["o-date-panel", `o-date-panel-${unref(size)}`, "o-date-range-panel"]), "hide-close": "", target: props.target, transition: unref(transition), position: unref(popupPosition), wrapper: unref(popupWrapper), trigger: "none", offset: 4, "adjust-min-width": false, "adjust-width": false }, { default: withCtx(() => [ createElementVNode( "div", { ref_key: "popupRef", ref: popupRef }, [ createVNode(_sfc_main$1, { ref_key: "contentRef", ref: contentRef, "current-view": currentView.value, "onUpdate:currentView": _cache[0] || (_cache[0] = ($event) => currentView.value = $event), onChange: handleContentChange }, null, 8, ["current-view"]), !unref(isEmptySlot)(_ctx.$slots.shortcut) && isMainPanel.value ? (openBlock(), createElementBlock( Fragment, { key: 0 }, [ createVNode(unref(ODivider), { class: "o-date-panel-divider" }), createElementVNode("div", _hoisted_1, [ createElementVNode("span", _hoisted_2, [ renderSlot(_ctx.$slots, "shortcut", { setValue, emitChange: () => emits("change", getValue().start, getValue().end) }) ]) ]) ], 64 /* STABLE_FRAGMENT */ )) : createCommentVNode("v-if", true) ], 512 /* NEED_PATCH */ ) ]), _: 3 /* FORWARDED */ }, 8, ["visible", "class", "target", "transition", "position", "wrapper"]) ]), _: 3 /* FORWARDED */ }); }; } }); export { _sfc_main as default };