chenhaodong / mew-iview

Commit c86d77fcef08ea67027f2defc1b1abf0f81f6a34

Authored by muei
Committed by GitHub
2 parents fb189f16 62a40f4f

Merge branch '2.0' into 2.0

Showing 31 changed files with 804 additions and 726 deletions   Show diff stats
Inline Side-by-side
.github/ISSUE_TEMPLATE.md
  Show/Hide comments   View file @c86d77f
... ... @@ -4,19 +4,22 @@ issue 仅用于提交 bug 或 feature 及 文档错误，其余疑问恕不作
4 4 <!--
5 5 我们十分感谢有价值的 issue 贡献者，所以请填写以下内容。如果提问不符要求、在文档中已有解答、已有相同 issue，我们将直接 close，感谢理解。
6 6 -->
  7 +<!--
  8 +点击 Preview 按钮预览，无误后再提交 issue
  9 +-->
7 10  
8 11 ### iView 版本号
9   -<!-- 0.9.10 -->
  12 +<!-- 2.0.0-rc.5 -->
10 13  
11 14 ### 操作系统/浏览器 版本号
12   -<!-- macOS/Chrome 54 -->
  15 +<!-- macOS/Chrome 56 -->
13 16  
14 17 ### Vue 版本号
15   -<!-- 1.0.26 -->
  18 +<!-- 2.2.1 -->
16 19  
17   -### 能够复现问题的在线示例
  20 +### 能够复现问题的在线示例（重要）
18 21 <!-- 使用下面的在线链接快速创建示例 -->
19   -<!-- https://codepen.io/anon/pen/NbEbja -->
  22 +<!-- https://codepen.io/anon/pen/BWwVoy -->
20 23  
21 24 ### 复现步骤
22 25  
... ...
1 1 The MIT License (MIT)
2 2  
3   -Copyright (c) 2016 iView
  3 +Copyright (c) 2016-present iView
4 4  
5 5 Permission is hereby granted, free of charge, to any person obtaining a copy
6 6 of this software and associated documentation files (the "Software"), to deal
... ... @@ -20,6 +20,29 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 20 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 21 SOFTWARE.
22 22  
  23 +MIT LICENSE
  24 +
  25 +Copyright (c) 2015-present Alipay.com, https://www.alipay.com/
  26 +
  27 +Permission is hereby granted, free of charge, to any person obtaining
  28 +a copy of this software and associated documentation files (the
  29 +"Software"), to deal in the Software without restriction, including
  30 +without limitation the rights to use, copy, modify, merge, publish,
  31 +distribute, sublicense, and/or sell copies of the Software, and to
  32 +permit persons to whom the Software is furnished to do so, subject to
  33 +the following conditions:
  34 +
  35 +The above copyright notice and this permission notice shall be
  36 +included in all copies or substantial portions of the Software.
  37 +
  38 +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
  39 +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
  40 +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
  41 +NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
  42 +LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
  43 +OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
  44 +WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  45 +
