<el-table v-loading="loading" :data="dataList" :defalut-sort="sortRule" @sort-change="sortChange">
<el-table-column :label="utilsTranslate('Project ID')" align="center" prop="projectID" sortable />
const sortRule = reactive({ prop: null, order: null})
const tabData = ref('')
``
// 日期排序
const sortChange = (column) => {
// 完成日期排序
if (column.order !== null && column.prop === 'completedDate') {
var data1 = []
var data2 = []
for (let i = 0; i < dataList.value.length; i++) {
//判断如果是空的push在数字后面,有值的就放在前面,然后把排好的数组再赋值给表格data
if (dataList.value[i].completedDate === null) {
data2.push(dataList.value[i])
} else {
data2.unshift(dataList.value[i])
}
}
if (column.order === "ascending") {
data1 = data2.sort(compare(column.prop, "ascending", 'completedDate'));
} else {
data1 = data2.sort(compare(column.prop, "descending", 'completedDate'));
}
nextTick(() => {
dataList.value = data1;
});
}
if (column.order === null) {
dataList.value = tabData.value; // tabData存放的是list副本,不排序时恢复到初始状态
}
}
// 手动排序
function compare(property, type, prop) {
return function(obj1, obj2) {
if (type === "ascending") {
// 升序
return Date.parse(obj1[prop]) - Date.parse(obj2[prop]);
} else {
// 降序
return Date.parse(obj2[prop]) - Date.parse(obj1[prop])
}
};
}
``