@wetspace/pro-components
Version:
::: tip 基本介绍
179 lines (178 loc) • 6.41 kB
JavaScript
import { defineComponent as R, useSlots as b, shallowRef as N, computed as _, watch as W, openBlock as a, createBlock as c, unref as e, normalizeClass as d, normalizeStyle as A, withCtx as u, createVNode as i, renderSlot as r, createElementBlock as p, toDisplayString as h, createElementVNode as f, createCommentVNode as v } from "vue";
import { useNamespace as V, ElContainer as g, ElAside as $, ElHeader as k, ElButton as F, ElIcon as D, ElBacktop as H, ElMain as I, ElFooter as L } from "element-plus";
import { SwitchButton as P, Fold as j, Expand as q } from "../../node_modules/.pnpm/@element-plus_icons-vue@2.3.1_vue@3.5.12_typescript@5.4.2_/node_modules/@element-plus/icons-vue/dist/index.mjs";
import G from "./xmenu.vue.mjs";
import J from "./ymenu.vue.mjs";
import K from "./person.vue.mjs";
import { proLayoutProps as O } from "./types.mjs";
const Q = { key: 0 }, T = { key: 1 }, U = { class: "ymenu-wrapper" }, X = { key: 0 }, Y = { key: 1 }, Z = { class: "header-menus-wrapper" }, ee = { style: { flex: "1" } }, se = { class: "header-tools-wrapper" }, le = { style: { "margin-right": "20px" } }, re = /* @__PURE__ */ R({
__name: "index",
props: O,
emits: ["logout", "menuClick"],
setup(E, { emit: w }) {
const t = V("pro-layout"), z = b(), l = E, y = w, o = N(!1), S = _(() => [
{
label: "退出登录",
icon: P,
action() {
y("logout");
}
},
...(l.avatarActions || []).map((s) => ({
...s,
iconSrc: typeof s.icon == "string" ? s.icon : ""
}))
]), m = _(() => ({
...{
iconSize: 16,
menus: []
},
...l.headerMenus
})), n = _(() => ({
...{
iconSize: 16,
menus: [],
isCollapse: !1,
maxWidth: 300,
minWidth: 84
},
...l.asideMenus
})), B = _(() => {
var s;
return (s = l.asideMenus) == null ? void 0 : s.isCollapse;
});
W(B, (s) => {
o.value = !!s;
}, {
immediate: !0,
deep: !0
});
const M = () => {
o.value = !o.value;
}, x = (s) => {
y("menuClick", s);
};
return (s, ae) => (a(), c(e(g), {
class: d([e(t).b()]),
style: A({
"--wet-pro-layout-aside-width": o.value ? `${n.value.minWidth}px` : `${n.value.maxWidth}px`
})
}, {
default: u(() => [
i(e($), {
class: d([e(t).e("aside"), e(t).is("fixed", n.value.fixed), l.asideClass])
}, {
default: u(() => [
i(e(k), {
class: d([e(t).e("logo")])
}, {
default: u(() => [
r(s.$slots, "logo", { collapse: o.value }, () => [
o.value ? (a(), p("h1", T, h(l.title[0]), 1)) : (a(), p("h1", Q, h(l.title), 1))
])
]),
_: 3
}, 8, ["class"]),
f("div", U, [
i(J, {
"icon-size": n.value.iconSize,
"is-collapse": o.value,
active: n.value.active,
menus: n.value.menus,
onMenuClick: x
}, null, 8, ["icon-size", "is-collapse", "active", "menus"])
]),
f("div", null, [
r(s.$slots, "aside-tools")
])
]),
_: 3
}, 8, ["class"]),
n.value.fixed ? (a(), c(e($), {
key: 0,
class: d([e(t).e("aside"), l.asideClass])
}, null, 8, ["class"])) : v("", !0),
i(e(g), null, {
default: u(() => [
i(e(k), {
class: d([e(t).e("header"), e(t).is("fixed", m.value.fixed), e(t).is("aside-fixed", n.value.fixed), l.headerClass])
}, {
default: u(() => {
var C;
return [
!n.value.fixed && m.value.fixed ? (a(), p("div", {
key: 0,
class: d([e(t).e("logo")])
}, [
r(s.$slots, "logo", { collapse: o.value }, () => [
o.value ? (a(), p("h1", Y, h(l.title[0]), 1)) : (a(), p("h1", X, h(l.title), 1))
])
], 2)) : v("", !0),
i(e(F), {
link: "",
style: { "margin-left": "20px" },
onClick: M
}, {
default: u(() => [
i(e(D), null, {
default: u(() => [
o.value ? (a(), c(e(q), { key: 1 })) : (a(), c(e(j), { key: 0 }))
]),
_: 1
})
]),
_: 1
}),
f("div", Z, [
f("div", ee, [
r(s.$slots, "header", {}, () => [
i(G, {
active: m.value.active,
"icon-size": m.value.iconSize,
menus: m.value.menus,
onMenuClick: x
}, null, 8, ["active", "icon-size", "menus"])
])
]),
f("div", se, [
l.backtop ? (a(), c(e(H), { key: 0 })) : v("", !0),
r(s.$slots, "header-tools")
])
]),
f("div", le, [
i(K, {
nickname: (C = l.avatar) == null ? void 0 : C.nickname,
"more-actions": S.value
}, null, 8, ["nickname", "more-actions"])
])
];
}),
_: 3
}, 8, ["class"]),
m.value.fixed ? (a(), c(e(k), {
key: 0,
class: d([e(t).e("header")])
}, null, 8, ["class"])) : v("", !0),
i(e(I), { style: { padding: "0" } }, {
default: u(() => [
r(s.$slots, "default")
]),
_: 3
}),
e(z).footer ? (a(), c(e(L), { key: 1 }, {
default: u(() => [
r(s.$slots, "footer")
]),
_: 3
})) : v("", !0)
]),
_: 3
})
]),
_: 3
}, 8, ["class", "style"]));
}
});
export {
re as default
};