import { defineComponent, getCurrentInstance, computed, ref, watch, openBlock, createElementBlock, Fragment, createCommentVNode, createElementVNode, normalizeStyle, renderSlot, renderList, normalizeClass, createVNode, unref, toDisplayString } from 'vue';
import { MeSvgIcon } from '../../svg-icon/index.mjs';

"use strict";
const _hoisted_1 = ["onClick"];
const _hoisted_2 = { class: "item-content" };
const _hoisted_3 = { class: "space" };
const _hoisted_4 = { class: "label" };
const __default__ = defineComponent({
  name: "me-main-menu"
});
var script = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    data: { type: Array, required: true, default: () => [] },
    router: { type: Boolean, required: false },
    activeId: { type: String, required: false },
    width: { type: Number, required: false, default: 84 },
    bgImg: { type: String, required: false, default: "http://resource.mini-enjoy.com/web-admin/bg-image/0.jpg" },
    mode: { type: String, required: false, default: "vertical" },
    theme: { type: String, required: false },
    show: { type: [Boolean, Function], required: false, default: true },
    style: { type: Object, required: false }
  },
  emits: ["main-menu-click"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const instance = getCurrentInstance();
    const router = instance.appContext.config.globalProperties.$router;
    const menuStyle = computed(() => ({
      backgroundImage: `url(${props.bgImg})`,
      width: `${props.width}px`,
      ...props.style
    }));
    const isVisible = (item) => {
      return typeof props.show === "function" ? props.show(item) : props.show;
    };
    const activeId = ref(props.activeId);
    watch(
      () => props.activeId,
      (newId) => {
        activeId.value = newId;
      },
      { immediate: true }
    );
    const handleMenuClick = (item) => {
      if (!item.meta.dialogMenu) {
        activeId.value = item.id;
      }
      if (props.router && router) {
        if (item.meta.linkURL) {
          window.open(item.meta.linkURL, "_blank");
          emit("main-menu-click", item);
          return;
        }
        if (item.id !== props.activeId && item.meta.path) {
          router.push(item.meta.path);
        }
      }
      emit("main-menu-click", item);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock(
        Fragment,
        null,
        [
          createCommentVNode(" \u83DC\u5355\u5BB9\u5668 "),
          createElementVNode(
            "div",
            {
              class: "me-main-menu",
              style: normalizeStyle(menuStyle.value)
            },
            [
              createCommentVNode(" Logo \u63D2\u69FD "),
              renderSlot(_ctx.$slots, "logo"),
              createCommentVNode(" \u904D\u5386\u83DC\u5355\u9879 "),
              (openBlock(true), createElementBlock(
                Fragment,
                null,
                renderList(__props.data, (mainMenuItem) => {
                  return openBlock(), createElementBlock(
                    Fragment,
                    {
                      key: mainMenuItem.id
                    },
                    [
                      createCommentVNode(" \u5355\u4E2A\u83DC\u5355\u9879 "),
                      isVisible(mainMenuItem) ? (openBlock(), createElementBlock(
                        "div",
                        {
                          key: 0,
                          class: normalizeClass([{ divider: mainMenuItem.meta.divider }, "item-container"])
                        },
                        [
                          createElementVNode("div", {
                            class: normalizeClass([{ active: mainMenuItem.id == activeId.value }, "item"]),
                            onClick: ($event) => handleMenuClick(mainMenuItem)
                          }, [
                            createElementVNode("div", _hoisted_2, [
                              createCommentVNode(" \u83DC\u5355\u56FE\u6807 "),
                              createElementVNode("span", _hoisted_3, [
                                createVNode(unref(MeSvgIcon), {
                                  name: mainMenuItem.icon,
                                  color: "#fff"
                                }, null, 8, ["name"])
                              ]),
                              createCommentVNode(" \u83DC\u5355\u6807\u9898 "),
                              createElementVNode(
                                "span",
                                _hoisted_4,
                                toDisplayString(mainMenuItem.title),
                                1
                                /* TEXT */
                              )
                            ])
                          ], 10, _hoisted_1)
                        ],
                        2
                        /* CLASS */
                      )) : createCommentVNode("v-if", true)
                    ],
                    64
                    /* STABLE_FRAGMENT */
                  );
                }),
                128
                /* KEYED_FRAGMENT */
              ))
            ],
            4
            /* STYLE */
          )
        ],
        2112
        /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
      );
    };
  }
});

export { script as default };
//# sourceMappingURL=main-menu.vue2.mjs.map
