mirror of
https://github.com/iczer/vue-antd-admin
synced 2025-04-06 04:00:06 +08:00
新增:根据当前路由自动展开菜单
This commit is contained in:
parent
0aaf3cf893
commit
f5b569f170
19
src/components/list/ApplicationList.vue
Normal file
19
src/components/list/ApplicationList.vue
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<a-card style="" :bordered="false">
|
||||||
|
bbb
|
||||||
|
</a-card>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import ACard from 'vue-antd-ui/es/card/Card'
|
||||||
|
export default {
|
||||||
|
name: 'ApplicationList',
|
||||||
|
components: {ACard}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<a-card style="" :bordered="false">
|
<a-card style="" :bordered="false">
|
||||||
|
aaaa
|
||||||
</a-card>
|
</a-card>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
19
src/components/list/ProjectList.vue
Normal file
19
src/components/list/ProjectList.vue
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<a-card style="" :bordered="false">
|
||||||
|
ccc
|
||||||
|
</a-card>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import ACard from 'vue-antd-ui/es/card/Card'
|
||||||
|
export default {
|
||||||
|
name: 'ProjectList',
|
||||||
|
components: {ACard}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
@ -5,7 +5,7 @@
|
|||||||
<a-input-search style="width: 522px" placeholder="请输入..." size="large" enterButton="搜索" />
|
<a-input-search style="width: 522px" placeholder="请输入..." size="large" enterButton="搜索" />
|
||||||
</div>
|
</div>
|
||||||
<div style="padding: 0 24px">
|
<div style="padding: 0 24px">
|
||||||
<a-tabs :tabBarStyle="{margin: 0}">
|
<a-tabs :tabBarStyle="{margin: 0}" @change="navigate" :activeKey="activeKey">
|
||||||
<a-tab-pane tab="文章" key="1"></a-tab-pane>
|
<a-tab-pane tab="文章" key="1"></a-tab-pane>
|
||||||
<a-tab-pane tab="应用" key="2"></a-tab-pane>
|
<a-tab-pane tab="应用" key="2"></a-tab-pane>
|
||||||
<a-tab-pane tab="项目" key="3"></a-tab-pane>
|
<a-tab-pane tab="项目" key="3"></a-tab-pane>
|
||||||
@ -29,7 +29,46 @@ const ATabPane = ATabs.TabPane
|
|||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'SearchLayout',
|
name: 'SearchLayout',
|
||||||
components: {ATabPane, ATabs, AInputSearch, AButton, AInputGroup, AInput}
|
components: {ATabPane, ATabs, AInputSearch, AButton, AInputGroup, AInput},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
activeKey: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
'$route': (val) => {
|
||||||
|
switch (val.path) {
|
||||||
|
case '/list/search/article':
|
||||||
|
this.activeKey = '1'
|
||||||
|
break
|
||||||
|
case '/list/search/application':
|
||||||
|
this.activeKey = '2'
|
||||||
|
break
|
||||||
|
case '/list/search/project':
|
||||||
|
this.activeKey = '3'
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
this.activeKey = '1'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
navigate (key) {
|
||||||
|
switch (key) {
|
||||||
|
case '1':
|
||||||
|
this.$router.push('/list/search/article')
|
||||||
|
break
|
||||||
|
case '2':
|
||||||
|
this.$router.push('/list/search/application')
|
||||||
|
break
|
||||||
|
case '3':
|
||||||
|
this.$router.push('/list/search/project')
|
||||||
|
break
|
||||||
|
default:
|
||||||
|
this.$router.push('/workplace')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -53,9 +53,13 @@ export default {
|
|||||||
return {
|
return {
|
||||||
rootSubmenuKeys: ['/form', '/list', '/detail', '/exception', '/result'],
|
rootSubmenuKeys: ['/form', '/list', '/detail', '/exception', '/result'],
|
||||||
openKeys: [],
|
openKeys: [],
|
||||||
|
selectedKeys: [],
|
||||||
cachedOpenKeys: []
|
cachedOpenKeys: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
created () {
|
||||||
|
this.updateMenu()
|
||||||
|
},
|
||||||
watch: {
|
watch: {
|
||||||
collapsed (val) {
|
collapsed (val) {
|
||||||
if (val) {
|
if (val) {
|
||||||
@ -64,6 +68,9 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
this.openKeys = this.cachedOpenKeys
|
this.openKeys = this.cachedOpenKeys
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
'$route': function () {
|
||||||
|
this.updateMenu()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
@ -133,6 +140,15 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
this.openKeys = latestOpenKey ? [latestOpenKey] : []
|
this.openKeys = latestOpenKey ? [latestOpenKey] : []
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
updateMenu () {
|
||||||
|
let routes = this.$route.matched.concat()
|
||||||
|
this.selectedKeys = [routes.pop().path]
|
||||||
|
let openKeys = []
|
||||||
|
routes.forEach((item) => {
|
||||||
|
openKeys.push(item.path)
|
||||||
|
})
|
||||||
|
this.openKeys = openKeys
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
render (h) {
|
render (h) {
|
||||||
@ -143,10 +159,12 @@ export default {
|
|||||||
theme: this.$props.theme,
|
theme: this.$props.theme,
|
||||||
mode: this.$props.mode,
|
mode: this.$props.mode,
|
||||||
inlineCollapsed: false,
|
inlineCollapsed: false,
|
||||||
openKeys: this.openKeys
|
openKeys: this.openKeys,
|
||||||
|
selectedKeys: this.selectedKeys
|
||||||
},
|
},
|
||||||
on: {
|
on: {
|
||||||
openChange: this.onOpenChange
|
openChange: this.onOpenChange,
|
||||||
|
select: (obj) => { this.selectedKeys = obj.selectedKeys }
|
||||||
}
|
}
|
||||||
}, this.renderMenu(h, this.menuData)
|
}, this.renderMenu(h, this.menuData)
|
||||||
)
|
)
|
||||||
|
@ -17,6 +17,8 @@ import StandardList from '@/components/list/StandardList'
|
|||||||
import CardList from '@/components/list/CardList'
|
import CardList from '@/components/list/CardList'
|
||||||
import SearchLayout from '@/components/list/SearchLayout'
|
import SearchLayout from '@/components/list/SearchLayout'
|
||||||
import ArticleList from '@/components/list/ArticleList'
|
import ArticleList from '@/components/list/ArticleList'
|
||||||
|
import ApplicationList from '@/components/list/ApplicationList'
|
||||||
|
import ProjectList from '@/components/list/ProjectList'
|
||||||
import WorkPlace from '@/components/dashboard/WorkPlace'
|
import WorkPlace from '@/components/dashboard/WorkPlace'
|
||||||
|
|
||||||
Vue.use(Router)
|
Vue.use(Router)
|
||||||
@ -105,6 +107,18 @@ export default new Router({
|
|||||||
name: '文章',
|
name: '文章',
|
||||||
component: ArticleList,
|
component: ArticleList,
|
||||||
icon: 'none'
|
icon: 'none'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/list/search/application',
|
||||||
|
name: '应用',
|
||||||
|
component: ApplicationList,
|
||||||
|
icon: 'none'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/list/search/project',
|
||||||
|
name: '项目',
|
||||||
|
component: ProjectList,
|
||||||
|
icon: 'none'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user