update Menu
update Menu
This commit is contained in:
parent
fc3ffbe08d
commit
f9d87766ca
3 changed files with 45 additions and 46 deletions
|
@ -78,7 +78,7 @@
|
||||||
groupItem.active = false;
|
groupItem.active = false;
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
} else if (subitem.$options.name === 'MenuItem') {
|
||||||
if (subitem.key === this.activeKey) {
|
if (subitem.key === this.activeKey) {
|
||||||
subitem.active = true;
|
subitem.active = true;
|
||||||
subitem.$parent.active = true;
|
subitem.$parent.active = true;
|
||||||
|
@ -91,7 +91,7 @@
|
||||||
item.$children.forEach(groupItem => {
|
item.$children.forEach(groupItem => {
|
||||||
groupItem.active = groupItem.key === this.activeKey;
|
groupItem.active = groupItem.key === this.activeKey;
|
||||||
})
|
})
|
||||||
} else {
|
} else if (item.$options.name === 'MenuItem') {
|
||||||
item.active = item.key === this.activeKey;
|
item.active = item.key === this.activeKey;
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -121,11 +121,11 @@
|
||||||
&-item-group{
|
&-item-group{
|
||||||
line-height: normal;
|
line-height: normal;
|
||||||
&-title {
|
&-title {
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
padding-left: 8px;
|
padding-left: 8px;
|
||||||
font-size: @font-size-small;
|
font-size: @font-size-small;
|
||||||
color: @legend-color;
|
color: @legend-color;
|
||||||
height: 48px;
|
|
||||||
line-height: 48px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
& > ul{
|
& > ul{
|
||||||
|
@ -166,6 +166,8 @@
|
||||||
}
|
}
|
||||||
&-vertical &-item-group{
|
&-vertical &-item-group{
|
||||||
&-title{
|
&-title{
|
||||||
|
height: 48px;
|
||||||
|
line-height: 48px;
|
||||||
font-size: @font-size-base;
|
font-size: @font-size-base;
|
||||||
padding-left: 28px;
|
padding-left: 28px;
|
||||||
}
|
}
|
||||||
|
@ -224,3 +226,8 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.select-item(@menu-prefix-cls, @menu-dropdown-item-prefix-cls);
|
.select-item(@menu-prefix-cls, @menu-dropdown-item-prefix-cls);
|
||||||
|
|
||||||
|
.@{menu-dropdown-item-prefix-cls} {
|
||||||
|
padding: 7px 16px 8px;
|
||||||
|
font-size: @font-size-base !important;
|
||||||
|
}
|
|
@ -1,24 +1,14 @@
|
||||||
<template>
|
<template>
|
||||||
<Row>
|
<Menu mode="horizontal" :theme="theme1" active-key="1">
|
||||||
<i-col span="8">
|
<i-button>test</i-button>
|
||||||
<Menu :theme="theme2">
|
<Menu-item key="1">
|
||||||
<Submenu key="1">
|
|
||||||
<template slot="title">
|
|
||||||
<Icon type="ios-paper"></Icon>
|
<Icon type="ios-paper"></Icon>
|
||||||
内容管理
|
内容管理
|
||||||
</template>
|
</Menu-item>
|
||||||
<Menu-item key="1-1">文章管理</Menu-item>
|
<Menu-item key="2">
|
||||||
<Menu-item key="1-2">评论管理</Menu-item>
|
|
||||||
<Menu-item key="1-3">举报管理</Menu-item>
|
|
||||||
</Submenu>
|
|
||||||
<Submenu key="2">
|
|
||||||
<template slot="title">
|
|
||||||
<Icon type="ios-people"></Icon>
|
<Icon type="ios-people"></Icon>
|
||||||
用户管理
|
用户管理
|
||||||
</template>
|
</Menu-item>
|
||||||
<Menu-item key="2-1">新增用户</Menu-item>
|
|
||||||
<Menu-item key="2-2">活跃用户</Menu-item>
|
|
||||||
</Submenu>
|
|
||||||
<Submenu key="3">
|
<Submenu key="3">
|
||||||
<template slot="title">
|
<template slot="title">
|
||||||
<Icon type="stats-bars"></Icon>
|
<Icon type="stats-bars"></Icon>
|
||||||
|
@ -34,22 +24,24 @@
|
||||||
<Menu-item key="3-5">流失用户</Menu-item>
|
<Menu-item key="3-5">流失用户</Menu-item>
|
||||||
</Menu-group>
|
</Menu-group>
|
||||||
</Submenu>
|
</Submenu>
|
||||||
|
<Menu-item key="4">
|
||||||
|
<Icon type="settings"></Icon>
|
||||||
|
综合设置
|
||||||
|
</Menu-item>
|
||||||
</Menu>
|
</Menu>
|
||||||
</i-col>
|
|
||||||
|
|
||||||
</Row>
|
|
||||||
<br>
|
<br>
|
||||||
<p>切换主题</p>
|
<p>切换主题</p>
|
||||||
<Radio-group :model.sync="theme2">
|
<Radio-group :model.sync="theme1">
|
||||||
<Radio value="light"></Radio>
|
<Radio value="light"></Radio>
|
||||||
<Radio value="dark"></Radio>
|
<Radio value="dark"></Radio>
|
||||||
|
<Radio value="primary"></Radio>
|
||||||
</Radio-group>
|
</Radio-group>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
theme2: 'light'
|
theme1: 'light'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue