更新依赖和版本
Former-commit-id: 5072ec87feb8745621004a198310faee62e6281c [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2] [formerly 5072ec87feb8745621004a198310faee62e6281c [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2] [formerly 5072ec87feb8745621004a198310faee62e6281c [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2] [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2 [formerly c3846e5df93218e15f02a646518880e6fa6cb0f9 [formerly 3bd4f9d9418df3df44f368bb2ae32652c69c013f]]]]] Former-commit-id: bd93fcb5e4675bbf18fd417d5288245f6088b538 Former-commit-id: 12ad7aefef66bd20c5d0d6224cdfa283142cbefc Former-commit-id: 0f4dee0a6517e1f77af70100ba450ae8f988307a [formerly 4d96d09f6d76a67c4fc4386efe6f51c1707f9d99] Former-commit-id: edb1f8cd9ce546d41873b5601fbe390fc7f43521 Former-commit-id: af996ea474ed1ae6d51068dcccbdc3cc29cea56d Former-commit-id: efb029f9cf3e2c9dcff8d48e4c53334d8b353fc7 Former-commit-id: 6f5b77ea91dc0259a6610cc9d3aa77f8e9724fcd Former-commit-id: e83e0ac4a63e9c6f5e7c6ccd66909badea6ae8ef
This commit is contained in:
parent
6fe6a1e9ec
commit
35441ffd44
|
|
@ -1 +1 @@
|
|||
75cce2a7e7e6a79b8b81a09d6028160238f7d647
|
||||
0ec40645fbaa948452267003c25548620961d85e
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "d2-admin",
|
||||
"version": "1.7.1",
|
||||
"version": "1.7.2",
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve --open",
|
||||
"build": "vue-cli-service build",
|
||||
|
|
|
|||
|
|
@ -1,27 +0,0 @@
|
|||
<template>
|
||||
<el-menu-item :index="menu.path || uniqueId">
|
||||
<i v-if="menu.icon" :class="`fa fa-${menu.icon}`"></i>
|
||||
<i v-if="menu.icon === undefined & !menu.iconSvg" class="fa fa-file-o"></i>
|
||||
<d2-icon-svg v-if="menu.iconSvg" :name="menu.iconSvg"/>
|
||||
<span slot="title">{{menu.title || $t('layout.header-aside.menu-item.label-default')}}</span>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { uniqueId } from 'lodash'
|
||||
export default {
|
||||
name: 'd2-layout-header-aside-menu-item',
|
||||
props: {
|
||||
menu: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: () => {}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
uniqueId: uniqueId('d2-menu-empty-')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
<template>
|
||||
<el-submenu :index="menu.path || uniqueId">
|
||||
<template slot="title">
|
||||
<i v-if="menu.icon" :class="`fa fa-${menu.icon}`"></i>
|
||||
<i v-if="menu.icon === undefined & !menu.iconSvg" class="fa fa-folder-o"></i>
|
||||
<d2-icon-svg v-if="menu.iconSvg" :name="menu.iconSvg"/>
|
||||
<span>{{menu.title}}</span>
|
||||
</template>
|
||||
<template v-for="(child, childIndex) in menu.children">
|
||||
<d2-layout-header-aside-menu-item v-if="child.children === undefined" :menu="child" :key="childIndex"/>
|
||||
<d2-layout-header-aside-menu-sub v-else :menu="child" :key="childIndex"/>
|
||||
</template>
|
||||
</el-submenu>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { uniqueId } from 'lodash'
|
||||
// 组件
|
||||
import d2LayoutMainMenuItem from '../menu-item'
|
||||
|
||||
export default {
|
||||
name: 'd2-layout-header-aside-menu-sub',
|
||||
components: {
|
||||
'd2-layout-header-aside-menu-item': d2LayoutMainMenuItem
|
||||
},
|
||||
props: {
|
||||
menu: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: () => {}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
uniqueId: uniqueId('d2-menu-empty-')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
import { uniqueId } from 'lodash'
|
||||
|
||||
// 创建 el-menu-item
|
||||
export function elMenuItem (createElement, menu) {
|
||||
return createElement('el-menu-item', { props: { index: menu.path || uniqueId('d2-menu-empty-') } }, [
|
||||
...menu.icon ? [
|
||||
createElement('i', { attrs: { class: `fa fa-${menu.icon}` } })
|
||||
] : [],
|
||||
...menu.icon === undefined & !menu.iconSvg ? [
|
||||
createElement('i', { attrs: { class: 'fa fa-file-o' } })
|
||||
] : [],
|
||||
...menu.iconSvg ? [
|
||||
createElement('d2-icon-svg', { props: { name: menu.iconSvg } })
|
||||
] : [],
|
||||
createElement('span', { slot: 'title' }, menu.title || this.$t('layout.header-aside.menu-item.label-default'))
|
||||
])
|
||||
}
|
||||
|
||||
// 创建 el-submenu
|
||||
export function elSubmenu (createElement, menu) {
|
||||
return createElement('el-submenu', { props: { index: menu.path || uniqueId('d2-menu-empty-') } }, [
|
||||
...menu.icon ? [
|
||||
createElement('i', { slot: 'title', attrs: { class: `fa fa-${menu.icon}` } })
|
||||
] : [],
|
||||
...menu.icon === undefined & !menu.iconSvg ? [
|
||||
createElement('i', { slot: 'title', attrs: { class: 'fa fa-file-o' } })
|
||||
] : [],
|
||||
...menu.iconSvg ? [
|
||||
createElement('d2-icon-svg', { slot: 'title', props: { name: menu.iconSvg } })
|
||||
] : [],
|
||||
createElement('span', { slot: 'title' }, menu.title || this.$t('layout.header-aside.menu-item.label-default')),
|
||||
...menu.children.map((child, childIndex) => (child.children === undefined ? elMenuItem : elSubmenu).call(this, createElement, child))
|
||||
])
|
||||
}
|
||||
|
|
@ -1,9 +1,8 @@
|
|||
<script>
|
||||
import { throttle } from 'lodash'
|
||||
import { mapState } from 'vuex'
|
||||
import menuMixin from '../mixin/menu'
|
||||
import d2LayoutMainMenuItem from '../components/menu-item/index.vue'
|
||||
import d2LayoutMainMenuSub from '../components/menu-sub/index.vue'
|
||||
import { elMenuItem, elSubmenu } from '../libs/util.menu'
|
||||
|
||||
export default {
|
||||
name: 'd2-layout-header-aside-menu-header',
|
||||
mixins: [
|
||||
|
|
@ -12,71 +11,40 @@ export default {
|
|||
render (createElement) {
|
||||
return createElement('div', {
|
||||
attrs: { flex: 'cross:center' },
|
||||
class: {
|
||||
'd2-theme-header-menu': true,
|
||||
'is-scrollable': this.isScroll
|
||||
},
|
||||
class: { 'd2-theme-header-menu': true, 'is-scrollable': this.isScroll },
|
||||
ref: 'page'
|
||||
}, [
|
||||
createElement('div', {
|
||||
attrs: {
|
||||
class: 'd2-theme-header-menu__content',
|
||||
flex: '',
|
||||
'flex-box': '1'
|
||||
},
|
||||
attrs: { class: 'd2-theme-header-menu__content', flex: '', 'flex-box': '1' },
|
||||
ref: 'content'
|
||||
}, [
|
||||
createElement('div', {
|
||||
attrs: {
|
||||
class: 'd2-theme-header-menu__scroll',
|
||||
'flex-box': '0'
|
||||
},
|
||||
attrs: { class: 'd2-theme-header-menu__scroll', 'flex-box': '0' },
|
||||
style: { transform: `translateX(${this.currentTranslateX}px)` },
|
||||
ref: 'scroll'
|
||||
}, [
|
||||
createElement('el-menu', {
|
||||
props: {
|
||||
mode: 'horizontal',
|
||||
defaultActive: this.active
|
||||
},
|
||||
props: { mode: 'horizontal', defaultActive: this.active },
|
||||
on: { select: this.handleMenuSelect }
|
||||
}, this.header.map(menu => {
|
||||
if (menu.children === undefined) {
|
||||
return createElement('d2-layout-header-aside-menu-item', { props: { menu } })
|
||||
} else {
|
||||
return createElement('d2-layout-header-aside-menu-sub', { props: { menu } })
|
||||
}
|
||||
}))
|
||||
}, this.header.map(menu => (menu.children === undefined ? elMenuItem : elSubmenu).call(this, createElement, menu)))
|
||||
])
|
||||
]),
|
||||
...this.isScroll ? [
|
||||
createElement('div', {
|
||||
attrs: {
|
||||
class: 'd2-theme-header-menu__prev',
|
||||
flex: 'main:center cross:center',
|
||||
'flex-box': '0'
|
||||
},
|
||||
attrs: { class: 'd2-theme-header-menu__prev', flex: 'main:center cross:center', 'flex-box': '0' },
|
||||
on: { click: () => this.scroll('left') }
|
||||
}, [
|
||||
createElement('i', { attrs: { class: 'el-icon-arrow-left' } })
|
||||
]),
|
||||
createElement('div', {
|
||||
attrs: {
|
||||
class: 'd2-theme-header-menu__next',
|
||||
flex: 'main:center cross:center',
|
||||
'flex-box': '0'
|
||||
},
|
||||
attrs: { class: 'd2-theme-header-menu__next', flex: 'main:center cross:center', 'flex-box': '0' },
|
||||
on: { click: () => this.scroll('right') }
|
||||
}, [
|
||||
createElement('i', { attrs: { class: 'el-icon-arrow-right' } })
|
||||
]),
|
||||
])
|
||||
] : []
|
||||
])
|
||||
},
|
||||
components: {
|
||||
'd2-layout-header-aside-menu-item': d2LayoutMainMenuItem,
|
||||
'd2-layout-header-aside-menu-sub': d2LayoutMainMenuSub
|
||||
},
|
||||
computed: {
|
||||
...mapState('d2admin/menu', [
|
||||
'header'
|
||||
|
|
@ -163,4 +131,3 @@ export default {
|
|||
window.removeEventListener('load', this.checkScroll)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,37 +1,27 @@
|
|||
<template>
|
||||
<div class="d2-layout-header-aside-menu-side">
|
||||
<el-menu
|
||||
:collapse="asideCollapse"
|
||||
:unique-opened="true"
|
||||
:default-active="active"
|
||||
ref="menu"
|
||||
@select="handleMenuSelect">
|
||||
<template v-for="(menu, menuIndex) in aside">
|
||||
<d2-layout-header-aside-menu-item v-if="menu.children === undefined" :menu="menu" :key="menuIndex"/>
|
||||
<d2-layout-header-aside-menu-sub v-else :menu="menu" :key="menuIndex"/>
|
||||
</template>
|
||||
</el-menu>
|
||||
<div v-if="aside.length === 0 && !asideCollapse" class="d2-layout-header-aside-menu-empty" flex="dir:top main:center cross:center">
|
||||
<d2-icon name="inbox"/>
|
||||
<span>{{ $t('layout.header-aside.menu-side.empty') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
import menuMixin from '../mixin/menu'
|
||||
import d2LayoutMainMenuItem from '../components/menu-item/index.vue'
|
||||
import d2LayoutMainMenuSub from '../components/menu-sub/index.vue'
|
||||
import { elMenuItem, elSubmenu } from '../libs/util.menu'
|
||||
import BScroll from 'better-scroll'
|
||||
|
||||
export default {
|
||||
name: 'd2-layout-header-aside-menu-side',
|
||||
mixins: [
|
||||
menuMixin
|
||||
],
|
||||
components: {
|
||||
'd2-layout-header-aside-menu-item': d2LayoutMainMenuItem,
|
||||
'd2-layout-header-aside-menu-sub': d2LayoutMainMenuSub
|
||||
render (createElement) {
|
||||
return createElement('div', { attrs: { class: 'd2-layout-header-aside-menu-side' } }, [
|
||||
createElement('el-menu', {
|
||||
props: { collapse: this.asideCollapse, uniqueOpened: true, defaultActive: this.active },
|
||||
ref: 'menu',
|
||||
on: { select: this.handleMenuSelect }
|
||||
}, this.aside.map(menu => (menu.children === undefined ? elMenuItem : elSubmenu).call(this, createElement, menu))),
|
||||
...this.aside.length === 0 && !this.asideCollapse ? [
|
||||
createElement('div', { attrs: { class: 'd2-layout-header-aside-menu-empty', flex: 'dir:top main:center cross:center' } }, [
|
||||
createElement('d2-icon', { props: { name: 'inbox' } }),
|
||||
createElement('span', {}, this.$t('layout.header-aside.menu-side.empty'))
|
||||
])
|
||||
] : []
|
||||
])
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
|
|
@ -96,4 +86,3 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1 +1 @@
|
|||
f0390fbbbea8e33d903173bd90f63bbfb8069d25
|
||||
53a2534f94e1fbddf5d771247686935e6f70062b
|
||||
Loading…
Reference in New Issue