1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-25 14:50:29 +00:00

Feature/improve gallery interactivity (#6701)

* zip download images in gallery

* delete images in gallery

* clean up code

* update gallery context menu

* fix bug - select failed when gallery have several groups

* change function name

---------

Co-authored-by: Michael An <2331806369@qq.com>
This commit is contained in:
Aries
2024-09-21 16:41:21 +08:00
committed by GitHub
parent 1ea86d95b3
commit adf6591e59
8 changed files with 408 additions and 23 deletions

View File

@@ -6,7 +6,7 @@ import { gettext, siteRoot } from '../../../../utils/constants';
import { Utils } from '../../../../utils/utils';
import { useMetadataView } from '../../../hooks/metadata-view';
import { PRIVATE_COLUMN_KEY } from '../../../constants';
import { VIEW_TYPE } from '../../../constants/view';
import './index.css';
const OPERATION = {
@@ -16,6 +16,8 @@ const OPERATION = {
OPEN_IN_NEW_TAB: 'open-new-tab',
GENERATE_DESCRIPTION: 'generate-description',
IMAGE_CAPTION: 'image-caption',
DOWNLOAD: 'download',
DELETE: 'delete',
};
const ContextMenu = ({
@@ -29,6 +31,8 @@ const ContextMenu = ({
updateRecords,
getTableContentRect,
getTableCanvasContainerRect,
onDownload,
onDelete,
}) => {
const menuRef = useRef(null);
const [visible, setVisible] = useState(false);
@@ -44,6 +48,11 @@ const ContextMenu = ({
const canModifyRow = window.sfMetadataContext.canModifyRow;
let list = [];
if (metadata.view.type === VIEW_TYPE.GALLERY) {
list.push({ value: OPERATION.DOWNLOAD, label: gettext('Download') });
list.push({ value: OPERATION.DELETE, label: gettext('Delete') });
}
if (selectedRange) {
!isReadonly && list.push({ value: OPERATION.CLEAR_SELECTED, label: gettext('Clear selected') });
list.push({ value: OPERATION.COPY_SELECTED, label: gettext('Copy selected') });
@@ -62,7 +71,7 @@ const ContextMenu = ({
return list;
}
const selectedRecords = Object.keys(recordMetrics.idSelectedRecordMap);
const selectedRecords = recordMetrics ? Object.keys(recordMetrics.idSelectedRecordMap) : [];
if (selectedRecords.length > 1) {
if (descriptionColumn) {
const isIncludeSdocRecord = selectedRecords.filter(id => {
@@ -229,12 +238,20 @@ const ContextMenu = ({
imageCaption && imageCaption();
break;
}
case OPERATION.DOWNLOAD: {
onDownload && onDownload();
break;
}
case OPERATION.DELETE: {
onDelete && onDelete();
break;
}
default: {
break;
}
}
setVisible(false);
}, [onOpenFileInNewTab, onOpenParentFolder, onCopySelected, onClearSelected, generateDescription, imageCaption]);
}, [onOpenFileInNewTab, onOpenParentFolder, onCopySelected, onClearSelected, generateDescription, imageCaption, onDownload, onDelete]);
const getMenuPosition = useCallback((x = 0, y = 0) => {
let menuStyles = {