update Table
update Table
This commit is contained in:
parent
35ad37642d
commit
642299b9b8
5 changed files with 110 additions and 33 deletions
|
@ -2,7 +2,7 @@
|
|||
<div :class="classes">
|
||||
<template v-if="renderType === 'index'">{{naturalIndex + 1}}</template>
|
||||
<template v-if="renderType === 'selection'">
|
||||
<Checkbox :checked="checked" @on-change="toggleSelect">{{checked}}</Checkbox>
|
||||
<Checkbox :checked="checked" @on-change="toggleSelect"></Checkbox>
|
||||
</template>
|
||||
<template v-if="renderType === 'normal'">{{{ row[column.key] }}}</template>
|
||||
</div>
|
||||
|
|
|
@ -14,6 +14,16 @@
|
|||
<i class="ivu-icon ivu-icon-arrow-up-b" :class="{on: column._sortType === 'asc'}" @click="handleSort($index, 'asc')"></i>
|
||||
<i class="ivu-icon ivu-icon-arrow-down-b" :class="{on: column._sortType === 'desc'}" @click="handleSort($index, 'desc')"></i>
|
||||
</span>
|
||||
<Poptip v-if="column.filters" placement="bottom-end">
|
||||
<span :class="[prefixCls + '-filter']">
|
||||
<i class="ivu-icon ivu-icon-chevron-down" @click="handleFilter($index)"></i>
|
||||
</span>
|
||||
<div slot="content">
|
||||
<ul>
|
||||
<li v-for="item in column.filters"><Checkbox>{{ item.label }}</Checkbox></li>
|
||||
</ul>
|
||||
</div>
|
||||
</Poptip>
|
||||
</template>
|
||||
</div>
|
||||
</th>
|
||||
|
@ -23,12 +33,13 @@
|
|||
</template>
|
||||
<script>
|
||||
import Checkbox from '../checkbox/checkbox.vue';
|
||||
import Poptip from '../poptip/poptip.vue';
|
||||
import Mixin from './mixin';
|
||||
import { deepCopy } from '../../utils/assist';
|
||||
|
||||
export default {
|
||||
mixins: [ Mixin ],
|
||||
components: { Checkbox },
|
||||
components: { Checkbox, Poptip },
|
||||
props: {
|
||||
prefixCls: String,
|
||||
style: Object,
|
||||
|
@ -74,6 +85,9 @@
|
|||
type = 'normal';
|
||||
}
|
||||
this.$parent.handleSort(index, type);
|
||||
},
|
||||
handleFilter (index) {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -310,24 +310,26 @@
|
|||
this.cloneColumns.forEach((col) => col._sortType = 'normal');
|
||||
|
||||
const key = this.cloneColumns[index].key;
|
||||
if (type === 'asc') {
|
||||
this.rebuildData.sort((a, b) => {
|
||||
if (this.cloneColumns[index].sortMethod) {
|
||||
return this.cloneColumns[index].sortMethod(a, b);
|
||||
} else {
|
||||
return a[key] > b[key];
|
||||
}
|
||||
});
|
||||
} else if (type === 'desc') {
|
||||
this.rebuildData.sort((a, b) => {
|
||||
if (this.cloneColumns[index].sortMethod) {
|
||||
return this.cloneColumns[index].sortMethod(a, b);
|
||||
} else {
|
||||
return a[key] < b[key];
|
||||
}
|
||||
});
|
||||
} else if (type === 'normal') {
|
||||
this.rebuildData = this.makeData();
|
||||
if (this.cloneColumns[index].sortable !== 'custom') { // custom is for remote sort
|
||||
if (type === 'asc') {
|
||||
this.rebuildData.sort((a, b) => {
|
||||
if (this.cloneColumns[index].sortMethod) {
|
||||
return this.cloneColumns[index].sortMethod(a, b);
|
||||
} else {
|
||||
return a[key] > b[key];
|
||||
}
|
||||
});
|
||||
} else if (type === 'desc') {
|
||||
this.rebuildData.sort((a, b) => {
|
||||
if (this.cloneColumns[index].sortMethod) {
|
||||
return this.cloneColumns[index].sortMethod(a, b);
|
||||
} else {
|
||||
return a[key] < b[key];
|
||||
}
|
||||
});
|
||||
} else if (type === 'normal') {
|
||||
this.rebuildData = this.makeData();
|
||||
}
|
||||
}
|
||||
|
||||
this.cloneColumns[index]._sortType = type;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue