@seemusic/ui-components
Version:
A Vue 3 UI Library. Uses Composable.
80 lines (79 loc) • 2.46 kB
JavaScript
import { defineComponent, computed, ref, createVNode, Fragment, nextTick } from "vue";
import { ElMenuItem, ElSubMenu } from "element-plus";
import { setMenuIndex } from "./SopTheSidebar.mjs";
import { useCustomRouter } from "../../composables/customRouter.mjs";
import { isURL } from "../../utils/reg.mjs";
const SidebarItem = /* @__PURE__ */ defineComponent({
name: "SidebarItem",
components: {
ElMenuItem,
ElSubMenu
},
props: {
item: {
type: Object,
required: true
},
index: {
type: String,
required: true
}
},
emits: ["click-menu-item"],
setup(props, {
emit
}) {
const {
router
} = useCustomRouter();
const item = computed(() => props.item);
const menuIndex = ref(props.index);
const disabled = computed(() => item.value.disabled !== void 0 ? item.value.disabled : false);
function menuClick(menuItem) {
var _a;
const index = menuItem.index;
emit("click-menu-item", index);
if (isURL(index)) {
nextTick(() => {
window.open(index, "_blank");
});
} else {
(_a = router.value) == null ? void 0 : _a.push(index);
menuIndex.value = index;
}
}
function renderMenu() {
if (!item.value.subMenu) {
return createVNode(ElMenuItem, {
"index": menuIndex.value,
"disabled": disabled.value,
"onClick": menuClick
}, {
default: () => [createVNode("div", {
"class": "menu-icon"
}, [item.value.icon && item.value.icon]), createVNode("span", null, [item.value.title])]
});
}
if (item.value.subMenu && item.value.subMenu.length) {
return createVNode(ElSubMenu, {
"index": `${menuIndex.value}`,
"disabled": disabled.value,
"popper-class": "sub-menu__popper"
}, {
title: () => createVNode(Fragment, null, [createVNode("div", {
"class": "menu-icon"
}, [item.value.icon]), createVNode("span", null, [item.value.title])]),
default: () => createVNode(Fragment, null, [item.value.subMenu && item.value.subMenu.map((i, idx) => createVNode(SidebarItem, {
"item": i,
"index": setMenuIndex(i, idx) || ""
}, null))])
});
}
}
return () => createVNode(Fragment, null, [renderMenu()]);
}
});
export {
SidebarItem
};
//# sourceMappingURL=SidebarItem.mjs.map