From 67f4d8e76360539969a6d88bd16577684d29471b Mon Sep 17 00:00:00 2001
From: 梁灏 <admin@aresn.com>
Date: Wed, 15 Mar 2017 18:26:10 +0800
Subject: [PATCH] update Menu

---
 examples/routers/menu.vue       | 312 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------------------------------------------------------------------------------------------------------------------------------------------------
 src/components/menu/menu.vue    |  12 +++++++-----
 src/components/menu/submenu.vue |  23 +++++++++--------------
 src/components/radio/radio.vue  |   1 -
 4 files changed, 174 insertions(+), 174 deletions(-)

diff --git a/examples/routers/menu.vue b/examples/routers/menu.vue
index dfbfec5..840bc75 100644
--- a/examples/routers/menu.vue
+++ b/examples/routers/menu.vue
@@ -1,153 +1,16 @@
-<!--<template>-->
-    <!--<div>-->
-        <!--<Menu mode="horizontal" :theme="theme1" active-name="1" @on-select="s">-->
-            <!--<Menu-item name="1">-->
-                <!--<Icon type="ios-paper"></Icon>-->
-                <!--内容管理-->
-            <!--</Menu-item>-->
-            <!--<Menu-item name="2">-->
-                <!--<Icon type="ios-people"></Icon>-->
-                <!--用户管理-->
-            <!--</Menu-item>-->
-            <!--<Submenu name="3">-->
-                <!--<template slot="title">-->
-                    <!--<Icon type="stats-bars"></Icon>-->
-                    <!--统计分析-->
-                <!--</template>-->
-                <!--<Menu-group title="使用">-->
-                    <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
-                    <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
-                    <!--<Menu-item name="3-3">时段分析</Menu-item>-->
-                <!--</Menu-group>-->
-                <!--<Menu-group title="留存">-->
-                    <!--<Menu-item name="3-4">用户留存</Menu-item>-->
-                    <!--<Menu-item name="3-5">流失用户</Menu-item>-->
-                <!--</Menu-group>-->
-            <!--</Submenu>-->
-            <!--<Menu-item name="4">-->
-                <!--<Icon type="settings"></Icon>-->
-                <!--综合设置-->
-            <!--</Menu-item>-->
-        <!--</Menu>-->
-        <!--<br>-->
-        <!--<p>切换主题</p>-->
-        <!--<Radio-group v-model="theme1">-->
-            <!--<Radio label="light"></Radio>-->
-            <!--<Radio label="dark"></Radio>-->
-            <!--<Radio label="primary"></Radio>-->
-        <!--</Radio-group>-->
-    <!--</div>-->
-<!--</template>-->
-<!--<script>-->
-    <!--export default {-->
-        <!--data () {-->
-            <!--return {-->
-                <!--theme1: 'light'-->
-            <!--}-->
-        <!--},-->
-        <!--methods: {-->
-            <!--s (s) {-->
-                <!--console.log(s)-->
-            <!--}-->
-        <!--}-->
-    <!--}-->
-<!--</script>-->
-
-
 <template>
     <div>
