xiaoyu
159 lines
4.3 KiB
JavaScript
159 lines
4.3 KiB
JavaScript
import { isExternalLink } from "../../utils/core";
|
|
const proMenus = {
|
|
name: "ProMenus",
|
|
props: {
|
|
data: Array,
|
|
active: String,
|
|
collapse: Boolean,
|
|
uniqueOpen: Boolean,
|
|
defaultOpeneds: Array,
|
|
themeClass: String,
|
|
popClass: String,
|
|
firstPopClass: String,
|
|
withTooltip: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
tooltipDisabled: Boolean,
|
|
popperAppendToBody: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
titleSlot: {
|
|
type: String,
|
|
default: "title"
|
|
},
|
|
iconSlot: {
|
|
type: String,
|
|
default: "icon"
|
|
},
|
|
mode: String
|
|
},
|
|
emits: ["open", "close"],
|
|
render(h) {
|
|
var _a;
|
|
const renderItems = (data, popupClassName, withTooltip) => {
|
|
const nodes = [];
|
|
data == null ? void 0 : data.forEach((item) => {
|
|
var _a2, _b;
|
|
if ((_a2 = item.meta) == null ? void 0 : _a2.hide) {
|
|
return;
|
|
}
|
|
const titleNodes = (() => {
|
|
var _a3, _b2, _c;
|
|
const temp = [];
|
|
if ((_a3 = item.meta) == null ? void 0 : _a3.icon) {
|
|
const iconSlot = this.$scopedSlots[this.iconSlot];
|
|
if (typeof iconSlot === "function") {
|
|
temp.push(iconSlot({ icon: item.meta.icon, item }));
|
|
} else {
|
|
temp.push(h("i", { class: item.meta.icon }));
|
|
}
|
|
}
|
|
const titleSlot = this.$scopedSlots[this.titleSlot];
|
|
if (typeof titleSlot === "function") {
|
|
temp.push(titleSlot({ title: (_b2 = item.meta) == null ? void 0 : _b2.title, item }));
|
|
} else {
|
|
temp.push(h("span", {}, (_c = item.meta) == null ? void 0 : _c.title));
|
|
}
|
|
return temp;
|
|
})();
|
|
if (!((_b = item.children) == null ? void 0 : _b.some((d) => {
|
|
var _a3;
|
|
return !((_a3 = d.meta) == null ? void 0 : _a3.hide);
|
|
}))) {
|
|
const content = (() => {
|
|
var _a3;
|
|
const temp = (() => {
|
|
if (isExternalLink(item.path)) {
|
|
return h(
|
|
"a",
|
|
{
|
|
attrs: { href: item.path, target: "_blank" },
|
|
on: { click: (e) => e.stopPropagation() }
|
|
},
|
|
titleNodes
|
|
);
|
|
}
|
|
return h("router-link", { props: { to: item.path } }, titleNodes);
|
|
})();
|
|
if (withTooltip) {
|
|
return h(
|
|
"el-tooltip",
|
|
{
|
|
props: {
|
|
placement: "right",
|
|
content: (_a3 = item.meta) == null ? void 0 : _a3.title,
|
|
disabled: this.tooltipDisabled || !this.collapse
|
|
}
|
|
},
|
|
[temp]
|
|
);
|
|
}
|
|
return temp;
|
|
})();
|
|
nodes.push(
|
|
h(
|
|
"el-menu-item",
|
|
{
|
|
key: item.path,
|
|
props: { index: item.path }
|
|
},
|
|
[content]
|
|
)
|
|
);
|
|
return;
|
|
}
|
|
nodes.push(
|
|
h(
|
|
"el-submenu",
|
|
{
|
|
key: item.path,
|
|
props: {
|
|
index: item.path,
|
|
popperClass: popupClassName,
|
|
popperAppendToBody: this.popperAppendToBody
|
|
}
|
|
},
|
|
[
|
|
h("template", { slot: "title" }, titleNodes),
|
|
...renderItems(item.children, this.popClass, false)
|
|
]
|
|
)
|
|
);
|
|
});
|
|
return nodes;
|
|
};
|
|
return h(
|
|
"el-menu",
|
|
{
|
|
class: this.themeClass,
|
|
props: {
|
|
mode: this.mode,
|
|
collapse: this.collapse,
|
|
defaultActive: this.active,
|
|
uniqueOpened: this.uniqueOpen,
|
|
defaultOpeneds: this.defaultOpeneds,
|
|
collapseTransition: false
|
|
},
|
|
on: {
|
|
open: (index, indexPath) => {
|
|
this.$emit("open", index, indexPath);
|
|
},
|
|
close: (index, indexPath) => {
|
|
this.$emit("close", index, indexPath);
|
|
}
|
|
}
|
|
},
|
|
renderItems(
|
|
this.data,
|
|
(_a = this.firstPopClass) != null ? _a : this.popClass,
|
|
this.withTooltip
|
|
)
|
|
);
|
|
}
|
|
};
|
|
export {
|
|
proMenus as default
|
|
};
|