haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-03 07:55:36 +00:00
Code Issues Releases Wiki Activity

Related Files Dialog Box Interaction Improvement (#3179)

Browse Source 
* Related Files Dialog Box Interaction Improvement

* Modify ralated file dialog and select dialog style

* Add markdow-editor.js
This commit is contained in:
zxj96
2019-03-28 17:34:01 +08:00
committed by Daniel Pan
parent c04c5d2044
commit a13e2a3519
6 changed files with 166 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
frontend/src/components/toolbar/view-file-toolbar.js
View File

@@ -1,6 +1,6 @@
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { DropdownToggle, Dropdown, DropdownMenu, DropdownItem, Tooltip } from 'reactstrap';
import { DropdownToggle, Dropdown, DropdownMenu, DropdownItem, Tooltip, Modal } from 'reactstrap';
import { Utils } from '../../utils/utils';
import { gettext, siteRoot } from '../../utils/constants';
import { seafileAPI } from '../../utils/seafile-api';
@@ -37,6 +37,7 @@ class ViewFileToolbar extends React.Component {
isEditTagDialogShow: false,
isListRelatedFileDialogShow: false,
isAddRelatedFileDialogShow: false,
isRelatedFileDialogShow: false,
};
}
@@ -72,13 +73,31 @@ class ViewFileToolbar extends React.Component {
}
onListRelatedFileToggle = () => {
this.setState({isListRelatedFileDialogShow: !this.state.isListRelatedFileDialogShow})
this.setState({
isListRelatedFileDialogShow: true,
isRelatedFileDialogShow: true,
});
}
toggleCancel = () => {
this.setState({
isListRelatedFileDialogShow: false,
isAddRelatedFileDialogShow: false,
isRelatedFileDialogShow: false,
})
}
onCloseAddRelatedFileDialog = () => {
this.setState({
isListRelatedFileDialogShow: true,
isAddRelatedFileDialogShow: false,
});
}
onAddRelatedFileToggle = () => {
this.setState({
isListRelatedFileDialogShow: !this.state.isListRelatedFileDialogShow,
isAddRelatedFileDialogShow: !this.state.isAddRelatedFileDialogShow,
isListRelatedFileDialogShow: false,
isAddRelatedFileDialogShow: true,
});
}
@@ -141,27 +160,30 @@ class ViewFileToolbar extends React.Component {
/>
</ModalPotal>
)}
{this.state.isListRelatedFileDialogShow &&
{this.state.isRelatedFileDialogShow && (
<ModalPotal>
<ListRelatedFileDialog
repoID={this.props.repoID}
filePath={this.props.path}
relatedFiles={this.props.relatedFiles}
toggleCancel={this.onListRelatedFileToggle}
addRelatedFileToggle={this.onAddRelatedFileToggle}
onRelatedFileChange={this.props.onRelatedFileChange}
/>
</ModalPotal>
}
{this.state.isAddRelatedFileDialogShow && (
<ModalPotal>
<AddRelatedFileDialog
dirent={dirent}
repoID={this.props.repoID}
filePath={this.props.path}
onRelatedFileChange={this.props.onRelatedFileChange}
toggleCancel={this.onAddRelatedFileToggle}
/>
<Modal isOpen={true} toggle={this.toggleCancel} size='lg' style={{width: '650px'}}>
{this.state.isListRelatedFileDialogShow &&
<ListRelatedFileDialog
repoID={this.props.repoID}
filePath={this.props.path}
relatedFiles={this.props.relatedFiles}
toggleCancel={this.toggleCancel}
addRelatedFileToggle={this.onAddRelatedFileToggle}
onRelatedFileChange={this.props.onRelatedFileChange}
/>
}
{this.state.isAddRelatedFileDialogShow &&
<AddRelatedFileDialog
dirent={dirent}
repoID={this.props.repoID}
filePath={this.props.path}
onRelatedFileChange={this.props.onRelatedFileChange}
toggleCancel={this.onCloseAddRelatedFileDialog}
onClose={this.toggleCancel}
/>
}
</Modal>
</ModalPotal>
)}
</Fragment>