<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在數(shù)字后面，有值的就放在前面板乙，然后把排好的數(shù)組再賦值給表格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副本，不排序時(shí)恢復(fù)到初始狀態(tài)
}
}
// 手動(dòng)排序
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])
}
};
}
``
