mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-07 09:51:26 +00:00
[dir view] redesigned the 'comment panel' for file items
This commit is contained in:
@@ -138,27 +138,32 @@ class DetailCommentList extends React.Component {
|
||||
|
||||
render() {
|
||||
const { repoID, filePath, fileParticipantList } = this.props;
|
||||
const { commentsList } = this.state;
|
||||
return (
|
||||
<div className="seafile-comment detail-comments h-100 w-100">
|
||||
<ul className="seafile-comment-list">
|
||||
{this.state.commentsList.length > 0 &&
|
||||
this.state.commentsList.map((item, index = 0, arr) => {
|
||||
let oldTime = (new Date(item.created_at)).getTime();
|
||||
let time = moment(oldTime).format('YYYY-MM-DD HH:mm');
|
||||
return (
|
||||
<React.Fragment key={item.id}>
|
||||
<div className="seafile-comment detail-comments h-100">
|
||||
<div className="flex-fill o-auto">
|
||||
{commentsList.length > 0 ? (
|
||||
<ul className="seafile-comment-list">
|
||||
{commentsList.map((item, index = 0, arr) => {
|
||||
let oldTime = (new Date(item.created_at)).getTime();
|
||||
let time = moment(oldTime).format('YYYY-MM-DD HH:mm');
|
||||
return (
|
||||
<CommentItem
|
||||
item={item} time={time} deleteComment={this.deleteComment}
|
||||
resolveComment={this.resolveComment} editComment={this.editComment}
|
||||
key={item.id}
|
||||
item={item}
|
||||
time={time}
|
||||
deleteComment={this.deleteComment}
|
||||
resolveComment={this.resolveComment}
|
||||
editComment={this.editComment}
|
||||
/>
|
||||
</React.Fragment>
|
||||
);
|
||||
})
|
||||
);
|
||||
})
|
||||
}
|
||||
</ul>) :
|
||||
<p className="text-center my-4">{gettext('No comment yet.')}</p>
|
||||
}
|
||||
{(this.state.commentsList.length == 0 ) &&
|
||||
<li className="comment-vacant">{gettext('No comment yet.')}</li>}
|
||||
</ul>
|
||||
<div className="seafile-comment-footer">
|
||||
</div>
|
||||
<div className="seafile-comment-footer flex-shrink-0">
|
||||
{fileParticipantList &&
|
||||
<ParticipantsList
|
||||
onParticipantsChange={this.props.onParticipantsChange}
|
||||
@@ -184,7 +189,9 @@ class DetailCommentList extends React.Component {
|
||||
appendSpaceOnAdd={true}
|
||||
/>
|
||||
</MentionsInput>
|
||||
<Button className="submit-comment" color="primary" size="sm" onClick={this.onSubmit}>{gettext('Submit')}</Button>
|
||||
<div className="comment-submit-container">
|
||||
<Button className="submit-comment" color="primary" size="sm" onClick={this.onSubmit}>{gettext('Submit')}</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
@@ -214,7 +214,7 @@ class DirentDetail extends React.Component {
|
||||
<div className="detail-container">
|
||||
{this.renderHeader(smallIconUrl, direntName)}
|
||||
<Nav tabs className="mx-0">{this.renderNavItem('info')}{this.renderNavItem('comments')}</Nav>
|
||||
<TabContent activeTab={this.state.activeTab}>
|
||||
<TabContent activeTab={this.state.activeTab} className="flex-fill o-auto">
|
||||
<TabPane tabId="info">{this.renderDetailBody(bigIconUrl, folderDirent)}</TabPane>
|
||||
<TabPane tabId="comments" className="comments h-100">
|
||||
<DetailCommentList
|
||||
|
@@ -175,15 +175,14 @@ class CommentPanel extends React.Component {
|
||||
let oldTime = (new Date(item.created_at)).getTime();
|
||||
let time = moment(oldTime).format('YYYY-MM-DD HH:mm');
|
||||
return (
|
||||
<React.Fragment key={item.id}>
|
||||
<CommentItem
|
||||
item={item} time={time}
|
||||
deleteComment={this.deleteComment}
|
||||
resolveComment={this.resolveComment}
|
||||
editComment={this.editComment}
|
||||
showResolvedComment={this.state.showResolvedComment}
|
||||
/>
|
||||
</React.Fragment>
|
||||
<CommentItem
|
||||
key={item.id}
|
||||
item={item} time={time}
|
||||
deleteComment={this.deleteComment}
|
||||
resolveComment={this.resolveComment}
|
||||
editComment={this.editComment}
|
||||
showResolvedComment={this.state.showResolvedComment}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</ul>) :
|
||||
@@ -217,8 +216,7 @@ class CommentPanel extends React.Component {
|
||||
/>
|
||||
</MentionsInput>
|
||||
<div className="comment-submit-container">
|
||||
<Button className="submit-comment" color="primary" size="sm" onClick={this.onSubmit}>
|
||||
{gettext('Submit')}</Button>
|
||||
<Button className="submit-comment" color="primary" size="sm" onClick={this.onSubmit}>{gettext('Submit')}</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user