-        <Row>
-            <i-col span="8">
-                <Menu :theme="theme2" @on-select="s">
-                    <Submenu name="1">
-                        <template slot="title">
-                            <Icon type="ios-paper"></Icon>
-                            内容管理
-                        </template>
-                        <Menu-item name="1-1">文章管理</Menu-item>
-                        <Menu-item name="1-2">评论管理</Menu-item>
-                        <Menu-item name="1-3">举报管理</Menu-item>
-                    </Submenu>
-                    <Submenu name="2">
-                        <template slot="title">
-                            <Icon type="ios-people"></Icon>
-                            用户管理
-                        </template>
-                        <Menu-item name="2-1">新增用户</Menu-item>
-                        <Menu-item name="2-2">活跃用户</Menu-item>
-                    </Submenu>
-                    <Submenu name="3">
-                        <template slot="title">
-                            <Icon type="stats-bars"></Icon>
-                            统计分析
-                        </template>
-                        <Menu-group title="使用">
-                            <Menu-item name="3-1">新增和启动</Menu-item>
-                            <Menu-item name="3-2">活跃分析</Menu-item>
-                            <Menu-item name="3-3">时段分析</Menu-item>
-                        </Menu-group>
-                        <Menu-group title="留存">
-                            <Menu-item name="3-4">用户留存</Menu-item>
-                            <Menu-item name="3-5">流失用户</Menu-item>
-                        </Menu-group>
-                    </Submenu>
-                </Menu>
-            </i-col>
-            <i-col span="8">
-                <Menu :theme="theme2" active-name="1-2" :open-names="['1']" @on-select="s">
-                    <Submenu name="1">
-                        <template slot="title">
-                            <Icon type="ios-paper"></Icon>
-                            内容管理
-                        </template>
-                        <Menu-item name="1-1">文章管理</Menu-item>
-                        <Menu-item name="1-2">评论管理</Menu-item>
-                        <Menu-item name="1-3">举报管理</Menu-item>
-                    </Submenu>
-                    <Submenu name="2">
-                        <template slot="title">
-                            <Icon type="ios-people"></Icon>
-                            用户管理
-                        </template>
-                        <Menu-item name="2-1">新增用户</Menu-item>
-                        <Menu-item name="2-2">活跃用户</Menu-item>
-                    </Submenu>
-                    <Submenu name="3">
-                        <template slot="title">
-                            <Icon type="stats-bars"></Icon>
-                            统计分析
-                        </template>
-                        <Menu-group title="使用">
-                            <Menu-item name="3-1">新增和启动</Menu-item>
-                            <Menu-item name="3-2">活跃分析</Menu-item>
-                            <Menu-item name="3-3">时段分析</Menu-item>
-                        </Menu-group>
-                        <Menu-group title="留存">
-                            <Menu-item name="3-4">用户留存</Menu-item>
-                            <Menu-item name="3-5">流失用户</Menu-item>
-                        </Menu-group>
-                    </Submenu>
-                </Menu>
-            </i-col>
-            <i-col span="8">
-                <Menu :theme="theme2" :open-names="['1']" accordion @on-select="s">
-                    <Submenu name="1">
-                        <template slot="title">
-                            <Icon type="ios-paper"></Icon>
-                            内容管理
-                        </template>
-                        <Menu-item name="1-1">文章管理</Menu-item>
-                        <Menu-item name="1-2">评论管理</Menu-item>
-                        <Menu-item name="1-3">举报管理</Menu-item>
-                    </Submenu>
-                    <Submenu name="2">
-                        <template slot="title">
-                            <Icon type="ios-people"></Icon>
-                            用户管理
-                        </template>
-                        <Menu-item name="2-1">新增用户</Menu-item>
-                        <Menu-item name="2-2">活跃用户</Menu-item>
-                    </Submenu>
+        <Menu mode="horizontal" :theme="theme1" active-name="1" @on-select="s">
+            <Row type="flex" justify="center" align="middle">
+                <i-col span="12">
+                    <Menu-item name="1">
+                        <Icon type="ios-paper"></Icon>
+                        内容管理
+                    </Menu-item>
+                    <Menu-item name="2">
+                        <Icon type="ios-people"></Icon>
+                        用户管理
+                    </Menu-item>
                     <Submenu name="3">
                         <template slot="title">
                             <Icon type="stats-bars"></Icon>
@@ -163,14 +26,19 @@
                             <Menu-item name="3-5">流失用户</Menu-item>
                         </Menu-group>
                     </Submenu>
-                </Menu>
-            </i-col>
-        </Row>
+                    <Menu-item name="4">
+                        <Icon type="settings"></Icon>
+                        综合设置
+                    </Menu-item>
+                </i-col>
+            </Row>
+        </Menu>
         <br>
         <p>切换主题</p>
-        <Radio-group v-model="theme2">
+        <Radio-group v-model="theme1">
             <Radio label="light"></Radio>
             <Radio label="dark"></Radio>
+            <Radio label="primary"></Radio>
         </Radio-group>
     </div>
 </template>
@@ -178,13 +46,149 @@
     export default {
         data () {
             return {
-                theme2: 'light'
+                theme1: 'light'
             }
         },
         methods: {
             s (s) {
-                console.log(s);
+                console.log(s)
             }
         }
     }
 </script>
