更新依赖和版本

Former-commit-id: 5072ec87feb8745621004a198310faee62e6281c [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2] [formerly 5072ec87feb8745621004a198310faee62e6281c [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2] [formerly 5072ec87feb8745621004a198310faee62e6281c [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2] [formerly 6881bd1e425d95d98ebb2b2ed44175fe9e98d5f2 [formerly c3846e5 [formerly 3bd4f9d9418df3df44f368bb2ae32652c69c013f]]]]]
Former-commit-id: bd93fcb
Former-commit-id: 12ad7ae
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

package.json

@@ -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",

src/layout/header-aside/components/libs/util.menu.js

@@ -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))
+  ])
+}

src/layout/header-aside/components/menu-header/index.vue → src/layout/header-aside/components/menu-header/index.js

@@ -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>

src/layout/header-aside/components/menu-side/index.vue → src/layout/header-aside/components/menu-side/index.js

@@ -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>

yarn.lock.REMOVED.git-id

@@ -1 +1 @@
-f0390fbbbea8e33d903173bd90f63bbfb8069d25
+53a2534f94e1fbddf5d771247686935e6f70062b