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

improve (#2467)

Browse Source
This commit is contained in:
MichaelAn
2018-10-25 10:39:16 +08:00
committed by Daniel Pan
parent 67e19792aa
commit 91cbfc508e
5 changed files with 241 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
frontend/src/draft-review.js
View File

@@ -32,6 +32,8 @@ class DraftReview extends React.Component {
isLoading: true,
commentsNumber: null,
isShowComments: false,
inResizing: false,
commentWidth: 30,
};
}
@@ -101,11 +103,39 @@ class DraftReview extends React.Component {
});
}
onResizeMouseUp = () => {
if(this.state.inResizing) {
this.setState({
inResizing: false
});
}
}
onResizeMouseDown = () => {
this.setState({
inResizing: true
});
};
onResizeMouseMove = (e) => {
let rate = 100 - e.nativeEvent.clientX / this.refs.main.clientWidth * 100;
if(rate < 20 || rate > 60) {
this.setState({
inResizing: false
});
return null;
}
this.setState({
commentWidth: rate
});
};
componentWillMount() {
this.getCommentsNumber();
}
render() {
const onResizeMove = this.state.inResizing ? this.onResizeMouseMove : null;
return(
<div className="wrapper">
<div id="header" className="header review">
@@ -130,8 +160,8 @@ class DraftReview extends React.Component {
{
this.state.reviewStatus === 'open' &&
<div className="cur-file-operation">
<button className="btn btn-secondary file-operation-btn" title={gettext('Close Review')} onClick={this.onCloseReview}>{gettext("Close")}</button>
<button className="btn btn-success file-operation-btn" title={gettext('Publish Review')} onClick={this.onPublishReview}>{gettext("Publish")}</button>
<button className='btn btn-secondary file-operation-btn' title={gettext('Close Review')} onClick={this.onCloseReview}>{gettext('Close')}</button>
<button className='btn btn-success file-operation-btn' title={gettext('Publish Review')} onClick={this.onPublishReview}>{gettext('Publish')}</button>
</div>
}
{
@@ -144,9 +174,11 @@ class DraftReview extends React.Component {
}
</div>
</div>
<div id="main" className="main">
<div className="cur-view-container content-container">
<div className={!this.state.isShowComments ? "cur-view-content" : "cur-view-content cur-view-content-commenton"}>
<div id="main" className="main" ref="main">
<div className="cur-view-container content-container"
onMouseMove={onResizeMove} onMouseUp={this.onResizeMouseUp} ref="comment">
<div style={{width:(100-this.state.commentWidth)+'%'}}
className={!this.state.isShowComments ? 'cur-view-content' : 'cur-view-content cur-view-content-commenton'} >
<div className="markdown-viewer-render-content article">
{this.state.isLoading ?
<Loading /> :
@@ -155,11 +187,15 @@ class DraftReview extends React.Component {
</div>
</div>
{ this.state.isShowComments &&
<ReviewComments
toggleCommentList={this.toggleCommentList}
commentsNumber={this.state.commentsNumber}
getCommentsNumber={this.getCommentsNumber}
/>
<div className="cur-view-right-part" style={{width:(this.state.commentWidth)+'%'}}>
<div className="seafile-comment-resize" onMouseDown={this.onResizeMouseDown}></div>
<ReviewComments
toggleCommentList={this.toggleCommentList}
commentsNumber={this.state.commentsNumber}
getCommentsNumber={this.getCommentsNumber}
inResizing={this.state.inResizing}
/>
</div>
}
</div>
</div>