GithubBackup/Foxel
1
0
Fork 0
mirror of https://github.com/DrizzleTime/Foxel.git synced 2026-05-07 08:13:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(GridView): add mouse down event for selecting multiple entries

Browse Source
This commit is contained in:
shiyu
2025-12-16 15:57:32 +08:00
parent c2a473fac9
commit 8cf147bf34
1 changed files with 18 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
web/src/pages/FileExplorerPage/components/GridView.tsx
View File

@@ -66,6 +66,24 @@ export const GridView: React.FC<Props> = ({ entries, thumbs, selectedEntries, pa
const [rect, setRect] = useState<{ left: number, top: number, width: number, height: number } | null>(null);
const [selecting, setSelecting] = useState(false);
useEffect(() => {
const grid = containerRef.current;
const scrollContainer = grid?.parentElement;
if (!scrollContainer) return;
const onBlankMouseDown = (e: MouseEvent) => {
if (e.button !== 0) return;
if (e.target !== scrollContainer) return;
startRef.current = { x: e.clientX, y: e.clientY };
setSelecting(true);
setRect({ left: e.clientX, top: e.clientY, width: 0, height: 0 });
e.preventDefault();
};
scrollContainer.addEventListener('mousedown', onBlankMouseDown);
return () => scrollContainer.removeEventListener('mousedown', onBlankMouseDown);
}, []);
useEffect(() => {
const onMove = (ev: MouseEvent) => {
if (!startRef.current) return;