@ctsy/layui-vue/es/subMenu/index.js

a component library for Vue 3 base on layui-vue

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
import { defineComponent, useSlots, inject, computed, ref, watch, onBeforeUnmount, openBlock, createElementBlock, createElementVNode, unref, renderSlot, createCommentVNode, normalizeClass, createBlock, withCtx } from "vue";
import { o as onClickOutside } from "../index4.js";
import "../transition/index.js";
import { _ as _sfc_main$1 } from "../index2.js";
import "../plugin-vue_export-helper.js";
const _hoisted_1 = { class: "layui-nav-item" };
const _hoisted_2 = { key: 0 };
const _hoisted_3 = { class: "layui-nav-child" };
const __default__ = {
  name: "LaySubMenu"
};
const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, __default__), {
  props: {
    id: null,
    title: null
  },
  setup(__props) {
    const props = __props;
    const slots = useSlots();
    const isTree = inject("isTree");
    inject("selectedKey");
    const openKeys = inject("openKeys");
    const isCollapse = inject("isCollapse");
    const isCollapseTransition = inject("isCollapseTransition");
    const isOpen = computed(() => {
      return openKeys.value.includes(props.id);
    });
    const subMenuRef = ref();
    const position = ref();
    watch(isOpen, () => {
      if (isOpen.value && position.value !== "left-nav") {
        setTimeout(setPosition, 0);
      }
    });
    const openHandle = function() {
      if (!isCollapse.value) {
        if (openKeys.value.includes(props.id)) {
          openKeys.value.splice(openKeys.value.indexOf(props.id), 1);
        } else {
          openKeys.value.push(props.id);
        }
      }
    };
    const setPosition = function() {
      if (!isTree.value || !subMenuRef.value) {
        return;
      }
      const offsetWidth = subMenuRef.value.offsetWidth;
      if (window.innerWidth < subMenuRef.value.getBoundingClientRect().left + offsetWidth + 10) {
        position.value = "left-nav";
      } else {
        position.value = "";
      }
    };
    onClickOutside(subMenuRef, (event) => {
      if (!isTree.value) {
        let index = openKeys.value.indexOf(props.id);
        if (index != -1) {
          openKeys.value.splice(index, 1);
        }
      }
    });
    window.addEventListener("resize", setPosition);
    onBeforeUnmount(() => window.removeEventListener("resize", setPosition));
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("li", _hoisted_1, [
        createElementVNode("a", {
          href: "javascript:void(0)",
          onClick: _cache[0] || (_cache[0] = ($event) => openHandle())
        }, [
          createElementVNode("i", null, [
            unref(slots).icon ? renderSlot(_ctx.$slots, "icon", { key: 0 }) : createCommentVNode("", true)
          ]),
          createElementVNode("span", null, [
            unref(slots).title ? renderSlot(_ctx.$slots, "title", { key: 0 }) : createCommentVNode("", true)
          ]),
          createElementVNode("i", {
            class: normalizeClass([[unref(isOpen) && !unref(isTree) ? "layui-nav-mored" : ""], "layui-icon layui-icon-down layui-nav-more"])
          }, null, 2)
        ]),
        unref(isTree) ? (openBlock(), createBlock(unref(_sfc_main$1), {
          key: 0,
          enable: unref(isCollapseTransition)
        }, {
          default: withCtx(() => [
            unref(isOpen) ? (openBlock(), createElementBlock("div", _hoisted_2, [
              createElementVNode("dl", _hoisted_3, [
                renderSlot(_ctx.$slots, "default")
              ])
            ])) : createCommentVNode("", true)
          ]),
          _: 3
        }, 8, ["enable"])) : (openBlock(), createElementBlock("dl", {
          key: 1,
          ref_key: "subMenuRef",
          ref: subMenuRef,
          class: normalizeClass(["layui-nav-child layui-anim layui-anim-upbit", [{ "layui-show": unref(isOpen) }, position.value]])
        }, [
          renderSlot(_ctx.$slots, "default")
        ], 2))
      ]);
    };
  }
}));
_sfc_main.install = (app) => {
  app.component(_sfc_main.name, _sfc_main);
};
export { _sfc_main as default };