Commit 183ab50e0c0187f5bfa10d718fd4905cb6b6f85b
Committed by
GitHub

Merge pull request #286 from GITleonine1989/master
itable添加禁用某行选中的功能
Showing
6 changed files
with
39 additions
and
14 deletions
Show diff stats
src/components/carousel/carousel.vue
@@ -13,7 +13,7 @@ | @@ -13,7 +13,7 @@ | ||
13 | </button> | 13 | </button> |
14 | <ul :class="dotsClasses"> | 14 | <ul :class="dotsClasses"> |
15 | <template v-for="n in slides.length"> | 15 | <template v-for="n in slides.length"> |
16 | - <li :class="{ [`${prefixCls}-active`]: n === currentIndex }" | 16 | + <li :class="[n === currentIndex ? prefixCls+'-active':'' ]" |
17 | @click="dotsEvent('click', n)" | 17 | @click="dotsEvent('click', n)" |
18 | @mouseover="dotsEvent('hover', n)"> | 18 | @mouseover="dotsEvent('hover', n)"> |
19 | <button></button> | 19 | <button></button> |
src/components/table/cell.vue
@@ -2,7 +2,7 @@ | @@ -2,7 +2,7 @@ | ||
2 | <div :class="classes"> | 2 | <div :class="classes"> |
3 | <template v-if="renderType === 'index'">{{naturalIndex + 1}}</template> | 3 | <template v-if="renderType === 'index'">{{naturalIndex + 1}}</template> |
4 | <template v-if="renderType === 'selection'"> | 4 | <template v-if="renderType === 'selection'"> |
5 | - <Checkbox :checked="checked" @on-change="toggleSelect"></Checkbox> | 5 | + <Checkbox :checked="checked" @on-change="toggleSelect" :disabled="disabled"></Checkbox> |
6 | </template> | 6 | </template> |
7 | <template v-if="renderType === 'normal'">{{{ row[column.key] }}}</template> | 7 | <template v-if="renderType === 'normal'">{{{ row[column.key] }}}</template> |
8 | </div> | 8 | </div> |
@@ -19,6 +19,7 @@ | @@ -19,6 +19,7 @@ | ||
19 | naturalIndex: Number, // index of rebuildData | 19 | naturalIndex: Number, // index of rebuildData |
20 | index: Number, // _index of data | 20 | index: Number, // _index of data |
21 | checked: Boolean, | 21 | checked: Boolean, |
22 | + disabled: Boolean, | ||
22 | fixed: { | 23 | fixed: { |
23 | type: [Boolean, String], | 24 | type: [Boolean, String], |
24 | default: false | 25 | default: false |
src/components/table/table-body.vue
@@ -19,7 +19,9 @@ | @@ -19,7 +19,9 @@ | ||
19 | :column="column" | 19 | :column="column" |
20 | :natural-index="index" | 20 | :natural-index="index" |
21 | :index="row._index" | 21 | :index="row._index" |
22 | - :checked="rowChecked(row._index)"></Cell> | 22 | + :checked="rowChecked(row._index)" |
23 | + :disabled="rowDisabled(row._index)" | ||
24 | + ></Cell> | ||
23 | </td> | 25 | </td> |
24 | </tr> | 26 | </tr> |
25 | </tbody> | 27 | </tbody> |
@@ -58,6 +60,9 @@ | @@ -58,6 +60,9 @@ | ||
58 | rowChecked (_index) { | 60 | rowChecked (_index) { |
59 | return this.objData[_index] && this.objData[_index]._isChecked; | 61 | return this.objData[_index] && this.objData[_index]._isChecked; |
60 | }, | 62 | }, |
63 | + rowDisabled(_index){ | ||
64 | + return this.objData[_index] && this.objData[_index]._isDisabled; | ||
65 | + }, | ||
61 | rowClsName (_index) { | 66 | rowClsName (_index) { |
62 | return this.$parent.rowClassName(this.objData[_index], _index); | 67 | return this.$parent.rowClassName(this.objData[_index], _index); |
63 | }, | 68 | }, |
src/components/table/table-head.vue
@@ -85,9 +85,8 @@ | @@ -85,9 +85,8 @@ | ||
85 | isSelectAll () { | 85 | isSelectAll () { |
86 | let isSelectAll = true; | 86 | let isSelectAll = true; |
87 | if (!this.data.length) isSelectAll = false; | 87 | if (!this.data.length) isSelectAll = false; |
88 | - | ||
89 | for (let i = 0; i < this.data.length; i++) { | 88 | for (let i = 0; i < this.data.length; i++) { |
90 | - if (!this.objData[this.data[i]._index]._isChecked) { | 89 | + if (!this.objData[this.data[i]._index]._isChecked && !this.objData[this.data[i]._index]._isDisabled) { |
91 | isSelectAll = false; | 90 | isSelectAll = false; |
92 | break; | 91 | break; |
93 | } | 92 | } |
src/components/table/table.vue
@@ -391,10 +391,21 @@ | @@ -391,10 +391,21 @@ | ||
391 | this.$emit('on-selection-change', selection); | 391 | this.$emit('on-selection-change', selection); |
392 | }, | 392 | }, |
393 | selectAll (status) { | 393 | selectAll (status) { |
394 | - this.rebuildData.forEach((data) => { | ||
395 | - this.objData[data._index]._isChecked = status; | ||
396 | - }); | ||
397 | - | 394 | + // this.rebuildData.forEach((data) => { |
395 | + // if(this.objData[data._index]._isDisabled){ | ||
396 | + // this.objData[data._index]._isChecked = false; | ||
397 | + // }else{ | ||
398 | + // this.objData[data._index]._isChecked = status; | ||
399 | + // } | ||
400 | + | ||
401 | + // }); | ||
402 | + for(const data of this.rebuildData){ | ||
403 | + if(this.objData[data._index]._isDisabled){ | ||
404 | + continue; | ||
405 | + }else{ | ||
406 | + this.objData[data._index]._isChecked = status; | ||
407 | + } | ||
408 | + } | ||
398 | const selection = this.getSelection(); | 409 | const selection = this.getSelection(); |
399 | if (status) { | 410 | if (status) { |
400 | this.$emit('on-select-all', selection); | 411 | this.$emit('on-select-all', selection); |
@@ -548,8 +559,13 @@ | @@ -548,8 +559,13 @@ | ||
548 | this.data.forEach((row, index) => { | 559 | this.data.forEach((row, index) => { |
549 | const newRow = deepCopy(row);// todo 直接替换 | 560 | const newRow = deepCopy(row);// todo 直接替换 |
550 | newRow._isHover = false; | 561 | newRow._isHover = false; |
562 | + if(newRow._disabled){ | ||
563 | + newRow._isDisabled = newRow._disabled; | ||
564 | + }else{ | ||
565 | + newRow._isDisabled = false; | ||
566 | + } | ||
551 | if (newRow._checked) { | 567 | if (newRow._checked) { |
552 | - newRow._isChecked = newRow._checked; | 568 | + newRow._isChecked = newRow._checked; |
553 | } else { | 569 | } else { |
554 | newRow._isChecked = false; | 570 | newRow._isChecked = false; |
555 | } | 571 | } |
test/routers/table.vue
@@ -54,25 +54,29 @@ | @@ -54,25 +54,29 @@ | ||
54 | age: 18, | 54 | age: 18, |
55 | address: '北京市朝阳区芍药居', | 55 | address: '北京市朝阳区芍药居', |
56 | _highlight: true, | 56 | _highlight: true, |
57 | - _checked: true | 57 | + _checked: true, |
58 | + _disabled: false | ||
58 | }, | 59 | }, |
59 | { | 60 | { |
60 | name: '张小刚', | 61 | name: '张小刚', |
61 | age: 25, | 62 | age: 25, |
62 | address: '北京市海淀区西二旗', | 63 | address: '北京市海淀区西二旗', |
63 | - _checked: true | 64 | + _checked: false, |
65 | + _disabled: true | ||
64 | }, | 66 | }, |
65 | { | 67 | { |
66 | name: '李小红', | 68 | name: '李小红', |
67 | age: 30, | 69 | age: 30, |
68 | address: '上海市浦东新区世纪大道', | 70 | address: '上海市浦东新区世纪大道', |
69 | - _checked: true | 71 | + _checked: true, |
72 | + _disabled: true | ||
70 | }, | 73 | }, |
71 | { | 74 | { |
72 | name: '周小伟', | 75 | name: '周小伟', |
73 | age: 26, | 76 | age: 26, |
74 | address: '深圳市南山区深南大道', | 77 | address: '深圳市南山区深南大道', |
75 | - _checked: true | 78 | + _checked: false, |
79 | + _disabled: false | ||
76 | } | 80 | } |
77 | ] | 81 | ] |
78 | } | 82 | } |