+
+
+<!--<template>-->
+    <!--<div>-->
+        <!--<Row>-->
+            <!--<i-col span="8">-->
+                <!--<Menu :theme="theme2" @on-select="s">-->
+                    <!--<Submenu name="1">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="ios-paper"></Icon>-->
+                            <!--内容管理-->
+                        <!--</template>-->
+                        <!--<Menu-item name="1-1">文章管理</Menu-item>-->
+                        <!--<Menu-item name="1-2">评论管理</Menu-item>-->
+                        <!--<Menu-item name="1-3">举报管理</Menu-item>-->
+                    <!--</Submenu>-->
+                    <!--<Submenu name="2">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="ios-people"></Icon>-->
+                            <!--用户管理-->
+                        <!--</template>-->
+                        <!--<Menu-item name="2-1">新增用户</Menu-item>-->
+                        <!--<Menu-item name="2-2">活跃用户</Menu-item>-->
+                    <!--</Submenu>-->
+                    <!--<Submenu name="3">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="stats-bars"></Icon>-->
+                            <!--统计分析-->
+                        <!--</template>-->
+                        <!--<Menu-group title="使用">-->
+                            <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
+                            <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
+                            <!--<Menu-item name="3-3">时段分析</Menu-item>-->
+                        <!--</Menu-group>-->
+                        <!--<Menu-group title="留存">-->
+                            <!--<Menu-item name="3-4">用户留存</Menu-item>-->
+                            <!--<Menu-item name="3-5">流失用户</Menu-item>-->
+                        <!--</Menu-group>-->
+                    <!--</Submenu>-->
+                <!--</Menu>-->
+            <!--</i-col>-->
+            <!--<i-col span="8">-->
+                <!--<Menu :theme="theme2" active-name="1-2" :open-names="['1']" @on-select="s">-->
+                    <!--<Submenu name="1">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="ios-paper"></Icon>-->
+                            <!--内容管理-->
+                        <!--</template>-->
+                        <!--<Menu-item name="1-1">文章管理</Menu-item>-->
+                        <!--<Menu-item name="1-2">评论管理</Menu-item>-->
+                        <!--<Menu-item name="1-3">举报管理</Menu-item>-->
+                    <!--</Submenu>-->
+                    <!--<Submenu name="2">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="ios-people"></Icon>-->
+                            <!--用户管理-->
+                        <!--</template>-->
+                        <!--<Menu-item name="2-1">新增用户</Menu-item>-->
+                        <!--<Menu-item name="2-2">活跃用户</Menu-item>-->
+                    <!--</Submenu>-->
+                    <!--<Submenu name="3">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="stats-bars"></Icon>-->
+                            <!--统计分析-->
+                        <!--</template>-->
+                        <!--<Menu-group title="使用">-->
+                            <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
+                            <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
+                            <!--<Menu-item name="3-3">时段分析</Menu-item>-->
+                        <!--</Menu-group>-->
+                        <!--<Menu-group title="留存">-->
+                            <!--<Menu-item name="3-4">用户留存</Menu-item>-->
+                            <!--<Menu-item name="3-5">流失用户</Menu-item>-->
+                        <!--</Menu-group>-->
+                    <!--</Submenu>-->
+                <!--</Menu>-->
+            <!--</i-col>-->
+            <!--<i-col span="8">-->
+                <!--<Menu :theme="theme2" :open-names="['1']" accordion @on-select="s">-->
+                    <!--<Submenu name="1">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="ios-paper"></Icon>-->
+                            <!--内容管理-->
+                        <!--</template>-->
+                        <!--<Menu-item name="1-1">文章管理</Menu-item>-->
+                        <!--<Menu-item name="1-2">评论管理</Menu-item>-->
+                        <!--<Menu-item name="1-3">举报管理</Menu-item>-->
+                    <!--</Submenu>-->
+                    <!--<Submenu name="2">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="ios-people"></Icon>-->
+                            <!--用户管理-->
+                        <!--</template>-->
+                        <!--<Menu-item name="2-1">新增用户</Menu-item>-->
+                        <!--<Menu-item name="2-2">活跃用户</Menu-item>-->
+                    <!--</Submenu>-->
+                    <!--<Submenu name="3">-->
+                        <!--<template slot="title">-->
+                            <!--<Icon type="stats-bars"></Icon>-->
+                            <!--统计分析-->
+                        <!--</template>-->
+                        <!--<Menu-group title="使用">-->
+                            <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
+                            <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
+                            <!--<Menu-item name="3-3">时段分析</Menu-item>-->
+                        <!--</Menu-group>-->
+                        <!--<Menu-group title="留存">-->
+                            <!--<Menu-item name="3-4">用户留存</Menu-item>-->
+                            <!--<Menu-item name="3-5">流失用户</Menu-item>-->
+                        <!--</Menu-group>-->
+                    <!--</Submenu>-->
+                <!--</Menu>-->
+            <!--</i-col>-->
+        <!--</Row>-->
+        <!--<br>-->
+        <!--<p>切换主题</p>-->
+        <!--<Radio-group v-model="theme2">-->
+            <!--<Radio label="light"></Radio>-->
+            <!--<Radio label="dark"></Radio>-->
+        <!--</Radio-group>-->
+    <!--</div>-->
+<!--</template>-->
+<!--<script>-->
+    <!--export default {-->
+        <!--data () {-->
+            <!--return {-->
+                <!--theme2: 'light'-->
+            <!--}-->
+        <!--},-->
+        <!--methods: {-->
+            <!--s (s) {-->
+                <!--console.log(s);-->
+            <!--}-->
+        <!--}-->
+    <!--}-->
+<!--</script>-->
diff --git a/src/components/menu/menu.vue b/src/components/menu/menu.vue
index 8bb0263..95dc6cd 100644
--- a/src/components/menu/menu.vue
+++ b/src/components/menu/menu.vue
@@ -2,7 +2,7 @@
     <ul :class="classes" :style="styles"><slot></slot></ul>
 </template>
 <script>
