2018-07-17 22:49:13 +08:00
|
|
|
import { mapState } from 'vuex'
|
2018-07-16 22:22:55 +08:00
|
|
|
import menuMixin from '../mixin/menu'
|
2020-06-08 14:55:14 +08:00
|
|
|
import { createMenu } from '../libs/util.menu'
|
2019-08-04 15:36:25 +08:00
|
|
|
|
2018-07-16 22:22:55 +08:00
|
|
|
export default {
|
2018-07-17 21:54:38 +08:00
|
|
|
name: 'd2-layout-header-aside-menu-side',
|
2018-07-16 22:22:55 +08:00
|
|
|
mixins: [
|
|
|
|
|
menuMixin
|
|
|
|
|
],
|
2020-04-21 15:52:37 +08:00
|
|
|
render (h) {
|
2020-06-08 14:55:14 +08:00
|
|
|
return <div class="d2-layout-header-aside-menu-side">
|
2020-11-24 08:58:46 +08:00
|
|
|
<d2-scrollbar>
|
|
|
|
|
<el-menu
|
|
|
|
|
collapse={ this.asideCollapse }
|
|
|
|
|
collapseTransition={ this.asideTransition }
|
|
|
|
|
uniqueOpened={ true }
|
|
|
|
|
defaultActive={ this.$route.fullPath }
|
|
|
|
|
ref="menu"
|
|
|
|
|
onSelect={ this.handleMenuSelect }>
|
|
|
|
|
{ this.aside.map(menu => createMenu.call(this, h, menu)) }
|
|
|
|
|
</el-menu>
|
|
|
|
|
{
|
|
|
|
|
this.aside.length === 0 && !this.asideCollapse
|
|
|
|
|
? <div class="d2-layout-header-aside-menu-empty" flex="dir:top main:center cross:center">
|
|
|
|
|
<d2-icon name="inbox"/>
|
|
|
|
|
<span>没有侧栏菜单</span>
|
|
|
|
|
</div>
|
|
|
|
|
: null
|
|
|
|
|
}
|
|
|
|
|
</d2-scrollbar>
|
2020-06-08 14:55:14 +08:00
|
|
|
</div>
|
2018-07-16 22:22:55 +08:00
|
|
|
},
|
2018-07-17 22:49:13 +08:00
|
|
|
computed: {
|
2018-08-08 16:04:10 +08:00
|
|
|
...mapState('d2admin/menu', [
|
|
|
|
|
'aside',
|
2020-04-23 11:00:49 +08:00
|
|
|
'asideCollapse',
|
|
|
|
|
'asideTransition'
|
2018-08-08 09:19:11 +08:00
|
|
|
])
|
2018-07-16 22:22:55 +08:00
|
|
|
}
|
|
|
|
|
}
|