feat(components): 优化目录结构并添加编辑功能

- 重构 buildTree 函数,提高目录结构生成效率
- 在目录项中添加编辑图标和相关事件处理
- 优化目录项的样式和布局
This commit is contained in:
2025-07-31 14:32:00 +08:00
parent 7b85fe4607
commit 1bfc45b240

View File

@@ -267,18 +267,45 @@ const initVditor = () => {
});
};
const buildTree = (items, parentId = 0) => {
return items
.filter(item => +item.parentId === +parentId)
.map(item => {
const children = buildTree(items, item.id);
return {
...item,
value: item.id,
label: item.grouping,
children: children.length > 0 ? children : undefined,
};
});
const buildTree = (items) => {
const tree = [];
const itemMap = new Map();
// First, map all items by their id
items.forEach(item => {
itemMap.set(String(item.id), {
...item,
value: item.id,
label: item.grouping,
children: [], // Initialize children array
});
});
// Then, build the tree structure
itemMap.forEach(item => {
const parentId = String(item.parentId);
if (parentId !== '0' && itemMap.has(parentId)) {
const parent = itemMap.get(parentId);
parent.children.push(item);
} else {
// If it's a root node or an orphan, add it to the top level
tree.push(item);
}
});
// Helper to remove empty children arrays
const cleanTree = (nodes) => {
nodes.forEach(node => {
if (node.children.length === 0) {
delete node.children;
} else {
cleanTree(node.children);
}
});
};
cleanTree(tree);
return tree;
};
const fetchGroupings = async () => {
@@ -388,10 +415,11 @@ const renderMenu = (item) => {
});
}
return h(ElMenuItem, { index: `group-${item.id}`, onClick: () => selectFile(item) }, {
default: () => [
h(ElIcon, () => h(Document)),
h('span', null, item.grouping)
]
default: () => h('div', { class: 'menu-item-title' }, [
h(ElIcon, () => h(Folder)),
h('span', null, item.grouping),
h(ElIcon, { class: 'edit-icon', onClick: (e) => { e.stopPropagation(); openRenameDialog(item, 'group'); } }, () => h(Edit))
])
});
};