haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-02 23:48:47 +00:00
Code Issues Releases Wiki Activity

refactor(tag): parent tag files count includes children (#7420)

Browse Source
This commit is contained in:
Jerry Ren
2025-01-23 14:37:57 +08:00
committed by GitHub
parent 076d147d4e
commit b7d9f781fd
17 changed files with 294 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/components/sf-table/table-main/records/record/actions-cell/index.js
View File

@@ -52,10 +52,7 @@ class ActionsCell extends Component {
};
getRecordNo = () => {
if (this.props.showRecordAsTree) {
return this.props.treeNodeDisplayIndex;
}
return this.props.index + 1;
return (this.props.showRecordAsTree ? this.props.treeNodeIndex : this.props.index) + 1;
};
render() {

24
frontend/src/components/sf-table/table-main/records/record/cell/index.js
View File

@@ -24,11 +24,12 @@ const Cell = React.memo(({
frozen,
height,
showRecordAsTree,
nodeDepth,
treeNodeIndex,
treeNodeDepth,
hasChildNodes,
isFoldedNode,
isFoldedTreeNode,
checkCanModifyRecord,
toggleExpandNode,
toggleExpandTreeNode,
}) => {
const cellEditable = useMemo(() => {
return checkIsColumnEditable(column) && checkCanModifyRecord && checkCanModifyRecord(record);
@@ -168,19 +169,19 @@ const Cell = React.memo(({
};
const renderCellContent = useCallback(() => {
const columnFormatter = isValidElement(column.formatter) && cloneElement(column.formatter, { isCellSelected, value: cellValue, column, record, onChange: modifyRecord });
const columnFormatter = isValidElement(column.formatter) && cloneElement(column.formatter, { isCellSelected, value: cellValue, column, record, treeNodeIndex, onChange: modifyRecord });
if (showRecordAsTree && isNameColumn) {
return (
<div className="sf-table-cell-tree-node">
{hasChildNodes && <span className="sf-table-record-tree-expand-icon" style={{ left: nodeDepth * NODE_ICON_LEFT_INDENT }} onClick={toggleExpandNode}><i className={classnames('sf3-font sf3-font-down', { 'rotate-270': isFoldedNode })}></i></span>}
<div className="sf-table-cell-tree-node-content" style={{ paddingLeft: NODE_CONTENT_LEFT_INDENT + nodeDepth * NODE_ICON_LEFT_INDENT }}>
{hasChildNodes && <span className="sf-table-record-tree-expand-icon" style={{ left: treeNodeDepth * NODE_ICON_LEFT_INDENT }} onClick={toggleExpandTreeNode}><i className={classnames('sf3-font sf3-font-down', { 'rotate-270': isFoldedTreeNode })}></i></span>}
<div className="sf-table-cell-tree-node-content" style={{ paddingLeft: NODE_CONTENT_LEFT_INDENT + treeNodeDepth * NODE_ICON_LEFT_INDENT }}>
{columnFormatter}
</div>
</div>
);
}
return columnFormatter;
}, [isNameColumn, column, isCellSelected, cellValue, record, showRecordAsTree, nodeDepth, hasChildNodes, isFoldedNode, modifyRecord, toggleExpandNode]);
}, [isNameColumn, column, isCellSelected, cellValue, record, showRecordAsTree, treeNodeIndex, treeNodeDepth, hasChildNodes, isFoldedTreeNode, modifyRecord, toggleExpandTreeNode]);
return (
<div key={`${record._id}-${column.key}`} {...containerProps}>
@@ -208,14 +209,15 @@ Cell.propTypes = {
column: PropTypes.object.isRequired,
height: PropTypes.number,
needBindEvents: PropTypes.bool,
modifyRecord: PropTypes.func,
highlightClassName: PropTypes.string,
bgColor: PropTypes.string,
showRecordAsTree: PropTypes.bool,
nodeDepth: PropTypes.number,
treeNodeIndex: PropTypes.number,
treeNodeDepth: PropTypes.number,
hasChildNodes: PropTypes.bool,
isFoldedNode: PropTypes.bool,
toggleExpandNode: PropTypes.func,
isFoldedTreeNode: PropTypes.bool,
modifyRecord: PropTypes.func,
toggleExpandTreeNode: PropTypes.func,
};
export default Cell;

34
frontend/src/components/sf-table/table-main/records/record/index.js
View File

@@ -36,11 +36,11 @@ class Record extends React.Component {
nextProps.searchResult !== this.props.searchResult ||
nextProps.columnColor !== this.props.columnColor ||
nextProps.showRecordAsTree !== this.props.showRecordAsTree ||
nextProps.nodeKey !== this.props.nodeKey ||
nextProps.nodeDepth !== this.props.nodeDepth ||
nextProps.treeNodeIndex !== this.props.treeNodeIndex ||
nextProps.treeNodeKey !== this.props.treeNodeKey ||
nextProps.treeNodeDepth !== this.props.treeNodeDepth ||
nextProps.hasChildNodes !== this.props.hasChildNodes ||
nextProps.treeNodeDisplayIndex !== this.props.treeNodeDisplayIndex ||
nextProps.isFoldedNode !== this.props.isFoldedNode
nextProps.isFoldedTreeNode !== this.props.isFoldedTreeNode
);
}
@@ -116,10 +116,11 @@ class Record extends React.Component {
highlightClassName={highlightClassName}
bgColor={bgColor}
showRecordAsTree={this.props.showRecordAsTree}
nodeDepth={this.props.nodeDepth}
treeNodeIndex={this.props.treeNodeIndex}
treeNodeDepth={this.props.treeNodeDepth}
hasChildNodes={this.props.hasChildNodes}
isFoldedNode={this.props.isFoldedNode}
toggleExpandNode={this.props.toggleExpandNode}
isFoldedTreeNode={this.props.isFoldedTreeNode}
toggleExpandTreeNode={this.props.toggleExpandTreeNode}
/>
);
});
@@ -183,10 +184,11 @@ class Record extends React.Component {
highlightClassName={highlightClassName}
bgColor={bgColor}
showRecordAsTree={this.props.showRecordAsTree}
nodeDepth={this.props.nodeDepth}
treeNodeIndex={this.props.treeNodeIndex}
treeNodeDepth={this.props.treeNodeDepth}
hasChildNodes={this.props.hasChildNodes}
isFoldedNode={this.props.isFoldedNode}
toggleExpandNode={this.props.toggleExpandNode}
isFoldedTreeNode={this.props.isFoldedTreeNode}
toggleExpandTreeNode={this.props.toggleExpandTreeNode}
/>
);
});
@@ -273,7 +275,7 @@ class Record extends React.Component {
recordId={record._id}
index={index}
showRecordAsTree={this.props.showRecordAsTree}
treeNodeDisplayIndex={this.props.treeNodeDisplayIndex}
treeNodeIndex={this.props.treeNodeIndex}
onSelectRecord={this.onSelectRecord}
isLastFrozenCell={!lastFrozenColumnKey}
height={cellHeight}
@@ -316,12 +318,12 @@ Record.propTypes = {
searchResult: PropTypes.object,
columnColor: PropTypes.object,
showRecordAsTree: PropTypes.bool,
nodeKey: PropTypes.string,
nodeDepth: PropTypes.number,
treeNodeIndex: PropTypes.number,
treeNodeKey: PropTypes.string,
treeNodeDepth: PropTypes.number,
hasChildNodes: PropTypes.bool,
treeNodeDisplayIndex: PropTypes.number,
isFoldedNode: PropTypes.bool,
toggleExpandNode: PropTypes.func,
isFoldedTreeNode: PropTypes.bool,
toggleExpandTreeNode: PropTypes.func,
};
export default Record;

14
frontend/src/components/sf-table/table-main/records/tree-body.js
View File

@@ -99,7 +99,7 @@ class TreeBody extends Component {
if (row && checkIsTreeNodeShown(nodeKey, keyNodeFoldedMap)) {
shownNodes.push({
...node,
node_display_index: index + 1,
node_index: index,
});
}
});
@@ -535,7 +535,7 @@ class TreeBody extends Component {
const rowHeight = this.getRowHeight();
const cellMetaData = this.getCellMetaData();
let shownNodes = visibleNodes.map((node, index) => {
const { _id: recordId, node_key, node_depth, node_display_index } = node;
const { _id: recordId, node_key, node_depth, node_index } = node;
const hasChildNodes = checkTreeNodeHasChildNodes(node);
const record = this.props.recordGetterById(recordId);
const isSelected = TreeMetrics.checkIsTreeNodeSelected(node_key, treeMetrics);
@@ -553,7 +553,6 @@ class TreeBody extends Component {
}}
isSelected={isSelected}
index={recordIndex}
treeNodeDisplayIndex={node_display_index}
isLastRecord={isLastRecord}
showSequenceColumn={this.props.showSequenceColumn}
record={record}
@@ -567,17 +566,18 @@ class TreeBody extends Component {
cellMetaData={cellMetaData}
columnColor={columnColor}
searchResult={this.props.searchResult}
nodeKey={node_key}
nodeDepth={node_depth}
treeNodeIndex={node_index}
treeNodeKey={node_key}
treeNodeDepth={node_depth}
hasChildNodes={hasChildNodes}
isFoldedNode={isFoldedNode}
isFoldedTreeNode={isFoldedNode}
checkCanModifyRecord={this.props.checkCanModifyRecord}
checkCellValueChanged={this.props.checkCellValueChanged}
hasSelectedCell={hasSelectedCell}
selectedPosition={selectedPosition}
selectNoneCells={this.selectNoneCells}
onSelectRecord={this.props.onSelectRecord}
toggleExpandNode={() => this.toggleExpandNode(node_key)}
toggleExpandTreeNode={() => this.toggleExpandNode(node_key)}
/>
);
});

7
frontend/src/components/sf-table/utils/cell-comparer.js
View File

@@ -22,7 +22,7 @@ export const checkCellValueChanged = (oldVal, newVal) => {
export const cellCompare = (props, nextProps) => {
const {
record: oldRecord, column, isCellSelected, isLastCell, highlightClassName, height, bgColor,
showRecordAsTree, nodeDepth, hasChildNodes, isFoldedNode,
showRecordAsTree, treeNodeIndex, treeNodeDepth, hasChildNodes, isFoldedTreeNode,
} = props;
const {
record: newRecord, highlightClassName: newHighlightClassName, height: newHeight, column: newColumn, bgColor: newBgColor,
@@ -49,9 +49,10 @@ export const cellCompare = (props, nextProps) => {
!ObjectUtils.isSameObject(column.data, newColumn.data) ||
bgColor !== newBgColor ||
showRecordAsTree !== nextProps.showRecordAsTree ||
nodeDepth !== nextProps.nodeDepth ||
treeNodeIndex !== nextProps.treeNodeIndex ||
treeNodeDepth !== nextProps.treeNodeDepth ||
hasChildNodes !== nextProps.hasChildNodes ||
isFoldedNode !== nextProps.isFoldedNode ||
isFoldedTreeNode !== nextProps.isFoldedTreeNode ||
props.groupRecordIndex !== nextProps.groupRecordIndex ||
props.recordIndex !== nextProps.recordIndex
);

35
frontend/src/components/sf-table/utils/tree.js
View File

@@ -27,7 +27,6 @@ export const generateKeyTreeNodeRowIdMap = (tree) => {
return tree_node_key_row_id_map;
};
export const getValidKeyTreeNodeFoldedMap = (keyTreeNodeFoldedMap, treeNodeKeyRecordIdMap) => {
if (!keyTreeNodeFoldedMap) return {};
@@ -71,6 +70,21 @@ export const checkIsTreeNodeShown = (nodeKey, keyFoldedNodeMap) => {
return !foldedNodeKeys.some((foldedNodeKey) => nodeKey !== foldedNodeKey && nodeKey.includes(foldedNodeKey));
};
export const updatedKeyTreeNodeMap = (nodeKey, node, keyTreeNodeMap) => {
if (!nodeKey || !node || !keyTreeNodeMap) return;
keyTreeNodeMap[nodeKey] = node;
};
export const getTreeNodeByKey = (nodeKey, keyTreeNodeMap) => {
if (!nodeKey || !keyTreeNodeMap) return null;
return keyTreeNodeMap[nodeKey];
};
export const getTreeNodeById = (nodeId, tree) => {
if (!nodeId || !Array.isArray(tree) || tree.length === 0) return null;
return tree.find((node) => getTreeNodeId(node) === nodeId);
};
export const getTreeNodeId = (node) => {
return node ? node[TREE_NODE_KEY.ID] : '';
};
@@ -95,7 +109,7 @@ export const resetTreeHasChildNodesStatus = (tree) => {
const nextNode = tree[index + 1];
const nextNodeKey = getTreeNodeKey(nextNode);
const currentNodeKey = getTreeNodeKey(node);
if (nextNode && checkTreeNodeHasChildNodes(node) && !nextNodeKey.includes(currentNodeKey)) {
if (checkTreeNodeHasChildNodes(node) && (!nextNode || !nextNodeKey.includes(currentNodeKey))) {
tree[index][TREE_NODE_KEY.HAS_CHILD_NODES] = false;
}
});
@@ -131,3 +145,20 @@ export const addTreeChildNode = (newChildNode, parentNode, tree) => {
}
tree.splice(lastChildNodeIndex + 1, 0, newChildNode);
};
export const getAllSubTreeNodes = (nodeIndex, tree) => {
const treeLen = Array.isArray(tree) ? tree.length : 0;
const parentNode = tree[nodeIndex];
const parentNodeKey = getTreeNodeKey(parentNode);
if (!parentNodeKey || nodeIndex === treeLen - 1) return [];
let subNodes = [];
for (let i = nodeIndex + 1, len = treeLen; i < len; i++) {
const currNodeKey = getTreeNodeKey(tree[i]);
if (!currNodeKey || !currNodeKey.includes(parentNodeKey)) {
break;
}
subNodes.push(tree[i]);
}
return subNodes;
};