Commit cb31ede0398f8e6f746c015b5a8db00b0179beee

Authored by 梁灏
1 parent 45e7ed7e

update Table

update Table
Showing 2 changed files with 41 additions and 16 deletions   Show diff stats
src/components/table/table.vue
... ... @@ -358,18 +358,32 @@
358 358 handleFilterHide (index) { // clear checked that not filter now
359 359 if (!this.cloneColumns[index]._isFiltered) this.cloneColumns[index]._filterChecked = [];
360 360 },
361   - handleFilter (index) {
362   - const column = this.cloneColumns[index];
363   - const filterData = this.makeData();
364   -
365   - this.rebuildData = filterData.filter((row) => {
366   - let status = false;
  361 + filterData (data, column) {
  362 + return data.filter((row) => {
  363 + let status = !column._filterChecked.length;
367 364 for (let i = 0; i < column._filterChecked.length; i++) {
368 365 status = column.filterMethod(column._filterChecked[i], row);
369 366 if (status) break;
370 367 }
371 368 return status;
372 369 });
  370 + },
  371 + filterOtherData (data, index) {
  372 + this.cloneColumns.forEach((col, colIndex) => {
  373 + if (colIndex !== index) {
  374 + data = this.filterData(data, col);
  375 + }
  376 + });
  377 + return data;
  378 + },
  379 + handleFilter (index) {
  380 + const column = this.cloneColumns[index];
  381 + let filterData = this.makeData();
  382 +
  383 + // filter others first, after filter this column
  384 + filterData = this.filterOtherData(filterData, index);
  385 + this.rebuildData = this.filterData(filterData, column);
  386 +
373 387 this.cloneColumns[index]._isFiltered = true;
374 388 this.cloneColumns[index]._filterVisible = false;
375 389 },
... ... @@ -381,7 +395,10 @@
381 395 this.cloneColumns[index]._isFiltered = false;
382 396 this.cloneColumns[index]._filterVisible = false;
383 397 this.cloneColumns[index]._filterChecked = [];
384   - this.rebuildData = this.makeData();
  398 +
  399 + let filterData = this.makeData();
  400 + filterData = this.filterOtherData(filterData, index);
  401 + this.rebuildData = filterData;
385 402 },
386 403 makeData () {
387 404 let data = deepCopy(this.data);
... ...
test/routers/table.vue
... ... @@ -8,7 +8,7 @@
8 8 <!--<i-table size="large" border stripe :columns="columns" :data="data"></i-table>-->
9 9 <br>
10 10 <i-table
11   - width="450"
  11 + width="850"
12 12 stripe
13 13 border
14 14 highlight-row
... ... @@ -55,20 +55,20 @@
55 55 width: 100,
56 56 filters: [
57 57 {
58   - label: '大于25岁',
  58 + label: '两个字',
59 59 value: 1
60 60 },
61 61 {
62   - label: '小于25岁',
  62 + label: '三个字',
63 63 value: 2
64 64 }
65 65 ],
66 66 filterMultiple: false,
67 67 filterMethod (value, row) {
68 68 if (value === 1) {
69   - return row.age >= 25;
  69 + return row.name.length == 2;
70 70 } else if (value === 2) {
71   - return row.age < 25;
  71 + return row.name.length == 3;
72 72 }
73 73 }
74 74 },
... ... @@ -103,14 +103,22 @@
103 103 width: 100,
104 104 filters: [
105 105 {
106   - label: '家',
107   - value: 'home'
  106 + label: '大于25岁',
  107 + value: 1
108 108 },
109 109 {
110   - label: '公司',
111   - value: 'company'
  110 + label: '小于25岁',
  111 + value: 2
112 112 }
113 113 ],
  114 + filterMultiple: false,
  115 + filterMethod (value, row) {
  116 + if (value === 1) {
  117 + return row.age >= 25;
  118 + } else if (value === 2) {
  119 + return row.age < 25;
  120 + }
  121 + }
114 122 // render (row) {
115 123 // return `<i-button>${row.age}</i-button>`
116 124 // }
... ...