no message
Former-commit-id: 97588181639c43522d616322e4291756b508e54e Former-commit-id: aaf11f7e65ced4adee6ff85b5f93d39971e7f00e Former-commit-id: d9613ae962e9c304acb5de0d04ee2dd06c4210bf
This commit is contained in:
@@ -12,10 +12,10 @@
|
|||||||
<script>
|
<script>
|
||||||
import menus from '@/menu/index.js'
|
import menus from '@/menu/index.js'
|
||||||
export default {
|
export default {
|
||||||
name: 'd2-layout-main-header-menu',
|
name: 'd2-layout-main-menu-header',
|
||||||
components: {
|
components: {
|
||||||
'd2-menu-item': () => import('../d2-menu-item/index.vue'),
|
'd2-menu-item': () => import('../d2-menu-item/index.vue'),
|
||||||
'd2-sub-menu': () => import('../d2-sub-menu/index.vue')
|
'd2-menu-sub': () => import('../d2-menu-sub/index.vue')
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -0,0 +1,26 @@
|
|||||||
|
<template>
|
||||||
|
<el-menu
|
||||||
|
mode="horizontal"
|
||||||
|
:router="true">
|
||||||
|
<template v-for="(menu, menuIndex) in menus">
|
||||||
|
<d2-menu-item v-if="menu.children === undefined" :menu="menu" :key="menuIndex"/>
|
||||||
|
<d2-submenu v-else :menu="menu" :key="menuIndex"/>
|
||||||
|
</template>
|
||||||
|
</el-menu>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import menus from '@/menu/index.js'
|
||||||
|
export default {
|
||||||
|
name: 'd2-layout-main-menu-header',
|
||||||
|
components: {
|
||||||
|
'd2-menu-item': () => import('../-menu-item/index.vue'),
|
||||||
|
'd2-menu-sub': () => import('../-menu-sub/index.vue')
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
menus
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,48 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-menu
|
||||||
|
:collapse="collapse"
|
||||||
|
:unique-opened="true"
|
||||||
|
:router="true">
|
||||||
|
<template v-for="(menu, menuIndex) in menus">
|
||||||
|
<d2-menu-item v-if="menu.children === undefined" :menu="menu" :key="menuIndex"/>
|
||||||
|
<d2-submenu v-else :menu="menu" :key="menuIndex"/>
|
||||||
|
</template>
|
||||||
|
</el-menu>
|
||||||
|
<!-- <div v-if="sideMenu.filter(e => e.title).length === 0 && !collapse" class="d2-menu-side-empty">
|
||||||
|
没有菜单
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { side } from '@/menu/index.js'
|
||||||
|
export default {
|
||||||
|
name: 'd2-layout-main-menu-side',
|
||||||
|
props: {
|
||||||
|
collapse: {
|
||||||
|
type: Boolean,
|
||||||
|
required: false,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
'd2-menu-item': () => import('../-menu-item/index.vue'),
|
||||||
|
'd2-menu-sub': () => import('../-menu-sub/index.vue')
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
menus: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
'$route.matched': {
|
||||||
|
handler (val) {
|
||||||
|
const path = val[0].path
|
||||||
|
this.menus = side.filter(menu => menu.path === path)
|
||||||
|
},
|
||||||
|
immediate: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -13,7 +13,7 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: 'd2-sub-menu',
|
name: 'd2-menu-sub',
|
||||||
props: {
|
props: {
|
||||||
menu: {
|
menu: {
|
||||||
type: Object,
|
type: Object,
|
||||||
@@ -22,7 +22,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
'd2-menu-item': () => import('../d2-menu-item/index.vue')
|
'd2-menu-item': () => import('../-menu-item/index.vue')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -9,7 +9,7 @@
|
|||||||
<d2-submenu v-else :menu="menu" :key="menuIndex"/>
|
<d2-submenu v-else :menu="menu" :key="menuIndex"/>
|
||||||
</template>
|
</template>
|
||||||
</el-menu>
|
</el-menu>
|
||||||
<!-- <div v-if="sideMenu.filter(e => e.title).length === 0 && !collapse" class="d2-side-menu-empty">
|
<!-- <div v-if="sideMenu.filter(e => e.title).length === 0 && !collapse" class="d2-menu-side-empty">
|
||||||
没有菜单
|
没有菜单
|
||||||
</div> -->
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
@@ -18,7 +18,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import { side } from '@/menu/index.js'
|
import { side } from '@/menu/index.js'
|
||||||
export default {
|
export default {
|
||||||
name: 'd2-layout-main-side-menu',
|
name: 'd2-layout-main-menu-side',
|
||||||
props: {
|
props: {
|
||||||
collapse: {
|
collapse: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
@@ -28,7 +28,7 @@ export default {
|
|||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
'd2-menu-item': () => import('../d2-menu-item/index.vue'),
|
'd2-menu-item': () => import('../d2-menu-item/index.vue'),
|
||||||
'd2-sub-menu': () => import('../d2-sub-menu/index.vue')
|
'd2-menu-sub': () => import('../d2-menu-sub/index.vue')
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -9,14 +9,14 @@
|
|||||||
<div class="toggle-aside-btn" @click="collapse = !collapse">
|
<div class="toggle-aside-btn" @click="collapse = !collapse">
|
||||||
<d2-icon name="bars"/>
|
<d2-icon name="bars"/>
|
||||||
</div>
|
</div>
|
||||||
<d2-layout-main-header-menu/>
|
<d2-layout-main-menu-header/>
|
||||||
<d2-layout-main-header-right/>
|
<d2-layout-main-header-right/>
|
||||||
</el-header>
|
</el-header>
|
||||||
<!-- 下面 主体 -->
|
<!-- 下面 主体 -->
|
||||||
<el-container>
|
<el-container>
|
||||||
<!-- 主体 侧边栏 -->
|
<!-- 主体 侧边栏 -->
|
||||||
<el-aside :style="{width: collapse ? asideWidthCollapse : asideWidth}">
|
<el-aside :style="{width: collapse ? asideWidthCollapse : asideWidth}">
|
||||||
<d2-layout-main-side-menu :collapse="collapse"/>
|
<d2-layout-main-menu-side :collapse="collapse"/>
|
||||||
</el-aside>
|
</el-aside>
|
||||||
<!-- 主体 -->
|
<!-- 主体 -->
|
||||||
<el-main>
|
<el-main>
|
||||||
@@ -32,8 +32,8 @@
|
|||||||
export default {
|
export default {
|
||||||
name: 'd2-layout-main',
|
name: 'd2-layout-main',
|
||||||
components: {
|
components: {
|
||||||
'd2-layout-main-side-menu': () => import('./components/side-menu'),
|
'd2-layout-main-menu-side': () => import('./components/-menu-side'),
|
||||||
'd2-layout-main-header-menu': () => import('./components/-header-menu'),
|
'd2-layout-main-menu-header': () => import('./components/-menu-header'),
|
||||||
'd2-layout-main-header-right': () => import('./components/-header-right')
|
'd2-layout-main-header-right': () => import('./components/-header-right')
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
|
|||||||
Reference in New Issue
Block a user