From 8d1eabc541a9cdd7d2f1d1538d5ebc751fb39388 Mon Sep 17 00:00:00 2001 From: llj Date: Tue, 2 Jul 2019 14:35:35 +0800 Subject: [PATCH 1/6] [grid] improvement * modifie UI for 'thumbnail' images * added 'Tags'('Select Tags') for file * show tags for tagged files --- .../components/dir-view-mode/dir-grid-view.js | 1 + .../dirent-grid-view/dirent-grid-item.js | 25 +++++++++++++++ .../dirent-grid-view/dirent-grid-view.js | 32 +++++++++++++++++-- frontend/src/css/grid-view.css | 9 +++--- 4 files changed, 61 insertions(+), 6 deletions(-) diff --git a/frontend/src/components/dir-view-mode/dir-grid-view.js b/frontend/src/components/dir-view-mode/dir-grid-view.js index 75010029b5..617da702a9 100644 --- a/frontend/src/components/dir-view-mode/dir-grid-view.js +++ b/frontend/src/components/dir-view-mode/dir-grid-view.js @@ -79,6 +79,7 @@ class DirGridView extends React.Component { isDirentDetailShow={this.props.isDirentDetailShow} onItemRename={this.props.onItemRename} onAddFolder={this.props.onAddFolder} + onFileTagChanged={this.props.onFileTagChanged} /> ); diff --git a/frontend/src/components/dirent-grid-view/dirent-grid-item.js b/frontend/src/components/dirent-grid-view/dirent-grid-item.js index af012282bc..d59a704d47 100644 --- a/frontend/src/components/dirent-grid-view/dirent-grid-item.js +++ b/frontend/src/components/dirent-grid-view/dirent-grid-item.js @@ -1,5 +1,7 @@ import React, { Fragment } from 'react'; import PropTypes from 'prop-types'; +import MD5 from 'MD5'; +import { UncontrolledTooltip } from 'reactstrap'; import { gettext, siteRoot, mediaUrl } from '../../utils/constants'; import { Utils } from '../../utils/utils'; @@ -136,6 +138,14 @@ class DirentGridItem extends React.Component { let iconUrl = Utils.getDirentIcon(dirent, true); let fileUrl = dirent.encoded_thumbnail_src ? this.getFileUrl(dirent.encoded_thumbnail_src) : ''; + let toolTipID = MD5(dirent.name).slice(0, 7); + let tagTitle = ''; + if (dirent.file_tags && dirent.file_tags.length > 0) { + dirent.file_tags.forEach(item => { + tagTitle += item.name + ' '; + }); + } + let dirHref = ''; if (this.props.currentRepoInfo) { dirHref = siteRoot + 'library/' + this.props.repoID + '/' + this.props.currentRepoInfo.repo_name + Utils.encodePath(direntPath); @@ -169,6 +179,21 @@ class DirentGridItem extends React.Component { {dirent.is_locked && {gettext('locked')}}
+ {(dirent.type !== 'dir' && dirent.file_tags) && ( + +
+ {dirent.file_tags.map((fileTag, index) => { + let length = dirent.file_tags.length; + return ( + + ); + })} +
+ + {tagTitle} + + + )} {dirent.name}
diff --git a/frontend/src/components/dirent-grid-view/dirent-grid-view.js b/frontend/src/components/dirent-grid-view/dirent-grid-view.js index 417416906e..f9be35fd7c 100644 --- a/frontend/src/components/dirent-grid-view/dirent-grid-view.js +++ b/frontend/src/components/dirent-grid-view/dirent-grid-view.js @@ -15,6 +15,7 @@ import MoveDirentDialog from '../dialog/move-dirent-dialog'; import CopyDirentDialog from '../dialog/copy-dirent-dialog'; import ShareDialog from '../dialog/share-dialog'; import ZipDownloadDialog from '../dialog/zip-download-dialog'; +import EditFileTagDialog from '../dialog/edit-filetag-dialog'; import Rename from '../../components/dialog/rename-grid-item-dialog'; import CreateFile from '../dialog/create-file-dialog'; import CreateFolder from '../dialog/create-folder-dialog'; @@ -40,6 +41,7 @@ const propTypes = { updateDirent: PropTypes.func.isRequired, isDirentDetailShow: PropTypes.bool.isRequired, onGridItemClick: PropTypes.func, + onFileTagChanged: PropTypes.func, onAddFolder: PropTypes.func.isRequired, showDirentDetail: PropTypes.func.isRequired, onItemRename: PropTypes.func.isRequired, @@ -48,7 +50,7 @@ const propTypes = { class DirentGridView extends React.Component{ constructor(props) { super(props); - this.state= { + this.state = { isImagePopupOpen: false, imageItems: [], imageIndex: 0, @@ -56,6 +58,7 @@ class DirentGridView extends React.Component{ isShareDialogShow: false, isMoveDialogShow: false, isCopyDialogShow: false, + isEditFileTagShow: false, isZipDialogOpen: false, isRenameDialogShow: false, isCreateFolderDialogShow: false, @@ -133,6 +136,9 @@ class DirentGridView extends React.Component{ case 'Copy': this.onItemCopyToggle(); break; + case 'Tags': + this.onEditFileTagToggle(); + break; case 'Permission': this.onPermissionItem(); break; @@ -165,6 +171,18 @@ class DirentGridView extends React.Component{ } } + onEditFileTagToggle = () => { + this.setState({ + isEditFileTagShow: !this.state.isEditFileTagShow + }); + } + + onFileTagChanged = () => { + let dirent = this.state.activeDirent ? this.state.activeDirent : ''; + let direntPath = Utils.joinPath(this.props.path, dirent.name); + this.props.onFileTagChanged(dirent, direntPath); + } + getDirentPath = (dirent) => { let path = this.props.path; return path === '/' ? path + dirent.name : path + '/' + dirent.name; @@ -437,7 +455,7 @@ class DirentGridView extends React.Component{ contextmenuList = contextmenuList.length > 0 ? [...contextmenuList, 'Divider'] : []; } - let { RENAME, MOVE, COPY, PERMISSION, OPEN_VIA_CLIENT, LOCK, UNLOCK, COMMENT, HISTORY, ACCESS_LOG } = TextTranslation; + let { RENAME, MOVE, COPY, PERMISSION, OPEN_VIA_CLIENT, LOCK, UNLOCK, COMMENT, HISTORY, ACCESS_LOG, TAGS } = TextTranslation; if (type === 'dir' && permission === 'rw') { if (can_set_folder_perm) { menuList = [...contextmenuList, RENAME, MOVE, COPY, 'Divider', PERMISSION, 'Divider', OPEN_VIA_CLIENT]; @@ -460,6 +478,7 @@ class DirentGridView extends React.Component{ menuList.push(MOVE); } menuList.push(COPY); + menuList.push(TAGS); if (isPro) { if (dirent.is_locked) { if (dirent.locked_by_me || (dirent.lock_owner === 'OnlineOffice' && permission === 'rw')) { @@ -590,6 +609,15 @@ class DirentGridView extends React.Component{ dirent={this.state.activeDirent} /> } + {this.state.isEditFileTagShow && + + } {this.state.isShareDialogShow && Date: Wed, 3 Jul 2019 10:55:16 +0800 Subject: [PATCH 2/6] change share dialog UI --- frontend/src/components/dialog/generate-share-link.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/components/dialog/generate-share-link.js b/frontend/src/components/dialog/generate-share-link.js index 1a52428dec..6713f3ecaf 100644 --- a/frontend/src/components/dialog/generate-share-link.js +++ b/frontend/src/components/dialog/generate-share-link.js @@ -391,24 +391,24 @@ class GenerateShareLink extends React.Component { - - {(Utils.isOfficeFile(this.props.itemPath) && fileInfo && fileInfo.can_edit) && - } {this.state.errorInfo && {gettext(this.state.errorInfo)}} - + ); } From b6afc03b582d94debebbfd1afd46804247a9e950 Mon Sep 17 00:00:00 2001 From: lian Date: Wed, 3 Jul 2019 16:52:09 +0800 Subject: [PATCH 3/6] use escapejs for draft path when render draft page --- seahub/templates/draft.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/seahub/templates/draft.html b/seahub/templates/draft.html index 35bf45e3c6..601c090e45 100644 --- a/seahub/templates/draft.html +++ b/seahub/templates/draft.html @@ -11,9 +11,9 @@ config: { draftID: '{{ draft_id }}', draftRepoID: '{{ draft_repo_id }}', - draftFilePath: '{{ draft_file_path }}', - draftOriginFilePath: '{{ draft_origin_file_path }}', - draftFileName: '{{ draft_file_name }}', + draftFilePath: '{{ draft_file_path|escapejs }}', + draftOriginFilePath: '{{ draft_origin_file_path|escapejs }}', + draftFileName: '{{ draft_file_name|escapejs }}', perm: '{{ permission }}', author: '{{ author }}', authorAvatar: '{{ author_avatar_url }}', From 431102bdac9ddd682afef7f535f8719aa35547a7 Mon Sep 17 00:00:00 2001 From: Michael An <1822852997@qq.com> Date: Wed, 3 Jul 2019 17:39:44 +0800 Subject: [PATCH 4/6] update seafile api --- frontend/package-lock.json | 6 +++--- frontend/package.json | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 91875b5c9f..68dbac5b4e 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -13360,9 +13360,9 @@ } }, "seafile-js": { - "version": "0.2.100", - "resolved": "https://registry.npmjs.org/seafile-js/-/seafile-js-0.2.100.tgz", - "integrity": "sha512-QrzO3vMSeL+4NRvb9/sjGdCtYzOIsXI7PhbPZrVmMc8XaXWL9ZzgMqMEGVYUgQlALQChNhXqqyfRLvZ3/WKEUg==", + "version": "0.2.101", + "resolved": "https://registry.npmjs.org/seafile-js/-/seafile-js-0.2.101.tgz", + "integrity": "sha512-CqF+4FKnUhnUYKCjiVbp10GkI9Ej+d4UfaWRvdGNaR74tK+0D9dUq7RNXUGS/MpIAlif7hbz5k+LUFafkfGmNg==", "requires": { "axios": "^0.18.0", "form-data": "^2.3.2", diff --git a/frontend/package.json b/frontend/package.json index e7266dfd68..8e61419cb4 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -38,7 +38,7 @@ "react-responsive": "^6.1.1", "react-select": "^2.4.1", "reactstrap": "^6.4.0", - "seafile-js": "^0.2.100", + "seafile-js": "^0.2.101", "socket.io-client": "^2.2.0", "sw-precache-webpack-plugin": "0.11.4", "unified": "^7.0.0", From e8659dcfcae19f6b45519672ef96ecc1050f4562 Mon Sep 17 00:00:00 2001 From: llj Date: Wed, 3 Jul 2019 17:46:24 +0800 Subject: [PATCH 5/6] [dir view] improved code for 'file tags' --- .../components/dirent-grid-view/dirent-grid-item.js | 9 ++++----- .../components/dirent-list-view/dirent-list-item.js | 10 +++++----- 2 files changed, 9 insertions(+), 10 deletions(-) diff --git a/frontend/src/components/dirent-grid-view/dirent-grid-item.js b/frontend/src/components/dirent-grid-view/dirent-grid-item.js index d59a704d47..33e5933588 100644 --- a/frontend/src/components/dirent-grid-view/dirent-grid-item.js +++ b/frontend/src/components/dirent-grid-view/dirent-grid-item.js @@ -138,12 +138,11 @@ class DirentGridItem extends React.Component { let iconUrl = Utils.getDirentIcon(dirent, true); let fileUrl = dirent.encoded_thumbnail_src ? this.getFileUrl(dirent.encoded_thumbnail_src) : ''; - let toolTipID = MD5(dirent.name).slice(0, 7); + let toolTipID = ''; let tagTitle = ''; if (dirent.file_tags && dirent.file_tags.length > 0) { - dirent.file_tags.forEach(item => { - tagTitle += item.name + ' '; - }); + toolTipID = MD5(dirent.name).slice(0, 7); + tagTitle = dirent.file_tags.map(item => item.name).join(' '); } let dirHref = ''; @@ -179,7 +178,7 @@ class DirentGridItem extends React.Component { {dirent.is_locked && {gettext('locked')}}
- {(dirent.type !== 'dir' && dirent.file_tags) && ( + {(dirent.type !== 'dir' && dirent.file_tags && dirent.file_tags.length > 0) && (
{dirent.file_tags.map((fileTag, index) => { diff --git a/frontend/src/components/dirent-list-view/dirent-list-item.js b/frontend/src/components/dirent-list-view/dirent-list-item.js index fd43faa698..82f203e7e6 100644 --- a/frontend/src/components/dirent-list-view/dirent-list-item.js +++ b/frontend/src/components/dirent-list-view/dirent-list-item.js @@ -555,12 +555,12 @@ class DirentListItem extends React.Component { dirHref = siteRoot + 'library/' + this.props.repoID + '/' + this.props.currentRepoInfo.repo_name + Utils.encodePath(direntPath); } let fileHref = siteRoot + 'lib/' + this.props.repoID + '/file' + Utils.encodePath(direntPath); - let toolTipID = MD5(dirent.name).slice(0, 7); + + let toolTipID = ''; let tagTitle = ''; if (dirent.file_tags && dirent.file_tags.length > 0) { - dirent.file_tags.forEach(item => { - tagTitle += item.name + ' '; - }); + toolTipID = MD5(dirent.name).slice(0, 7); + tagTitle = dirent.file_tags.map(item => item.name).join(' '); } let iconUrl = Utils.getDirentIcon(dirent); @@ -613,7 +613,7 @@ class DirentListItem extends React.Component { } - {(dirent.type !== 'dir' && dirent.file_tags) && ( + {(dirent.type !== 'dir' && dirent.file_tags && dirent.file_tags.length > 0) && (
{dirent.file_tags.map((fileTag, index) => { From 7becb47810c50cd3029c5319dfc08a96712dd614 Mon Sep 17 00:00:00 2001 From: llj Date: Wed, 3 Jul 2019 18:04:49 +0800 Subject: [PATCH 6/6] [grid view] improved UI for file tags --- frontend/src/components/dirent-grid-view/dirent-grid-item.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/components/dirent-grid-view/dirent-grid-item.js b/frontend/src/components/dirent-grid-view/dirent-grid-item.js index 33e5933588..6bc2820b42 100644 --- a/frontend/src/components/dirent-grid-view/dirent-grid-item.js +++ b/frontend/src/components/dirent-grid-view/dirent-grid-item.js @@ -180,7 +180,7 @@ class DirentGridItem extends React.Component {
{(dirent.type !== 'dir' && dirent.file_tags && dirent.file_tags.length > 0) && ( -
+
{dirent.file_tags.map((fileTag, index) => { let length = dirent.file_tags.length; return (