mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-28 16:17:02 +00:00
Update org management interface (#6040)
* add trash to org admin interface * update get_org_trash_repo_list * update * update-team-admin-trash-libraries * update trash repo frontend * update * update * Update seafile_db.py --------- Co-authored-by: 孙永强 <11704063+s-yongqiang@user.noreply.gitee.com> Co-authored-by: r350178982 <32759763+r350178982@users.noreply.github.com>
This commit is contained in:
awu0403
GitHub
427
frontend/src/pages/org-admin/libraries/org-all-repos.js
Normal file
427
frontend/src/pages/org-admin/libraries/org-all-repos.js
Normal file
@@ -0,0 +1,427 @@
|
||||
import React, { Component, Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Dropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap';
|
||||
import { Utils } from '../../../utils/utils';
|
||||
import { seafileAPI } from '../../../utils/seafile-api';
|
||||
import { gettext, siteRoot, mediaUrl, orgID } from '../../../utils/constants';
|
||||
import toaster from '../../../components/toast/index';
|
||||
import EmptyTip from '../../../components/empty-tip';
|
||||
import Loading from '../../../components/loading';
|
||||
import Paginator from '../../../components/paginator';
|
||||
import ModalPortal from '../../../components/modal-portal';
|
||||
import TransferDialog from '../../../components/dialog/transfer-dialog';
|
||||
import { navigate } from '@gatsbyjs/reach-router';
|
||||
import OrgAdminRepo from '../../../models/org-admin-repo';
|
||||
import MainPanelTopbar from '../main-panel-topbar';
|
||||
import ReposNav from './org-repo-nav';
|
||||
|
||||
|
||||
class Content extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
isItemFreezed: false
|
||||
};
|
||||
}
|
||||
|
||||
onFreezedItem = () => {
|
||||
this.setState({isItemFreezed: true});
|
||||
};
|
||||
|
||||
onUnfreezedItem = () => {
|
||||
this.setState({isItemFreezed: false});
|
||||
};
|
||||
|
||||
getPreviousPageList = () => {
|
||||
this.props.getListByPage(this.props.pageInfo.current_page - 1);
|
||||
};
|
||||
|
||||
getNextPageList = () => {
|
||||
this.props.getListByPage(this.props.pageInfo.current_page + 1);
|
||||
};
|
||||
|
||||
sortByFileCount = (e) => {
|
||||
e.preventDefault();
|
||||
this.props.sortItems('file_count');
|
||||
};
|
||||
|
||||
sortBySize = (e) => {
|
||||
e.preventDefault();
|
||||
this.props.sortItems('size');
|
||||
};
|
||||
|
||||
render() {
|
||||
// offer 'sort' only for 'all repos'
|
||||
const { loading, errorMsg, items, pageInfo, curPerPage, sortBy } = this.props;
|
||||
if (loading) {
|
||||
return <Loading />;
|
||||
} else if (errorMsg) {
|
||||
return <p className="error text-center">{errorMsg}</p>;
|
||||
} else {
|
||||
const emptyTip = (
|
||||
<EmptyTip>
|
||||
<h2>{gettext('No libraries')}</h2>
|
||||
</EmptyTip>
|
||||
);
|
||||
const initialSortIcon = <span className="fas fa-sort"></span>;
|
||||
const sortIcon = <span className="fas fa-caret-down"></span>;
|
||||
const table = (
|
||||
<Fragment>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th width="5%">{/*icon*/}</th>
|
||||
<th width="25%">{gettext('Name')}</th>
|
||||
<th width="15%">
|
||||
{sortBy != undefined ?
|
||||
<Fragment>
|
||||
<a className="d-inline-block table-sort-op" href="#" onClick={this.sortByFileCount}>{gettext('Files')} {sortBy == 'file_count' ? sortIcon : initialSortIcon}</a>{' / '}
|
||||
<a className="d-inline-block table-sort-op" href="#" onClick={this.sortBySize}>{gettext('Size')} {sortBy == 'size' ? sortIcon : initialSortIcon}</a>
|
||||
</Fragment> :
|
||||
gettext('Files') / gettext('Size')
|
||||
}
|
||||
</th>
|
||||
<th width="32%">ID</th>
|
||||
<th width="18%">{gettext('Owner')}</th>
|
||||
<th width="5%">{/*Operations*/}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{items.map((item, index) => {
|
||||
return (<RepoItem
|
||||
key={index}
|
||||
repo={item}
|
||||
isItemFreezed={this.state.isItemFreezed}
|
||||
onFreezedItem={this.onFreezedItem}
|
||||
onUnfreezedItem={this.onUnfreezedItem}
|
||||
onDeleteRepo={this.props.onDeleteRepo}
|
||||
transferRepoItem={this.props.transferRepoItem}
|
||||
/>);
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
{pageInfo &&
|
||||
<Paginator
|
||||
gotoPreviousPage={this.getPreviousPageList}
|
||||
gotoNextPage={this.getNextPageList}
|
||||
currentPage={pageInfo.current_page}
|
||||
hasNextPage={pageInfo.has_next_page}
|
||||
curPerPage={curPerPage}
|
||||
resetPerPage={this.props.resetPerPage}
|
||||
/>
|
||||
}
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
return items.length ? table : emptyTip;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Content.propTypes = {
|
||||
loading: PropTypes.bool.isRequired,
|
||||
errorMsg: PropTypes.string.isRequired,
|
||||
items: PropTypes.array.isRequired,
|
||||
deleteItem: PropTypes.func,
|
||||
onDeleteRepo: PropTypes.func.isRequired,
|
||||
onRestoreRepo: PropTypes.func,
|
||||
getListByPage: PropTypes.func.isRequired,
|
||||
resetPerPage: PropTypes.func,
|
||||
pageInfo: PropTypes.object,
|
||||
curPerPage: PropTypes.number,
|
||||
sortItems: PropTypes.func,
|
||||
sortBy: PropTypes.string,
|
||||
transferRepoItem: PropTypes.func.isRequired,
|
||||
};
|
||||
|
||||
const propTypes = {
|
||||
repo: PropTypes.object.isRequired,
|
||||
isItemFreezed: PropTypes.bool,
|
||||
onFreezedItem: PropTypes.func.isRequired,
|
||||
onUnfreezedItem: PropTypes.func.isRequired,
|
||||
onDeleteRepo: PropTypes.func.isRequired,
|
||||
transferRepoItem: PropTypes.func.isRequired,
|
||||
};
|
||||
|
||||
class RepoItem extends React.Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
highlight: false,
|
||||
showMenu: false,
|
||||
isItemMenuShow: false,
|
||||
isTransferDialogShow: false,
|
||||
};
|
||||
}
|
||||
|
||||
onMouseEnter = () => {
|
||||
if (!this.props.isItemFreezed) {
|
||||
this.setState({
|
||||
showMenu: true,
|
||||
highlight: true,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
onMouseLeave = () => {
|
||||
if (!this.props.isItemFreezed) {
|
||||
this.setState({
|
||||
showMenu: false,
|
||||
highlight: false
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
onDropdownToggleClick = (e) => {
|
||||
e.preventDefault();
|
||||
this.toggleOperationMenu(e);
|
||||
};
|
||||
|
||||
toggleOperationMenu = (e) => {
|
||||
e.stopPropagation();
|
||||
this.setState(
|
||||
{isItemMenuShow: !this.state.isItemMenuShow }, () => {
|
||||
if (this.state.isItemMenuShow) {
|
||||
this.props.onFreezedItem();
|
||||
} else {
|
||||
this.setState({
|
||||
highlight: false,
|
||||
showMenu: false,
|
||||
});
|
||||
this.props.onUnfreezedItem();
|
||||
}
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
toggleDelete = () => {
|
||||
this.props.onDeleteRepo(this.props.repo);
|
||||
};
|
||||
|
||||
renderLibIcon = (repo) => {
|
||||
let href;
|
||||
let iconTitle;
|
||||
if (repo.encrypted) {
|
||||
href = mediaUrl + 'img/lib/48/lib-encrypted.png';
|
||||
iconTitle = gettext('Encrypted library');
|
||||
} else {
|
||||
href = mediaUrl + 'img/lib/48/lib.png';
|
||||
iconTitle = gettext('Read-Write library');
|
||||
}
|
||||
return <img src={href} title={iconTitle} alt={iconTitle} width="24" />;
|
||||
};
|
||||
|
||||
renderRepoOwnerHref = (repo) => {
|
||||
let href;
|
||||
if (repo.isDepartmentRepo) {
|
||||
href = siteRoot + 'org/groupadmin/' + repo.groupID + '/';
|
||||
} else {
|
||||
href = siteRoot + 'org/useradmin/info/' + repo.ownerEmail + '/';
|
||||
}
|
||||
return href;
|
||||
};
|
||||
|
||||
toggleTransfer = () => {
|
||||
this.setState({isTransferDialogShow: !this.state.isTransferDialogShow});
|
||||
};
|
||||
|
||||
onTransferRepo = (user) => {
|
||||
let repo = this.props.repo;
|
||||
seafileAPI.orgAdminTransferOrgRepo(orgID, repo.repoID, user.email).then(res => {
|
||||
this.props.transferRepoItem(repo.repoID, user);
|
||||
let msg = gettext('Successfully transferred the library.');
|
||||
toaster.success(msg);
|
||||
}).catch(error => {
|
||||
let errMessage = Utils.getErrorMsg(error);
|
||||
toaster.danger(errMessage);
|
||||
});
|
||||
this.toggleTransfer();
|
||||
};
|
||||
|
||||
render() {
|
||||
let { repo } = this.props;
|
||||
let isOperationMenuShow = this.state.showMenu;
|
||||
return (
|
||||
<Fragment>
|
||||
<tr className={this.state.highlight ? 'tr-highlight' : ''} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
|
||||
<td>{this.renderLibIcon(repo)}</td>
|
||||
<td>{repo.repoName}</td>
|
||||
<td>{`${repo.file_count} / ${Utils.bytesToSize(repo.size)}`}</td>
|
||||
<td>{repo.repoID}</td>
|
||||
<td><a href={this.renderRepoOwnerHref(repo)}>{repo.ownerName}</a></td>
|
||||
<td className="text-center cursor-pointer">
|
||||
{isOperationMenuShow &&
|
||||
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
|
||||
<DropdownToggle
|
||||
tag="a"
|
||||
className="attr-action-icon fas fa-ellipsis-v"
|
||||
title={gettext('More operations')}
|
||||
aria-label={gettext('More operations')}
|
||||
data-toggle="dropdown"
|
||||
aria-expanded={this.state.isItemMenuShow}
|
||||
onClick={this.onDropdownToggleClick}
|
||||
/>
|
||||
<DropdownMenu>
|
||||
<DropdownItem onClick={this.toggleDelete}>{gettext('Delete')}</DropdownItem>
|
||||
<DropdownItem onClick={this.toggleTransfer}>{gettext('Transfer')}</DropdownItem>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
{this.state.isTransferDialogShow && (
|
||||
<ModalPortal>
|
||||
<TransferDialog
|
||||
itemName={repo.repoName}
|
||||
submit={this.onTransferRepo}
|
||||
toggleDialog={this.toggleTransfer}
|
||||
isOrgAdmin={true}
|
||||
/>
|
||||
</ModalPortal>
|
||||
)}
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
RepoItem.propTypes = propTypes;
|
||||
|
||||
class OrgAllRepos extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: true,
|
||||
errorMsg: '',
|
||||
repos: [],
|
||||
pageInfo: {},
|
||||
perPage: 25,
|
||||
sortBy: '',
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
let urlParams = (new URL(window.location)).searchParams;
|
||||
const { currentPage = 1, perPage, sortBy } = this.state;
|
||||
this.setState({
|
||||
sortBy: urlParams.get('order_by') || sortBy,
|
||||
perPage: parseInt(urlParams.get('per_page') || perPage),
|
||||
currentPage: parseInt(urlParams.get('page') || currentPage)
|
||||
}, () => {
|
||||
this.getReposByPage(this.state.currentPage);
|
||||
});
|
||||
}
|
||||
|
||||
getReposByPage = (page) => {
|
||||
let { perPage } = this.state;
|
||||
seafileAPI.orgAdminListOrgRepos(orgID, page, perPage, this.state.sortBy).then((res) => {
|
||||
let orgRepos = res.data.repo_list.map(item => {
|
||||
return new OrgAdminRepo(item);
|
||||
});
|
||||
let page_info = {};
|
||||
if(res.data.page_info === undefined){
|
||||
let page = res.data.page;
|
||||
let has_next_page = res.data.page_next;
|
||||
page_info = {
|
||||
'current_page': page,
|
||||
'has_next_page': has_next_page
|
||||
};
|
||||
}else{
|
||||
page_info = res.data.page_info;
|
||||
}
|
||||
this.setState({
|
||||
loading: false,
|
||||
repos: orgRepos,
|
||||
pageInfo: page_info
|
||||
});
|
||||
}).catch((error) => {
|
||||
this.setState({
|
||||
loading: false,
|
||||
errorMsg: Utils.getErrorMsg(error, true) // true: show login tip if 403
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
sortItems = (sortBy) => {
|
||||
this.setState({
|
||||
currentPage: 1,
|
||||
sortBy: sortBy
|
||||
}, () => {
|
||||
let url = new URL(location.href);
|
||||
let searchParams = new URLSearchParams(url.search);
|
||||
const { currentPage, sortBy } = this.state;
|
||||
searchParams.set('page', currentPage);
|
||||
searchParams.set('order_by', sortBy);
|
||||
url.search = searchParams.toString();
|
||||
navigate(url.toString());
|
||||
this.getReposByPage(currentPage);
|
||||
});
|
||||
};
|
||||
|
||||
resetPerPage = (perPage) => {
|
||||
this.setState({
|
||||
perPage: perPage
|
||||
}, () => {
|
||||
this.getReposByPage(1);
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
deleteRepoItem = (repo) => {
|
||||
seafileAPI.orgAdminDeleteOrgRepo(orgID, repo.repoID).then(res => {
|
||||
this.setState({
|
||||
repos: this.state.repos.filter(item => item.repoID !== repo.repoID)
|
||||
});
|
||||
let msg = gettext('Successfully deleted {name}');
|
||||
msg = msg.replace('{name}', repo.repoName);
|
||||
toaster.success(msg);
|
||||
}).catch(error => {
|
||||
let errMessage = Utils.getErrorMsg(error);
|
||||
toaster.danger(errMessage);
|
||||
});
|
||||
};
|
||||
|
||||
transferRepoItem = (repoID, user) => {
|
||||
this.setState({
|
||||
repos: this.state.repos.map(item =>{
|
||||
if (item.repoID == repoID) {
|
||||
item.ownerEmail = user.email;
|
||||
item.ownerName = user.value;
|
||||
}
|
||||
return item;
|
||||
})
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Fragment>
|
||||
<MainPanelTopbar />
|
||||
<div className="main-panel-center flex-row">
|
||||
<div className="cur-view-container">
|
||||
<ReposNav currentItem="all" />
|
||||
<div className="cur-view-content">
|
||||
<Content
|
||||
loading={this.state.loading}
|
||||
errorMsg={this.state.errorMsg}
|
||||
items={this.state.repos}
|
||||
sortBy={this.state.sortBy}
|
||||
sortItems={this.sortItems}
|
||||
pageInfo={this.state.pageInfo}
|
||||
curPerPage={this.state.perPage}
|
||||
getListByPage={this.getReposByPage}
|
||||
resetPerPage={this.resetPerPage}
|
||||
onDeleteRepo={this.deleteRepoItem}
|
||||
transferRepoItem={this.transferRepoItem}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default OrgAllRepos;
|
||||
40
frontend/src/pages/org-admin/libraries/org-repo-nav.js
Normal file
40
frontend/src/pages/org-admin/libraries/org-repo-nav.js
Normal file
@@ -0,0 +1,40 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from '@gatsbyjs/reach-router';
|
||||
import { siteRoot, gettext } from '../../../utils/constants';
|
||||
|
||||
const propTypes = {
|
||||
currentItem: PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
class Nav extends React.Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.navItems = [
|
||||
{name: 'all', urlPart: 'repoadmin', text: gettext('All')},
|
||||
{name: 'trash', urlPart: 'repoadmin-trash', text: gettext('Trash')}
|
||||
];
|
||||
}
|
||||
|
||||
render() {
|
||||
const { currentItem } = this.props;
|
||||
return (
|
||||
<div className="cur-view-path tab-nav-container">
|
||||
<ul className="nav">
|
||||
{this.navItems.map((item, index) => {
|
||||
return (
|
||||
<li className="nav-item" key={index}>
|
||||
<Link to={`${siteRoot}org/${item.urlPart}/`} className={`nav-link${currentItem == item.name ? ' active' : ''}`}>{item.text}</Link>
|
||||
</li>
|
||||
);
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Nav.propTypes = propTypes;
|
||||
|
||||
export default Nav;
|
||||
411
frontend/src/pages/org-admin/libraries/org-repo-trash.js
Normal file
411
frontend/src/pages/org-admin/libraries/org-repo-trash.js
Normal file
@@ -0,0 +1,411 @@
|
||||
import React, { Component, Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Button } from 'reactstrap';
|
||||
import moment from 'moment';
|
||||
import { Utils } from '../../../utils/utils';
|
||||
import { seafileAPI } from '../../../utils/seafile-api';
|
||||
import { gettext, orgID } from '../../../utils/constants';
|
||||
import toaster from '../../../components/toast/index';
|
||||
import EmptyTip from '../../../components/empty-tip';
|
||||
import Loading from '../../../components/loading';
|
||||
import Paginator from '../../../components/paginator';
|
||||
import ModalPortal from '../../../components/modal-portal';
|
||||
import OpMenu from '../../../components/dialog/op-menu';
|
||||
import CommonOperationConfirmationDialog from '../../../components/dialog/common-operation-confirmation-dialog';
|
||||
import MainPanelTopbar from '../main-panel-topbar';
|
||||
import UserLink from '../user-link';
|
||||
import ReposNav from './org-repo-nav';
|
||||
|
||||
|
||||
class Content extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
isItemFreezed: false
|
||||
};
|
||||
}
|
||||
|
||||
onFreezedItem = () => {
|
||||
this.setState({isItemFreezed: true});
|
||||
};
|
||||
|
||||
onUnfreezedItem = () => {
|
||||
this.setState({isItemFreezed: false});
|
||||
};
|
||||
|
||||
getPreviousPageList = () => {
|
||||
this.props.getListByPage(this.props.pageInfo.current_page - 1);
|
||||
};
|
||||
|
||||
getNextPageList = () => {
|
||||
this.props.getListByPage(this.props.pageInfo.current_page + 1);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { loading, errorMsg, items, pageInfo, curPerPage } = this.props;
|
||||
if (loading) {
|
||||
return <Loading />;
|
||||
} else if (errorMsg) {
|
||||
return <p className="error text-center mt-4">{errorMsg}</p>;
|
||||
} else {
|
||||
const emptyTip = (
|
||||
<EmptyTip>
|
||||
<h2>{gettext('No deleted libraries')}</h2>
|
||||
</EmptyTip>
|
||||
);
|
||||
const table = (
|
||||
<Fragment>
|
||||
{/* <p className="mt-4 small text-secondary">{gettext('Tip: libraries deleted {trashReposExpireDays} days ago will be cleaned automatically.').replace('{trashReposExpireDays}', trashReposExpireDays)}</p> */}
|
||||
<table className="table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th width="5%">{/*icon*/}</th>
|
||||
<th width="43%">{gettext('Name')}</th>
|
||||
<th width="27%">{gettext('Owner')}</th>
|
||||
<th width="20%">{gettext('Deleted Time')}</th>
|
||||
<th width="5%">{/*Operations*/}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{items.map((item, index) => {
|
||||
return (<Item
|
||||
key={index}
|
||||
repo={item}
|
||||
isItemFreezed={this.state.isItemFreezed}
|
||||
onFreezedItem={this.onFreezedItem}
|
||||
onUnfreezedItem={this.onUnfreezedItem}
|
||||
onDeleteRepo={this.props.onDeleteRepo}
|
||||
onRestoreRepo={this.props.onRestoreRepo}
|
||||
/>);
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
{pageInfo &&
|
||||
<Paginator
|
||||
gotoPreviousPage={this.getPreviousPageList}
|
||||
gotoNextPage={this.getNextPageList}
|
||||
currentPage={pageInfo.current_page}
|
||||
hasNextPage={pageInfo.has_next_page}
|
||||
curPerPage={curPerPage}
|
||||
resetPerPage={this.props.resetPerPage}
|
||||
/>
|
||||
}
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
return items.length ? table : emptyTip;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Content.propTypes = {
|
||||
loading: PropTypes.bool.isRequired,
|
||||
errorMsg: PropTypes.string.isRequired,
|
||||
items: PropTypes.array.isRequired,
|
||||
deleteItem: PropTypes.func,
|
||||
onDeleteRepo: PropTypes.func.isRequired,
|
||||
onRestoreRepo: PropTypes.func,
|
||||
getListByPage: PropTypes.func.isRequired,
|
||||
resetPerPage: PropTypes.func,
|
||||
pageInfo: PropTypes.object,
|
||||
curPerPage: PropTypes.number,
|
||||
};
|
||||
|
||||
class Item extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
highlight: false,
|
||||
isOpIconShown: false,
|
||||
isDeleteRepoDialogOpen: false,
|
||||
isRestoreRepoDialogOpen: false
|
||||
};
|
||||
}
|
||||
|
||||
handleMouseOver = () => {
|
||||
if (!this.props.isItemFreezed) {
|
||||
this.setState({
|
||||
isOpIconShown: true,
|
||||
highlight: true
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
handleMouseOut = () => {
|
||||
if (!this.props.isItemFreezed) {
|
||||
this.setState({
|
||||
isOpIconShown: false,
|
||||
highlight: false
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
onUnfreezedItem = () => {
|
||||
this.setState({
|
||||
highlight: false,
|
||||
isOpIconShow: false
|
||||
});
|
||||
this.props.onUnfreezedItem();
|
||||
};
|
||||
|
||||
onDeleteRepo = () => {
|
||||
const repo = this.props.repo;
|
||||
seafileAPI.orgAdminDeleteTrashRepo(orgID, repo.id).then((res) => {
|
||||
this.props.onDeleteRepo(repo);
|
||||
const msg = gettext('Successfully deleted {name}.').replace('{name}', repo.name);
|
||||
toaster.success(msg);
|
||||
}).catch((error) => {
|
||||
let errMessage = Utils.getErrorMsg(error);
|
||||
toaster.danger(errMessage);
|
||||
});
|
||||
};
|
||||
|
||||
onRestoreRepo = () => {
|
||||
const repo = this.props.repo;
|
||||
seafileAPI.orgAdminRestoreTrashRepo(orgID, repo.id).then((res) => {
|
||||
this.props.onRestoreRepo(repo);
|
||||
let message = gettext('Successfully restored the library.');
|
||||
toaster.success(message);
|
||||
}).catch((error) => {
|
||||
let errMessage = Utils.getErrorMsg(error);
|
||||
toaster.danger(errMessage);
|
||||
});
|
||||
};
|
||||
|
||||
toggleDeleteRepoDialog = (e) => {
|
||||
if (e) {
|
||||
e.preventDefault();
|
||||
}
|
||||
this.setState({isDeleteRepoDialogOpen: !this.state.isDeleteRepoDialogOpen});
|
||||
};
|
||||
|
||||
toggleRestoreRepoDialog = (e) => {
|
||||
if (e) {
|
||||
e.preventDefault();
|
||||
}
|
||||
this.setState({isRestoreRepoDialogOpen: !this.state.isRestoreRepoDialogOpen});
|
||||
};
|
||||
|
||||
translateOperations = (item) => {
|
||||
let translateResult = '';
|
||||
switch(item) {
|
||||
case 'Restore':
|
||||
translateResult = gettext('Restore');
|
||||
break;
|
||||
case 'Delete':
|
||||
translateResult = gettext('Delete');
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
return translateResult;
|
||||
};
|
||||
|
||||
onMenuItemClick = (operation) => {
|
||||
switch(operation) {
|
||||
case 'Restore':
|
||||
this.toggleRestoreRepoDialog();
|
||||
break;
|
||||
case 'Delete':
|
||||
this.toggleDeleteRepoDialog();
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
render () {
|
||||
const { repo } = this.props;
|
||||
const { isOpIconShown, isDeleteRepoDialogOpen, isRestoreRepoDialogOpen } = this.state;
|
||||
const iconUrl = Utils.getLibIconUrl(repo);
|
||||
const iconTitle = Utils.getLibIconTitle(repo);
|
||||
const repoName = '<span class="op-target">' + Utils.HTMLescape(repo.name) + '</span>';
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<tr onMouseEnter={this.handleMouseOver} onMouseLeave={this.handleMouseOut}>
|
||||
<td><img src={iconUrl} title={iconTitle} alt={iconTitle} width="24" /></td>
|
||||
<td>{repo.name}</td>
|
||||
<td>
|
||||
{repo.owner.indexOf('@seafile_group') == -1 ?
|
||||
<UserLink email={repo.owner} name={repo.owner_name} /> :
|
||||
repo.group_name}
|
||||
</td>
|
||||
<td>{moment(repo.delete_time).fromNow()}</td>
|
||||
<td>
|
||||
{isOpIconShown && (
|
||||
<OpMenu
|
||||
operations={['Restore', 'Delete']}
|
||||
translateOperations={this.translateOperations}
|
||||
onMenuItemClick={this.onMenuItemClick}
|
||||
onFreezedItem={this.props.onFreezedItem}
|
||||
onUnfreezedItem={this.onUnfreezedItem}
|
||||
/>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
{isDeleteRepoDialogOpen &&
|
||||
<ModalPortal>
|
||||
<CommonOperationConfirmationDialog
|
||||
title={gettext('Delete Library')}
|
||||
message={gettext('Are you sure you want to delete {placeholder} completely?').replace('{placeholder}', repoName)}
|
||||
executeOperation={this.onDeleteRepo}
|
||||
confirmBtnText={gettext('Delete')}
|
||||
toggleDialog={this.toggleDeleteRepoDialog}
|
||||
/>
|
||||
</ModalPortal>
|
||||
}
|
||||
{isRestoreRepoDialogOpen &&
|
||||
<ModalPortal>
|
||||
<CommonOperationConfirmationDialog
|
||||
title={gettext('Restore Library')}
|
||||
message={gettext('Are you sure you want to restore {placeholder}?').replace('{placeholder}', repoName)}
|
||||
executeOperation={this.onRestoreRepo}
|
||||
confirmBtnText={gettext('Restore')}
|
||||
toggleDialog={this.toggleRestoreRepoDialog}
|
||||
/>
|
||||
</ModalPortal>
|
||||
}
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Item.propTypes = {
|
||||
repo: PropTypes.object.isRequired,
|
||||
isItemFreezed: PropTypes.bool.isRequired,
|
||||
onFreezedItem: PropTypes.func.isRequired,
|
||||
onUnfreezedItem: PropTypes.func.isRequired,
|
||||
onDeleteRepo: PropTypes.func.isRequired,
|
||||
onRestoreRepo: PropTypes.func,
|
||||
};
|
||||
|
||||
class TrashRepos extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: true,
|
||||
errorMsg: '',
|
||||
repos: [],
|
||||
pageInfo: {},
|
||||
perPage: 25,
|
||||
isCleanTrashDialogOpen: false
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount () {
|
||||
let urlParams = (new URL(window.location)).searchParams;
|
||||
const { currentPage = 1, perPage } = this.state;
|
||||
this.setState({
|
||||
perPage: parseInt(urlParams.get('per_page') || perPage),
|
||||
currentPage: parseInt(urlParams.get('page') || currentPage)
|
||||
}, () => {
|
||||
this.getReposByPage(this.state.currentPage);
|
||||
});
|
||||
}
|
||||
|
||||
toggleCleanTrashDialog = () => {
|
||||
this.setState({isCleanTrashDialogOpen: !this.state.isCleanTrashDialogOpen});
|
||||
};
|
||||
|
||||
getReposByPage = (page) => {
|
||||
let { perPage } = this.state;
|
||||
seafileAPI.orgAdminListTrashRepos(orgID, page, perPage).then((res) => {
|
||||
this.setState({
|
||||
repos: res.data.repos,
|
||||
pageInfo: res.data.page_info,
|
||||
loading: false
|
||||
});
|
||||
}).catch((error) => {
|
||||
this.setState({
|
||||
loading: false,
|
||||
errorMsg: Utils.getErrorMsg(error, true) // true: show login tip if 403
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
resetPerPage = (perPage) => {
|
||||
this.setState({
|
||||
perPage: perPage
|
||||
}, () => {
|
||||
this.getReposByPage(1);
|
||||
});
|
||||
};
|
||||
|
||||
onDeleteRepo = (targetRepo) => {
|
||||
let repos = this.state.repos.filter(repo => {
|
||||
return repo.id != targetRepo.id;
|
||||
});
|
||||
this.setState({
|
||||
repos: repos
|
||||
});
|
||||
};
|
||||
|
||||
onRestoreRepo = (targetRepo) => {
|
||||
let repos = this.state.repos.filter(repo => {
|
||||
return repo.id != targetRepo.id;
|
||||
});
|
||||
this.setState({
|
||||
repos: repos
|
||||
});
|
||||
};
|
||||
|
||||
cleanTrash = () => {
|
||||
seafileAPI.orgAdminCleanTrashRepo(orgID).then(res => {
|
||||
this.setState({repos: []});
|
||||
toaster.success(gettext('Successfully cleared trash.'));
|
||||
}).catch(error => {
|
||||
let errMessage = Utils.getErrorMsg(error);
|
||||
toaster.danger(errMessage);
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { isCleanTrashDialogOpen } = this.state;
|
||||
|
||||
// enable 'search': <MainPanelTopbar search={this.getSearch()}>
|
||||
return (
|
||||
<Fragment>
|
||||
{this.state.repos.length ? (
|
||||
<MainPanelTopbar {...this.props}>
|
||||
<Button className="operation-item" onClick={this.toggleCleanTrashDialog}>{gettext('Clean')}</Button>
|
||||
</MainPanelTopbar>
|
||||
) : <MainPanelTopbar {...this.props} />
|
||||
}
|
||||
<div className="main-panel-center flex-row">
|
||||
<div className="cur-view-container">
|
||||
<ReposNav currentItem="trash" />
|
||||
<div className="cur-view-content">
|
||||
<Content
|
||||
loading={this.state.loading}
|
||||
errorMsg={this.state.errorMsg}
|
||||
items={this.state.repos}
|
||||
pageInfo={this.state.pageInfo}
|
||||
onDeleteRepo={this.onDeleteRepo}
|
||||
onRestoreRepo={this.onRestoreRepo}
|
||||
getListByPage={this.getReposByPage}
|
||||
resetPerPage={this.resetPerPage}
|
||||
curPerPage={this.state.perPage}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{isCleanTrashDialogOpen &&
|
||||
<CommonOperationConfirmationDialog
|
||||
title={gettext('Clear Trash')}
|
||||
message={gettext('Are you sure you want to clear trash?')}
|
||||
executeOperation={this.cleanTrash}
|
||||
confirmBtnText={gettext('Clear')}
|
||||
toggleDialog={this.toggleCleanTrashDialog}
|
||||
/>
|
||||
}
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default TrashRepos;
|
||||
Reference in New Issue
Block a user