diff --git a/packages/next/src/select-table/index.tsx b/packages/next/src/select-table/index.tsx index d138baf74a8..3d637cba400 100644 --- a/packages/next/src/select-table/index.tsx +++ b/packages/next/src/select-table/index.tsx @@ -135,6 +135,7 @@ export const SelectTable: ComposedSelectTable = observer((props) => { }, [filteredDataSource, filterSort]) const flatDataSource = useFlatOptions(dataSource) + const flatFilteredDataSource = useFlatOptions(filteredDataSource) // selected keys for Table UI const selected = getUISelected( @@ -212,7 +213,8 @@ export const SelectTable: ComposedSelectTable = observer((props) => { currentSelected, selected, primaryKey, - flatDataSource + flatDataSource, + flatFilteredDataSource ) onInnerChange(selectedRowKeys, records) } @@ -220,7 +222,8 @@ export const SelectTable: ComposedSelectTable = observer((props) => { // Table All Checkbox const titleAddon = useTitleAddon( selected, - useFlatOptions(filteredDataSource), + flatDataSource, + flatFilteredDataSource, primaryKey, mode, disabled, diff --git a/packages/next/src/select-table/useCheckSlackly.tsx b/packages/next/src/select-table/useCheckSlackly.tsx index 195387826a5..9248b09c34f 100644 --- a/packages/next/src/select-table/useCheckSlackly.tsx +++ b/packages/next/src/select-table/useCheckSlackly.tsx @@ -19,27 +19,31 @@ interface ICheckSlackly { currentSelected: any[], allSelected: any[], primaryKey: string, - flatDataSource: any[] + flatDataSource: any[], + flatFilteredDataSource: any[] ): { selectedRowKeys: any[] records: any[] } } +// 父子节点(节点状态按全完整数据计算,节点操作按筛选数据计算) const useCheckSlackly: ICheckSlackly = ( currentSelected, // onChange 返回的 keys allSelected, // Table UI 展示的 keys primaryKey, - flatDataSource + flatDataSource, + flatFilteredDataSource ) => { const isSelected = currentSelected.length > allSelected.length // 判断是选中还是取消 const currentKey = [...currentSelected, ...allSelected].find( (key) => !(currentSelected.includes(key) && allSelected.includes(key)) // 当前变化key不同时存在于两个selected ) - const currentRecords = flatDataSource.find( + // 从过滤后的数据中获取当前record + const currentRecord = flatFilteredDataSource.find( (item) => item[primaryKey] === currentKey ) - const currentTreeKeys = getTreeKeys([currentRecords], primaryKey) + const currentTreeKeys = getTreeKeys([currentRecord], primaryKey) let newSelectedRowKeys = [] if (isSelected) { // 选中当前key及其子keys diff --git a/packages/next/src/select-table/useTitleAddon.tsx b/packages/next/src/select-table/useTitleAddon.tsx index 9fb911e4653..bff18f81e79 100644 --- a/packages/next/src/select-table/useTitleAddon.tsx +++ b/packages/next/src/select-table/useTitleAddon.tsx @@ -1,10 +1,11 @@ import React from 'react' import { Checkbox } from '@alifd/next' -// 重写表格表头Checkbox +// 重写表格表头Checkbox(节点状态按全完整数据计算,节点操作按筛选数据计算) const newCheckbox = ( selected, + flatDataSource, filteredFlatDataSource, primaryKey, disabled, @@ -12,31 +13,46 @@ const newCheckbox = onChange ) => () => { - const currentDataSource = filteredFlatDataSource.filter( - (item) => !item.disabled + // 当前可全选的keys + const currentSelected = filteredFlatDataSource + .filter((item) => !item.disabled) + .map((item) => item?.[primaryKey]) + + // 点击全选的完整数据(筛选前后) + const newSelected = [...new Set([...selected, ...currentSelected])] + const newRecords = flatDataSource.filter((item) => + newSelected.includes(item[primaryKey]) ) - const currentDataSourceKeys = currentDataSource.map( - (item) => item?.[primaryKey] + + // 取消全选的剩余数据(筛选前后) + const restSelected = selected.filter( + (key) => !currentSelected.includes(key) ) - const currentSelected = selected.filter((item) => - currentDataSourceKeys.includes(item) + const restRecords = flatDataSource.filter((item) => + restSelected.includes(item[primaryKey]) ) - const indeterminate = !!( - currentSelected?.length && - currentSelected.length !== currentDataSource.length + + // 全选框是否选中 + const checked = Boolean( + selected?.length && + selected?.length === + flatDataSource.filter((item) => !item.disabled).length ) + // 全选框是否未完全选中 + const indeterminate = Boolean(selected?.length && !checked) + return ( { if (!readOnly) { - if (checked || indeterminate) { - onChange?.(currentDataSourceKeys, currentDataSource) + if (checked) { + onChange?.(newSelected, newRecords) } else { - onChange?.([], []) + onChange?.(restSelected, restRecords) } } }} @@ -46,6 +62,7 @@ const newCheckbox = const useTitleAddon = ( selected: any[], + flatDataSource: any[], filteredFlatDataSource: any[], primaryKey: string, mode: string, @@ -62,6 +79,7 @@ const useTitleAddon = ( }), titleAddons: newCheckbox( selected, + flatDataSource, filteredFlatDataSource, primaryKey, disabled,