[Feature Request] how to use filter pagination and sorting in one table

### 选择要提交 issue 的库
vue-easytable

### Issue 类型
Feature

### Issue 标题
how to use filter pagination and sorting in one table

### 这个功能解决了什么问题？
how to use filter pagination and sorting in one table

### 你期望的 API 是什么样的？
here my code please help

```vue

.table-pagination {
margin-top: 20px;
text-align: right;
}
.table-body-cell-class2 {
background: orange !important;
color: #fff !important;
}

export default {
data() {
return {
sortOption: {
multipleSort: true,
sortChange: (params) => {
console.log("sortChange::", params);
this.sortChange(params);
},
},
// real table data
tableData: [],
serviceData: [],
// page index
pageIndex: 1,
// page size
pageSize: 10,
};
},
async mounted() {
await this.callService();
setInterval(() => {
this.callService();
}, 60000);
},
computed: {
filterList() {
let dates = [...new Set(this.tableData.map((x) => x.type))];
let result = [];
for (let i = 0; i < dates.length; i++) {
result.push({ value: i, label: dates[i], selected: false });
}
return result;
},
columns() {
return [
{
field: "",
key: "a",
title: "#",
align: "center",
renderBodyCell: ({ row, column, rowIndex }, h) => {
return (this.pageIndex - 1) * this.pageSize + rowIndex + 1;
},
},
{
field: "region",
key: "b",
title: "Region",

},
{
field: "type",
key: "c",
title: "Type",

// filter
filter: {
filterList: this.filterList,
// filter confirm hook
filterConfirm: (filterList) => {
const labels = filterList
.filter((x) => x.selected)
.map((x) => x.label);
this.searchByDateField(labels);
},
// filter reset hook
filterReset: (filterList) => {
this.searchByDateField([]);
},
},
},
{
title: "Total",
children: [
{
field: "total",
key: "d",
title: "3D",
width: 100,
sortBy: "",
},
],
},

];
},
NewData() {
const { pageIndex, pageSize } = this;
return this.serviceData.slice(
(pageIndex - 1) * pageSize,
pageIndex * pageSize
);
},
totalCount() {
return this.serviceData.length;
},
},
methods: {
// page number change
pageNumberChange(pageIndex) {
this.pageIndex = pageIndex;
},

// page size change
pageSizeChange(pageSize) {
this.pageIndex = 1;
this.pageSize = pageSize;
},

async callService() {
this.dataService = [
{ region: "West", type: 'A',total:100},
{ region: "North", type: 'B',total:200 },
{ region: "Center", type: 'C',total:300},
];
this.serviceData.splice(0, this.serviceData.length);
for (var i = 0; i < this.dataService.length; i++) {
this.serviceData.push({
region: this.dataService[i].region,
type: this.dataService[i].type,
total: this.dataService[i].total,
});
}
// console.log(this.tableData);
},
sortChange(params) {
let data = this.serviceData.slice(0);

data.sort((a, b) => {
if (params.total) {
if (params.total === "asc") {
return a.total - b.total;
} else if (params.total === "desc") {
return b.total - a.total;
} else {
return 0;
}
}
});
this.serviceData = data;
},
// search by date field
searchByDateField(labels) {
this.tableData = this.serviceData.filter(
(x) => labels.length === 0 || labels.includes(x.type)
);
},
},
};

```

Start by reproducing the supplied Vue example around ve-table, ve-pagination, sortOption, the filter callbacks, and the pagination and sorting methods. Confirm the intended combined behavior and identify the relevant component entry points before defining what a completed solution should demonstrate.

Written by the indexing model from the issue text.