1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-09 02:42:47 +00:00

add new repo in my-libraries-view and group-view (#6974)

This commit is contained in:
Michael An
2024-10-31 10:31:46 +08:00
committed by GitHub
parent 52a6e2e7e3
commit 7842eb978f
5 changed files with 103 additions and 30 deletions

View File

@@ -20,6 +20,7 @@ import LeaveGroupDialog from '../../components/dialog/leave-group-dialog';
import SharedRepoListView from '../../components/shared-repo-list-view/shared-repo-list-view';
import SortOptionsDialog from '../../components/dialog/sort-options';
import SingleDropdownToolbar from '../../components/toolbar/single-dropdown-toolbar';
import NewLibrary from '../my-libs/new-library';
import '../../css/group-view.css';
@@ -388,7 +389,7 @@ class GroupView extends React.Component {
};
render() {
const { errMessage, emptyTip, currentGroup, isDepartmentGroup, isMembersDialogOpen } = this.state;
const { errMessage, emptyTip, currentGroup, isDepartmentGroup, isMembersDialogOpen, isStaff } = this.state;
let useRate = 0;
if (isDepartmentGroup && currentGroup.group_quota) {
@@ -442,6 +443,7 @@ class GroupView extends React.Component {
{(!this.state.isLoading && errMessage) && <div className="error text-center mt-2">{errMessage}</div>}
{(!this.state.isLoading && this.state.repoList.length === 0) && emptyTip}
{(!this.state.isLoading && this.state.repoList.length > 0) &&
<>
<SharedRepoListView
repoList={this.state.repoList}
hasNextPage={this.state.hasNextPage}
@@ -455,6 +457,10 @@ class GroupView extends React.Component {
onMonitorRepo={this.onMonitorRepo}
onTransferRepo={this.onItemTransfer}
/>
{((!isDepartmentGroup && canAddRepo) || (isDepartmentGroup && isStaff)) &&
<NewLibrary onClick={this.onCreateRepoToggle} />
}
</>
}
</div>
</div>

View File

@@ -168,6 +168,7 @@ class MyLibraries extends Component {
onTransferRepo={this.onTransferRepo}
onMonitorRepo={this.onMonitorRepo}
sortRepoList={this.sortRepoList}
toggleCreateRepoDialog={this.toggleCreateRepoDialog}
/>
}
</div>

View File

@@ -8,6 +8,7 @@ import { LIST_MODE } from '../../components/dir-view-mode/constants';
import ContextMenu from '../../components/context-menu/context-menu';
import { Utils } from '../../utils/utils';
import { hideMenu, handleContextClick } from '../../components/context-menu/actions';
import NewLibrary from './new-library';
const propTypes = {
sortBy: PropTypes.string.isRequired,
@@ -116,22 +117,41 @@ class MylibRepoListView extends React.Component {
const sortIcon = this.props.sortOrder === 'asc' ? <span className="sf3-font sf3-font-down rotate-180 d-inline-block"></span> : <span className="sf3-font sf3-font-down"></span>;
return currentViewMode == LIST_MODE ? (
<>
<table className={inAllLibs ? 'table-thead-hidden' : ''}>
<thead>
<tr>
<th width="4%"></th>
<th width="3%"><span className="sr-only">{gettext('Library Type')}</span></th>
<th width={showStorageBackend ? '36%' : '35%'}><a className="d-block table-sort-op" href="#" onClick={this.sortByName}>{gettext('Name')} {this.props.sortBy === 'name' && sortIcon}</a></th>
<th width="10%"><span className="sr-only">{gettext('Actions')}</span></th>
<th width={showStorageBackend ? '15%' : '14%'}><a className="d-block table-sort-op" href="#" onClick={this.sortBySize}>{gettext('Size')} {this.props.sortBy === 'size' && sortIcon}</a></th>
<th width="3%">
<span className="sr-only">{gettext('Library Type')}</span>
</th>
<th width={showStorageBackend ? '36%' : '35%'}>
<a className="d-block table-sort-op" href="#" onClick={this.sortByName}>
{gettext('Name')} {this.props.sortBy === 'name' && sortIcon}
</a>
</th>
<th width="10%">
<span className="sr-only">{gettext('Actions')}</span>
</th>
<th width={showStorageBackend ? '15%' : '14%'}>
<a className="d-block table-sort-op" href="#" onClick={this.sortBySize}>
{gettext('Size')} {this.props.sortBy === 'size' && sortIcon}
</a>
</th>
{showStorageBackend ? <th width="17%">{gettext('Storage Backend')}</th> : null}
<th width={showStorageBackend ? '15%' : '34%'}><a className="d-block table-sort-op" href="#" onClick={this.sortByTime}>{gettext('Last Update')} {this.props.sortBy === 'time' && sortIcon}</a></th>
<th width={showStorageBackend ? '15%' : '34%'}>
<a className="d-block table-sort-op" href="#" onClick={this.sortByTime}>
{gettext('Last Update')} {this.props.sortBy === 'time' && sortIcon}
</a>
</th>
</tr>
</thead>
<tbody>
{this.renderRepoListView()}
</tbody>
</table>
{!inAllLibs && <NewLibrary onClick={this.props.toggleCreateRepoDialog} />}
</>
) : (
<div className="d-flex justify-content-between flex-wrap">
{this.renderRepoListView()}

View File

@@ -0,0 +1,31 @@
.new-library-container {
height: 41px;
line-height: 41px;
border-bottom: 1px solid #e8e8e8;
display: flex;
flex-direction: row;
cursor: pointer;
margin-bottom: 60px;
}
.new-library-container:hover {
background-color: #f8f8f8;
}
.new-library-container .new-library-star {
width: 4%;
}
.new-library-container .new-library-plus {
width: 3%;
padding-right: 4px;
display: flex;
justify-content: center;
align-items: center;
color: #999;
}
.new-library-container .new-library-text {
padding-left: 3px;
font-size: 0.875rem;
}

View File

@@ -0,0 +1,15 @@
import React from 'react';
import { gettext } from '../../utils/constants';
import './new-library.css';
export default function NewLibrary({ onClick }) {
return (
<div className="new-library-container" onClick={onClick}>
<div className="new-library-star"></div>
<div className="new-library-plus">
<i className="sf2-icon-plus nav-icon" aria-hidden="true"></i>
</div>
<div className="new-library-text" aria-label={gettext('New Library')}>{gettext('New Library')}</div>
</div>
);
}