Authored by 毕凯

菜单

<template>
<Menu class="sidebar-menu" active-name="1-2" theme="light" width="auto" :open-names="['1']">
<MenuItem name="1">
<a href="/">
<Icon type="ios-home"></Icon>
Dashboard
</a>
</MenuItem>
<Submenu name="2">
<template slot="title">
<Icon type="document-text"></Icon>
日志查询
</template>
<MenuItem name="2-1">
<router-link to="/logs/node">
Node 日志
</router-link>
</MenuItem>
</Submenu>
</Menu>
</template>
<script>
export default {
props: ['user']
}
</script>
<style scoped lang="scss">
a {
display: block;
color: #495060;
> i {
margin-right: 6px;
}
}
.ivu-menu-light.ivu-menu-vertical .ivu-menu-item-active {
color: #495060;
}
</style>
\ No newline at end of file
... ...
... ... @@ -4,97 +4,7 @@
<Avatar icon="person" size="large" :src="userImg" />
<span class="username">{{user.username}}</span>
</div>
<Menu class="sidebar-menu" active-name="1-2" theme="light" width="auto" :open-names="['1']">
<Submenu name="1">
<template slot="title">
<Icon type="ios-navigate"></Icon>
Item 1
</template>
<MenuItem name="1-1">Option 1</MenuItem>
<MenuItem name="1-2">Option 2</MenuItem>
<MenuItem name="1-3">Option 3</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="2">
<template slot="title">
<Icon type="ios-keypad"></Icon>
Item 2
</template>
<MenuItem name="2-1">Option 1</MenuItem>
<MenuItem name="2-2">Option 2</MenuItem>
</Submenu>
<Submenu name="3">
<template slot="title">
<Icon type="ios-analytics"></Icon>
Item 3
</template>
<MenuItem name="3-1">Option 1</MenuItem>
<MenuItem name="3-2">Option 2</MenuItem>
</Submenu>
</Menu>
<Menus :user="user" />
</div>
</template>
... ... @@ -116,7 +26,7 @@
height: 40px;
font-size: 18px;
line-height: 40px;
max-width: 120px;
max-width: 110px;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
... ... @@ -130,10 +40,14 @@
</style>
<script>
import Menus from 'common/Menus.vue'
import userImg from '../../../images/photos/user1.png'
import axios from 'axios'
export default {
components: {
Menus
},
data() {
return {
userImg,
... ...