From fc3ffbe08d848f147041b6af8d4cdb4e48b0d997 Mon Sep 17 00:00:00 2001
From: 梁灏 <admin@aresn.com>
Date: Thu, 8 Dec 2016 18:33:04 +0800
Subject: [PATCH] publish 0.9.10-rc-2
---
package.json | 2 +-
src/components/menu/menu-group.vue | 6 ------
src/components/menu/menu.vue | 30 +++++++++++++++++++++++-------
src/styles/common/article.less | 2 +-
src/styles/components/menu.less | 29 +++++++++++++++++++++++------
test/routers/menu.vue | 175 +++++++++++++++++++++++++++++++++++++++++++++++--------------------------------------------------------------------------------------------------------------------------------
6 files changed, 95 insertions(+), 149 deletions(-)
diff --git a/package.json b/package.json
index 4348480..2896c3c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "iview",
- "version": "0.9.10-rc-1",
+ "version": "0.9.10-rc-2",
"title": "iView",
"description": "A high quality UI components Library with Vue.js",
"homepage": "http://www.iviewui.com",
diff --git a/src/components/menu/menu-group.vue b/src/components/menu/menu-group.vue
index 7236e45..bd4dc62 100644
--- a/src/components/menu/menu-group.vue
+++ b/src/components/menu/menu-group.vue
@@ -19,12 +19,6 @@
return {
prefixCls: prefixCls
}
- },
- computed: {
-
- },
- methods: {
-
}
}
</script>
\ No newline at end of file
diff --git a/src/components/menu/menu.vue b/src/components/menu/menu.vue
index 16f1746..a725867 100644
--- a/src/components/menu/menu.vue
+++ b/src/components/menu/menu.vue
@@ -1,5 +1,5 @@
<template>
- <ul :class="classes"><slot></slot></ul>
+ <ul :class="classes" :style="styles"><slot></slot></ul>
</template>
<script>
import { oneOf } from '../../utils/assist';
@@ -32,11 +32,10 @@
accordion: {
type: Boolean,
default: false
- }
- },
- data () {
- return {
-
+ },
+ width: {
+ type: String,
+ default: '240px'
}
},
computed: {
@@ -51,12 +50,21 @@
[`${prefixCls}-${this.mode}`]: this.mode
}
]
+ },
+ styles () {
+ let style = {};
+
+ if (this.mode === 'vertical') style.width = this.width;
+
+ return style;
}
},
methods: {
updateActiveKey () {
this.$children.forEach((item, index) => {
- if (!this.activeKey && index === 0) this.activeKey = item.key;
+ if (!this.activeKey && index === 0) {
+ this.activeKey = -1;
+ }
if (item.$options.name === 'Submenu') {
item.active = false;
@@ -95,10 +103,18 @@
} else {
this.openKeys.push(key);
}
+ },
+ updateOpened () {
+ this.$children.forEach(item => {
+ if (item.$options.name === 'Submenu') {
+ if (this.openKeys.indexOf(item.key) > -1) item.opened = true;
+ }
+ })
}
},
compiled () {
this.updateActiveKey();
+ this.updateOpened();
},
events: {
'on-menu-item-select' (key) {
diff --git a/src/styles/common/article.less b/src/styles/common/article.less
index 841057a..cd229a2 100644
--- a/src/styles/common/article.less
+++ b/src/styles/common/article.less
@@ -41,7 +41,7 @@
margin-bottom: 5px;
font-size: 14px;
}
- ul ul, ol ul{
+ ul ul:not([class^="ivu-"]), ol ul:not([class^="ivu-"]){
list-style-type: circle;
}
diff --git a/src/styles/components/menu.less b/src/styles/components/menu.less
index d281db2..3bd9a8d 100644
--- a/src/styles/components/menu.less
+++ b/src/styles/components/menu.less
@@ -29,7 +29,6 @@
}
}
&-vertical{
- width: 240px;
&.@{menu-prefix-cls}-light{
&:after{
content: '';
@@ -125,8 +124,13 @@
padding-left: 8px;
font-size: @font-size-small;
color: @legend-color;
- height: 30px;
- line-height: 30px;
+ height: 48px;
+ line-height: 48px;
+ }
+
+ & > ul{
+ padding: 0 !important;
+ list-style: none !important;
}
}
@@ -183,9 +187,15 @@
&-dark&-vertical &-item, &-dark&-vertical &-submenu-title{
color: @subsidiary-color;
- &-active:not(.@{menu-prefix-cls}-submenu), &:hover{
+ &-active:not(.@{menu-prefix-cls}-submenu),
+ &-active:not(.@{menu-prefix-cls}-submenu):hover
+ {
background: @menu-dark-active-bg;
}
+ &:hover{
+ color: #fff;
+ background: @title-color;
+ }
&-active:not(.@{menu-prefix-cls}-submenu){
color: @primary-color;
border-right: 2px solid @primary-color;
@@ -194,16 +204,23 @@
&-dark&-vertical &-submenu &-item{
&:hover{
color: #fff;
+ background: transparent !important;
}
- &-active{
+ &-active,&-active:hover{
border-right: none;
color: #fff;
- background: @primary-color;
+ background: @primary-color !important;
}
}
+ &-dark&-vertical &-item-active &-submenu-title{
+ color: #fff;
+ }
&-dark&-vertical &-opened{
background: @menu-dark-active-bg;
+ .@{menu-prefix-cls}-submenu-title{
+ background: @title-color;
+ }
}
}
.select-item(@menu-prefix-cls, @menu-dropdown-item-prefix-cls);
\ No newline at end of file
diff --git a/test/routers/menu.vue b/test/routers/menu.vue
index 92d66d7..d01e69a 100644
--- a/test/routers/menu.vue
+++ b/test/routers/menu.vue
@@ -1,137 +1,56 @@
<template>
- <div>
- <Menu mode="horizontal" :theme="theme" active-key="1">
- <Menu-item key="1">
- <Icon type="ionic"></Icon><span>导航一</span>
- </Menu-item>
- <Menu-item key="2">导航二</Menu-item>
- <Submenu key="3">
- <template slot="title"><Icon type="ionic"></Icon>导航三</template>
- <Menu-group title="集合1">
- <Menu-item key="3-1">导航三 - 一</Menu-item>
- <Menu-item key="3-2">导航三 - 二</Menu-item>
- </Menu-group>
- <Menu-group title="集合2">
- <Menu-item key="3-3">导航三 - 三</Menu-item>
- <Menu-item key="3-4">导航三 - 四</Menu-item>
- </Menu-group>
- </Submenu>
- <Menu-item key="4">导航四</Menu-item>
- </Menu>
- <br><br>
- <Radio-group :model.sync="theme">
- <Radio value="light"></Radio>
- <Radio value="dark"></Radio>
- <Radio value="primary"></Radio>
- </Radio-group>
- <br><br>
- <Menu :mode="mode" :theme="theme" active-key="1" @on-open-change="change">
- <Menu-item key="1">
- <Icon type="ionic"></Icon>
- <span>导航一</span>
- </Menu-item>
- <Menu-group title="集合1">
- <Menu-item key="2">
- <Icon type="ionic"></Icon>
- 导航二
- </Menu-item>
- <Menu-item key="3">导航三</Menu-item>
- </Menu-group>
- <Menu-group title="集合2">
- <Menu-item key="4">导航四</Menu-item>
- <Menu-item key="5">导航五</Menu-item>
- </Menu-group>
- <Submenu key="6">
- <template slot="title"><Icon type="ionic"></Icon>导航六</template>
- <Menu-group title="集合1">
- <Menu-item key="3-1">导航三 - 一</Menu-item>
- <Menu-item key="3-2">导航三 - 二</Menu-item>
- </Menu-group>
- <Menu-group title="集合2">
- <Menu-item key="3-3">导航三 - 三</Menu-item>
- <Menu-item key="3-4">导航三 - 四</Menu-item>
- </Menu-group>
- </Submenu>
- <Submenu key="7">
- <template slot="title"><Icon type="ionic"></Icon>导航七</template>
- <Menu-group title="集合1">
- <Menu-item key="7-1">导航三 - 一</Menu-item>
- <Menu-item key="7-2">导航三 - 二</Menu-item>
- </Menu-group>
- <Menu-group title="集合2">
- <Menu-item key="7-3">导航三 - 三</Menu-item>
- <Menu-item key="7-4">导航三 - 四</Menu-item>
- </Menu-group>
- </Submenu>
- </Menu>
- <!--<Menu :mode="mode" active-key="1">-->
- <!--<Menu-item key="1">-->
- <!--<Icon type="ionic"></Icon>-->
- <!--<span>导航一</span>-->
- <!--</Menu-item>-->
- <!--<Menu-item key="2">导航二</Menu-item>-->
- <!--<Submenu key="3">-->
- <!--<template slot="title"><Icon type="ionic"></Icon><span>导航三</span></template>-->
- <!--<Menu-group title="集合1">-->
- <!--<Menu-item key="3-1">导航三 - 一</Menu-item>-->
- <!--<Menu-item key="3-2">导航三 - 二</Menu-item>-->
- <!--</Menu-group>-->
- <!--<Menu-group title="集合2">-->
- <!--<Menu-item key="3-3">导航三 - 三</Menu-item>-->
- <!--<Menu-item key="3-4">导航三 - 四</Menu-item>-->
- <!--</Menu-group>-->
- <!--</Submenu>-->
- <!--<Menu-item key="4">导航四</Menu-item>-->
- <!--</Menu>-->
- <!--<br><br>-->
- <!--<Menu mode="horizontal" theme="dark" active-key="1">-->
- <!--<Menu-item key="1">-->
- <!--<Icon type="ionic"></Icon>-->
- <!--<span>导航一</span>-->
- <!--</Menu-item>-->
- <!--<Menu-item key="2">导航二</Menu-item>-->
- <!--<Submenu key="3">-->
- <!--<span slot="title">导航三</span>-->
- <!--<Menu-item key="3-1">导航三 - 一</Menu-item>-->
- <!--<Menu-item key="3-2">导航三 - 二</Menu-item>-->
- <!--<Menu-item key="3-3">导航三 - 三</Menu-item>-->
- <!--</Submenu>-->
- <!--<Menu-item key="4">导航四</Menu-item>-->
- <!--</Menu>-->
- <!--<br><br>-->
- <!--<Menu mode="horizontal" theme="primary" active-key="1">-->
- <!--<Menu-item key="1">-->
- <!--<Icon type="ionic"></Icon>-->
- <!--<span>导航一</span>-->
- <!--</Menu-item>-->
- <!--<Menu-item key="2">导航二</Menu-item>-->
- <!--<Submenu key="3">-->
- <!--<span slot="title">导航三</span>-->
- <!--<Menu-item key="3-1">导航三 - 一</Menu-item>-->
- <!--<Menu-item key="3-2">导航三 - 二</Menu-item>-->
- <!--<Menu-item key="3-3">导航三 - 三</Menu-item>-->
- <!--</Submenu>-->
- <!--<Menu-item key="4">导航四</Menu-item>-->
- <!--</Menu>-->
- </div>
+ <Row>
+ <i-col span="8">
+ <Menu :theme="theme2">
+ <Submenu key="1">
+ <template slot="title">
+ <Icon type="ios-paper"></Icon>
+ 内容管理
+ </template>
+ <Menu-item key="1-1">文章管理</Menu-item>
+ <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>
+ 用户管理
+ </template>
+ <Menu-item key="2-1">新增用户</Menu-item>
+ <Menu-item key="2-2">活跃用户</Menu-item>
+ </Submenu>
+ <Submenu key="3">
+ <template slot="title">
+ <Icon type="stats-bars"></Icon>
+ 统计分析
+ </template>
+ <Menu-group title="使用">
+ <Menu-item key="3-1">新增和启动</Menu-item>
+ <Menu-item key="3-2">活跃分析</Menu-item>
+ <Menu-item key="3-3">时段分析</Menu-item>
+ </Menu-group>
+ <Menu-group title="留存">
+ <Menu-item key="3-4">用户留存</Menu-item>
+ <Menu-item key="3-5">流失用户</Menu-item>
+ </Menu-group>
+ </Submenu>
+ </Menu>
+ </i-col>
+
+ </Row>
+ <br>
+ <p>切换主题</p>
+ <Radio-group :model.sync="theme2">
+ <Radio value="light"></Radio>
+ <Radio value="dark"></Radio>
+ </Radio-group>
</template>
<script>
export default {
- props: {},
data () {
return {
- mode: 'vertical',
- theme: 'dark'
- }
- },
- computed: {},
- methods: {
- toggleMode () {
- this.mode = this.mode === 'horizontal' ? 'vertical' : 'horizontal';
- },
- change (d) {
- console.log(d)
+ theme2: 'light'
}
}
}
-</script>
\ No newline at end of file
+</script>
--
libgit2 0.21.4