no message
Former-commit-id: 7b3fddd98d854f89e0357006e317cba47fd9be0f Former-commit-id: 1b033b5f22388fc303b45d1b1f69504f582a34cc Former-commit-id: e449874c389b784a04f7cd1e891a8a272f781f8d
This commit is contained in:
@@ -26,32 +26,21 @@ export default {
|
||||
routeName () {
|
||||
return this.$route.name
|
||||
},
|
||||
// 当前路由是否是顶级菜单
|
||||
// 顶级菜单就是在顶栏里显示的菜单
|
||||
// 二级菜单是在侧边栏显示的菜单
|
||||
// 三级菜单是二级菜单展开的
|
||||
routeIsTopLevel () {
|
||||
return !!this.router.find(e => e.name === this.routeName)
|
||||
},
|
||||
// 不管当前路由是不是顶级菜单 都返回这个路由所属的顶级菜单对象的name
|
||||
// 如果返回 undefined 代表这个路由不是在菜单里显示的路由
|
||||
routeTopLevel () {
|
||||
if (this.routeIsTopLevel) {
|
||||
routeTopLevelName () {
|
||||
if (this.router.find(e => e.name === this.routeName)) {
|
||||
return this.routeName
|
||||
} else {
|
||||
const find = this.router.find(e => {
|
||||
return e.children.find(child => {
|
||||
return child.name === this.routeName
|
||||
})
|
||||
})
|
||||
const find = this.router.find(e => e.children.find(child => child.name === this.routeName))
|
||||
return find ? find.name : undefined
|
||||
}
|
||||
},
|
||||
// 返回当前对象对应的顶级菜单 这个菜单可以在侧边栏菜单中直接使用
|
||||
// 如果返回 undefined 代表这个路由没有对应的一级路由也就没有菜单
|
||||
routeTopLevelMenu () {
|
||||
if (this.routeTopLevel) {
|
||||
return this.menu.find(e => e.name === this.routeTopLevel).children
|
||||
if (this.routeTopLevelName) {
|
||||
return this.menu.find(e => e.name === this.routeTopLevelName).children
|
||||
} else {
|
||||
return undefined
|
||||
}
|
||||
|
||||
88
src/components/core/MainLayout/_headerMenu_bak.vue
Normal file
88
src/components/core/MainLayout/_headerMenu_bak.vue
Normal file
@@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<el-menu class="el-menu-demo" mode="horizontal">
|
||||
<el-menu-item index="index" @click.native="active({name: 'index'})">首页</el-menu-item>
|
||||
<el-menu-item
|
||||
v-for="(item, index) in menu"
|
||||
:key="index"
|
||||
:index="String(index)"
|
||||
@click.native="active(item)">
|
||||
{{item.title}}
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapMutations } from 'vuex'
|
||||
import { menu, router } from '@/router/menu/index.js'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
menu,
|
||||
router
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 当前路由的name
|
||||
routeName () {
|
||||
return this.$route.name
|
||||
},
|
||||
// 当前路由是否是顶级菜单
|
||||
// 顶级菜单就是在顶栏里显示的菜单
|
||||
// 二级菜单是在侧边栏显示的菜单
|
||||
// 三级菜单是二级菜单展开的
|
||||
routeIsTopLevel () {
|
||||
return !!this.router.find(e => e.name === this.routeName)
|
||||
},
|
||||
// 不管当前路由是不是顶级菜单 都返回这个路由所属的顶级菜单对象的name
|
||||
// 如果返回 undefined 代表这个路由不是在菜单里显示的路由
|
||||
routeTopLevel () {
|
||||
if (this.routeIsTopLevel) {
|
||||
return this.routeName
|
||||
} else {
|
||||
const find = this.router.find(e => {
|
||||
return e.children.find(child => {
|
||||
return child.name === this.routeName
|
||||
})
|
||||
})
|
||||
return find ? find.name : undefined
|
||||
}
|
||||
},
|
||||
// 返回当前对象对应的顶级菜单 这个菜单可以在侧边栏菜单中直接使用
|
||||
// 如果返回 undefined 代表这个路由没有对应的一级路由也就没有菜单
|
||||
routeTopLevelMenu () {
|
||||
if (this.routeTopLevel) {
|
||||
return this.menu.find(e => e.name === this.routeTopLevel).children
|
||||
} else {
|
||||
return undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
routeName () {
|
||||
this.doSetSideMenu()
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.doSetSideMenu()
|
||||
},
|
||||
methods: {
|
||||
...mapMutations([
|
||||
'setSideMenu'
|
||||
]),
|
||||
// 更新一次侧边栏
|
||||
doSetSideMenu () {
|
||||
if (this.routeTopLevelMenu) {
|
||||
this.setSideMenu({
|
||||
sideMenu: this.routeTopLevelMenu
|
||||
})
|
||||
}
|
||||
},
|
||||
// 跳转到某个路由
|
||||
active (item) {
|
||||
this.$router.push({
|
||||
name: item.name
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -7,33 +7,18 @@
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<el-card>
|
||||
<el-form
|
||||
ref="loginForm"
|
||||
label-position="top"
|
||||
:rules="rules"
|
||||
:model="formLogin">
|
||||
<el-form ref="loginForm" label-position="top" :rules="rules" :model="formLogin">
|
||||
<el-form-item prop="username">
|
||||
<el-input
|
||||
type="text"
|
||||
v-model="formLogin.username"
|
||||
placeholder="用户名">
|
||||
<el-input type="text" v-model="formLogin.username" placeholder="用户名">
|
||||
<i slot="prepend" class="fa fa-user-circle-o"></i>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input
|
||||
type="password"
|
||||
v-model="formLogin.password"
|
||||
placeholder="密码">
|
||||
<el-input type="password" v-model="formLogin.password" placeholder="密码">
|
||||
<i slot="prepend" class="fa fa-keyboard-o"></i>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-button
|
||||
@click="submit"
|
||||
type="primary"
|
||||
class="button-login">
|
||||
登陆
|
||||
</el-button>
|
||||
<el-button @click="submit" type="primary" class="button-login">登陆</el-button>
|
||||
</el-form>
|
||||
</el-card>
|
||||
<el-button type="info" class="button-help">
|
||||
|
||||
Reference in New Issue
Block a user