feat(文件选择对话框): 添加展开/折叠全部文件夹功能

添加 handleExpandAll 和 handleCollapseAll 回调函数实现批量展开/折叠功能
在树形视图模式下添加对应的操作按钮
This commit is contained in:
lintsinghua 2025-12-18 22:36:04 +08:00
parent fb7513f886
commit 46f7a46f22
1 changed files with 41 additions and 1 deletions

View File

@ -31,6 +31,8 @@ import {
RotateCcw, RotateCcw,
RefreshCw, RefreshCw,
Terminal, Terminal,
ChevronsUpDown,
ChevronsDownUp,
} from "lucide-react"; } from "lucide-react";
import { api } from "@/shared/config/database"; import { api } from "@/shared/config/database";
import { toast } from "sonner"; import { toast } from "sonner";
@ -251,6 +253,21 @@ export default function FileSelectionDialog({
}); });
}, []); }, []);
const handleExpandAll = useCallback(() => {
const folders = new Set<string>();
filteredFiles.forEach((f) => {
const parts = f.path.split("/");
for (let i = 1; i < parts.length; i++) {
folders.add(parts.slice(0, i).join("/"));
}
});
setExpandedFolders(folders);
}, [filteredFiles]);
const handleCollapseAll = useCallback(() => {
setExpandedFolders(new Set());
}, []);
const handleSelectAll = () => { const handleSelectAll = () => {
setSelectedFiles(new Set(filteredFiles.map((f) => f.path))); setSelectedFiles(new Set(filteredFiles.map((f) => f.path)));
}; };
@ -485,7 +502,7 @@ export default function FileSelectionDialog({
<select <select
value={filterType} value={filterType}
onChange={(e) => setFilterType(e.target.value)} onChange={(e) => setFilterType(e.target.value)}
className="h-9 px-2 cyber-input font-mono text-sm cyber-bg-elevated" className="h-9 px-2 py-1 border border-border rounded font-mono text-xs cyber-bg-elevated text-foreground"
> >
<option value=""></option> <option value=""></option>
{fileTypes.slice(0, 10).map(([ext, count]) => ( {fileTypes.slice(0, 10).map(([ext, count]) => (
@ -512,6 +529,7 @@ export default function FileSelectionDialog({
</button> </button>
</div> </div>
</div> </div>
{/* 操作按钮 */} {/* 操作按钮 */}
@ -544,6 +562,28 @@ export default function FileSelectionDialog({
<RefreshCw className="w-3 h-3 mr-1" /> <RefreshCw className="w-3 h-3 mr-1" />
</Button> </Button>
{viewMode === "tree" && (
<>
<Button
variant="outline"
size="sm"
onClick={handleExpandAll}
className="h-8 px-3 cyber-btn-outline font-mono text-xs"
>
<ChevronDown className="w-3 h-3 mr-1" />
</Button>
<Button
variant="outline"
size="sm"
onClick={handleCollapseAll}
className="h-8 px-3 cyber-btn-outline font-mono text-xs"
>
<ChevronRight className="w-3 h-3 mr-1" />
</Button>
</>
)}
{(searchTerm || filterType) && ( {(searchTerm || filterType) && (
<Button <Button
variant="outline" variant="outline"