88 lines
13 KiB
JavaScript
88 lines
13 KiB
JavaScript
|
import { w as withInstall } from "../badge/index2.js";
|
||
|
|
import { defineComponent, computed, ref, watch, provide, openBlock, createElementBlock, normalizeClass, renderSlot } from "vue";
|
||
|
|
import { p as provideLevel } from "../useLevel/index.js";
|
||
|
|
var index = /* @__PURE__ */ (() => '.layui-dropdown{position:relative;display:inline-block}.layui-dropdown-content{position:absolute;z-index:99999;background-color:#fff;box-sizing:border-box;border:1px solid #e4e7ed;border-radius:2px;box-shadow:0 2px 12px #0000001a}.layui-dropdown-content>.layui-dropdown-menu{border-radius:var(--global-border-radius);margin:5px 0}.layui-dropdown-content .layui-menu{position:relative;background-color:#fff}.layui-dropdown-content .layui-menu li,.layui-dropdown-content .layui-menu-body-title a{padding:5px 15px}.layui-dropdown-content .layui-menu li{position:relative;display:flex;margin:1px 0;line-height:26px;color:#000c;font-size:14px;white-space:nowrap;cursor:pointer}.layui-dropdown-content .layui-menu li:hover{background-color:var(--global-neutral-color-2)}.layui-dropdown-content .layui-menu-body-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layui-dropdown-menu-prefix{margin-right:8px}.layui-dropdown-menu-suffix{margin-left:15px}.layui-dropdown-content .layui-menu li.layui-disabled:hover{background-color:inherit}.layui-popper{position:fixed;padding:10px;border-radius:3px;word-wrap:break-word;min-width:12px;min-height:12px;font-size:14px;box-sizing:border-box;box-shadow:0 2px 12px #00000026;background-color:#fff;color:#3a3a3a;border:1px solid #cecece;max-width:300px;z-index:99999}.layui-popper[position=top]{margin-bottom:6px}.layui-popper[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#cecece}.layui-popper[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#fff}.layui-popper[position=bottom]{margin-top:6px}.layui-popper[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#cecece}.layui-popper[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-color:#fff}.layui-popper[position=right]{margin-left:6px}.layui-popper[position=right] .layui-popper-arrow{left:-6px;border-left-width:0;border-right-color:#cecece}.layui-popper[position=right] .layui-popper-arrow:after{left:1px;border-left-width:0;margin-top:-6px;border-right-color:#fff}.layui-popper[position=left]{margin-right:6px}.layui-popper[position=left] .layui-popper-arrow{right:-6px;border-right-width:0;border-left-color:#cecece}.layui-popper[position=left] .layui-popper-arrow:after{right:1px;border-right-width:0;margin-top:-6px;border-left-color:#fff}.layui-popper[position=top] .layui-popper-arrow,.layui-popper[position=bottom] .layui-popper-arrow{left:-moz-calc(44%);left:-webkit-calc(44%);left:calc(50% - 6px)}.layui-popper[position=left] .layui-popper-arrow,.layui-popper[position=right] .layui-popper-arrow{top:-moz-calc(44%);top:-webkit-calc(44%);top:calc(50% - 6px)}.layui-popper:after{content:" ";position:absolute;display:block}.layui-popper[position=top]:after{bottom:-7px;left:0;width:100%;height:7px}.layui-popper[position=bottom]:after{top:-7px;left:0;width:100%;height:7px}.layui-popper[position=left]:after{right:-7px;bottom:0;height:100%;width:7px}.layui-popper[position=right]:after{left:-7px;bottom:0;height:100%;width:7px}.layui-popper .layui-popper-arrow,.layui-popper .layui-popper-arrow:after{position:absolute;display:block;width:0;height:0;border-width:6px;border-style:solid;border-color:transparent}.layui-popper .layui-popper-arrow:after{content:" "}.layui-popper.layui-dark{background-color:#353535;color:#fff;border:1px solid #353535}.layui-popper.layui-dark[position=top]{margin-bottom:6px}.layui-popper.layui-dark[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#353535}.layui-popper.layui-dark[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#353535}.layui-popper.layui-dark[position=bottom]{margin-top:6px}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#353535}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-
|
||
|
|
const __default__ = {
|
||
|
|
name: "LayMenu"
|
||
|
|
};
|
||
|
|
const _sfc_main = defineComponent({
|
||
|
|
...__default__,
|
||
|
|
props: {
|
||
|
|
selectedKey: { default: "" },
|
||
|
|
openKeys: { default: () => [] },
|
||
|
|
tree: { type: Boolean, default: false },
|
||
|
|
theme: { default: "dark" },
|
||
|
|
inverted: { type: [Boolean, String], default: false },
|
||
|
|
level: { type: [Boolean, String], default: true },
|
||
|
|
collapse: { type: [Boolean, String], default: false },
|
||
|
|
collapseTransition: { type: [Boolean, String], default: true },
|
||
|
|
indent: { type: [Boolean, String], default: false }
|
||
|
|
},
|
||
|
|
emits: [
|
||
|
|
"update:selectedKey",
|
||
|
|
"update:openKeys",
|
||
|
|
"changeSelectedKey",
|
||
|
|
"changeOpenKeys"
|
||
|
|
],
|
||
|
|
setup(__props, { emit }) {
|
||
|
|
const props = __props;
|
||
|
|
const isTree = computed(() => props.tree);
|
||
|
|
const isCollapse = computed(() => props.collapse);
|
||
|
|
const isCollapseTransition = computed(() => props.collapseTransition);
|
||
|
|
const oldOpenKeys = ref(props.openKeys);
|
||
|
|
const menuTheme = computed(() => props.theme);
|
||
|
|
const openKeys = computed({
|
||
|
|
get() {
|
||
|
|
return props.collapse ? [] : props.openKeys;
|
||
|
|
},
|
||
|
|
set(val) {
|
||
|
|
emit("update:openKeys", val);
|
||
|
|
emit("changeOpenKeys", val);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
const selectedKey = computed({
|
||
|
|
get() {
|
||
|
|
return props.selectedKey;
|
||
|
|
},
|
||
|
|
set(val) {
|
||
|
|
emit("update:selectedKey", val);
|
||
|
|
emit("changeSelectedKey", val);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
const indent = computed(() => {
|
||
|
|
return props.indent;
|
||
|
|
});
|
||
|
|
watch(() => props.collapse, () => {
|
||
|
|
if (props.collapse) {
|
||
|
|
oldOpenKeys.value = props.openKeys;
|
||
|
|
openKeys.value = [];
|
||
|
|
} else {
|
||
|
|
openKeys.value = oldOpenKeys.value;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
provideLevel(1);
|
||
|
|
provide("isTree", isTree);
|
||
|
|
provide("selectedKey", selectedKey);
|
||
|
|
provide("openKeys", openKeys);
|
||
|
|
provide("isCollapse", isCollapse);
|
||
|
|
provide("isCollapseTransition", isCollapseTransition);
|
||
|
|
provide("menuTheme", menuTheme);
|
||
|
|
provide("indent", indent);
|
||
|
|
return (_ctx, _cache) => {
|
||
|
|
return openBlock(), createElementBlock("ul", {
|
||
|
|
class: normalizeClass(["layui-nav", [
|
||
|
|
__props.level ? "" : "not-level",
|
||
|
|
__props.inverted ? "inverted" : "",
|
||
|
|
__props.tree ? "layui-nav-tree" : "",
|
||
|
|
__props.theme === "dark" ? "layui-nav-dark" : "layui-nav-light",
|
||
|
|
__props.collapse ? "layui-nav-collapse" : ""
|
||
|
|
]])
|
||
|
|
}, [
|
||
|
|
renderSlot(_ctx.$slots, "default")
|
||
|
|
], 2);
|
||
|
|
};
|
||
|
|
}
|
||
|
|
});
|
||
|
|
const component = withInstall(_sfc_main);
|
||
|
|
export { component as default };
|