theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨(component): update

Browse Source
This commit is contained in:
就眠儀式 2022-10-18 09:19:56 +08:00
parent eb51083a27
commit 45a8d62ffb
2 changed files with 8 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
package/component/src/component/menuItem/index.vue
View File

@ -44,8 +44,7 @@ const needTooltip = computed(
<template> <template>
<li <li
class="layui-nav-item" :class="['layui-nav-item', { 'layui-this': selectedKey === id }]"
:class="[selectedKey === id ? 'layui-this' : '']"
:style="indentHandle({ indent, level, isTree })" :style="indentHandle({ indent, level, isTree })"
@click="selectHandle()" @click="selectHandle()"
> >

23
package/component/src/component/subMenu/SubMenuPopup.vue
View File

@ -5,26 +5,22 @@ export default {
</script> </script>
<script setup lang="ts"> <script setup lang="ts">
import { computed, inject, Ref, useSlots } from "vue"; import { computed, inject, Ref } from "vue";
import LayDropdown from "../dropdown/index.vue"; import LayDropdown from "../dropdown/index.vue";
import { LayIcon } from "@layui/icons-vue"; import { LayIcon } from "@layui/icons-vue";
import useLevel from "../menu/useLevel"; import useLevel from "../menu/useLevel";
export interface LaySubMenuPopupProps { export interface SubMenuPopupProps {
id: string; id: string;
title?: string; title?: string;
} }
const props = defineProps<LaySubMenuPopupProps>();
const props = defineProps<SubMenuPopupProps>();
const { level } = useLevel(); const { level } = useLevel();
const isTree: Ref<boolean> = inject("isTree") as Ref<boolean>; const isTree: Ref<boolean> = inject("isTree") as Ref<boolean>;
const openKeys: Ref<string[]> = inject("openKeys") as Ref<string[]>;
const theme = inject("menuTheme") as Ref<string>; const theme = inject("menuTheme") as Ref<string>;
const isOpen = computed(() => {
return openKeys.value.includes(props.id);
});
const computedTheme = computed(() => { const computedTheme = computed(() => {
return theme.value === "light" ? "-light" : ""; return theme.value === "light" ? "-light" : "";
}); });
@ -42,27 +38,22 @@ const computedPlacement = computed(() => {
<template> <template>
<lay-dropdown <lay-dropdown
trigger="hover" trigger="hover"
class="layui-sub-menu-popup"
:placement="computedPlacement" :placement="computedPlacement"
:autoFitMinWidth="false" :autoFitMinWidth="false"
:updateAtScroll="true"
:contentOffset="3" :contentOffset="3"
updateAtScroll
class="layui-sub-menu-popup"
> >
<li :class="['layui-nav-item']"> <li class="layui-nav-item">
<a href="javascript:void(0)" style="justify-content: space-between"> <a href="javascript:void(0)" style="justify-content: space-between">
<div> <div>
<!-- 图标 -->
<i v-if="$slots.icon" class="layui-sub-menu-icon"> <i v-if="$slots.icon" class="layui-sub-menu-icon">
<slot name="icon"></slot> <slot name="icon"></slot>
</i> </i>
<!-- 标题 -->
<span v-if="$slots.title"> <span v-if="$slots.title">
<slot name="title"></slot> <slot name="title"></slot>
</span> </span>
</div> </div>
<!-- 扩展 -->
<span v-if="$slots.expandIcon" class="layui-nav-more"> <span v-if="$slots.expandIcon" class="layui-nav-more">
<slot name="expandIcon"> <slot name="expandIcon">
<lay-icon :type="computedExpandIcon" /> <lay-icon :type="computedExpandIcon" />