feat(文件选择对话框): 添加展开/折叠全部文件夹功能
添加 handleExpandAll 和 handleCollapseAll 回调函数实现批量展开/折叠功能 在树形视图模式下添加对应的操作按钮
This commit is contained in:
parent
fb7513f886
commit
46f7a46f22
|
|
@ -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"
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue