Commit 343eecbc authored by tyn's avatar tyn

bug fix ,菜单默认打开二级目录

parent a8e212cd
......@@ -158,7 +158,7 @@ export default {
menuDetails:{},
menuOptions: {
nodeName: "menuName",
nodeValue: "menuName",
nodeValue: "menuId",
children : "childrenList"
},
detailsId:'',
......
......@@ -15,7 +15,7 @@
</div>
</template>
<!-- 子集递归 -->
<project-menu-item v-for="(child,index) of menuItem.children" :menuItem="child" :key="child.nodeValue"></project-menu-item>
<project-menu-item v-for="(child,index) of menuItem.children" :menuItem="child" :key="`${child.nodeValue}-${child.level}`"></project-menu-item>
</el-submenu>
</template>
<!-- 无子集菜单 -->
......
<template>
<div class="project-side-menu-container">
<el-menu mode="vertical" class="project-side-menu-instance" :unique-opened="uniqueOpened" :default-active="createMenuIndex(comDefaultActive)"
@select="menuSelect" @open="subMenuOpen" @close="subMenuClose" ref="customElMenu">
:default-openeds="comDefaultOpeneds" @select="menuSelect" @open="subMenuOpen" @close="subMenuClose" ref="customElMenu">
<template v-for="(item,index) of tempMenuTree">
<project-menu-item :menuItem="item" :key="item.nodeValue">
<project-menu-item :menuItem="item" :key="`${item.nodeValue}-${item.level}`">
<template :slot="`${item.nodeName}-${item.level}`" slot-scope="scope">
<slot :name="`${scope.data.nodeName}-${scope.data.level}`" :data="scope.data"></slot>
</template>
......@@ -46,6 +46,11 @@ export default {
defaultActive: {
type: [String, Number],
default: ""
},
// 默认展开的二级菜单
defaultOpeneds: {
type: Array,
default: () => []
}
},
watch: {
......@@ -61,6 +66,11 @@ export default {
handler(newValue) {
this.comDefaultActive = newValue;
}
},
defaultOpeneds: {
handler(newValue) {
this.comDefaultOpeneds = newValue ? newValue : [];
}
}
},
data() {
......@@ -75,12 +85,13 @@ export default {
tempMenuOptions: {},
tempMenuTree: [],
comMenuTree: this.menuTree,
comDefaultActive: this.defaultActive
comDefaultActive: this.defaultActive,
comDefaultOpeneds: this.defaultOpeneds
};
},
//可访问data属性
created() {
this.openTargetAllSubMenu(this.comDefaultOpeneds);
},
//计算集
computed: {
......@@ -91,8 +102,33 @@ export default {
//方法集
methods: {
// 展开所有指定层级的菜单 默认二级
openTargetAllSubMenu() {
openTargetAllSubMenu(openeds = [], level = 2) {
// 组件外传入了值 使用传入值,否则默认获取二级菜单打开二级
if (openeds instanceof Array && openeds.length) {
// 转换为字符串
this.comDefaultOpeneds = openeds.map(item => this.createMenuIndex(item));
} else {
// 递归查找当前二级目录index
const _tempTree = this.tempMenuTree;
const result = this.findTargetLevelIndex(_tempTree, 2, []);
this.comDefaultOpeneds = result;
}
},
findTargetLevelIndex(data = [], level = 2, result = []) {
if (data.length) {
for (const item of data) {
// level大于传入level直接跳出循环
if (item.level > level) break;
// 确保打开菜单为目录
if (item.level <= level && item.children instanceof Array) {
result.push(item.nodeValue);
}
if (item.children instanceof Array && item.children.length) {
this.findTargetLevelIndex(item.children, level, result);
}
}
}
return result.map(item => this.createMenuIndex(item));
},
// 事件订阅
subMenuOpen(menuPath, menuPathArray) {
......@@ -130,7 +166,7 @@ export default {
return null;
},
// 初始化树形结构
initMenuTree(array = []) {
async initMenuTree(array = []) {
if (array?.length) {
// 合并默认配置
const _options = this.mergeMenuOptions(JSON.parse(JSON.stringify(this.menuOptions)));
......@@ -139,6 +175,8 @@ export default {
const resultData = this.mapDataByMenuOptions(JSON.parse(JSON.stringify(this.comMenuTree)), _options);
if (resultData) {
this.tempMenuTree = resultData;
await this.$nextTick();
this.openTargetAllSubMenu(this.comDefaultOpeneds);
}
}
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment