Commit 0dcc948256e70b657f0e01fa3491f84b32b88d41

Authored by leonine
1 parent 8a0b1749

itable 添加禁用某行选中的功能

src/components/table/cell.vue
... ... @@ -2,7 +2,7 @@
2 2 <div :class="classes">
3 3 <template v-if="renderType === 'index'">{{naturalIndex + 1}}</template>
4 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 6 </template>
7 7 <template v-if="renderType === 'normal'">{{{ row[column.key] }}}</template>
8 8 </div>
... ... @@ -19,6 +19,7 @@
19 19 naturalIndex: Number, // index of rebuildData
20 20 index: Number, // _index of data
21 21 checked: Boolean,
  22 + disabled:Boolean,
22 23 fixed: {
23 24 type: [Boolean, String],
24 25 default: false
... ...
src/components/table/table-body.vue
... ... @@ -19,7 +19,9 @@
19 19 :column="column"
20 20 :natural-index="index"
21 21 :index="row._index"
22   - :checked="rowChecked(row._index)"></Cell>
  22 + :checked="rowChecked(row._index)"
  23 + :disabled="rowDisabled(row._index)"
  24 + ></Cell>
23 25 </td>
24 26 </tr>
25 27 </tbody>
... ... @@ -51,13 +53,17 @@
51 53 this.rowClsName(_index),
52 54 {
53 55 [`${this.prefixCls}-row-highlight`]: this.objData[_index] && this.objData[_index]._isHighlight,
54   - [`${this.prefixCls}-row-hover`]: this.objData[_index] && this.objData[_index]._isHover
  56 + [`${this.prefixCls}-row-hover`]: this.objData[_index] && this.objData[_index]._isHover,
  57 + [`${this.prefixCls}-row-disabled`]: this.objData[_index] && this.objData[_index]._isDisabled
55 58 }
56 59 ];
57 60 },
58 61 rowChecked (_index) {
59 62 return this.objData[_index] && this.objData[_index]._isChecked;
60 63 },
  64 + rowDisabled(_index){
  65 + return this.objData[_index] && this.objData[_index]._isDisabled;
  66 + },
61 67 rowClsName (_index) {
62 68 return this.$parent.rowClassName(this.objData[_index], _index);
63 69 },
... ...
src/components/table/table.vue
... ... @@ -392,7 +392,12 @@
392 392 },
393 393 selectAll (status) {
394 394 this.rebuildData.forEach((data) => {
395   - this.objData[data._index]._isChecked = status;
  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 +
396 401 });
397 402  
398 403 const selection = this.getSelection();
... ... @@ -558,6 +563,12 @@
558 563 } else {
559 564 newRow._isHighlight = false;
560 565 }
  566 +
  567 + if(newRow._disabled){
  568 + newRow._isDisabled = newRow._disabled;
  569 + }else{
  570 + newRow._isDisabled = false;
  571 + }
561 572 data[index] = newRow;
562 573 });
563 574 return data;
... ...
src/styles/components/table.less
... ... @@ -209,6 +209,14 @@
209 209 }
210 210 }
211 211  
  212 + &-row-disabled,
  213 + tr&-row-disabled,
  214 + {
  215 + td{
  216 + background-color: @table-td-disabled-ng;
  217 + }
  218 + }
  219 +
212 220 &-fixed, &-fixed-right{
213 221 position: absolute;
214 222 top: 0;
... ...
src/styles/custom.less
... ... @@ -43,6 +43,7 @@
43 43 @table-td-stripe-bg : #f5f7f9;
44 44 @table-td-hover-bg : #ebf7ff;
45 45 @table-td-highlight-bg : #ebf7ff;
  46 +@table-td-disabled-ng : #c3cbd6;
46 47 @menu-dark-active-bg : #313540;
47 48 @date-picker-cell-hover-bg : #e1f0fe;
48 49  
... ...
test/routers/table.vue
... ... @@ -66,7 +66,8 @@
66 66 name: '李小红',
67 67 age: 30,
68 68 address: '上海市浦东新区世纪大道',
69   - _checked: true
  69 + _checked: false,
  70 + _disabled: true
70 71 },
71 72 {
72 73 name: '周小伟',
... ...