исправлена функция выбора дт и кт
This commit is contained in:
parent
22d5733d16
commit
2812897858
@ -34,10 +34,6 @@ export const TreeFilterDropdown: React.FC<TreeFilterDropdownProps> = ({
|
||||
const [checkedKeys, setCheckedKeys] = useState<string[]>(selectedKeys);
|
||||
const [expandedKeys, setExpandedKeys] = useState<string[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
setCheckedKeys(selectedKeys);
|
||||
}, [selectedKeys]);
|
||||
|
||||
const filteredTreeData = useMemo(() => {
|
||||
if (!query) return treeData;
|
||||
|
||||
@ -51,7 +47,11 @@ export const TreeFilterDropdown: React.FC<TreeFilterDropdownProps> = ({
|
||||
}
|
||||
|
||||
if (isMatch || filteredChildren.length > 0) {
|
||||
return { ...node, children: filteredChildren.length > 0 ? filteredChildren : undefined };
|
||||
return {
|
||||
...node,
|
||||
// ВАЖНО: мы оставляем родителя, но обрезаем его детей до найденных
|
||||
children: filteredChildren.length > 0 ? filteredChildren : undefined,
|
||||
};
|
||||
}
|
||||
return null;
|
||||
};
|
||||
@ -98,8 +98,68 @@ export const TreeFilterDropdown: React.FC<TreeFilterDropdownProps> = ({
|
||||
onClose();
|
||||
};
|
||||
|
||||
function checkHandler(keys: string[], info: { node: OptionType; checked: boolean }) {
|
||||
const newKeys = new Set([...keys, ...selectedKeys]);
|
||||
|
||||
const getAllDescendants = (node: OptionType): string[] => {
|
||||
let res: string[] = [];
|
||||
if (node?.children) {
|
||||
node.children.forEach((child) => {
|
||||
res.push(child.key);
|
||||
res = [...res, ...getAllDescendants(child)];
|
||||
});
|
||||
}
|
||||
return res;
|
||||
};
|
||||
const findNodeByKey = (nodes: OptionType[], key: string): OptionType | undefined => {
|
||||
for (const node of nodes) {
|
||||
if (node.key === key) return node;
|
||||
if (node.children) {
|
||||
const found = findNodeByKey(node.children, key);
|
||||
if (found) return found;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
};
|
||||
function findParentByKey(nodes: OptionType[], targetKey: string, parent: OptionType | null = null): OptionType | undefined {
|
||||
for (const node of nodes) {
|
||||
if (node.key === targetKey) {
|
||||
return parent || undefined;
|
||||
}
|
||||
|
||||
if (node.children) {
|
||||
const foundParent = findParentByKey(node.children, targetKey, node);
|
||||
if (foundParent) {
|
||||
return foundParent;
|
||||
}
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
const node = findNodeByKey(treeData, info.node.key);
|
||||
const childrens = getAllDescendants(node as OptionType);
|
||||
if (node?.key) {
|
||||
if (info.checked) {
|
||||
newKeys.add(node.key);
|
||||
childrens?.forEach((elem) => newKeys.add(elem));
|
||||
} else {
|
||||
const parentNode = findParentByKey(treeData, node.key);
|
||||
if (parentNode?.key) {
|
||||
newKeys.delete(parentNode?.key);
|
||||
}
|
||||
newKeys.delete(node.key);
|
||||
childrens?.forEach((elem) => newKeys.delete(elem));
|
||||
}
|
||||
}
|
||||
|
||||
setCheckedKeys(Array.from(newKeys));
|
||||
}
|
||||
useEffect(() => {
|
||||
setCheckedKeys(selectedKeys);
|
||||
}, [selectedKeys]);
|
||||
|
||||
return (
|
||||
<div style={{ padding: 12, width: 380 }}>
|
||||
<div className='filterTree' style={{ padding: 12, width: 380 }}>
|
||||
<div style={{ fontWeight: 600, marginBottom: 12, fontSize: 16 }}>{title}</div>
|
||||
{warningBlock}
|
||||
<div style={{ fontSize: 12, marginBottom: 4 }}>Поиск</div>
|
||||
@ -122,16 +182,7 @@ export const TreeFilterDropdown: React.FC<TreeFilterDropdownProps> = ({
|
||||
selectable={false}
|
||||
treeData={filteredTreeData}
|
||||
checkedKeys={visibleCheckedKeys}
|
||||
onCheck={(keys) => {
|
||||
const newChecked = Array.isArray(keys) ? keys : keys.checked;
|
||||
|
||||
const allVisibleKeys = getAllNodeKeys(filteredTreeData);
|
||||
const hiddenKeys = checkedKeys.filter((k) => !allVisibleKeys.includes(k));
|
||||
|
||||
const finalKeys = Array.from(new Set([...newChecked.map(String), ...hiddenKeys]));
|
||||
|
||||
setCheckedKeys(finalKeys);
|
||||
}}
|
||||
onCheck={(keys, test) => checkHandler(keys as string[], test)}
|
||||
expandedKeys={expandedKeys}
|
||||
onExpand={(keys) => setExpandedKeys(keys as string[])}
|
||||
/>
|
||||
|
||||
@ -6,6 +6,6 @@
|
||||
.chessTable .ant-table-cell-fix {
|
||||
background-color: #f8fafc !important;
|
||||
}
|
||||
.resRow {
|
||||
.chessTable .resRow {
|
||||
background-color: #e6f4ea !important ;
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
.empty-cell {
|
||||
.chessTable .empty-cell {
|
||||
background-color: #f2f4f7;
|
||||
}
|
||||
.chessTable .ant-table-tbody > tr:hover > td.empty-cell {
|
||||
|
||||
@ -151,6 +151,7 @@ export const ConsolidationChessTableFilter: React.FC<ConsolidationChessTableFilt
|
||||
className='custom-select-selection-item '
|
||||
popupRender={() => (
|
||||
<TreeFilterDropdown
|
||||
|
||||
title='Компании'
|
||||
placeholder='Введите название компании'
|
||||
treeData={companyTreeData}
|
||||
@ -177,7 +178,7 @@ export const ConsolidationChessTableFilter: React.FC<ConsolidationChessTableFilt
|
||||
showSearch={false}
|
||||
popupMatchSelectWidth={false}
|
||||
options={flattenTree(debitTreeData)}
|
||||
className='custom-select-selection-item '
|
||||
className='custom-select-selection-item'
|
||||
popupRender={() => (
|
||||
<TreeFilterDropdown
|
||||
title='Дебетовые счета'
|
||||
@ -208,6 +209,7 @@ export const ConsolidationChessTableFilter: React.FC<ConsolidationChessTableFilt
|
||||
showSearch={false}
|
||||
popupMatchSelectWidth={false}
|
||||
options={flattenTree(creditTreeData)}
|
||||
className='custom-select-selection-item'
|
||||
popupRender={() => (
|
||||
<TreeFilterDropdown
|
||||
title='Кредитовые счета'
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user