haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-31 22:54:11 +00:00
Code Issues Releases Wiki Activity

12.0 grid view support multiple selection (#6403)

Browse Source 
* Feature - multiple selection with ctrl/shift

* update grid view context menu list in multiple selection mode

* fix code format

* optimize codes
This commit is contained in:
Aries
2024-07-23 23:08:53 +08:00
committed by GitHub
parent 2bc5ef7957
commit be84e505d0
35 changed files with 220 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
frontend/src/pages/lib-content-view/lib-content-view.js
View File

@@ -54,6 +54,7 @@ class LibContentView extends React.Component {
isGroupOwnedRepo: false,
userPerm: '',
selectedDirentList: [],
lastSelectedIndex: null,
fileTags: [],
repoTags: [],
usedRepoTags: [],
@@ -1328,22 +1329,50 @@ class LibContentView extends React.Component {
};
onDirentClick = (dirent) => {
let direntList = this.state.direntList.map(dirent => {
dirent.isSelected = false;
return dirent;
});
if (dirent) {
onDirentClick = (clickedDirent, event) => {
const { direntList, selectedDirentList, lastSelectedIndex } = this.state;
if (clickedDirent) {
const clickedIndex = direntList.findIndex(dirent => dirent.name === clickedDirent.name);
let newSelectedDirentList = [...selectedDirentList];
const isCtrlOrMetaKeyPressed = event && (event.ctrlKey || event.metaKey);
const isShiftKeyPressed = event && event.shiftKey;
if (isCtrlOrMetaKeyPressed) {
// Ctrl (Cmd on Mac) key is pressed: Toggle selection of the clicked item
const isSelected = newSelectedDirentList.some(dirent => dirent.name === clickedDirent.name);
if (isSelected) {
newSelectedDirentList = newSelectedDirentList.filter(dirent => dirent.name !== clickedDirent.name);
} else {
newSelectedDirentList.push(clickedDirent);
}
} else if (isShiftKeyPressed && lastSelectedIndex !== null) {
// Shift key is pressed: Select all items between the last selected and the clicked item
const rangeStart = Math.min(this.state.lastSelectedIndex, clickedIndex);
const rangeEnd = Math.max(this.state.lastSelectedIndex, clickedIndex);
newSelectedDirentList = direntList.slice(rangeStart, rangeEnd + 1);
} else {
newSelectedDirentList = [clickedDirent];
}
this.setState({
direntList: direntList,
isDirentSelected: true,
selectedDirentList: [dirent],
direntList: direntList.map(dirent => {
dirent.isSelected = newSelectedDirentList.some(selectedDirent => selectedDirent.name === dirent.name);
return dirent;
}),
isDirentSelected: newSelectedDirentList.length > 0,
selectedDirentList: newSelectedDirentList,
lastSelectedIndex: clickedIndex,
});
} else {
this.setState({
direntList: direntList,
direntList: direntList.map(dirent => {
dirent.isSelected = false;
return dirent;
}),
isDirentSelected: false,
selectedDirentList: [],
lastSelectedIndex: null,
});
}
};
@@ -1459,7 +1488,7 @@ class LibContentView extends React.Component {
};
onFileUploadSuccess = (direntObject) => {
const isExist = this.state.direntList.some(item => item.name === direntObject.name && item.type === direntObject.type );
const isExist = this.state.direntList.some(item => item.name === direntObject.name && item.type === direntObject.type);
if (isExist) {
const updatedDirentList = this.state.direntList.map(dirent => {