This commit is contained in:
udf_admin@163.com
2020-05-04 13:37:14 +08:00
parent f3befd562f
commit b9bb9cecd2
39 changed files with 1609 additions and 52 deletions
+27 -30
View File
@@ -1,43 +1,40 @@
<template>
<div class="leftMenu">
<el-menu background-color="#F5F5F5">
<el-submenu index="1">
<template slot="title">
<i class="el-icon-location"></i>
<span>导航一</span>
</template>
<el-menu-item-group>
<template slot="title">分组一</template>
<el-menu-item index="1-1">选项1</el-menu-item>
<el-menu-item index="1-2">选项2</el-menu-item>
</el-menu-item-group>
<el-menu-item-group title="分组2">
<el-menu-item index="1-3">选项3</el-menu-item>
</el-menu-item-group>
<el-submenu index="1-4">
<template slot="title">选项4</template>
<el-menu-item index="1-4-1">选项1</el-menu-item>
</el-submenu>
</el-submenu>
<el-menu-item index="2">
<el-menu background-color="#F5F5F5" @select="leftMenuSelect">
<el-menu-item index="homeabc">
<i class="el-icon-menu"></i>
<span slot="title">导航二</span>
</el-menu-item>
<el-menu-item index="3" disabled>
<i class="el-icon-document"></i>
<span slot="title">导航三</span>
</el-menu-item>
<el-menu-item index="4">
<i class="el-icon-setting"></i>
<span slot="title">导航四</span>
<span slot="title">首页</span>
</el-menu-item>
<div v-if="data">
<left-menu-item :data="data"></left-menu-item>
</div>
</el-menu>
</div>
</template>
<script>
import leftMenuItem from "./leftMenuItem";
export default {
name: "leftMenu"
name: "leftMenu",
components: {
leftMenuItem
},
props: {
data: {
type: Array,
required: false,
default: () => []
}
},
methods: {
//菜单激活回调
leftMenuSelect(index, indexPath) {
if (this.$route.name !== index) {
this.$router.push({name: index});
}
}
}
}
</script>
+45
View File
@@ -0,0 +1,45 @@
<template>
<div class="leftMenuItem">
<!-- 菜单 -->
<div v-for="item of data" :key="item.code">
<el-submenu :index="item.code">
<template slot="title">
<i :class="item.className"></i>
<span>{{item.name}}</span>
</template>
<!-- 子菜单 -->
<div v-if="item.childMenus">
<left-menu-item :data="item.childMenus"></left-menu-item>
</div>
<!-- 子功能 -->
<div v-if="item.childFunctions">
<div v-for="item of item.childFunctions" :key="item.code">
<el-menu-item :index="item.code">
<template slot="title">
<span>{{item.name}}</span>
</template>
</el-menu-item>
</div>
</div>
</el-submenu>
</div>
</div>
</template>
<script>
export default {
name: "leftMenuItem",
props: {
data: {
type: Array,
required: false,
default: () => []
}
}
}
</script>
<style lang="scss" scoped>
</style>