Commit 586bf3fc1bca09cb19b0700148d1ec5f9016ba1b
Merge remote-tracking branch 'upstream/2.0' into popper
Showing
16 changed files
with
191 additions
and
100 deletions
Show diff stats
README.md
... | ... | @@ -115,7 +115,8 @@ If you want to contribute or have questions or bugs to report: |
115 | 115 | |---|---|---|---|---|---| |
116 | 116 | |[Aresn](https://github.com/icarusion) |  |[jingsam](https://github.com/jingsam) |  | [rijn](https://github.com/rijn) |  | |
117 | 117 | |[lcx960324](https://github.com/lcx960324) |  |[GITleonine1989](https://github.com/GITleonine1989) |  |[huixisheng](https://github.com/huixisheng) |  | |
118 | -|[Sergio Crisostomo](https://github.com/SergioCrisostomo) |  | [lison16](https://github.com/lison16) |  | [Xotic750](https://github.com/Xotic750) |  | |
118 | +|[Sergio Crisostomo](https://github.com/SergioCrisostomo) |  | [lison16](https://github.com/lison16) |  | [Xotic750](https://github.com/Xotic750) |  | | |
119 | +[huanghong1125](https://github.com/huanghong1125) |  | | |
119 | 120 | |
120 | 121 | |
121 | 122 | ## Links | ... | ... |
examples/routers/menu.vue
1 | 1 | <template> |
2 | - <Menu active-name="1-2" :open-names="['1']" theme="dark"> | |
3 | - <Submenu name="1"> | |
4 | - <template slot="title"> | |
5 | - <Icon type="ios-analytics"></Icon> | |
6 | - Navigation One | |
7 | - </template> | |
8 | - <MenuGroup title="Item 1"> | |
9 | - <MenuItem name="1-1">Option 1</MenuItem> | |
10 | - <MenuItem name="1-2">Option 2</MenuItem> | |
11 | - </MenuGroup> | |
12 | - <MenuGroup title="Item 2"> | |
13 | - <MenuItem name="1-3">Option 3</MenuItem> | |
14 | - <MenuItem name="1-4">Option 4</MenuItem> | |
15 | - </MenuGroup> | |
16 | - </Submenu> | |
17 | - <Submenu name="2"> | |
18 | - <template slot="title"> | |
19 | - <Icon type="ios-filing"></Icon> | |
20 | - Navigation Two | |
21 | - </template> | |
22 | - <MenuItem name="2-1">Option 5</MenuItem> | |
23 | - <MenuItem name="2-2">Option 6</MenuItem> | |
24 | - <Submenu name="3"> | |
25 | - <template slot="title">Submenu</template> | |
26 | - <MenuItem name="3-1">Option 7</MenuItem> | |
27 | - <MenuItem name="3-2">Option 8</MenuItem> | |
2 | + <div> | |
3 | + <Menu ref="menu" active-name="1-2" :open-names="openNames" theme="dark" accordion @on-open-change="handleOpenChange"> | |
4 | + <Submenu name="1"> | |
5 | + <template slot="title"> | |
6 | + <Icon type="ios-analytics"></Icon> | |
7 | + Navigation One | |
8 | + </template> | |
9 | + <MenuGroup title="Item 1"> | |
10 | + <MenuItem name="1-1">Option 1</MenuItem> | |
11 | + <MenuItem name="1-2">Option 2</MenuItem> | |
12 | + </MenuGroup> | |
13 | + <MenuGroup title="Item 2"> | |
14 | + <MenuItem name="1-3">Option 3</MenuItem> | |
15 | + <MenuItem name="1-4">Option 4</MenuItem> | |
16 | + </MenuGroup> | |
28 | 17 | </Submenu> |
29 | - </Submenu> | |
30 | - <Submenu name="4"> | |
31 | - <template slot="title"> | |
32 | - <Icon type="ios-gear"></Icon> | |
33 | - Navigation Three | |
34 | - </template> | |
35 | - <MenuItem name="4-1">Option 9</MenuItem> | |
36 | - <MenuItem name="4-2">Option 10</MenuItem> | |
37 | - <MenuItem name="4-3">Option 11</MenuItem> | |
38 | - <MenuItem name="4-4">Option 12</MenuItem> | |
39 | - </Submenu> | |
40 | - </Menu> | |
18 | + <Submenu name="2"> | |
19 | + <template slot="title"> | |
20 | + <Icon type="ios-filing"></Icon> | |
21 | + Navigation Two | |
22 | + </template> | |
23 | + <MenuItem name="2-1">Option 5</MenuItem> | |
24 | + <MenuItem name="2-2">Option 6</MenuItem> | |
25 | + <Submenu name="3"> | |
26 | + <template slot="title">Submenu</template> | |
27 | + <MenuItem name="3-1">Option 7</MenuItem> | |
28 | + <MenuItem name="3-2">Option 8</MenuItem> | |
29 | + </Submenu> | |
30 | + <Submenu name="4"> | |
31 | + <template slot="title">Submenu</template> | |
32 | + <MenuItem name="4-1">Option 7</MenuItem> | |
33 | + <MenuItem name="4-2">Option 8</MenuItem> | |
34 | + </Submenu> | |
35 | + </Submenu> | |
36 | + <Submenu name="5"> | |
37 | + <template slot="title"> | |
38 | + <Icon type="ios-gear"></Icon> | |
39 | + Navigation Three | |
40 | + </template> | |
41 | + <MenuItem name="5-1">Option 9</MenuItem> | |
42 | + <MenuItem name="5-2">Option 10</MenuItem> | |
43 | + <MenuItem name="5-3">Option 11</MenuItem> | |
44 | + <MenuItem name="5-4">Option 12</MenuItem> | |
45 | + </Submenu> | |
46 | + </Menu> | |
47 | + <Button @click="setOpenNames">ไฟฎๆนๅฑๅผๆฐ็ป</Button> | |
48 | + </div> | |
41 | 49 | </template> |
42 | 50 | <script> |
43 | 51 | export default { |
44 | - | |
52 | + data () { | |
53 | + return { | |
54 | + openNames: ['1'] | |
55 | + }; | |
56 | + }, | |
57 | + methods: { | |
58 | + handleOpenChange (name) { | |
59 | + console.log(name) | |
60 | + }, | |
61 | + setOpenNames () { | |
62 | + this.openNames = ['2', '3']; | |
63 | + this.$nextTick(() => { | |
64 | + this.$refs.menu.updateOpened(); | |
65 | + }) | |
66 | + } | |
67 | + } | |
45 | 68 | } |
46 | 69 | </script> | ... | ... |
examples/routers/poptip.vue
1 | 1 | <template> |
2 | - <div style="margin: 200px;"> | |
3 | - <Poptip title="ๆ็คบๆ ้ข" transfer> | |
4 | - <div slot="content" style="padding: 50px"> | |
5 | - <Button>click me</Button> | |
6 | - </div> | |
7 | - <Button>click ๆฟๆดป</Button> | |
8 | - </Poptip> | |
2 | + <div style="margin: 200px"> | |
3 | + <Tabs value="name1"> | |
4 | + <TabPane label="ๆ ็ญพไธ" name="name1"> | |
5 | + <div style="overflow: auto;width: 200px;height:300px"> | |
6 | + <Poptip title="ๆ็คบๆ ้ข" content="ๆ ็ญพไธ็ๅ ๅฎน" placement="right" transfer :options="options"> | |
7 | + <Button id="aaa">ๅณ่พน</Button> | |
8 | + </Poptip> | |
9 | + </div> | |
10 | + </TabPane> | |
11 | + <TabPane label="ๆ ็ญพไบ" name="name2">ๆ ็ญพไบ็ๅ ๅฎน</TabPane> | |
12 | + </Tabs> | |
9 | 13 | </div> |
10 | 14 | </template> |
11 | 15 | <script> |
12 | 16 | export default { |
13 | - methods: { | |
14 | - ok () { | |
15 | - this.$Message.info('็นๅปไบ็กฎๅฎ'); | |
16 | - }, | |
17 | - cancel () { | |
18 | - this.$Message.info('็นๅปไบๅๆถ'); | |
17 | + data () { | |
18 | + return { | |
19 | + options: { | |
20 | + modifiers: { | |
21 | + preventOverflow: { | |
22 | + boundariesElement: 'body', | |
23 | + } | |
24 | + } | |
25 | + } | |
19 | 26 | } |
20 | 27 | } |
21 | 28 | } | ... | ... |
package.json
src/components/card/card.vue
1 | 1 | <template> |
2 | 2 | <div :class="classes"> |
3 | - <div :class="headClasses" v-if="showHead"><slot name="title"></slot></div> | |
3 | + <div :class="headClasses" v-if="showHead"><slot name="title"> | |
4 | + <p v-if="title"> | |
5 | + <Icon v-if="icon" :type="icon"></Icon> | |
6 | + {{title}} | |
7 | + </p> | |
8 | + </slot></div> | |
4 | 9 | <div :class="extraClasses" v-if="showExtra"><slot name="extra"></slot></div> |
5 | 10 | <div :class="bodyClasses" :style="bodyStyles"><slot></slot></div> |
6 | 11 | </div> |
... | ... | @@ -8,10 +13,11 @@ |
8 | 13 | <script> |
9 | 14 | const prefixCls = 'ivu-card'; |
10 | 15 | const defaultPadding = 16; |
16 | + import Icon from '../icon/icon.vue'; | |
11 | 17 | |
12 | 18 | export default { |
13 | 19 | name: 'Card', |
14 | - | |
20 | + components: { Icon }, | |
15 | 21 | props: { |
16 | 22 | bordered: { |
17 | 23 | type: Boolean, |
... | ... | @@ -28,6 +34,12 @@ |
28 | 34 | padding: { |
29 | 35 | type: Number, |
30 | 36 | default: defaultPadding |
37 | + }, | |
38 | + title: { | |
39 | + type: String, | |
40 | + }, | |
41 | + icon: { | |
42 | + type: String, | |
31 | 43 | } |
32 | 44 | }, |
33 | 45 | data () { |
... | ... | @@ -67,7 +79,7 @@ |
67 | 79 | } |
68 | 80 | }, |
69 | 81 | mounted () { |
70 | - this.showHead = this.$slots.title !== undefined; | |
82 | + this.showHead = this.title || this.$slots.title !== undefined; | |
71 | 83 | this.showExtra = this.$slots.extra !== undefined; |
72 | 84 | } |
73 | 85 | }; | ... | ... |
src/components/dropdown/dropdown-item.vue
... | ... | @@ -3,7 +3,7 @@ |
3 | 3 | </template> |
4 | 4 | <script> |
5 | 5 | const prefixCls = 'ivu-dropdown-item'; |
6 | - | |
6 | + import { findComponentUpward } from '../../utils/assist'; | |
7 | 7 | export default { |
8 | 8 | name: 'DropdownItem', |
9 | 9 | props: { |
... | ... | @@ -37,7 +37,7 @@ |
37 | 37 | }, |
38 | 38 | methods: { |
39 | 39 | handleClick () { |
40 | - const $parent = this.$parent.$parent.$parent; | |
40 | + const $parent = findComponentUpward(this, 'Dropdown'); | |
41 | 41 | const hasChildren = this.$parent && this.$parent.$options.name === 'Dropdown'; |
42 | 42 | |
43 | 43 | if (this.disabled) { | ... | ... |
src/components/form/form-item.vue
... | ... | @@ -92,6 +92,7 @@ |
92 | 92 | this.validateState = val; |
93 | 93 | } |
94 | 94 | }, |
95 | + inject: ['form'], | |
95 | 96 | computed: { |
96 | 97 | classes () { |
97 | 98 | return [ |
... | ... | @@ -103,13 +104,13 @@ |
103 | 104 | } |
104 | 105 | ]; |
105 | 106 | }, |
106 | - form() { | |
107 | - let parent = this.$parent; | |
108 | - while (parent.$options.name !== 'iForm') { | |
109 | - parent = parent.$parent; | |
110 | - } | |
111 | - return parent; | |
112 | - }, | |
107 | + // form() { | |
108 | + // let parent = this.$parent; | |
109 | + // while (parent.$options.name !== 'iForm') { | |
110 | + // parent = parent.$parent; | |
111 | + // } | |
112 | + // return parent; | |
113 | + // }, | |
113 | 114 | fieldValue: { |
114 | 115 | cache: false, |
115 | 116 | get() { | ... | ... |
src/components/form/form.vue
src/components/input/input.vue
... | ... | @@ -2,7 +2,7 @@ |
2 | 2 | <div :class="wrapClasses"> |
3 | 3 | <template v-if="type !== 'textarea'"> |
4 | 4 | <div :class="[prefixCls + '-group-prepend']" v-if="prepend" v-show="slotReady"><slot name="prepend"></slot></div> |
5 | - <i class="ivu-icon" :class="['ivu-icon-ios-close', prefixCls + '-icon', prefixCls + '-icon-clear' , prefixCls + '-icon-normal']" v-if="clearable" @click="handleClear"></i> | |
5 | + <i class="ivu-icon" :class="['ivu-icon-ios-close', prefixCls + '-icon', prefixCls + '-icon-clear' , prefixCls + '-icon-normal']" v-if="clearable && currentValue" @click="handleClear"></i> | |
6 | 6 | <i class="ivu-icon" :class="['ivu-icon-' + icon, prefixCls + '-icon', prefixCls + '-icon-normal']" v-else-if="icon" @click="handleIconClick"></i> |
7 | 7 | <transition name="fade"> |
8 | 8 | <i class="ivu-icon ivu-icon-load-c ivu-load-loop" :class="[prefixCls + '-icon', prefixCls + '-icon-validate']" v-if="!icon"></i> | ... | ... |
src/components/menu/menu.vue
... | ... | @@ -43,7 +43,8 @@ |
43 | 43 | }, |
44 | 44 | data () { |
45 | 45 | return { |
46 | - currentActiveName: this.activeName | |
46 | + currentActiveName: this.activeName, | |
47 | + openedNames: [] | |
47 | 48 | }; |
48 | 49 | }, |
49 | 50 | computed: { |
... | ... | @@ -76,36 +77,40 @@ |
76 | 77 | this.broadcast('MenuItem', 'on-update-active-name', this.currentActiveName); |
77 | 78 | }, |
78 | 79 | updateOpenKeys (name) { |
79 | - const index = this.openNames.indexOf(name); | |
80 | - if (index > -1) { | |
81 | - this.openNames.splice(index, 1); | |
80 | + let names = [...this.openedNames]; | |
81 | + const index = names.indexOf(name); | |
82 | + if (index >= 0) { | |
83 | + names.splice(index, 1); | |
82 | 84 | } else { |
83 | - this.openNames.push(name); | |
84 | 85 | if (this.accordion) { |
85 | - let currentSubmenu = {}; | |
86 | + let currentSubmenu = null; | |
86 | 87 | findComponentsDownward(this, 'Submenu').forEach(item => { |
87 | 88 | if (item.name === name) currentSubmenu = item; |
88 | 89 | }); |
89 | 90 | findBrothersComponents(currentSubmenu, 'Submenu').forEach(item => { |
90 | - let index = this.openNames.indexOf(item.name); | |
91 | - this.openNames.splice(index, index >= 0 ? 1 : 0); | |
91 | + let i = names.indexOf(item.name); | |
92 | + if (i >= 0) names.splice(i, 1); | |
92 | 93 | }); |
93 | - this.openNames.push(name); | |
94 | + names.push(name); | |
94 | 95 | } |
95 | 96 | } |
97 | + this.openedNames = names; | |
98 | + this.$emit('on-open-change', this.openedNames); | |
96 | 99 | }, |
97 | 100 | updateOpened () { |
98 | 101 | const items = findComponentsDownward(this, 'Submenu'); |
99 | 102 | |
100 | 103 | if (items.length) { |
101 | 104 | items.forEach(item => { |
102 | - if (this.openNames.indexOf(item.name) > -1) item.opened = true; | |
105 | + if (this.openedNames.indexOf(item.name) > -1) item.opened = true; | |
106 | + else item.opened = false; | |
103 | 107 | }); |
104 | 108 | } |
105 | 109 | } |
106 | 110 | }, |
107 | 111 | mounted () { |
108 | 112 | this.updateActiveName(); |
113 | + this.openedNames = [...this.openNames]; | |
109 | 114 | this.updateOpened(); |
110 | 115 | this.$on('on-menu-item-select', (name) => { |
111 | 116 | this.currentActiveName = name; |
... | ... | @@ -113,8 +118,8 @@ |
113 | 118 | }); |
114 | 119 | }, |
115 | 120 | watch: { |
116 | - openNames () { | |
117 | - this.$emit('on-open-change', this.openNames); | |
121 | + openNames (names) { | |
122 | + this.openedNames = names; | |
118 | 123 | }, |
119 | 124 | activeName (val) { |
120 | 125 | this.currentActiveName = val; | ... | ... |
src/components/select/dropdown.vue
... | ... | @@ -21,7 +21,8 @@ |
21 | 21 | data () { |
22 | 22 | return { |
23 | 23 | popper: null, |
24 | - width: '' | |
24 | + width: '', | |
25 | + popperStatus: false | |
25 | 26 | }; |
26 | 27 | }, |
27 | 28 | computed: { |
... | ... | @@ -37,6 +38,7 @@ |
37 | 38 | if (this.popper) { |
38 | 39 | this.$nextTick(() => { |
39 | 40 | this.popper.update(); |
41 | + this.popperStatus = true; | |
40 | 42 | }); |
41 | 43 | } else { |
42 | 44 | this.$nextTick(() => { |
... | ... | @@ -65,10 +67,11 @@ |
65 | 67 | destroy () { |
66 | 68 | if (this.popper) { |
67 | 69 | setTimeout(() => { |
68 | - if (this.popper) { | |
70 | + if (this.popper && !this.popperStatus) { | |
69 | 71 | this.popper.destroy(); |
70 | 72 | this.popper = null; |
71 | 73 | } |
74 | + this.popperStatus = false; | |
72 | 75 | }, 300); |
73 | 76 | } |
74 | 77 | }, | ... | ... |
src/components/slider/slider.vue
... | ... | @@ -3,6 +3,7 @@ |
3 | 3 | <Input-number |
4 | 4 | v-if="!range && showInput" |
5 | 5 | :min="min" |
6 | + :size="inputSize" | |
6 | 7 | :max="max" |
7 | 8 | :step="step" |
8 | 9 | :value="exportValue[0]" |
... | ... | @@ -120,6 +121,13 @@ |
120 | 121 | type: Boolean, |
121 | 122 | default: false |
122 | 123 | }, |
124 | + inputSize: { | |
125 | + type: String, | |
126 | + default: 'default', | |
127 | + validator (value) { | |
128 | + return oneOf(value, ['small', 'large', 'default']); | |
129 | + } | |
130 | + }, | |
123 | 131 | showStops: { |
124 | 132 | type: Boolean, |
125 | 133 | default: false |
... | ... | @@ -151,7 +159,7 @@ |
151 | 159 | startX: 0, |
152 | 160 | currentX: 0, |
153 | 161 | startPos: 0, |
154 | - oldValue: val, | |
162 | + oldValue: [...val], | |
155 | 163 | valueIndex: { |
156 | 164 | min: 0, |
157 | 165 | max: 1, |
... | ... | @@ -327,7 +335,7 @@ |
327 | 335 | if (type === 'min') newPos = this.checkLimits([newPos, this.maxPosition])[0]; |
328 | 336 | else newPos = this.checkLimits([this.minPosition, newPos])[1]; |
329 | 337 | |
330 | - const modulus = newPos % this.step; | |
338 | + const modulus = this.handleDecimal(newPos,this.step); | |
331 | 339 | const value = this.currentValue; |
332 | 340 | value[index] = newPos - modulus; |
333 | 341 | this.currentValue = [...value]; |
... | ... | @@ -339,7 +347,20 @@ |
339 | 347 | } |
340 | 348 | } |
341 | 349 | }, |
342 | - | |
350 | + handleDecimal(pos,step){ | |
351 | + if(step<1){ | |
352 | + let sl = step.toString(), | |
353 | + multiple = 1, | |
354 | + m; | |
355 | + try { | |
356 | + m = sl.split('.')[1].length; | |
357 | + } catch (e){ | |
358 | + m = 0; | |
359 | + } | |
360 | + multiple = Math.pow(10,m); | |
361 | + return (pos * multiple) % (step * multiple) / multiple; | |
362 | + }else return pos % step; | |
363 | + }, | |
343 | 364 | emitChange(){ |
344 | 365 | const value = this.range ? this.exportValue : this.exportValue[0]; |
345 | 366 | this.$emit('on-change', value); | ... | ... |
src/components/tree/node.vue
... | ... | @@ -17,11 +17,12 @@ |
17 | 17 | <span v-else :class="titleClasses" @click="handleSelect">{{ data.title }}</span> |
18 | 18 | <Tree-node |
19 | 19 | v-if="data.expand" |
20 | - v-for="(item, i) in data.children" | |
20 | + v-for="(item, i) in children" | |
21 | 21 | :key="i" |
22 | 22 | :data="item" |
23 | 23 | :multiple="multiple" |
24 | - :show-checkbox="showCheckbox"> | |
24 | + :show-checkbox="showCheckbox" | |
25 | + :children-key="childrenKey"> | |
25 | 26 | </Tree-node> |
26 | 27 | </li> |
27 | 28 | </ul> |
... | ... | @@ -52,6 +53,10 @@ |
52 | 53 | type: Boolean, |
53 | 54 | default: false |
54 | 55 | }, |
56 | + childrenKey: { | |
57 | + type: String, | |
58 | + default: 'children' | |
59 | + }, | |
55 | 60 | showCheckbox: { |
56 | 61 | type: Boolean, |
57 | 62 | default: false |
... | ... | @@ -93,7 +98,7 @@ |
93 | 98 | ]; |
94 | 99 | }, |
95 | 100 | showArrow () { |
96 | - return (this.data.children && this.data.children.length) || ('loading' in this.data && !this.data.loading); | |
101 | + return (this.data[this.childrenKey] && this.data[this.childrenKey].length) || ('loading' in this.data && !this.data.loading); | |
97 | 102 | }, |
98 | 103 | showLoading () { |
99 | 104 | return 'loading' in this.data && this.data.loading; |
... | ... | @@ -118,6 +123,9 @@ |
118 | 123 | } else { |
119 | 124 | return []; |
120 | 125 | } |
126 | + }, | |
127 | + children () { | |
128 | + return this.data[this.childrenKey]; | |
121 | 129 | } |
122 | 130 | }, |
123 | 131 | methods: { |
... | ... | @@ -126,14 +134,14 @@ |
126 | 134 | if (item.disabled) return; |
127 | 135 | |
128 | 136 | // async loading |
129 | - if (item.children.length === 0) { | |
137 | + if (item[this.childrenKey].length === 0) { | |
130 | 138 | const tree = findComponentUpward(this, 'Tree'); |
131 | 139 | if (tree && tree.loadData) { |
132 | 140 | this.$set(this.data, 'loading', true); |
133 | 141 | tree.loadData(item, children => { |
134 | 142 | this.$set(this.data, 'loading', false); |
135 | 143 | if (children.length) { |
136 | - this.$set(this.data, 'children', children); | |
144 | + this.$set(this.data, this.childrenKey, children); | |
137 | 145 | this.$nextTick(() => this.handleExpand()); |
138 | 146 | } |
139 | 147 | }); |
... | ... | @@ -141,7 +149,7 @@ |
141 | 149 | } |
142 | 150 | } |
143 | 151 | |
144 | - if (item.children && item.children.length) { | |
152 | + if (item[this.childrenKey] && item[this.childrenKey].length) { | |
145 | 153 | this.$set(this.data, 'expand', !this.data.expand); |
146 | 154 | this.dispatch('Tree', 'toggle-expand', this.data); |
147 | 155 | } | ... | ... |
src/components/tree/tree.vue
... | ... | @@ -6,7 +6,8 @@ |
6 | 6 | :data="item" |
7 | 7 | visible |
8 | 8 | :multiple="multiple" |
9 | - :show-checkbox="showCheckbox"> | |
9 | + :show-checkbox="showCheckbox" | |
10 | + :children-key="childrenKey"> | |
10 | 11 | </Tree-node> |
11 | 12 | <div :class="[prefixCls + '-empty']" v-if="!stateTree.length">{{ localeEmptyText }}</div> |
12 | 13 | </div> |
... | ... | @@ -40,6 +41,10 @@ |
40 | 41 | emptyText: { |
41 | 42 | type: String |
42 | 43 | }, |
44 | + childrenKey: { | |
45 | + type: String, | |
46 | + default: 'children' | |
47 | + }, | |
43 | 48 | loadData: { |
44 | 49 | type: Function |
45 | 50 | }, |
... | ... | @@ -76,18 +81,19 @@ |
76 | 81 | methods: { |
77 | 82 | compileFlatState () { // so we have always a relation parent/children of each node |
78 | 83 | let keyCounter = 0; |
84 | + let childrenKey = this.childrenKey; | |
79 | 85 | const flatTree = []; |
80 | 86 | function flattenChildren(node, parent) { |
81 | 87 | node.nodeKey = keyCounter++; |
82 | 88 | flatTree[node.nodeKey] = { node: node, nodeKey: node.nodeKey }; |
83 | 89 | if (typeof parent != 'undefined') { |
84 | 90 | flatTree[node.nodeKey].parent = parent.nodeKey; |
85 | - flatTree[parent.nodeKey].children.push(node.nodeKey); | |
91 | + flatTree[parent.nodeKey][childrenKey].push(node.nodeKey); | |
86 | 92 | } |
87 | 93 | |
88 | - if (node.children) { | |
89 | - flatTree[node.nodeKey].children = []; | |
90 | - node.children.forEach(child => flattenChildren(child, node)); | |
94 | + if (node[childrenKey]) { | |
95 | + flatTree[node.nodeKey][childrenKey] = []; | |
96 | + node[childrenKey].forEach(child => flattenChildren(child, node)); | |
91 | 97 | } |
92 | 98 | } |
93 | 99 | this.stateTree.forEach(rootNode => { |
... | ... | @@ -104,11 +110,11 @@ |
104 | 110 | if (node.checked == parent.checked && node.indeterminate == parent.indeterminate) return; // no need to update upwards |
105 | 111 | |
106 | 112 | if (node.checked == true) { |
107 | - this.$set(parent, 'checked', parent.children.every(node => node.checked)); | |
113 | + this.$set(parent, 'checked', parent[this.childrenKey].every(node => node.checked)); | |
108 | 114 | this.$set(parent, 'indeterminate', !parent.checked); |
109 | 115 | } else { |
110 | 116 | this.$set(parent, 'checked', false); |
111 | - this.$set(parent, 'indeterminate', parent.children.some(node => node.checked || node.indeterminate)); | |
117 | + this.$set(parent, 'indeterminate', parent[this.childrenKey].some(node => node.checked || node.indeterminate)); | |
112 | 118 | } |
113 | 119 | this.updateTreeUp(parentKey); |
114 | 120 | }, |
... | ... | @@ -139,8 +145,8 @@ |
139 | 145 | for (let key in changes) { |
140 | 146 | this.$set(node, key, changes[key]); |
141 | 147 | } |
142 | - if (node.children) { | |
143 | - node.children.forEach(child => { | |
148 | + if (node[this.childrenKey]) { | |
149 | + node[this.childrenKey].forEach(child => { | |
144 | 150 | this.updateTreeDown(child, changes); |
145 | 151 | }); |
146 | 152 | } | ... | ... |
src/styles/components/select.less