1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-05-12 18:05:05 +00:00

basic codes

remove useless
This commit is contained in:
Michael An 2025-04-01 18:33:28 +08:00
parent e332873d8e
commit d1f10dbf60
13 changed files with 120 additions and 220 deletions
frontend/src
components
css
metadata/components/dialog/metadata-tags-status-dialog
pages/lib-content-view
shared-dir-view.js
utils

View File

@ -10,4 +10,8 @@ export const EVENT_BUS_TYPE = {
RESTORE_IMAGE: 'restore_image',
OPEN_MARKDOWN: 'open_markdown',
// migrate tags
OPEN_TREE_PANEL: 'open_tree_panel',
OPEN_LIBRARY_SETTINGS_TAGS: 'open_library_settings_tags',
};

View File

@ -1,11 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Dropdown, DropdownMenu, DropdownToggle, DropdownItem } from 'reactstrap';
import { gettext, enableFileTags } from '../../utils/constants';
import { Utils } from '../../utils/utils';
import TextTranslation from '../../utils/text-translation';
import CustomizePopover from '../customize-popover';
import ListTagPopover from '../popover/list-tag-popover';
import ViewModes from '../../components/view-modes';
import SortMenu from '../../components/sort-menu';
import MetadataViewToolBar from '../../metadata/components/view-toolbar';
@ -16,7 +11,6 @@ import AllTagsSortSetter from '../../tag/views/all-tags/tags-table/sort-setter';
import TagFilesSortSetter from '../../tag/views/tag-files/sort-setter';
const propTypes = {
repoID: PropTypes.string.isRequired,
userPerm: PropTypes.string,
currentPath: PropTypes.string.isRequired,
updateUsedRepoTags: PropTypes.func.isRequired,
@ -34,72 +28,13 @@ const propTypes = {
class DirTool extends React.Component {
constructor(props) {
super(props);
this.state = {
isRepoTagDialogOpen: false,
isDropdownMenuOpen: false,
};
}
toggleDropdownMenu = () => {
this.setState({
isDropdownMenuOpen: !this.state.isDropdownMenuOpen
});
};
hidePopover = (e) => {
if (e) {
let dom = e.target;
while (dom) {
if (typeof dom.className === 'string' && dom.className.includes('tag-color-popover')) return;
dom = dom.parentNode;
}
}
this.setState({ isRepoTagDialogOpen: false });
};
toggleCancel = () => {
this.setState({ isRepoTagDialogOpen: false });
};
getMenu = () => {
const list = [];
const { userPerm, currentPath } = this.props;
if (userPerm !== 'rw' || Utils.isMarkdownFile(currentPath)) {
return list;
}
const { TAGS } = TextTranslation;
if (enableFileTags) {
list.push(TAGS);
}
return list;
};
onMenuItemClick = (item) => {
const { key } = item;
switch (key) {
case 'Tags':
this.setState({ isRepoTagDialogOpen: !this.state.isRepoTagDialogOpen });
break;
}
};
onMenuItemKeyDown = (e, item) => {
if (e.key == 'Enter' || e.key == 'Space') {
this.onMenuItemClick(item);
}
};
onSelectSortOption = (item) => {
const [sortBy, sortOrder] = item.value.split('-');
this.props.sortItems(sortBy, sortOrder);
};
render() {
const menuItems = this.getMenu();
const { isDropdownMenuOpen } = this.state;
const { repoID, currentMode, currentPath, sortBy, sortOrder, viewId, isCustomPermission, onToggleDetail, onCloseDetail } = this.props;
const { currentMode, currentPath, sortBy, sortOrder, viewId, isCustomPermission, onToggleDetail, onCloseDetail } = this.props;
const propertiesText = TextTranslation.PROPERTIES.value;
const isFileExtended = currentPath.startsWith('/' + PRIVATE_FILE_TYPE.FILE_EXTENDED_PROPERTIES + '/');
const isTagView = currentPath.startsWith('/' + PRIVATE_FILE_TYPE.TAGS_PROPERTIES + '/');
@ -128,62 +63,15 @@ class DirTool extends React.Component {
}
return (
<React.Fragment>
<div className="dir-tool d-flex">
<ViewModes currentViewMode={currentMode} switchViewMode={this.props.switchViewMode} />
<SortMenu sortBy={sortBy} sortOrder={sortOrder} onSelectSortOption={this.onSelectSortOption} />
{(!isCustomPermission) &&
<div className="cur-view-path-btn" onClick={onToggleDetail}>
<span className="sf3-font sf3-font-info" aria-label={propertiesText} title={propertiesText}></span>
</div>
}
{menuItems.length > 0 &&
<Dropdown isOpen={isDropdownMenuOpen} toggle={this.toggleDropdownMenu}>
<DropdownToggle
tag="i"
id="cur-folder-more-op-toggle"
className='cur-view-path-btn sf3-font-more sf3-font'
data-toggle="dropdown"
title={gettext('More operations')}
aria-label={gettext('More operations')}
aria-expanded={isDropdownMenuOpen}
>
</DropdownToggle>
<DropdownMenu>
{menuItems.map((menuItem, index) => {
if (menuItem === 'Divider') {
return <DropdownItem key={index} divider />;
} else {
return (
<DropdownItem
key={index}
onClick={this.onMenuItemClick.bind(this, menuItem)}
onKeyDown={this.onMenuItemKeyDown.bind(this, menuItem)}
>{menuItem.value}
</DropdownItem>
);
}
})}
</DropdownMenu>
</Dropdown>
}
</div>
{this.state.isRepoTagDialogOpen &&
<CustomizePopover
popoverClassName="list-tag-popover"
target="cur-folder-more-op-toggle"
hidePopover={this.hidePopover}
hidePopoverWithEsc={this.hidePopover}
boundariesElement={document.body}
placement={'bottom-end'}
>
<ListTagPopover
repoID={repoID}
onListTagCancel={this.toggleCancel}
/>
</CustomizePopover>
<div className="dir-tool d-flex">
<ViewModes currentViewMode={currentMode} switchViewMode={this.props.switchViewMode} />
<SortMenu sortBy={sortBy} sortOrder={sortOrder} onSelectSortOption={this.onSelectSortOption} />
{(!isCustomPermission) &&
<div className="cur-view-path-btn" onClick={onToggleDetail}>
<span className="sf3-font sf3-font-info" aria-label={propertiesText} title={propertiesText}></span>
</div>
}
</React.Fragment>
</div>
);
}

View File

@ -25,7 +25,7 @@ const propTypes = {
currentRepoInfo: PropTypes.object.isRequired
};
const LibSettingsDialog = ({ repoID, currentRepoInfo, toggleDialog, tab }) => {
const LibSettingsDialog = ({ repoID, currentRepoInfo, toggleDialog, tab, showMigrateTip }) => {
const [activeTab, setActiveTab] = useState(tab || TAB.HISTORY_SETTING);
const toggleTab = useCallback((tab) => {
@ -201,6 +201,7 @@ const LibSettingsDialog = ({ repoID, currentRepoInfo, toggleDialog, tab }) => {
submit={updateEnableTags}
toggleDialog={toggleDialog}
enableMetadata={enableMetadata}
showMigrateTip={showMigrateTip}
/>
</TabPane>
)}

View File

@ -1,4 +1,4 @@
import React, { useState } from 'react';
import React, { useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import { gettext } from '../../../utils/constants';
import { Utils } from '../../../utils/utils';
@ -6,16 +6,34 @@ import TreeSection from '../../tree-section';
import TrashDialog from '../../dialog/trash-dialog';
import LibSettingsDialog from '../../dialog/lib-settings';
import RepoHistoryDialog from '../../dialog/repo-history';
import { eventBus } from '../../common/event-bus';
import { EVENT_BUS_TYPE } from '../../common/event-bus-type';
import { TAB } from '../../../constants/repo-setting-tabs';
import './index.css';
const DirOthers = ({ userPerm, repoID, currentRepoInfo }) => {
const showSettings = currentRepoInfo.is_admin; // repo owner, department admin, shared with 'Admin' permission
let [isSettingsDialogOpen, setSettingsDialogOpen] = useState(false);
let [activeTab, setActiveTab] = useState(TAB.HISTORY_SETTING);
let [showMigrateTip, setShowMigrateTip] = useState(false);
const toggleSettingsDialog = () => {
setSettingsDialogOpen(!isSettingsDialogOpen);
};
useEffect(() => {
const unsubscribeUnselectFiles = eventBus.subscribe(EVENT_BUS_TYPE.OPEN_LIBRARY_SETTINGS_TAGS, () => {
setSettingsDialogOpen(true);
setActiveTab(TAB.TAGS_SETTING);
setShowMigrateTip(true);
});
return () => {
unsubscribeUnselectFiles();
};
});
const [showTrashDialog, setShowTrashDialog] = useState(false);
const toggleTrashDialog = () => {
setShowTrashDialog(!showTrashDialog);
@ -59,6 +77,8 @@ const DirOthers = ({ userPerm, repoID, currentRepoInfo }) => {
repoID={repoID}
currentRepoInfo={currentRepoInfo}
toggleDialog={toggleSettingsDialog}
tab={activeTab}
showMigrateTip={showMigrateTip}
/>
)}
{isRepoHistoryDialogOpen && (

View File

@ -1,8 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import MD5 from 'MD5';
import { UncontrolledTooltip } from 'reactstrap';
import { gettext, siteRoot, mediaUrl, enableVideoThumbnail, enablePDFThumbnail } from '../../utils/constants';
import { Utils } from '../../utils/utils';
import { imageThumbnailCenter, videoThumbnailCenter } from '../../utils/thumbnail-center';
@ -297,13 +295,7 @@ class DirentGridItem extends React.Component {
render() {
let { dirent, isGridDropTipShow } = this.state;
let { is_freezed, is_locked, lock_owner_name, file_tags, isSelected } = dirent;
let toolTipID = '';
let tagTitle = '';
if (file_tags && file_tags.length > 0) {
toolTipID = MD5(dirent.name).slice(0, 7);
tagTitle = file_tags.map(item => item.name).join(' ');
}
let { is_freezed, is_locked, lock_owner_name, isSelected } = dirent;
const showName = this.getRenderedText(dirent);
return (
<>
@ -341,21 +333,6 @@ class DirentGridItem extends React.Component {
}
</div>
<div className="grid-file-name" onDragStart={this.onGridItemDragStart} draggable={this.canDrag} >
{(dirent.type !== 'dir' && file_tags && file_tags.length > 0) && (
<>
<div id={`tag-list-title-${toolTipID}`} className="dirent-item tag-list tag-list-stacked d-inline-block align-middle">
{file_tags.map((fileTag, index) => {
let length = file_tags.length;
return (
<span className="file-tag" key={fileTag.id} style={{ zIndex: length - index, backgroundColor: fileTag.color }}></span>
);
})}
</div>
<UncontrolledTooltip target={`tag-list-title-${toolTipID}`} placement="bottom">
{tagTitle}
</UncontrolledTooltip>
</>
)}
{(!dirent.isDir() && !this.canPreview) ?
<a
className="sf-link grid-file-name-link"

View File

@ -2,7 +2,6 @@ import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import MediaQuery from 'react-responsive';
import { v4 as uuidv4 } from 'uuid';
import dayjs from 'dayjs';
import { DropdownItem } from 'reactstrap';
import { gettext, siteRoot, mediaUrl, username, useGoFileserver, fileServerRoot, enableVideoThumbnail, enablePDFThumbnail } from '../../utils/constants';
@ -23,7 +22,6 @@ import LibSubFolderPermissionDialog from '../dialog/lib-sub-folder-permission-di
import FileAccessLog from '../dialog/file-access-log';
import toaster from '../toast';
import MobileItemMenu from '../../components/mobile-item-menu';
import FileTag from './file-tag';
import '../../css/dirent-list-item.css';
@ -95,10 +93,8 @@ class DirentListItem extends React.Component {
isShowTagTooltip: false,
isDragTipShow: false,
isDropTipshow: false,
isEditFileTagShow: false,
isPermissionDialogOpen: false
};
this.tagListTitleID = `tag-list-title-${uuidv4()}`;
this.isGeneratingThumbnail = false;
this.thumbnailCenter = null;
this.dragIconRef = null;
@ -350,9 +346,6 @@ class DirentListItem extends React.Component {
case 'Copy':
this.onItemCopyToggle();
break;
case 'Tags':
this.onEditFileTagToggle();
break;
case 'Permission':
this.onPermissionItem();
break;
@ -410,12 +403,6 @@ class DirentListItem extends React.Component {
this.props.onItemConvert(this.state.dirent, dstType);
};
onEditFileTagToggle = () => {
this.setState({
isEditFileTagShow: !this.state.isEditFileTagShow
});
};
onFileTagChanged = () => {
let direntPath = this.getDirentPath(this.state.dirent);
this.props.onFileTagChanged(this.state.dirent, direntPath);
@ -891,18 +878,6 @@ class DirentListItem extends React.Component {
)}
</td>
<td className="tag-list-title">
{(dirent.type !== 'dir' && dirent.file_tags && dirent.file_tags.length > 0) && (
<div id={this.tagListTitleID} className="dirent-item tag-list tag-list-stacked">
{dirent.file_tags.map((fileTag, index) => {
return (
<FileTag fileTag={fileTag} length={dirent.file_tags.length} key={index} index={index}/>
);
})}
</div>
)}
{(dirent.type !== 'dir' && (!dirent.file_tags || dirent.file_tags.length == 0)) &&
<div id={this.tagListTitleID} className="dirent-item tag-list tag-list-stacked"></div>
}
</td>
<td className="operation">{this.renderItemOperation()}</td>
<td className="file-size">{dirent.size || ''}</td>
@ -993,32 +968,6 @@ class DirentListItem extends React.Component {
/>
</ModalPortal>
}
<MediaQuery query="(min-width: 768px)">
{this.state.isEditFileTagShow &&
<EditFileTagPopover
repoID={this.props.repoID}
repoTags={this.props.repoTags}
fileTagList={dirent.file_tags}
filePath={direntPath}
toggleCancel={this.onEditFileTagToggle}
onFileTagChanged={this.onFileTagChanged}
target={this.tagListTitleID}
isEditFileTagShow={this.state.isEditFileTagShow}
/>
}
</MediaQuery>
<MediaQuery query="(max-width: 767.8px)">
{this.state.isEditFileTagShow &&
<EditFileTagDialog
repoID={this.props.repoID}
repoTags={this.props.repoTags}
fileTagList={dirent.file_tags}
filePath={direntPath}
toggleCancel={this.onEditFileTagToggle}
onFileTagChanged={this.onFileTagChanged}
/>
}
</MediaQuery>
{this.state.isZipDialogOpen &&
<ModalPortal>
<ZipDownloadDialog

View File

@ -0,0 +1,36 @@
import React from 'react';
import { Button } from 'reactstrap';
import { gettext } from '../utils/constants';
import { useMetadataStatus } from '../hooks';
import { eventBus } from '../components/common/event-bus';
import { EVENT_BUS_TYPE } from '../components/common/event-bus-type';
const RepoInfoBarMigrate = () => {
const { enableMetadata } = useMetadataStatus();
const openMigrate = () => {
eventBus.dispatch(EVENT_BUS_TYPE.OPEN_TREE_PANEL, () => eventBus.dispatch(EVENT_BUS_TYPE.OPEN_LIBRARY_SETTINGS_TAGS));
};
return (
<div className="repo-info-bar-migrate mt-2">
{enableMetadata ?
(
<>
{gettext('Tips: There are tags of old version. Please migrate tags to new version.')}
<Button color="link" size="sm" tag="a" onClick={openMigrate}>{gettext('Migrate')}</Button>
</>
) :
(
<>{gettext('Tips: These are tags of old version. The feature is deprecated and can no longer be used.')}</>
)
}
</div>
);
};
RepoInfoBarMigrate.propTypes = {
};
export default RepoInfoBarMigrate;

View File

@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import ModalPortal from './modal-portal';
import ListTaggedFilesDialog from './dialog/list-taggedfiles-dialog';
import RepoInfoBarMigrate from './repo-info-bar-migrate';
import '../css/repo-info-bar.css';
@ -72,6 +73,7 @@ class RepoInfoBar extends React.Component {
/>
</ModalPortal>
)}
<RepoInfoBarMigrate />
</div>
);
}

View File

@ -3,13 +3,16 @@
margin: 10px 16px 0;
border: 1px solid #e6e6dd;
border-radius: 5px;
/* background: #f8f8f8; */
}
.used-tag-list {
list-style: none;
}
.used-tag-list .used-tag-item:first-child {
margin-left: 0;
}
.used-tag-item {
display: inline-block;
margin: auto 15px;
@ -60,3 +63,16 @@
.readme-dialog .modal-body {
padding: 0 30px;
}
.repo-info-bar .repo-info-bar-migrate .btn-link {
font-size: 14px;
font-weight: normal;
padding: 0px 8px;
border: 0;
color: #EC8000;
}
.repo-info-bar .repo-info-bar-migrate .btn-link:active {
color: #EC8000;
background-color: #fff;
}

View File

@ -20,7 +20,7 @@ const langOptions = [
}
];
const MetadataTagsStatusDialog = ({ value: oldValue, lang: oldLang, repoID, toggleDialog: toggle, submit, enableMetadata }) => {
const MetadataTagsStatusDialog = ({ value: oldValue, lang: oldLang, repoID, toggleDialog: toggle, submit, enableMetadata, showMigrateTip }) => {
const [value, setValue] = useState(oldValue);
const [lang, setLang] = useState(oldLang);
const [submitting, setSubmitting] = useState(false);
@ -46,6 +46,10 @@ const MetadataTagsStatusDialog = ({ value: oldValue, lang: oldLang, repoID, togg
});
}, [lang, repoID, submit, toggle, value]);
const migrateTag = useCallback(() => {
// TODO backend migrate old tags
}, []);
const turnOffConfirmToggle = useCallback(() => {
setShowTurnOffConfirmDialog(!showTurnOffConfirmDialog);
}, [showTurnOffConfirmDialog]);
@ -104,6 +108,12 @@ const MetadataTagsStatusDialog = ({ value: oldValue, lang: oldLang, repoID, togg
/>
</FormGroup>
}
{showMigrateTip &&
<FormGroup className="mt-6">
<p>{gettext('This library contains tags of old version. Do you like to migrate the tags to new version?')}</p>
<Button color="primary" onClick={migrateTag}>{gettext('Migrate old version tags')}</Button>
</FormGroup>
}
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={onToggle}>{gettext('Cancel')}</Button>
@ -126,6 +136,7 @@ MetadataTagsStatusDialog.propTypes = {
toggleDialog: PropTypes.func.isRequired,
submit: PropTypes.func.isRequired,
enableMetadata: PropTypes.bool.isRequired,
showMigrateTip: PropTypes.bool,
};
export default MetadataTagsStatusDialog;

View File

@ -31,6 +31,7 @@ import Detail from '../../components/dirent-detail';
import DirColumnView from '../../components/dir-view-mode/dir-column-view';
import SelectedDirentsToolbar from '../../components/toolbar/selected-dirents-toolbar';
import MetadataPathToolbar from '../../components/toolbar/metadata-path-toolbar';
import { eventBus } from '../../components/common/event-bus';
import '../../css/lib-content-view.css';
@ -156,6 +157,7 @@ class LibContentView extends React.Component {
componentDidMount() {
this.unsubscribeEvent = this.props.eventBus.subscribe(EVENT_BUS_TYPE.SEARCH_LIBRARY_CONTENT, this.onSearchedClick);
this.unsubscribeOpenTreePanel = eventBus.subscribe(EVENT_BUS_TYPE.OPEN_TREE_PANEL, this.openTreePanel);
this.calculatePara(this.props);
}
@ -268,6 +270,7 @@ class LibContentView extends React.Component {
componentWillUnmount() {
window.onpopstate = this.oldonpopstate;
this.unsubscribeEvent();
this.unsubscribeOpenTreePanel();
this.unsubscribeEventBus && this.unsubscribeEventBus();
this.props.eventBus.dispatch(EVENT_BUS_TYPE.CURRENT_LIBRARY_CHANGED, {
repoID: '',
@ -2172,6 +2175,17 @@ class LibContentView extends React.Component {
e.preventDefault();
};
openTreePanel = (callback) => {
if (this.state.isTreePanelShown) {
callback();
} else {
this.toggleTreePanel();
setTimeout(() => {
callback();
}, 100);
}
};
toggleTreePanel = () => {
this.setState({
isTreePanelShown: !this.state.isTreePanelShown

View File

@ -1180,21 +1180,6 @@ class Item extends React.Component {
<a href={fileURL} onClick={this.handleFileClick}>{item.file_name}</a>
</td>
<td className="tag-list-title">
{(item.file_tags && item.file_tags.length > 0) && (
<Fragment>
<div id={`tag-list-title-${toolTipID}`} className="dirent-item tag-list tag-list-stacked">
{item.file_tags.map((fileTag, index) => {
let length = item.file_tags.length;
return (
<span className="file-tag" key={fileTag.file_tag_id} style={{ zIndex: length - index, backgroundColor: fileTag.tag_color }}></span>
);
})}
</div>
<UncontrolledTooltip target={`tag-list-title-${toolTipID}`} placement="bottom">
{tagTitle}
</UncontrolledTooltip>
</Fragment>
)}
</td>
<td>{Utils.bytesToSize(item.size)}</td>
<td title={dayjs(item.last_modified).format('dddd, MMMM D, YYYY h:mm:ss A')}>{dayjs(item.last_modified).fromNow()}</td>

View File

@ -1,4 +1,4 @@
import { mediaUrl, gettext, serviceURL, siteRoot, isPro, fileAuditEnabled, canGenerateShareLink, canGenerateUploadLink, shareLinkPasswordMinLength, username, folderPermEnabled, onlyofficeConverterExtensions, enableSeadoc, enableFileTags, enableRepoSnapshotLabel,
import { mediaUrl, gettext, serviceURL, siteRoot, isPro, fileAuditEnabled, canGenerateShareLink, canGenerateUploadLink, shareLinkPasswordMinLength, username, folderPermEnabled, onlyofficeConverterExtensions, enableSeadoc, enableRepoSnapshotLabel,
enableResetEncryptedRepoPassword, isEmailConfigured, isSystemStaff,
enableOnlyoffice, onlyofficeEditFileExtension,
enableOfficeWebApp, officeWebAppEditFileExtension } from './constants';
@ -555,7 +555,7 @@ export const Utils = {
getFileOperationList: function (isRepoOwner, currentRepoInfo, dirent, isContextmenu) {
let list = [];
const {
SHARE, DOWNLOAD, DELETE, RENAME, MOVE, COPY, TAGS, UNLOCK, LOCK, UNFREEZE_DOCUMENT, FREEZE_DOCUMENT,
SHARE, DOWNLOAD, DELETE, RENAME, MOVE, COPY, UNLOCK, LOCK, UNFREEZE_DOCUMENT, FREEZE_DOCUMENT,
HISTORY, ACCESS_LOG, PROPERTIES, OPEN_VIA_CLIENT, ONLYOFFICE_CONVERT,
CONVERT_AND_EXPORT, CONVERT_TO_MARKDOWN, CONVERT_TO_DOCX, EXPORT_DOCX, CONVERT_TO_SDOC, EXPORT_SDOC
} = TextTranslation;
@ -613,9 +613,6 @@ export const Utils = {
}
if (permission == 'rw') {
if (enableFileTags) {
list.push(TAGS);
}
if (isPro) {
if (dirent.is_locked) {
if (dirent.locked_by_me || dirent.lock_owner == 'OnlineOffice' || isRepoOwner || currentRepoInfo.is_admin) {