<a-table
v-if="tableTh.length > 0"
:row-selection="{
selectedRowKeys: selectedRowKeys,
onSelect: onSelect,
onSelectAll: onSelectAll,
}"
:rowKey="(record) => record.id"
:dataSource="tableDatas"
:columns="tableTh"
:pagination="false"
:customRow="customRow"
>
<template #bodyCell="{ column, record }">
<span
v-html="setName(record[column.key])"
></span>
</template>
</a-table>
const state = reactive<{
selectedRowKeys: AnyObject[];
}>({
selectedRowKeys: [],// 存放所有选中选项的id
});
const selectedRowsAll: Ref<any[]> = ref([]);// 存放所有选中的选项的所有内容
const onSelect = (record: any, selected: boolean) => {
if (selected) {
state.selectedRowKeys.push(record.id);
selectedRowsAll.value.push(record);
} else {
let index = state.selectedRowKeys.findIndex((it) => {
it === record.id;
});
state.selectedRowKeys.splice(index, 1);
selectedRowsAll.value.splice(index, 1);
}
};
const onSelectAll = (
selected: boolean,
selectedRows: any,
changeRows: any,
) => {
const changeRowId = changeRows.map((it: AnyObject) => {
return it.id;
});
if (selected) {
let newIds: any[] = Array.from(
new Set(changeRowId.concat(state.selectedRowKeys)),
);
let newRows: any[] = Array.from(
new Set(changeRows.concat(selectedRowsAll.value)),
);
state.selectedRowKeys = newIds;
selectedRowsAll.value = newRows;
} else {
// 取消选中
changeRowId.map((it: AnyObject) => {
let index = state.selectedRowKeys.findIndex((item) => {
return item == it;
});
if (index != -1) {
state.selectedRowKeys.splice(index, 1);
selectedRowsAll.value.splice(index, 1);
}
});
}
};