-    import { oneOf } from '../../utils/assist';
+    import { oneOf, findComponentsDownward } from '../../utils/assist';
     import Emitter from '../../mixins/emitter';
 
     const prefixCls = 'ivu-menu';
@@ -84,11 +84,13 @@
                 }
             },
             updateOpened () {
-                this.$children.forEach(item => {
-                    if (item.$options.name === 'Submenu') {
+                const items = findComponentsDownward(this, 'Submenu');
+
+                if (items.length) {
+                    items.forEach(item => {
                         if (this.openNames.indexOf(item.name) > -1) item.opened = true;
-                    }
-                });
+                    });
+                }
             }
         },
         mounted () {
diff --git a/src/components/menu/submenu.vue b/src/components/menu/submenu.vue
index d689d58..b0cba7d 100644
--- a/src/components/menu/submenu.vue
+++ b/src/components/menu/submenu.vue
@@ -17,7 +17,7 @@
 <script>
     import Drop from '../select/dropdown.vue';
     import Icon from '../icon/icon.vue';
-    import { getStyle } from '../../utils/assist';
+    import { getStyle, findComponentUpward } from '../../utils/assist';
     import Emitter from '../../mixins/emitter';
 
     const prefixCls = 'ivu-menu';
@@ -41,7 +41,8 @@
                 prefixCls: prefixCls,
                 active: false,
                 opened: false,
-                dropWidth: parseFloat(getStyle(this.$el, 'width'))
+                dropWidth: parseFloat(getStyle(this.$el, 'width')),
+                parent: findComponentUpward(this, 'Menu')
             };
         },
         computed: {
@@ -56,12 +57,10 @@
                 ];
             },
             mode () {
-                // todo while
-                return this.$parent.mode;
+                return this.parent.mode;
             },
             accordion () {
-                // todo while
-                return this.$parent.accordion;
+                return this.parent.accordion;
             },
             dropStyle () {
                 let style = {};
@@ -77,8 +76,7 @@
 
                 clearTimeout(this.timeout);
                 this.timeout = setTimeout(() => {
-                    // todo while
-                    this.$parent.updateOpenKeys(this.name);
+                    this.parent.updateOpenKeys(this.name);
                     this.opened = true;
                 }, 250);
             },
@@ -88,8 +86,7 @@
 
                 clearTimeout(this.timeout);
                 this.timeout = setTimeout(() => {
-                    // todo while
-                    this.$parent.updateOpenKeys(this.name);
+                    this.parent.updateOpenKeys(this.name);
                     this.opened = false;
                 }, 150);
             },
@@ -98,14 +95,12 @@
                 if (this.mode === 'horizontal') return;
                 const opened = this.opened;
                 if (this.accordion) {
-                    // todo while
-                    this.$parent.$children.forEach(item => {
+                    this.parent.$children.forEach(item => {
                         if (item.$options.name === 'Submenu') item.opened = false;
                     });
                 }
                 this.opened = !opened;
-                // todo while
-                this.$parent.updateOpenKeys(this.name);
+                this.parent.updateOpenKeys(this.name);
             }
         },
         watch: {
diff --git a/src/components/radio/radio.vue b/src/components/radio/radio.vue
index 2603ee4..e850504 100644
--- a/src/components/radio/radio.vue
+++ b/src/components/radio/radio.vue
@@ -68,7 +68,6 @@
             }
         },
         mounted () {
-            this.parent = findComponentUpward(this, 'RadioGroup');
             if (this.parent) this.group = true;
             if (!this.group) {
                 this.updateValue();
--
libgit2 0.21.4