23 46 The MIT License (MIT)
24 47  
25 48 Copyright (c) 2016 ElemeFE
... ... @@ -40,4 +63,92 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
40 63 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
41 64 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
42 65 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
43   -SOFTWARE.
44 66 \ No newline at end of file
  67 +SOFTWARE.
  68 +
  69 +The MIT License (MIT)
  70 +
  71 +Copyright (c) 2015 Koala
  72 +
  73 +Permission is hereby granted, free of charge, to any person obtaining a copy
  74 +of this software and associated documentation files (the "Software"), to deal
  75 +in the Software without restriction, including without limitation the rights
  76 +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  77 +copies of the Software, and to permit persons to whom the Software is
  78 +furnished to do so, subject to the following conditions:
  79 +
  80 +The above copyright notice and this permission notice shall be included in all
  81 +copies or substantial portions of the Software.
  82 +
  83 +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  84 +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  85 +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  86 +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  87 +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  88 +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  89 +SOFTWARE.
  90 +
  91 +The MIT License (MIT)
  92 +
  93 +Copyright (c) 2016 vue-beauty
  94 +
  95 +Permission is hereby granted, free of charge, to any person obtaining a copy
  96 +of this software and associated documentation files (the "Software"), to deal
  97 +in the Software without restriction, including without limitation the rights
  98 +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  99 +copies of the Software, and to permit persons to whom the Software is
  100 +furnished to do so, subject to the following conditions:
  101 +
  102 +The above copyright notice and this permission notice shall be included in all
  103 +copies or substantial portions of the Software.
  104 +
  105 +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  106 +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  107 +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  108 +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  109 +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  110 +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  111 +SOFTWARE.
  112 +
  113 +MIT License
  114 +
  115 +Copyright (c) 2016-present, Airyland
  116 +
  117 +Permission is hereby granted, free of charge, to any person obtaining a copy
  118 +of this software and associated documentation files (the "Software"), to deal
  119 +in the Software without restriction, including without limitation the rights
  120 +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  121 +copies of the Software, and to permit persons to whom the Software is
  122 +furnished to do so, subject to the following conditions:
  123 +
  124 +The above copyright notice and this permission notice shall be included in all
  125 +copies or substantial portions of the Software.
  126 +
  127 +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  128 +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  129 +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  130 +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  131 +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  132 +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  133 +SOFTWARE.
  134 +
  135 +The MIT License (MIT)
  136 +
  137 +Copyright (c) 2016 Drifty (http://drifty.com/)
  138 +
  139 +Permission is hereby granted, free of charge, to any person obtaining a copy
  140 +of this software and associated documentation files (the "Software"), to deal
  141 +in the Software without restriction, including without limitation the rights
  142 +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  143 +copies of the Software, and to permit persons to whom the Software is
  144 +furnished to do so, subject to the following conditions:
  145 +
  146 +The above copyright notice and this permission notice shall be included in
  147 +all copies or substantial portions of the Software.
  148 +
  149 +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  150 +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  151 +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  152 +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  153 +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  154 +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
  155 +THE SOFTWARE.
45 156 \ No newline at end of file
... ...
README.md
  Show/Hide comments   View file @c86d77f
... ... @@ -83,10 +83,7 @@ Normal browsers and Internet Explorer 9+.
83 83 - [ionicons](https://github.com/driftyco/ionicons)
84 84 - [Ant Design](https://github.com/ant-design/ant-design)
85 85  
86   -## Related open source projects
87   -In iView, Some of the components and style codes refer to the following projects:
88   -- [AntDesign](https://github.com/ant-design/ant-design)
89   -- [Element](https://github.com/ElemeFE/element)
90   -- [vue-antd](https://github.com/okoala/vue-antd)
91   -- [vue-beauty](https://github.com/FE-Driver/vue-beauty)
92   -- [Vux](https://github.com/airyland/vux)
93 86 \ No newline at end of file
  87 +## License
  88 +[MIT](http://opensource.org/licenses/MIT)
  89 +
  90 +Copyright (c) 2016-present, iView
94 91 \ No newline at end of file
... ...
examples/routers/carousel.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -2,7 +2,9 @@
2 2 <div>
3 3 <Carousel v-model="v1" dots="inside" trigger="hover">
4 4 <Carousel-item>
5   - <div class="demo-carousel">1</div>
  5 + <Card>
  6 + <div class="demo-carousel">1</div>
  7 + </Card>
6 8 </Carousel-item>
7 9 <Carousel-item>
8 10 <div class="demo-carousel">2</div>
... ...
examples/routers/checkbox.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -27,9 +27,17 @@
27 27 <div @click="c">修改1</div>
28 28 {{ fruit }}
29 29 <Checkbox-group v-model="fruit">
30   - <Checkbox label="香蕉"></Checkbox>
31   - <Checkbox label="苹果"></Checkbox>
32   - <Checkbox label="西瓜"></Checkbox>
  30 + <Row>
  31 + <i-col span="8">
  32 + <Checkbox label="香蕉"></Checkbox>
  33 + </i-col>
  34 + <i-col span="8">
  35 + <Checkbox label="苹果"></Checkbox>
  36 + </i-col>
  37 + <i-col span="8">
  38 + <Checkbox label="西瓜"></Checkbox>
  39 + </i-col>
  40 + </Row>
33 41 </Checkbox-group>
34 42 <br><br>
35 43 <div style="border-bottom: 1px solid #e9e9e9;padding-bottom:6px;margin-bottom:6px;">
... ...
examples/routers/form.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -11,6 +11,14 @@
11 11 <Form-item prop="user">
12 12 <Input v-model="formInline.user"></Input>
13 13 </Form-item>
  14 + <Form-item prop="targetKeys1">
  15 + <Transfer
  16 + filterable
  17 + :data="formInline.data1"
  18 + :target-keys="formInline.targetKeys1"
  19 + :render-format="render1"
  20 + @on-change="handleChange1"></Transfer>
  21 + </Form-item>
14 22 <Form-item>
15 23 <i-button type="primary" @click.native="handleSubmit('formInline')">登录</i-button>
16 24 </Form-item>
... ... @@ -22,6 +30,8 @@
22 30 data () {
23 31 return {
24 32 formInline: {
  33 + data1: this.getMockData(),
  34 + targetKeys1: this.getTargetKeys(),
25 35 date: new Date(),
26 36 user: '',
27 37 value2: [],
... ... @@ -102,6 +112,15 @@
102 112 message: '请输入',
103 113 trigger: 'change'
104 114 }
  115 + ],
  116 + targetKeys1: [
  117 + {
  118 + required: true,
  119 + type: 'array',
  120 + max: 2,
  121 + message: '太多了',
  122 + trigger: 'change'
  123 + }
105 124 ]
106 125 }
107 126 }
... ... @@ -118,6 +137,32 @@
118 137 },
119 138 handleInput (val) {
120 139 console.log(val)
  140 + },
  141 + getMockData () {
  142 + let mockData = [];
  143 + for (let i = 1; i <= 20; i++) {
  144 + mockData.push({
  145 + key: i.toString(),
  146 + label: '内容' + i,
  147 + description: '内容' + i + '的描述信息',
  148 + disabled: Math.random() * 3 < 1
  149 + });
  150 + }
  151 + return mockData;
  152 + },
  153 + getTargetKeys () {
  154 + return this.getMockData()
  155 + .filter(() => Math.random() * 2 > 1)
  156 + .map(item => item.key);
  157 + },
  158 + render1 (item) {
  159 + return item.label;
  160 + },
  161 + handleChange1 (newTargetKeys, direction, moveKeys) {
  162 + console.log(newTargetKeys);
  163 + console.log(direction);
  164 + console.log(moveKeys);
  165 + this.formInline.targetKeys1 = newTargetKeys;
121 166 }
122 167 }
123 168 }
... ...
examples/routers/menu.vue
  Show/Hide comments   View file @c86d77f
1   -<!--<template>-->
2   - <!--<div>-->
3   - <!--<Menu mode="horizontal" :theme="theme1" active-name="1" @on-select="s">-->
4   - <!--<Menu-item name="1">-->
5   - <!--<Icon type="ios-paper"></Icon>-->
6   - <!--内容管理-->
7   - <!--</Menu-item>-->
8   - <!--<Menu-item name="2">-->
9   - <!--<Icon type="ios-people"></Icon>-->
10   - <!--用户管理-->
11   - <!--</Menu-item>-->
12   - <!--<Submenu name="3">-->
13   - <!--<template slot="title">-->
14   - <!--<Icon type="stats-bars"></Icon>-->
15   - <!--统计分析-->
16   - <!--</template>-->
17   - <!--<Menu-group title="使用">-->
18   - <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
19   - <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
20   - <!--<Menu-item name="3-3">时段分析</Menu-item>-->
21   - <!--</Menu-group>-->
22   - <!--<Menu-group title="留存">-->
23   - <!--<Menu-item name="3-4">用户留存</Menu-item>-->
24   - <!--<Menu-item name="3-5">流失用户</Menu-item>-->
25   - <!--</Menu-group>-->
26   - <!--</Submenu>-->
27   - <!--<Menu-item name="4">-->
28   - <!--<Icon type="settings"></Icon>-->
29   - <!--综合设置-->
30   - <!--</Menu-item>-->
31   - <!--</Menu>-->
32   - <!--<br>-->
33   - <!--<p>切换主题</p>-->
34   - <!--<Radio-group v-model="theme1">-->
35   - <!--<Radio label="light"></Radio>-->
36   - <!--<Radio label="dark"></Radio>-->
37   - <!--<Radio label="primary"></Radio>-->
38   - <!--</Radio-group>-->
39   - <!--</div>-->
40   -<!--</template>-->
41   -<!--<script>-->
42   - <!--export default {-->
43   - <!--data () {-->
44   - <!--return {-->
45   - <!--theme1: 'light'-->
46   - <!--}-->
47   - <!--},-->
48   - <!--methods: {-->
49   - <!--s (s) {-->
50   - <!--console.log(s)-->
51   - <!--}-->
52   - <!--}-->
53   - <!--}-->
54   -<!--</script>-->
55   -
56   -
57 1 <template>
58 2 <div>
59   - <Row>
60   - <i-col span="8">
61   - <Menu :theme="theme2" @on-select="s">
62   - <Submenu name="1">
63   - <template slot="title">
64   - <Icon type="ios-paper"></Icon>
65   - 内容管理
66   - </template>
67   - <Menu-item name="1-1">文章管理</Menu-item>
68   - <Menu-item name="1-2">评论管理</Menu-item>
69   - <Menu-item name="1-3">举报管理</Menu-item>
70   - </Submenu>
71   - <Submenu name="2">
72   - <template slot="title">
73   - <Icon type="ios-people"></Icon>
74   - 用户管理
75   - </template>
76   - <Menu-item name="2-1">新增用户</Menu-item>
77   - <Menu-item name="2-2">活跃用户</Menu-item>
78   - </Submenu>
79   - <Submenu name="3">
80   - <template slot="title">
81   - <Icon type="stats-bars"></Icon>
82   - 统计分析
83   - </template>
84   - <Menu-group title="使用">
85   - <Menu-item name="3-1">新增和启动</Menu-item>
86   - <Menu-item name="3-2">活跃分析</Menu-item>
87   - <Menu-item name="3-3">时段分析</Menu-item>
88   - </Menu-group>
89   - <Menu-group title="留存">
90   - <Menu-item name="3-4">用户留存</Menu-item>
91   - <Menu-item name="3-5">流失用户</Menu-item>
92   - </Menu-group>
93   - </Submenu>
94   - </Menu>
95   - </i-col>
96   - <i-col span="8">
97   - <Menu :theme="theme2" active-name="1-2" :open-names="['1']" @on-select="s">
98   - <Submenu name="1">
99   - <template slot="title">
100   - <Icon type="ios-paper"></Icon>
101   - 内容管理
102   - </template>
103   - <Menu-item name="1-1">文章管理</Menu-item>
104   - <Menu-item name="1-2">评论管理</Menu-item>
105   - <Menu-item name="1-3">举报管理</Menu-item>
106   - </Submenu>
107   - <Submenu name="2">
108   - <template slot="title">
109   - <Icon type="ios-people"></Icon>
110   - 用户管理
111   - </template>
112   - <Menu-item name="2-1">新增用户</Menu-item>
113   - <Menu-item name="2-2">活跃用户</Menu-item>
114   - </Submenu>
115   - <Submenu name="3">
116   - <template slot="title">
117   - <Icon type="stats-bars"></Icon>
118   - 统计分析
119   - </template>
120   - <Menu-group title="使用">
121   - <Menu-item name="3-1">新增和启动</Menu-item>
122   - <Menu-item name="3-2">活跃分析</Menu-item>
123   - <Menu-item name="3-3">时段分析</Menu-item>
124   - </Menu-group>
125   - <Menu-group title="留存">
126   - <Menu-item name="3-4">用户留存</Menu-item>
127   - <Menu-item name="3-5">流失用户</Menu-item>
128   - </Menu-group>
129   - </Submenu>
130   - </Menu>
131   - </i-col>
132   - <i-col span="8">
133   - <Menu :theme="theme2" :open-names="['1']" accordion @on-select="s">
134   - <Submenu name="1">
135   - <template slot="title">
136   - <Icon type="ios-paper"></Icon>
137   - 内容管理
138   - </template>
139   - <Menu-item name="1-1">文章管理</Menu-item>
140   - <Menu-item name="1-2">评论管理</Menu-item>
141   - <Menu-item name="1-3">举报管理</Menu-item>
142   - </Submenu>
143   - <Submenu name="2">
144   - <template slot="title">
145   - <Icon type="ios-people"></Icon>
146   - 用户管理
147   - </template>
148   - <Menu-item name="2-1">新增用户</Menu-item>
149   - <Menu-item name="2-2">活跃用户</Menu-item>
150   - </Submenu>
  3 + <Menu mode="horizontal" :theme="theme1" active-name="1" @on-select="s">
  4 + <Row type="flex" justify="center" align="middle">
  5 + <i-col span="12">
  6 + <Menu-item name="1">
  7 + <Icon type="ios-paper"></Icon>
  8 + 内容管理
  9 + </Menu-item>
  10 + <Menu-item name="2">
  11 + <Icon type="ios-people"></Icon>
  12 + 用户管理
  13 + </Menu-item>
151 14 <Submenu name="3">
152 15 <template slot="title">
153 16 <Icon type="stats-bars"></Icon>
... ... @@ -163,14 +26,19 @@
163 26 <Menu-item name="3-5">流失用户</Menu-item>
164 27 </Menu-group>
165 28 </Submenu>
166   - </Menu>
167   - </i-col>
168   - </Row>
  29 + <Menu-item name="4">
  30 + <Icon type="settings"></Icon>
  31 + 综合设置
  32 + </Menu-item>
  33 + </i-col>
  34 + </Row>
  35 + </Menu>
169 36 <br>
170 37 <p>切换主题</p>
171   - <Radio-group v-model="theme2">
  38 + <Radio-group v-model="theme1">
172 39 <Radio label="light"></Radio>
173 40 <Radio label="dark"></Radio>
  41 + <Radio label="primary"></Radio>
174 42 </Radio-group>
175 43 </div>
176 44 </template>
... ... @@ -178,13 +46,149 @@
178 46 export default {
179 47 data () {
180 48 return {
181   - theme2: 'light'
  49 + theme1: 'light'
182 50 }
183 51 },
184 52 methods: {
185 53 s (s) {
186   - console.log(s);
  54 + console.log(s)
187 55 }
188 56 }
189 57 }
190 58 </script>
  59 +
  60 +
  61 +<!--<template>-->
  62 + <!--<div>-->
  63 + <!--<Row>-->
  64 + <!--<i-col span="8">-->
  65 + <!--<Menu :theme="theme2" @on-select="s">-->
  66 + <!--<Submenu name="1">-->
  67 + <!--<template slot="title">-->
  68 + <!--<Icon type="ios-paper"></Icon>-->
  69 + <!--内容管理-->
  70 + <!--</template>-->
  71 + <!--<Menu-item name="1-1">文章管理</Menu-item>-->
  72 + <!--<Menu-item name="1-2">评论管理</Menu-item>-->
  73 + <!--<Menu-item name="1-3">举报管理</Menu-item>-->
  74 + <!--</Submenu>-->
  75 + <!--<Submenu name="2">-->
  76 + <!--<template slot="title">-->
  77 + <!--<Icon type="ios-people"></Icon>-->
  78 + <!--用户管理-->
  79 + <!--</template>-->
  80 + <!--<Menu-item name="2-1">新增用户</Menu-item>-->
  81 + <!--<Menu-item name="2-2">活跃用户</Menu-item>-->
  82 + <!--</Submenu>-->
  83 + <!--<Submenu name="3">-->
  84 + <!--<template slot="title">-->
  85 + <!--<Icon type="stats-bars"></Icon>-->
  86 + <!--统计分析-->
  87 + <!--</template>-->
  88 + <!--<Menu-group title="使用">-->
  89 + <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
  90 + <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
  91 + <!--<Menu-item name="3-3">时段分析</Menu-item>-->
  92 + <!--</Menu-group>-->
  93 + <!--<Menu-group title="留存">-->
  94 + <!--<Menu-item name="3-4">用户留存</Menu-item>-->
  95 + <!--<Menu-item name="3-5">流失用户</Menu-item>-->
  96 + <!--</Menu-group>-->
  97 + <!--</Submenu>-->
  98 + <!--</Menu>-->
  99 + <!--</i-col>-->
  100 + <!--<i-col span="8">-->
  101 + <!--<Menu :theme="theme2" active-name="1-2" :open-names="['1']" @on-select="s">-->
  102 + <!--<Submenu name="1">-->
  103 + <!--<template slot="title">-->
  104 + <!--<Icon type="ios-paper"></Icon>-->
  105 + <!--内容管理-->
  106 + <!--</template>-->
  107 + <!--<Menu-item name="1-1">文章管理</Menu-item>-->
  108 + <!--<Menu-item name="1-2">评论管理</Menu-item>-->
  109 + <!--<Menu-item name="1-3">举报管理</Menu-item>-->
  110 + <!--</Submenu>-->
  111 + <!--<Submenu name="2">-->
  112 + <!--<template slot="title">-->
  113 + <!--<Icon type="ios-people"></Icon>-->
  114 + <!--用户管理-->
  115 + <!--</template>-->
  116 + <!--<Menu-item name="2-1">新增用户</Menu-item>-->
  117 + <!--<Menu-item name="2-2">活跃用户</Menu-item>-->
  118 + <!--</Submenu>-->
  119 + <!--<Submenu name="3">-->
  120 + <!--<template slot="title">-->
  121 + <!--<Icon type="stats-bars"></Icon>-->
  122 + <!--统计分析-->
  123 + <!--</template>-->
  124 + <!--<Menu-group title="使用">-->
  125 + <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
  126 + <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
  127 + <!--<Menu-item name="3-3">时段分析</Menu-item>-->
  128 + <!--</Menu-group>-->
  129 + <!--<Menu-group title="留存">-->
  130 + <!--<Menu-item name="3-4">用户留存</Menu-item>-->
  131 + <!--<Menu-item name="3-5">流失用户</Menu-item>-->
  132 + <!--</Menu-group>-->
  133 + <!--</Submenu>-->
  134 + <!--</Menu>-->
  135 + <!--</i-col>-->
  136 + <!--<i-col span="8">-->
  137 + <!--<Menu :theme="theme2" :open-names="['1']" accordion @on-select="s">-->
  138 + <!--<Submenu name="1">-->
  139 + <!--<template slot="title">-->
  140 + <!--<Icon type="ios-paper"></Icon>-->
  141 + <!--内容管理-->
  142 + <!--</template>-->
  143 + <!--<Menu-item name="1-1">文章管理</Menu-item>-->
  144 + <!--<Menu-item name="1-2">评论管理</Menu-item>-->
  145 + <!--<Menu-item name="1-3">举报管理</Menu-item>-->
  146 + <!--</Submenu>-->
  147 + <!--<Submenu name="2">-->
  148 + <!--<template slot="title">-->
  149 + <!--<Icon type="ios-people"></Icon>-->
  150 + <!--用户管理-->
  151 + <!--</template>-->
  152 + <!--<Menu-item name="2-1">新增用户</Menu-item>-->
  153 + <!--<Menu-item name="2-2">活跃用户</Menu-item>-->
  154 + <!--</Submenu>-->
  155 + <!--<Submenu name="3">-->
  156 + <!--<template slot="title">-->
  157 + <!--<Icon type="stats-bars"></Icon>-->
  158 + <!--统计分析-->
  159 + <!--</template>-->
  160 + <!--<Menu-group title="使用">-->
  161 + <!--<Menu-item name="3-1">新增和启动</Menu-item>-->
  162 + <!--<Menu-item name="3-2">活跃分析</Menu-item>-->
  163 + <!--<Menu-item name="3-3">时段分析</Menu-item>-->
  164 + <!--</Menu-group>-->
  165 + <!--<Menu-group title="留存">-->
  166 + <!--<Menu-item name="3-4">用户留存</Menu-item>-->
  167 + <!--<Menu-item name="3-5">流失用户</Menu-item>-->
  168 + <!--</Menu-group>-->
  169 + <!--</Submenu>-->
  170 + <!--</Menu>-->
  171 + <!--</i-col>-->
  172 + <!--</Row>-->
  173 + <!--<br>-->
  174 + <!--<p>切换主题</p>-->
  175 + <!--<Radio-group v-model="theme2">-->
  176 + <!--<Radio label="light"></Radio>-->
  177 + <!--<Radio label="dark"></Radio>-->
  178 + <!--</Radio-group>-->
  179 + <!--</div>-->
  180 +<!--</template>-->
  181 +<!--<script>-->
  182 + <!--export default {-->
  183 + <!--data () {-->
  184 + <!--return {-->
  185 + <!--theme2: 'light'-->
  186 + <!--}-->
  187 + <!--},-->
  188 + <!--methods: {-->
  189 + <!--s (s) {-->
  190 + <!--console.log(s);-->
  191 + <!--}-->
  192 + <!--}-->
  193 + <!--}-->
  194 +<!--</script>-->
... ...
examples/routers/modal.vue
  Show/Hide comments   View file @c86d77f
1 1 <template>
2 2 <div>
3   - <i-button @click.native="instance('info')">消息</i-button>
4   - <i-button @click.native="instance('success')">成功</i-button>
5   - <i-button @click.native="instance('warning')">警告</i-button>
6   - <i-button @click.native="instance('error')">错误</i-button>
  3 + <i-button @click.native="modal2 = true">自定义页头和页脚</i-button>
  4 + <Modal v-model="modal2" width="360">
  5 + <p slot="header" style="color:#f60;text-align:center">
  6 + <Icon type="information-circled"></Icon>
  7 + <span>删除确认</span>
  8 + </p>
  9 + <div style="text-align:center">
  10 + <p>此任务删除后，下游 10 个任务将无法执行。</p>
  11 + <p>是否继续删除？</p>
  12 + </div>
  13 + <div slot="footer">
  14 + <i-button type="error" size="large" long :loading="modal_loading" @click.native="del">删除</i-button>
  15 + </div>
  16 + </Modal>
7 17 </div>
8 18 </template>
9 19 <script>
10 20 export default {
  21 + data () {
  22 + return {
  23 + modal2: false,
  24 + modal_loading: false,
  25 + modal3: false,
  26 + modal4: false,
  27 + modal5: false
  28 + }
  29 + },
11 30 methods: {
12   - instance (type) {
13   - const title = '对话框的标题';
14   - const content = '<p>一些对话框内容</p><p>一些对话框内容</p>';
15   - switch (type) {
16   - case 'info':
17   - this.$Modal.info({
18   - title: title,
19   - content: content
20   - });
21   - break;
22   - case 'success':
23   - this.$Modal.success({
24   - title: title,
25   - content: content
26   - });
27   - break;
28   - case 'warning':
29   - this.$Modal.warning({
30   - title: title,
31   - content: content
32   - });
33   - break;
34   - case 'error':
35   - this.$Modal.error({
36   - title: title,
37   - content: content
38   - });
39   - break;
40   - }
  31 + del () {
  32 + this.modal_loading = true;
  33 + setTimeout(() => {
  34 + this.modal_loading = false;
  35 + this.modal2 = false;
  36 + this.$Message.success('删除成功');
  37 + }, 2000);
41 38 }
42 39 }
43 40 }
44 41 </script>
45   -
46   -
47   -<!--<template>-->
48   - <!--<div>-->
49   - <!--<i-button @click.native="confirm">标准</i-button>-->
50   - <!--<i-button @click.native="custom">自定义按钮文字</i-button>-->
51   - <!--<i-button @click.native="async">异步关闭</i-button>-->
52   - <!--</div>-->
53   -<!--</template>-->
54   -<!--<script>-->
55   - <!--export default {-->
56   - <!--methods: {-->
57   - <!--confirm () {-->
58   - <!--this.$Modal.confirm({-->
59   - <!--title: '确认对话框标题',-->
60   - <!--content: '<p>一些对话框内容</p><p>一些对话框内容</p>',-->
61   - <!--onOk: () => {-->
62   - <!--console.log('确定');-->
63   -<!--// this.$Message.info('点击了确定');-->
64   - <!--},-->
65   - <!--onCancel: () => {-->
66   - <!--console.log('取消');-->
67   -<!--// this.$Message.info('点击了取消');-->
68   - <!--}-->
69   - <!--});-->
70   - <!--},-->
71   - <!--custom () {-->
72   - <!--this.$Modal.confirm({-->
73   - <!--title: '确认对话框标题',-->
74   - <!--content: '<p>一些对话框内容</p><p>一些对话框内容</p>',-->
75   - <!--okText: 'OK',-->
76   - <!--cancelText: 'Cancel'-->
77   - <!--});-->
78   - <!--},-->
79   - <!--async () {-->
80   - <!--this.$Modal.confirm({-->
81   - <!--title: '确认对话框标题',-->
82   - <!--content: '<p>对话框将在 2秒 后关闭</p>',-->
83   - <!--loading: true,-->
84   - <!--onOk: () => {-->
85   - <!--setTimeout(() => {-->
86   - <!--this.$Modal.remove();-->
87   -<!--// this.$Message.info('异步关闭了对话框');-->
88   - <!--}, 2000);-->
89   - <!--}-->
90   - <!--});-->
91   - <!--}-->
92   - <!--}-->
93   - <!--}-->
94   -<!--</script>-->
... ...
examples/routers/radio.vue
  Show/Hide comments   View file @c86d77f
1 1 <template>
2 2 <div>
3   - <Radio v-model="single" @on-change="c">Radio</Radio>
4   - <Radio-group v-model="phone" type="button" @on-change="c">
5   - <Radio label="apple">
6   - <Icon type="social-apple"></Icon>
7   - <span>Apple</span>
8   - </Radio>
9   - <Radio label="android">
10   - <Icon type="social-android"></Icon>
11   - <span>Android</span>
12   - </Radio>
13   - <Radio label="windows">
14   - <Icon type="social-windows"></Icon>
15   - <span>Windows</span>
16   - </Radio>
  3 + <Radio-group v-model="phone">
  4 + <Row>
  5 + <i-col span="8">
  6 + <Radio label="apple">
  7 + <Icon type="social-apple"></Icon>
  8 + <span>Apple</span>
  9 + </Radio>
  10 + </i-col>
  11 + <i-col span="8">
  12 + <Radio label="android">
  13 + <Icon type="social-android"></Icon>
  14 + <span>Android</span>
  15 + </Radio>
  16 + </i-col>
  17 + <i-col span="8">
  18 + <Radio label="windows">
  19 + <Icon type="social-windows"></Icon>
  20 + <span>Windows</span>
  21 + </Radio>
  22 + </i-col>
  23 + </Row>
17 24 </Radio-group>
18   - <Radio-group v-model="animal">
19   - <Radio label="金斑蝶"></Radio>
20   - <Radio label="爪哇犀牛"></Radio>
21   - <Radio label="印度黑羚"></Radio>
22   - </Radio-group>
23   - {{ phone }}
24   - <div @click="phone = 'apple'">apple</div>
25   - <div @click="single = true"> single</div>{{ single }}
26 25 </div>
27 26 </template>
28 27 <script>
... ... @@ -30,13 +29,7 @@
30 29 data () {
31 30 return {
32 31 phone: 'apple',
33   - animal: '爪哇犀牛',
34   - single: false
35   - }
36   - },
37   - methods: {
38   - c (data) {
39   - console.log(data)
  32 + animal: '爪哇犀牛'
40 33 }
41 34 }
42 35 }
... ...
examples/routers/slider.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -6,8 +6,8 @@
6 6 {{ value1 }}{{value2}}
7 7 <div @click="value1 = 13">change value1</div>
8 8 <br>
9   - <Slider :value="value9" :tip-format="format"></Slider>
10   - <Slider :value="value10" :tip-format="hideFormat"></Slider>
  9 + <Slider v-model="value9" :tip-format="format"></Slider>
  10 + <Slider v-model="value10" :tip-format="hideFormat"></Slider>
11 11 </div>
12 12 </template>
13 13 <script>
... ...
examples/routers/table.vue
  Show/Hide comments   View file @c86d77f
1   -<!--<template>-->
2   - <!--<Card>-->
3   - <!--<Table border :content="self" :columns="columns7" :data="data6"></Table>-->
4   - <!--</Card>-->
5   -<!--</template>-->
6   -<!--<script>-->
7   - <!--export default {-->
8   - <!--data () {-->
9   - <!--return {-->
10   - <!--self: this,-->
11   - <!--columns7: [-->
12   - <!--{-->
13   - <!--title: '姓名',-->
14   - <!--key: 'name',-->
15   - <!--render (row, column, index) {-->
16   - <!--return `<Icon type="person"></Icon> <strong>${row.name}</strong>`;-->
17   - <!--}-->
18   - <!--},-->
19   - <!--{-->
20   - <!--title: '年龄',-->
21   - <!--key: 'age'-->
22   - <!--},-->
23   - <!--{-->
24   - <!--title: '地址',-->
25   - <!--key: 'address'-->
26   - <!--},-->
27   - <!--{-->
28   - <!--title: '操作',-->
29   - <!--key: 'action',-->
30   - <!--width: 150,-->
31   - <!--align: 'center',-->
32   - <!--render (row, column, index) {-->
33   - <!--return `<i-button type="primary" size="small" @click.native="show(${index})">查看</i-button> <i-button type="error" size="small" @click.native="remove(${index})">删除</i-button>`;-->
34   - <!--}-->
35   - <!--}-->
36   - <!--],-->
37   - <!--data6: [-->
38   - <!--{-->
39   - <!--name: '王小明',-->
40   - <!--age: 18,-->
41   - <!--address: '北京市朝阳区芍药居'-->
42   - <!--},-->
43   - <!--{-->
44   - <!--name: '张小刚',-->
45   - <!--age: 25,-->
46   - <!--address: '北京市海淀区西二旗'-->
47   - <!--},-->
48   - <!--{-->
49   - <!--name: '李小红',-->
50   - <!--age: 30,-->
51   - <!--address: '上海市浦东新区世纪大道'-->
52   - <!--},-->
53   - <!--{-->
54   - <!--name: '周小伟',-->
55   - <!--age: 26,-->
56   - <!--address: '深圳市南山区深南大道'-->
57   - <!--}-->
58   - <!--]-->
59   - <!--}-->
60   - <!--},-->
61   - <!--methods: {-->
62   - <!--show (index) {-->
63   - <!--console.log(`姓名：${this.data6[index].name}<br>年龄：${this.data6[index].age}<br>地址：${this.data6[index].address}`)-->
64   - <!--},-->
65   - <!--remove (index) {-->
66   - <!--this.data6.splice(index, 1);-->
67   - <!--}-->
68   - <!--},-->
69   - <!--mounted () {-->
70   - <!--setTimeout(() => {-->
71   -<!--// this.data6.splice(2, 1);-->
72   - <!--}, 3000)-->
73   - <!--}-->
74   - <!--}-->
75   -<!--</script>-->
76   -
77   -
78 1 <template>
79   - <div>
80   - <i-table border :columns="columns6" :data="data5"></i-table>
81   - </div>
  2 + <i-table border :content="self" :columns="columns7" :data="data6"></i-table>
82 3 </template>
83 4 <script>
84 5 export default {
85 6 data () {
86 7 return {
87   - columns6: [
88   - {
89   - title: '日期',
90   - key: 'date'
91   - },
  8 + info: '123',
  9 + self: this,
  10 + columns7: [
92 11 {
93 12 title: '姓名',
94   - key: 'name'
  13 + key: 'name',
  14 +// render (row, column, index) {
  15 +// return `<Icon type="person"></Icon> <strong>${row.name}</strong>`;
  16 +// }
95 17 },
96 18 {
97 19 title: '年龄',
98   - key: 'age',
99   - filters: [
100   - {
101   - label: '大于25岁',
102   - value: 1
103   - },
104   - {
105   - label: '小于25岁',
106   - value: 2
107   - }
108   - ],
109   - filterMultiple: false,
110   - filterMethod (value, row) {
111   - if (value === 1) {
112   - return row.age > 25;
113   - } else if (value === 2) {
114   - return row.age < 25;
115   - }
116   - }
  20 + key: 'age'
117 21 },
118 22 {
119 23 title: '地址',
120   - key: 'address',
121   - filters: [
122   - {
123   - label: '北京',
124   - value: '北京'
125   - },
126   - {
127   - label: '上海',
128   - value: '上海'
129   - },
130   - {
131   - label: '深圳',
132   - value: '深圳'
133   - }
134   - ],
135   - filterMethod (value, row) {
136   - return row.address.indexOf(value) > -1;
  24 + key: 'address'
  25 + },
  26 + {
  27 + title: '操作',
  28 + key: 'action',
  29 + width: 150,
  30 + align: 'center',
  31 + render (row, column, index) {
  32 + return `<i-button type="primary" size="small" @click="show(${index})">{{ info }}查看</i-button> <i-button type="error" size="small" @click="remove(${index})">删除</i-button>`;
137 33 }
138 34 }
139 35 ],
140   - data5: [
  36 + data6: [
141 37 {
142 38 name: '王小明',
143 39 age: 18,
144   - address: '北京市朝阳区芍药居',
145   - date: '2016-10-03'
146   - },
147   - {
148   - name: '张小刚',
149   - age: 25,
150   - address: '北京市海淀区西二旗',
151   - date: '2016-10-01'
  40 + address: '北京市朝阳区芍药居'
152 41 },
153   - {
154   - name: '李小红',
155   - age: 30,
156   - address: '上海市浦东新区世纪大道',
157   - date: '2016-10-02'
158   - },
159   - {
160   - name: '周小伟',
161   - age: 26,
162   - address: '深圳市南山区深南大道',
163   - date: '2016-10-04'
164   - }
  42 +// {
  43 +// name: '张小刚',
  44 +// age: 25,
  45 +// address: '北京市海淀区西二旗'
  46 +// },
  47 +// {
  48 +// name: '李小红',
  49 +// age: 30,
  50 +// address: '上海市浦东新区世纪大道'
  51 +// },
  52 +// {
  53 +// name: '周小伟',
  54 +// age: 26,
  55 +// address: '深圳市南山区深南大道'
  56 +// }
165 57 ]
166 58 }
  59 + },
  60 + computed: {
  61 + dddfff () {
  62 + return this.info
  63 + }
  64 + },
  65 + methods: {
  66 + show (index) {
  67 + this.$Modal.info({
  68 + title: '用户信息',
  69 + content: `姓名：${this.data6[index].name}<br>年龄：${this.data6[index].age}<br>地址：${this.data6[index].address}`
  70 + })
  71 + },
  72 + remove (index) {
  73 + this.data6.splice(index, 1);
  74 + }
  75 + },
  76 + mounted () {
  77 + setTimeout(() => {
  78 + this.info = '444';
  79 + }, 3000);
167 80 }
168 81 }
169 82 </script>
... ...
examples/routers/transfer.vue
  Show/Hide comments   View file @c86d77f
1   -<!--<template>-->
2   - <!--<div>-->
3   - <!--<Transfer-->
4   - <!--:data="data1"-->
5   - <!--filterable-->
6   - <!--:target-keys="targetKeys1"-->
7   - <!--:render-format="render1"-->
8   - <!--@on-change="handleChange1"></Transfer>-->
9   - <!--</div>-->
10   -<!--</template>-->
11   -<!--<script>-->
12   - <!--export default {-->
13   - <!--data () {-->
14   - <!--return {-->
15   - <!--data1: this.getMockData(),-->
16   - <!--targetKeys1: this.getTargetKeys()-->
17   - <!--}-->
18   - <!--},-->
19   - <!--methods: {-->
20   - <!--getMockData () {-->
21   - <!--let mockData = [];-->
22   - <!--for (let i = 1; i <= 20; i++) {-->
23   - <!--mockData.push({-->
24   - <!--key: i.toString(),-->
25   - <!--label: '内容' + i,-->
26   - <!--description: '内容' + i + '的描述信息',-->
27   - <!--disabled: Math.random() * 3 < 1-->
28   - <!--});-->
29   - <!--}-->
30   - <!--return mockData;-->
31   - <!--},-->
32   - <!--getTargetKeys () {-->
33   - <!--return this.getMockData()-->
34   - <!--.filter(() => Math.random() * 2 > 1)-->
35   - <!--.map(item => item.key);-->
36   - <!--},-->
37   - <!--render1 (item) {-->
38   - <!--return item.label;-->
39   - <!--},-->
40   - <!--handleChange1 (newTargetKeys, direction, moveKeys) {-->
41   - <!--console.log(newTargetKeys);-->
42   - <!--console.log(direction);-->
43   - <!--console.log(moveKeys);-->
44   - <!--this.targetKeys1 = newTargetKeys;-->
45   - <!--}-->
46   - <!--}-->
47   - <!--}-->
48   -<!--</script>-->
49   -
50   -
51 1 <template>
52   - <Transfer
53   - :data="data3"
54   - :target-keys="targetKeys3"
55   - :list-style="listStyle"
56   - :render-format="render3"
57   - :operations="['向左移动','向右移动']"
58   - filterable
59   - @on-change="handleChange3">
60   - <div :style="{float: 'right', margin: '5px'}">
61   - <Button type="ghost" size="small" @click.native="reloadMockData">刷新</Button>
62   - </div>
63   - </Transfer>
  2 + <div>
  3 + <Transfer
  4 + :data="data1"
  5 + filterable
  6 + :target-keys="targetKeys1"
  7 + :render-format="render1"
  8 + @on-change="handleChange1"></Transfer>
  9 + </div>
64 10 </template>
65 11 <script>
66 12 export default {
67 13 data () {
68 14 return {
69   - data3: this.getMockData(),
70   - targetKeys3: this.getTargetKeys(),
71   - listStyle: {
72   - width: '250px',
73   - height: '300px'
74   - }
  15 + data1: this.getMockData(),
  16 + targetKeys1: this.getTargetKeys()
75 17 }
76 18 },
77 19 methods: {
... ... @@ -92,20 +34,78 @@
92 34 .filter(() => Math.random() * 2 > 1)
93 35 .map(item => item.key);
94 36 },
95   - handleChange3 (newTargetKeys) {
96   - this.targetKeys3 = newTargetKeys;
  37 + render1 (item) {
  38 + return item.label;
97 39 },
98   - render3 (item) {
99   - return item.label + ' - ' + item.description;
100   - },
101   - reloadMockData () {
102   - this.data3 = this.getMockData();
103   - this.targetKeys3 = this.getTargetKeys();
  40 + handleChange1 (newTargetKeys, direction, moveKeys) {
  41 + console.log(newTargetKeys);
  42 + console.log(direction);
  43 + console.log(moveKeys);
  44 + this.targetKeys1 = newTargetKeys;
104 45 }
105 46 }
106 47 }
107 48 </script>
108 49  
  50 +
  51 +<!--<template>-->
  52 + <!--<Transfer-->
  53 + <!--:data="data3"-->
  54 + <!--:target-keys="targetKeys3"-->
  55 + <!--:list-style="listStyle"-->
  56 + <!--:render-format="render3"-->
  57 + <!--:operations="['向左移动','向右移动']"-->
  58 + <!--filterable-->
  59 + <!--@on-change="handleChange3">-->
  60 + <!--<div :style="{float: 'right', margin: '5px'}">-->
  61 + <!--<Button type="ghost" size="small" @click.native="reloadMockData">刷新</Button>-->
  62 + <!--</div>-->
  63 + <!--</Transfer>-->
  64 +<!--</template>-->
  65 +<!--<script>-->
  66 + <!--export default {-->
  67 + <!--data () {-->
  68 + <!--return {-->
  69 + <!--data3: this.getMockData(),-->
  70 + <!--targetKeys3: this.getTargetKeys(),-->
  71 + <!--listStyle: {-->
  72 + <!--width: '250px',-->
  73 + <!--height: '300px'-->
  74 + <!--}-->
  75 + <!--}-->
  76 + <!--},-->
  77 + <!--methods: {-->
  78 + <!--getMockData () {-->
  79 + <!--let mockData = [];-->
  80 + <!--for (let i = 1; i <= 20; i++) {-->
  81 + <!--mockData.push({-->
  82 + <!--key: i.toString(),-->
  83 + <!--label: '内容' + i,-->
  84 + <!--description: '内容' + i + '的描述信息',-->
  85 + <!--disabled: Math.random() * 3 < 1-->
  86 + <!--});-->
  87 + <!--}-->
  88 + <!--return mockData;-->
  89 + <!--},-->
  90 + <!--getTargetKeys () {-->
  91 + <!--return this.getMockData()-->
  92 + <!--.filter(() => Math.random() * 2 > 1)-->
  93 + <!--.map(item => item.key);-->
  94 + <!--},-->
  95 + <!--handleChange3 (newTargetKeys) {-->
  96 + <!--this.targetKeys3 = newTargetKeys;-->
  97 + <!--},-->
  98 + <!--render3 (item) {-->
  99 + <!--return item.label + ' - ' + item.description;-->
  100 + <!--},-->
  101 + <!--reloadMockData () {-->
  102 + <!--this.data3 = this.getMockData();-->
  103 + <!--this.targetKeys3 = this.getTargetKeys();-->
  104 + <!--}-->
  105 + <!--}-->
  106 + <!--}-->
  107 +<!--</script>-->
  108 +
109 109 <!--<template>-->
110 110 <!--<Transfer-->
111 111 <!--:data="data4"-->
... ...
examples/routers/upload.vue
  Show/Hide comments   View file @c86d77f
  1 +<!--<template>-->
  2 + <!--<div>-->
  3 + <!--<div class="demo-upload-list" v-for="item in uploadList">-->
  4 + <!--<template v-if="item.status === 'finished'">-->
  5 + <!--<img :src="item.url">-->
  6 + <!--<div class="demo-upload-list-cover">-->
  7 + <!--<Icon type="ios-eye-outline" @click.native="handleView(item.name)"></Icon>-->
  8 + <!--<Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon>-->
  9 + <!--</div>-->
  10 + <!--</template>-->
  11 + <!--<template v-else>-->
  12 + <!--<i-progress v-if="item.showProgress" :percent="item.percentage" hide-info></i-progress>-->
  13 + <!--</template>-->
  14 + <!--</div>-->
  15 + <!--<Upload-->
  16 + <!--ref="upload"-->
  17 + <!--:show-upload-list="false"-->
  18 + <!--:default-file-list="defaultList"-->
  19 + <!--:on-success="handleSuccess"-->
  20 + <!--:format="['jpg','jpeg','png']"-->
  21 + <!--:max-size="2048"-->
  22 + <!--:on-format-error="handleFormatError"-->
  23 + <!--:on-exceeded-size="handleMaxSize"-->
  24 + <!--@on-progress="handleProgress"-->
  25 + <!--:before-upload="handleBeforeUpload"-->
  26 + <!--multiple-->
  27 + <!--type="drag"-->
  28 + <!--action="//jsonplaceholder.typicode.com/posts/"-->
  29 + <!--style="display: inline-block;width:58px;">-->
  30 + <!--<div style="width: 58px;height:58px;line-height: 58px;">-->
  31 + <!--<Icon type="camera" size="20"></Icon>-->
  32 + <!--</div>-->
  33 + <!--</Upload>-->
  34 + <!--{{ visible }}-->
  35 + <!--</div>-->
  36 +<!--</template>-->
  37 +<!--<script>-->
  38 + <!--export default {-->
  39 + <!--data () {-->
  40 + <!--return {-->
  41 + <!--defaultList: [-->
  42 + <!--{-->
  43 + <!--'name': 'a42bdcc1178e62b4694c830f028db5c0',-->
  44 + <!--'url': 'https://o5wwk8baw.qnssl.com/a42bdcc1178e62b4694c830f028db5c0/avatar'-->
  45 + <!--},-->
  46 + <!--{-->
  47 + <!--'name': 'bc7521e033abdd1e92222d733590f104',-->
  48 + <!--'url': 'https://o5wwk8baw.qnssl.com/bc7521e033abdd1e92222d733590f104/avatar'-->
  49 + <!--}-->
  50 + <!--],-->
  51 + <!--imgName: '',-->
  52 + <!--visible: false,-->
  53 + <!--uploadList: []-->
  54 + <!--}-->
  55 + <!--},-->
  56 + <!--computed: {-->
  57 +<!--// uploadList () {-->
  58 +<!--// return this.$refs.upload ? this.$refs.upload.fileList : [];-->
  59 +<!--// }-->
  60 + <!--},-->
  61 + <!--watch: {-->
  62 +
  63 + <!--},-->
  64 + <!--mounted () {-->
  65 + <!--this.uploadList = this.$refs.upload.fileList;-->
  66 +<!--// console.log(this.$refs.upload.fileList)-->
  67 + <!--},-->
  68 + <!--methods: {-->
  69 + <!--handleView (name) {-->
  70 + <!--this.imgName = name;-->
  71 + <!--this.visible = true;-->
  72 + <!--},-->
  73 + <!--handleRemove (file) {-->
  74 + <!--// 从 upload 实例删除数据-->
  75 + <!--const fileList = this.$refs.upload.fileList;-->
  76 + <!--this.$refs.upload.fileList.splice(fileList.indexOf(file), 1);-->
  77 + <!--},-->
  78 + <!--handleSuccess (res, file) {-->
  79 + <!--// 因为上传过程为实例，这里模拟添加 url-->
  80 + <!--file.url = 'https://o5wwk8baw.qnssl.com/7eb99afb9d5f317c912f08b5212fd69a/avatar';-->
  81 + <!--file.name = '7eb99afb9d5f317c912f08b5212fd69a';-->
  82 + <!--},-->
  83 + <!--handleFormatError (file) {-->
  84 + <!--this.$Notice.warning({-->
  85 + <!--title: '文件格式不正确',-->
  86 + <!--desc: '文件 ' + file.name + ' 格式不正确，请上传 jpg 或 png 格式的图片。'-->
  87 + <!--});-->
  88 + <!--},-->
  89 + <!--handleMaxSize (file) {-->
  90 + <!--this.$Notice.warning({-->
  91 + <!--title: '超出文件大小限制',-->
  92 + <!--desc: '文件 ' + file.name + ' 太大，不能超过 2M。'-->
  93 + <!--});-->
  94 + <!--},-->
  95 + <!--handleBeforeUpload () {-->
  96 + <!--const check = this.uploadList.length < 5;-->
  97 + <!--if (!check) {-->
  98 + <!--this.$Notice.warning({-->
  99 + <!--title: '最多只能上传 5 张图片。'-->
  100 + <!--});-->
  101 + <!--}-->
  102 + <!--return check;-->
  103 + <!--},-->
  104 + <!--handleProgress (s) {-->
  105 + <!--console.log(s)-->
  106 + <!--}-->
  107 + <!--}-->
  108 + <!--}-->
  109 +<!--</script>-->
  110 +<!--<style>-->
  111 + <!--.demo-upload-list{-->
  112 + <!--display: inline-block;-->
  113 + <!--width: 60px;-->
  114 + <!--height: 60px;-->
  115 + <!--text-align: center;-->
  116 + <!--line-height: 60px;-->
  117 + <!--border: 1px solid transparent;-->
  118 + <!--border-radius: 4px;-->
  119 + <!--overflow: hidden;-->
  120 + <!--background: #fff;-->
  121 + <!--position: relative;-->
  122 + <!--box-shadow: 0 1px 1px rgba(0,0,0,.2);-->
  123 + <!--margin-right: 4px;-->
  124 + <!--}-->
  125 + <!--.demo-upload-list img{-->
  126 + <!--width: 100%;-->
  127 + <!--height: 100%;-->
  128 + <!--}-->
  129 + <!--.demo-upload-list-cover{-->
  130 + <!--display: none;-->
  131 + <!--position: absolute;-->
  132 + <!--top: 0;-->
  133 + <!--bottom: 0;-->
  134 + <!--left: 0;-->
  135 + <!--right: 0;-->
  136 + <!--background: rgba(0,0,0,.6);-->
  137 + <!--}-->
  138 + <!--.demo-upload-list:hover .demo-upload-list-cover{-->
  139 + <!--display: block;-->
  140 + <!--}-->
  141 + <!--.demo-upload-list-cover i{-->
  142 + <!--color: #fff;-->
  143 + <!--font-size: 20px;-->
  144 + <!--cursor: pointer;-->
  145 + <!--margin: 0 2px;-->
  146 + <!--}-->
  147 +<!--</style>-->
  148 +
  149 +
1 150 <template>
2 151 <div>
3   - <div class="demo-upload-list" v-for="item in uploadList">
4   - <template v-if="item.status === 'finished'">
5   - <img :src="item.url">
6   - <div class="demo-upload-list-cover">
7   - <Icon type="ios-eye-outline" @click.native="handleView(item.name)"></Icon>
8   - <Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon>
9   - </div>
10   - </template>
11   - <template v-else>
12   - <i-progress v-if="item.showProgress" :percent="item.percentage" hide-info></i-progress>
13   - </template>
14   - </div>
15   - <Upload
16   - ref="upload"
17   - :show-upload-list="false"
18   - :default-file-list="defaultList"
19   - :on-success="handleSuccess"
20   - :format="['jpg','jpeg','png']"
21   - :max-size="2048"
22   - :on-format-error="handleFormatError"
23   - :on-exceeded-size="handleMaxSize"
24   - @on-progress="handleProgress"
25   - :before-upload="handleBeforeUpload"
26   - multiple
27   - type="drag"
28   - action="//jsonplaceholder.typicode.com/posts/"
29   - style="display: inline-block;width:58px;">
30   - <div style="width: 58px;height:58px;line-height: 58px;">
31   - <Icon type="camera" size="20"></Icon>
32   - </div>
  152 + <Upload action="//jsonplaceholder.typicode.com/posts/" :before-upload="handleBeforeUpload" ref="file">
  153 + <i-button type="ghost" icon="ios-cloud-upload-outline">选择文件</i-button>
33 154 </Upload>
34   - {{ visible }}
  155 + <i-button @click.native="handleUpload">上传</i-button>
35 156 </div>
36 157 </template>
37 158 <script>
38 159 export default {
39 160 data () {
40 161 return {
41   - defaultList: [
42   - {
43   - 'name': 'a42bdcc1178e62b4694c830f028db5c0',
44   - 'url': 'https://o5wwk8baw.qnssl.com/a42bdcc1178e62b4694c830f028db5c0/avatar'
45   - },
46   - {
47   - 'name': 'bc7521e033abdd1e92222d733590f104',
48   - 'url': 'https://o5wwk8baw.qnssl.com/bc7521e033abdd1e92222d733590f104/avatar'
49   - }
50   - ],
51   - imgName: '',
52   - visible: false,
53   - uploadList: []
  162 + file: null
54 163 }
55 164 },
56   - computed: {
57   -// uploadList () {
58   -// return this.$refs.upload ? this.$refs.upload.fileList : [];
59   -// }
60   - },
61   - watch: {
62   -
63   - },
64   - mounted () {
65   - this.uploadList = this.$refs.upload.fileList;
66   -// console.log(this.$refs.upload.fileList)
67   - },
68 165 methods: {
69   - handleView (name) {
70   - this.imgName = name;
71   - this.visible = true;
72   - },
73   - handleRemove (file) {
74   - // 从 upload 实例删除数据
75   - const fileList = this.$refs.upload.fileList;
76   - this.$refs.upload.fileList.splice(fileList.indexOf(file), 1);
77   - },
78   - handleSuccess (res, file) {
79   - // 因为上传过程为实例，这里模拟添加 url
80   - file.url = 'https://o5wwk8baw.qnssl.com/7eb99afb9d5f317c912f08b5212fd69a/avatar';
81   - file.name = '7eb99afb9d5f317c912f08b5212fd69a';
  166 + handleBeforeUpload (file) {
  167 + this.file = file;
  168 + return false;
82 169 },
83   - handleFormatError (file) {
84   - this.$Notice.warning({
85   - title: '文件格式不正确',
86   - desc: '文件 ' + file.name + ' 格式不正确，请上传 jpg 或 png 格式的图片。'
87   - });
88   - },
89   - handleMaxSize (file) {
90   - this.$Notice.warning({
91   - title: '超出文件大小限制',
92   - desc: '文件 ' + file.name + ' 太大，不能超过 2M。'
93   - });
94   - },
95   - handleBeforeUpload () {
96   - const check = this.uploadList.length < 5;
97   - if (!check) {
98   - this.$Notice.warning({
99   - title: '最多只能上传 5 张图片。'
100   - });
101   - }
102   - return check;
103   - },
104   - handleProgress (s) {
105   - console.log(s)
  170 + handleUpload () {
  171 + this.$refs.file.post(this.file);
106 172 }
107 173 }
108 174 }
109 175 </script>
110   -<style>
111   - .demo-upload-list{
112   - display: inline-block;
113   - width: 60px;
114   - height: 60px;
115   - text-align: center;
116   - line-height: 60px;
117   - border: 1px solid transparent;
118   - border-radius: 4px;
119   - overflow: hidden;
120   - background: #fff;
121   - position: relative;
122   - box-shadow: 0 1px 1px rgba(0,0,0,.2);
123   - margin-right: 4px;
124   - }
125   - .demo-upload-list img{
126   - width: 100%;
127   - height: 100%;
128   - }
129   - .demo-upload-list-cover{
130   - display: none;
131   - position: absolute;
132   - top: 0;
133   - bottom: 0;
134   - left: 0;
135   - right: 0;
136   - background: rgba(0,0,0,.6);
137   - }
138   - .demo-upload-list:hover .demo-upload-list-cover{
139   - display: block;
140   - }
141   - .demo-upload-list-cover i{
142   - color: #fff;
143   - font-size: 20px;
144   - cursor: pointer;
145   - margin: 0 2px;
146   - }
147   -</style>
... ...
package.json
  Show/Hide comments   View file @c86d77f
1 1 {
2 2 "name": "iview",
3   - "version": "2.0.0-rc.4",
  3 + "version": "2.0.0-rc.5",
4 4 "title": "iView",
5 5 "description": "A high quality UI components Library with Vue.js",
6 6 "homepage": "http://www.iviewui.com",
... ...
src/components/button/button.vue
  Show/Hide comments   View file @c86d77f
1 1 <template>
2   - <button :type="htmlType" :class="classes" :disabled="disabled">
  2 + <button :type="htmlType" :class="classes" :disabled="disabled" @click="handleClick">
3 3 <Icon class="ivu-load-loop" type="load-c" v-if="loading"></Icon>
4 4 <Icon :type="icon" v-if="icon && !loading"></Icon>
5 5 <span v-if="showSlot" ref="slot"><slot></slot></span>
... ... @@ -64,8 +64,13 @@
64 64 ];
65 65 }
66 66 },
  67 + methods: {
  68 + handleClick (event) {
  69 + this.$emit('click', event);
  70 + }
  71 + },
67 72 mounted () {
68   - this.showSlot = this.$refs.slot.innerHTML.replace(/\n/g, '').replace(/<!--[\w\W\r\n]*?-->/gmi, '') !== '';
  73 + this.showSlot = this.$slots.default !== undefined;
69 74 }
70 75 };
71 76 </script>
... ...
src/components/carousel/carousel-item.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -25,11 +25,9 @@
25 25 }
26 26 },
27 27 mounted () {
28   - // todo while
29 28 this.$parent.slotChange();
30 29 },
31 30 beforeDestroy () {
32   - // todo while
33 31 this.$parent.slotChange();
34 32 }
35 33 };
... ...
src/components/checkbox/checkbox-group.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -4,6 +4,7 @@
4 4 </div>
5 5 </template>
6 6 <script>
  7 + import { findComponentsDownward } from '../../utils/assist';
7 8 import Emitter from '../../mixins/emitter';
8 9 const prefixCls = 'ivu-checkbox-group';
9 10  
... ... @@ -20,7 +21,8 @@
20 21 },
21 22 data () {
22 23 return {
23   - currentValue: this.value
  24 + currentValue: this.value,
  25 + childrens: []
24 26 };
25 27 },
26 28 computed: {
... ... @@ -34,15 +36,18 @@
34 36 methods: {
35 37 updateModel (update) {
36 38 const value = this.value;
  39 + this.childrens = findComponentsDownward(this, 'Checkbox');
37 40  
38   - this.$children.forEach((child) => {
39   - child.model = value;
  41 + if (this.childrens) {
  42 + this.childrens.forEach(child => {
  43 + child.model = value;
40 44  
41   - if (update) {
42   - child.currentValue = value.indexOf(child.label) >= 0;
43   - child.group = true;
44   - }
45   - });
  45 + if (update) {
  46 + child.currentValue = value.indexOf(child.label) >= 0;
  47 + child.group = true;
  48 + }
  49 + });
  50 + }
46 51 },
47 52 change (data) {
48 53 this.currentValue = data;
... ...
src/components/checkbox/checkbox.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -18,10 +18,11 @@
18 18 :checked="currentValue"
19 19 @change="change">
20 20 </span>
21   - <slot v-if="showSlot"><span ref="slot">{{ label }}</span></slot>
  21 + <slot><span v-if="showSlot">{{ label }}</span></slot>
22 22 </label>
23 23 </template>
24 24 <script>
  25 + import { findComponentUpward } from '../../utils/assist';
25 26 import Emitter from '../../mixins/emitter';
26 27  
27 28 const prefixCls = 'ivu-checkbox';
... ... @@ -51,7 +52,8 @@
51 52 model: [],
52 53 currentValue: this.value,
53 54 group: false,
54   - showSlot: true
  55 + showSlot: true,
  56 + parent: findComponentUpward(this, 'CheckboxGroup')
55 57 };
56 58 },
57 59 computed: {
... ... @@ -83,16 +85,11 @@
83 85 }
84 86 },
85 87 mounted () {
86   - // todo 使用 while向上查找
87   - if (this.$parent && this.$parent.$options.name === 'CheckboxGroup') this.group = true;
  88 + this.parent = findComponentUpward(this, 'CheckboxGroup');
  89 + if (this.parent) this.group = true;
88 90 if (!this.group) {
89 91 this.updateModel();
90   -// if (this.$refs.slot && this.$refs.slot.innerHTML === '') {
91   -// this.showSlot = false;
92   -// }
93   - if (this.$slots.default === undefined) {
94   - this.showSlot = false;
95   - }
  92 + this.showSlot = this.$slots.default !== undefined;
96 93 }
97 94 },
98 95 methods: {
... ...
src/components/collapse/panel.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -48,7 +48,6 @@
48 48 },
49 49 methods: {
50 50 toggle () {
51   - // todo while向上查找
52 51 this.$parent.toggle({
53 52 name: this.name || this.index,
54 53 isActive: this.isActive
... ...
src/components/input/input.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -151,8 +151,8 @@
151 151 this.$emit('on-focus', event);
152 152 },
153 153 handleBlur (event) {
154   - this.$emit('on-blur', event);
155   - if (!findComponentUpward(this, ['DatePicker', 'TimePicker', 'Cascader'])) {
  154 + this.$emit('on-blur', envent);
  155 + if (!findComponentUpward(this, ['DatePicker', 'TimePicker', 'Cascader', 'Search'])) {
156 156 this.dispatch('FormItem', 'on-form-blur', this.currentValue);
157 157 }
158 158 },
... ... @@ -171,7 +171,7 @@
171 171 this.resizeTextarea();
172 172 });
173 173 this.currentValue = value;
174   - if (!findComponentUpward(this, ['DatePicker', 'TimePicker', 'Cascader'])) {
  174 + if (!findComponentUpward(this, ['DatePicker', 'TimePicker', 'Cascader', 'Search'])) {
175 175 this.dispatch('FormItem', 'on-form-change', value);
176 176 }
177 177 },
... ...
src/components/menu/menu.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -2,7 +2,7 @@
2 2 <ul :class="classes" :style="styles"><slot></slot></ul>
3 3 </template>
4 4 <script>
5   - import { oneOf } from '../../utils/assist';
  5 + import { oneOf, findComponentsDownward } from '../../utils/assist';
6 6 import Emitter from '../../mixins/emitter';
7 7  
8 8 const prefixCls = 'ivu-menu';
... ... @@ -84,11 +84,13 @@
84 84 }
85 85 },
86 86 updateOpened () {
87   - this.$children.forEach(item => {
88   - if (item.$options.name === 'Submenu') {
  87 + const items = findComponentsDownward(this, 'Submenu');
  88 +
  89 + if (items.length) {
  90 + items.forEach(item => {
89 91 if (this.openNames.indexOf(item.name) > -1) item.opened = true;
90   - }
91   - });
  92 + });
  93 + }
92 94 }
93 95 },
94 96 mounted () {
... ...
src/components/menu/submenu.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -17,7 +17,7 @@
17 17 <script>
18 18 import Drop from '../select/dropdown.vue';
19 19 import Icon from '../icon/icon.vue';
20   - import { getStyle } from '../../utils/assist';
  20 + import { getStyle, findComponentUpward } from '../../utils/assist';
21 21 import Emitter from '../../mixins/emitter';
22 22  
23 23 const prefixCls = 'ivu-menu';
... ... @@ -41,7 +41,8 @@
41 41 prefixCls: prefixCls,
42 42 active: false,
43 43 opened: false,
44   - dropWidth: parseFloat(getStyle(this.$el, 'width'))
  44 + dropWidth: parseFloat(getStyle(this.$el, 'width')),
  45 + parent: findComponentUpward(this, 'Menu')
45 46 };
46 47 },
47 48 computed: {
... ... @@ -56,12 +57,10 @@
56 57 ];
57 58 },
58 59 mode () {
59   - // todo while
60   - return this.$parent.mode;
  60 + return this.parent.mode;
61 61 },
62 62 accordion () {
63   - // todo while
64   - return this.$parent.accordion;
  63 + return this.parent.accordion;
65 64 },
66 65 dropStyle () {
67 66 let style = {};
... ... @@ -77,8 +76,7 @@
77 76  
78 77 clearTimeout(this.timeout);
79 78 this.timeout = setTimeout(() => {
80   - // todo while
81   - this.$parent.updateOpenKeys(this.name);
  79 + this.parent.updateOpenKeys(this.name);
82 80 this.opened = true;
83 81 }, 250);
84 82 },
... ... @@ -88,8 +86,7 @@
88 86  
89 87 clearTimeout(this.timeout);
90 88 this.timeout = setTimeout(() => {
91   - // todo while
92   - this.$parent.updateOpenKeys(this.name);
  89 + this.parent.updateOpenKeys(this.name);
93 90 this.opened = false;
94 91 }, 150);
95 92 },
... ... @@ -98,14 +95,12 @@
98 95 if (this.mode === 'horizontal') return;
99 96 const opened = this.opened;
100 97 if (this.accordion) {
101   - // todo while
102   - this.$parent.$children.forEach(item => {
  98 + this.parent.$children.forEach(item => {
103 99 if (item.$options.name === 'Submenu') item.opened = false;
104 100 });
105 101 }
106 102 this.opened = !opened;
107   - // todo while
108   - this.$parent.updateOpenKeys(this.name);
  103 + this.parent.updateOpenKeys(this.name);
109 104 }
110 105 },
111 106 watch: {
... ...
src/components/modal/modal.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -198,7 +198,7 @@
198 198  
199 199 let showHead = true;
200 200  
201   - if (this.$slots.head === undefined && !this.title) {
  201 + if (this.$slots.header === undefined && !this.title) {
202 202 showHead = false;
203 203 }
204 204  
... ...
src/components/radio/radio-group.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -4,7 +4,7 @@
4 4 </div>
5 5 </template>
6 6 <script>
7   - import { oneOf } from '../../utils/assist';
  7 + import { oneOf, findComponentsDownward } from '../../utils/assist';
8 8 import Emitter from '../../mixins/emitter';
9 9  
10 10 const prefixCls = 'ivu-radio-group';
... ... @@ -34,7 +34,8 @@
34 34 },
35 35 data () {
36 36 return {
37   - currentValue: this.value
  37 + currentValue: this.value,
  38 + childrens: []
38 39 };
39 40 },
40 41 computed: {
... ... @@ -55,10 +56,14 @@
55 56 methods: {
56 57 updateValue () {
57 58 const value = this.value;
58   - this.$children.forEach((child) => {
59   - child.currentValue = value == child.label;
60   - child.group = true;
61   - });
  59 + this.childrens = findComponentsDownward(this, 'Radio');
  60 +
  61 + if (this.childrens) {
  62 + this.childrens.forEach(child => {
  63 + child.currentValue = value == child.label;
  64 + child.group = true;
  65 + });
  66 + }
62 67 },
63 68 change (data) {
64 69 this.currentValue = data.value;
... ...
src/components/radio/radio.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -12,6 +12,7 @@
12 12 </label>
13 13 </template>
14 14 <script>
  15 + import { findComponentUpward } from '../../utils/assist';
15 16 import Emitter from '../../mixins/emitter';
16 17  
17 18 const prefixCls = 'ivu-radio';
... ... @@ -35,7 +36,8 @@
35 36 data () {
36 37 return {
37 38 currentValue: this.value,
38   - group: false
  39 + group: false,
  40 + parent: findComponentUpward(this, 'RadioGroup')
39 41 };
40 42 },
41 43 computed: {
... ... @@ -66,8 +68,7 @@
66 68 }
67 69 },
68 70 mounted () {
69   - // todo 使用 while向上查找
70   - if (this.$parent && this.$parent.$options.name === 'RadioGroup') this.group = true;
  71 + if (this.parent) this.group = true;
71 72 if (!this.group) {
72 73 this.updateValue();
73 74 }
... ... @@ -83,7 +84,7 @@
83 84 this.$emit('input', checked);
84 85  
85 86 if (this.group && this.label) {
86   - this.$parent.change({
  87 + this.parent.change({
87 88 value: this.label,
88 89 checked: this.value
89 90 });
... ...
src/components/table/cell.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -52,36 +52,32 @@
52 52 const template = this.column.render(this.row, this.column, this.index);
53 53 const cell = document.createElement('div');
54 54 cell.innerHTML = template;
55   -// const _oldParentChildLen = $parent.$children.length;
56   -// const _newParentChildLen = $parent.$children.length;
57   -// if (_oldParentChildLen !== _newParentChildLen) { // if render normal html node, do not tag
58   -// this.uid = $parent.$children[$parent.$children.length - 1]._uid; // tag it, and delete when data or columns update
59   -// }
  55 +
60 56 this.$el.innerHTML = '';
61 57 let methods = {};
62 58 Object.keys($parent).forEach(key => {
63   - const func = $parent[`${key}`];
  59 + const func = $parent[key];
64 60 if (typeof(func) === 'function' && func.name === 'boundFn') {
65   - methods[`${key}`] = func;
  61 + methods[key] = func;
66 62 }
67 63 });
68 64 const res = Vue.compile(cell.outerHTML);
  65 + // todo 临时解决方案
69 66 const component = new Vue({
70 67 render: res.render,
71 68 staticRenderFns: res.staticRenderFns,
72   - methods: methods
  69 + methods: methods,
  70 + data () {
  71 + return $parent._data;
  72 + }
73 73 });
  74 +
74 75 const Cell = component.$mount();
75 76 this.$refs.cell.appendChild(Cell.$el);
76 77 }
77 78 },
78 79 destroy () {
79   - const $parent = this.content;
80   - for (let i = 0; i < $parent.$children.length; i++) {
81   - if ($parent.$children[i]._uid === this.uid) {
82   - $parent.$children[i].$destroy();
83   - }
84   - }
  80 +
85 81 },
86 82 toggleSelect () {
87 83 this.$parent.$parent.toggleSelect(this.index);
... ...
src/components/table/table.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -173,7 +173,8 @@
173 173 bodyHeight: 0,
174 174 bodyRealHeight: 0,
175 175 scrollBarWidth: getScrollBarSize(),
176   - currentContent: this.content
  176 + currentContent: this.content,
  177 + cloneData: deepCopy(this.data) // when Cell has a button to delete row data, clickCurrentRow will throw an error, so clone a data
177 178 };
178 179 },
179 180 computed: {
... ... @@ -357,16 +358,16 @@
357 358 }
358 359 }
359 360 this.objData[_index]._isHighlight = true;
360   - const oldData = oldIndex < 0 ? null : JSON.parse(JSON.stringify(this.data[oldIndex]));
361   - this.$emit('on-current-change', JSON.parse(JSON.stringify(this.data[_index])), oldData);
  361 + const oldData = oldIndex < 0 ? null : JSON.parse(JSON.stringify(this.cloneData[oldIndex]));
  362 + this.$emit('on-current-change', JSON.parse(JSON.stringify(this.cloneData[_index])), oldData);
362 363 },
363 364 clickCurrentRow (_index) {
364 365 this.highlightCurrentRow (_index);
365   - this.$emit('on-row-click', JSON.parse(JSON.stringify(this.data[_index])));
  366 + this.$emit('on-row-click', JSON.parse(JSON.stringify(this.cloneData[_index])));
366 367 },
367 368 dblclickCurrentRow (_index) {
368 369 this.highlightCurrentRow (_index);
369   - this.$emit('on-row-dblclick', JSON.parse(JSON.stringify(this.data[_index])));
  370 + this.$emit('on-row-dblclick', JSON.parse(JSON.stringify(this.cloneData[_index])));
370 371 },
371 372 getSelection () {
372 373 let selectionIndexes = [];
... ... @@ -663,6 +664,10 @@
663 664 this.objData = this.makeObjData();
664 665 this.rebuildData = this.makeDataWithSortAndFilter();
665 666 this.handleResize();
  667 + // here will trigger before clickCurrentRow, so use async
  668 + setTimeout(() => {
  669 + this.cloneData = deepCopy(this.data);
  670 + }, 0);
666 671 },
667 672 deep: true
668 673 },
... ...
src/components/transfer/search.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -44,14 +44,5 @@
44 44 this.$emit('on-query-clear');
45 45 }
46 46 }
47   - // todo 事件
48   -// events: {
49   -// 'on-form-blur' () {
50   -// return false;
51   -// },
52   -// 'on-form-change' () {
53   -// return false;
54   -// }
55   -// }
56 47 };
57 48 </script>
... ...
src/components/transfer/transfer.vue
  Show/Hide comments   View file @c86d77f
... ... @@ -67,8 +67,8 @@
67 67 return cloned;
68 68 }
69 69  
70   - const vNodes = this.$slots.default;
71   - const clonedVNodes = vNodes.map(vnode => cloneVNode(vnode));
  70 + const vNodes = this.$slots.default === undefined ? [] : this.$slots.default;
  71 + const clonedVNodes = this.$slots.default === undefined ? [] : vNodes.map(vnode => cloneVNode(vnode));
72 72  
73 73 return createElement('div', {
74 74 'class': this.classes
... ... @@ -120,7 +120,7 @@
120 120 on: {
121 121 'on-checked-keys-change': this.handleRightCheckedKeysChange
122 122 }
123   - }, clonedVNodes),
  123 + }, clonedVNodes)
124 124 ]);
125 125 },
126 126  
... ...
src/styles/components/input.less
  Show/Hide comments   View file @c86d77f
... ... @@ -58,6 +58,14 @@
58 58 .@{input-prefix-cls}-group{
59 59 .input-group-error;
60 60 }
  61 + .@{transfer-prefix-cls} {
  62 + .@{input-prefix-cls} {
  63 + .input;
  64 + &-icon{
  65 + color: @subsidiary-color;
  66 + }
  67 + }
  68 + }
61 69 }
62 70 .@{form-item-prefix-cls}-validating{
63 71 .@{input-prefix-cls}{
... ...
src/utils/assist.js
  Show/Hide comments   View file @c86d77f
... ... @@ -185,9 +185,9 @@ function findComponentUpward (content, componentName, componentNames) {
185 185 }
186 186 export {findComponentUpward};
187 187  
188   -// Find components downward
  188 +// Find component downward
189 189 function findComponentDownward (content, componentName) {
190   - let childrens = content.$children;
  190 + const childrens = content.$children;
191 191 let children = null;
192 192  
193 193 if (childrens.length) {
... ... @@ -212,4 +212,24 @@ function findComponentDownward (content, componentName) {
212 212 }
213 213 return children;
214 214 }
215   -export {findComponentDownward};
216 215 \ No newline at end of file
  216 +export {findComponentDownward};
  217 +
  218 +// Find components downward
  219 +function findComponentsDownward (content, componentName, components = []) {
  220 + const childrens = content.$children;
  221 +
  222 + if (childrens.length) {
  223 + childrens.forEach(child => {
  224 + const name = child.$options.name;
  225 + const childs = child.$children;
  226 +
  227 + if (name === componentName) components.push(child);
  228 + if (childs.length) {
  229 + const findChilds = findComponentsDownward(child, componentName, components);
  230 + if (findChilds) components.concat(findChilds);
  231 + }
  232 + });
  233 + }
  234 + return components;
  235 +}
  236 +export {findComponentsDownward};
217 237 \ No newline at end of file
... ...