mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-28 16:17:02 +00:00
[system admin] users: added 'search users' (#4253)
This commit is contained in:
@@ -16,6 +16,7 @@ import Users from './users/users';
|
|||||||
import AdminUsers from './users/admin-users';
|
import AdminUsers from './users/admin-users';
|
||||||
import LDAPImportedUsers from './users/ldap-imported-users';
|
import LDAPImportedUsers from './users/ldap-imported-users';
|
||||||
import LDAPUsers from './users/ldap-users';
|
import LDAPUsers from './users/ldap-users';
|
||||||
|
import SearchUsers from './users/search-users';
|
||||||
import User from './users/user-info';
|
import User from './users/user-info';
|
||||||
import UserOwnedRepos from './users/user-repos';
|
import UserOwnedRepos from './users/user-repos';
|
||||||
import UserSharedRepos from './users/user-shared-repos';
|
import UserSharedRepos from './users/user-shared-repos';
|
||||||
@@ -108,7 +109,7 @@ class SysAdmin extends React.Component {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
tab: 'users',
|
tab: 'users',
|
||||||
urlPartList: ['users/']
|
urlPartList: ['users/', 'search-users/']
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
tab: 'groups',
|
tab: 'groups',
|
||||||
@@ -206,6 +207,7 @@ class SysAdmin extends React.Component {
|
|||||||
<AdminUsers path={siteRoot + 'sys/users/admins'} />
|
<AdminUsers path={siteRoot + 'sys/users/admins'} />
|
||||||
<LDAPImportedUsers path={siteRoot + 'sys/users/ldap-imported'} />
|
<LDAPImportedUsers path={siteRoot + 'sys/users/ldap-imported'} />
|
||||||
<LDAPUsers path={siteRoot + 'sys/users/ldap'} />
|
<LDAPUsers path={siteRoot + 'sys/users/ldap'} />
|
||||||
|
<SearchUsers path={siteRoot + 'sys/search-users'} />
|
||||||
<User path={siteRoot + 'sys/users/:email'} />
|
<User path={siteRoot + 'sys/users/:email'} />
|
||||||
<UserOwnedRepos path={siteRoot + 'sys/users/:email/owned-libraries'} />
|
<UserOwnedRepos path={siteRoot + 'sys/users/:email/owned-libraries'} />
|
||||||
<UserSharedRepos path={siteRoot + 'sys/users/:email/shared-libraries'} />
|
<UserSharedRepos path={siteRoot + 'sys/users/:email/shared-libraries'} />
|
||||||
|
341
frontend/src/pages/sys-admin/users/search-users.js
Normal file
341
frontend/src/pages/sys-admin/users/search-users.js
Normal file
@@ -0,0 +1,341 @@
|
|||||||
|
import React, { Component, Fragment } from 'react';
|
||||||
|
import { Button, Form, FormGroup, Input, Col } from 'reactstrap';
|
||||||
|
import { Utils } from '../../../utils/utils';
|
||||||
|
import { seafileAPI } from '../../../utils/seafile-api';
|
||||||
|
import { gettext, loginUrl } from '../../../utils/constants';
|
||||||
|
import toaster from '../../../components/toast';
|
||||||
|
import SysAdminUserSetQuotaDialog from '../../../components/dialog/sysadmin-dialog/set-quota';
|
||||||
|
import CommonOperationConfirmationDialog from '../../../components/dialog/common-operation-confirmation-dialog';
|
||||||
|
import MainPanelTopbar from '../main-panel-topbar';
|
||||||
|
import Content from './users-content';
|
||||||
|
|
||||||
|
|
||||||
|
class SearchUsers extends Component {
|
||||||
|
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
query: '',
|
||||||
|
isSubmitBtnActive: false,
|
||||||
|
loading: true,
|
||||||
|
errorMsg: '',
|
||||||
|
userList: [],
|
||||||
|
hasUserSelected: false,
|
||||||
|
selectedUserList: [],
|
||||||
|
isAllUsersSelected: false,
|
||||||
|
isBatchSetQuotaDialogOpen: false,
|
||||||
|
isBatchDeleteUserDialogOpen: false
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidMount () {
|
||||||
|
let params = (new URL(document.location)).searchParams;
|
||||||
|
this.setState({
|
||||||
|
query: params.get('query') || ''
|
||||||
|
}, this.getItems);
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleBatchSetQuotaDialog = () => {
|
||||||
|
this.setState({isBatchSetQuotaDialogOpen: !this.state.isBatchSetQuotaDialogOpen});
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleBatchDeleteUserDialog = () => {
|
||||||
|
this.setState({isBatchDeleteUserDialogOpen: !this.state.isBatchDeleteUserDialogOpen});
|
||||||
|
}
|
||||||
|
|
||||||
|
onUserSelected = (item) => {
|
||||||
|
let hasUserSelected = false;
|
||||||
|
let selectedUserList = [];
|
||||||
|
// traverse all users, toggle its selected status
|
||||||
|
let users = this.state.userList.map(user => {
|
||||||
|
// toggle status
|
||||||
|
if (user.email === item.email) {
|
||||||
|
user.isSelected = !user.isSelected;
|
||||||
|
}
|
||||||
|
// update selectedUserList
|
||||||
|
// if current user is now selected, push it to selectedUserList
|
||||||
|
// if current user is now not selected, drop it from selectedUserList
|
||||||
|
if (user.isSelected == true) {
|
||||||
|
hasUserSelected = true;
|
||||||
|
selectedUserList.push(user);
|
||||||
|
} else {
|
||||||
|
selectedUserList = selectedUserList.filter(thisuser => {
|
||||||
|
return thisuser.email != user.email;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return user;
|
||||||
|
});
|
||||||
|
// finally update state
|
||||||
|
this.setState({
|
||||||
|
userList: users,
|
||||||
|
hasUserSelected: hasUserSelected,
|
||||||
|
selectedUserList: selectedUserList,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleSelectAllUsers = () => {
|
||||||
|
if (this.state.isAllUsersSelected) {
|
||||||
|
// if previous state is allSelected, toggle to not select
|
||||||
|
let users = this.state.userList.map(user => {
|
||||||
|
user.isSelected = false;
|
||||||
|
return user;
|
||||||
|
});
|
||||||
|
this.setState({
|
||||||
|
userList: users,
|
||||||
|
hasUserSelected: false,
|
||||||
|
isAllUsersSelected: false,
|
||||||
|
selectedUserList: [],
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// if previous state is not allSelected, toggle to selectAll
|
||||||
|
let users = this.state.userList.map(user => {
|
||||||
|
user.isSelected = true;
|
||||||
|
return user;
|
||||||
|
});
|
||||||
|
this.setState({
|
||||||
|
userList: users,
|
||||||
|
hasUserSelected: true,
|
||||||
|
isAllUsersSelected: true,
|
||||||
|
selectedUserList: users
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
getItems = () => {
|
||||||
|
seafileAPI.sysAdminSearchUsers(this.state.query.trim()).then(res => {
|
||||||
|
this.setState({
|
||||||
|
userList: res.data.user_list,
|
||||||
|
loading: false
|
||||||
|
});
|
||||||
|
}).catch((error) => {
|
||||||
|
if (error.response) {
|
||||||
|
if (error.response.status == 403) {
|
||||||
|
this.setState({
|
||||||
|
loading: false,
|
||||||
|
errorMsg: gettext('Permission denied')
|
||||||
|
});
|
||||||
|
location.href = `${loginUrl}?next=${encodeURIComponent(location.href)}`;
|
||||||
|
} else {
|
||||||
|
this.setState({
|
||||||
|
loading: false,
|
||||||
|
errorMsg: gettext('Error')
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.setState({
|
||||||
|
loading: false,
|
||||||
|
errorMsg: gettext('Please check the network.')
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteUser = (email) => {
|
||||||
|
seafileAPI.sysAdminDeleteUser(email).then(res => {
|
||||||
|
let newUserList = this.state.userList.filter(item => {
|
||||||
|
return item.email != email;
|
||||||
|
});
|
||||||
|
this.setState({userList: newUserList});
|
||||||
|
toaster.success(gettext('Successfully deleted 1 item.'));
|
||||||
|
}).catch((error) => {
|
||||||
|
let errMessage = Utils.getErrorMsg(error);
|
||||||
|
toaster.danger(errMessage);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
setUserQuotaInBatch = (quotaTotal) => {
|
||||||
|
let emails = this.state.selectedUserList.map(user => {
|
||||||
|
return user.email;
|
||||||
|
});
|
||||||
|
seafileAPI.sysAdminSetUserQuotaInBatch(emails, quotaTotal).then(res => {
|
||||||
|
let userList = this.state.userList.map(item => {
|
||||||
|
res.data.success.map(resultUser => {
|
||||||
|
if (item.email == resultUser.email) {
|
||||||
|
item.quota_total = resultUser.quota_total;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
this.setState({userList: userList});
|
||||||
|
}).catch((error) => {
|
||||||
|
let errMessage = Utils.getErrorMsg(error);
|
||||||
|
toaster.danger(errMessage);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteUserInBatch = () => {
|
||||||
|
let emails = this.state.selectedUserList.map(user => {
|
||||||
|
return user.email;
|
||||||
|
});
|
||||||
|
seafileAPI.sysAdminDeleteUserInBatch(emails).then(res => {
|
||||||
|
if (res.data.success.length) {
|
||||||
|
let oldUserList = this.state.userList;
|
||||||
|
let newUserList = oldUserList.filter(oldUser => {
|
||||||
|
return !res.data.success.some(deletedUser =>{
|
||||||
|
return deletedUser.email == oldUser.email;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
this.setState({
|
||||||
|
userList: newUserList,
|
||||||
|
hasUserSelected: emails.length != res.data.success.length
|
||||||
|
});
|
||||||
|
const length = res.data.success.length;
|
||||||
|
const msg = length == 1 ?
|
||||||
|
gettext('Successfully deleted 1 user.') :
|
||||||
|
gettext('Successfully deleted {user_number_placeholder} users.')
|
||||||
|
.replace('{user_number_placeholder}', length);
|
||||||
|
toaster.success(msg);
|
||||||
|
}
|
||||||
|
res.data.failed.map(item => {
|
||||||
|
const msg = `${item.email}: ${item.error_msg}`;
|
||||||
|
toaster.danger(msg);
|
||||||
|
});
|
||||||
|
}).catch((error) => {
|
||||||
|
let errMessage = Utils.getErrorMsg(error);
|
||||||
|
toaster.danger(errMessage);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
updateUser = (email, key, value) => {
|
||||||
|
seafileAPI.sysAdminUpdateUser(email, key, value).then(res => {
|
||||||
|
let newUserList = this.state.userList.map(item => {
|
||||||
|
if (item.email == email) {
|
||||||
|
item[key]= res.data[key];
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
this.setState({userList: newUserList});
|
||||||
|
const msg = (key == 'is_active' && value) ?
|
||||||
|
res.data.update_status_tip : gettext('Edit succeeded');
|
||||||
|
toaster.success(msg);
|
||||||
|
}).catch((error) => {
|
||||||
|
let errMessage = Utils.getErrorMsg(error);
|
||||||
|
toaster.danger(errMessage);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
updateAdminRole = (email, role) => {
|
||||||
|
seafileAPI.sysAdminUpdateAdminRole(email, role).then(res => {
|
||||||
|
let newUserList = this.state.userList.map(item => {
|
||||||
|
if (item.email == email) {
|
||||||
|
item.admin_role = res.data.role;
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
this.setState({userList: newUserList});
|
||||||
|
toaster.success(gettext('Edit succeeded'));
|
||||||
|
}).catch((error) => {
|
||||||
|
let errMessage = Utils.getErrorMsg(error);
|
||||||
|
toaster.danger(errMessage);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
revokeAdmin = (email, name) => {
|
||||||
|
seafileAPI.sysAdminUpdateUser(email, 'is_staff', false).then(res => {
|
||||||
|
let userList = this.state.userList.filter(item => {
|
||||||
|
return item.email != email;
|
||||||
|
});
|
||||||
|
this.setState({
|
||||||
|
userList: userList
|
||||||
|
});
|
||||||
|
toaster.success(gettext('Successfully revoked the admin permission of {placeholder}'.replace('{placeholder}', name)));
|
||||||
|
}).catch((error) => {
|
||||||
|
let errMessage = Utils.getErrorMsg(error);
|
||||||
|
toaster.danger(errMessage);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
handleInputChange = (e) => {
|
||||||
|
this.setState({
|
||||||
|
query: e.target.value
|
||||||
|
}, this.checkSubmitBtnActive);
|
||||||
|
}
|
||||||
|
|
||||||
|
checkSubmitBtnActive = () => {
|
||||||
|
const { email } = this.state;
|
||||||
|
this.setState({
|
||||||
|
isSubmitBtnActive: email.trim()
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { query, isSubmitBtnActive } = this.state;
|
||||||
|
const {
|
||||||
|
hasUserSelected,
|
||||||
|
isBatchDeleteUserDialogOpen,
|
||||||
|
isBatchSetQuotaDialogOpen
|
||||||
|
} = this.state;
|
||||||
|
return (
|
||||||
|
<Fragment>
|
||||||
|
{hasUserSelected ?
|
||||||
|
<MainPanelTopbar>
|
||||||
|
<Fragment>
|
||||||
|
<Button className="btn btn-secondary operation-item" onClick={this.toggleBatchSetQuotaDialog}>{gettext('Set Quota')}</Button>
|
||||||
|
<Button className="btn btn-secondary operation-item" onClick={this.toggleBatchDeleteUserDialog}>{gettext('Delete Users')}</Button>
|
||||||
|
</Fragment>
|
||||||
|
</MainPanelTopbar> :
|
||||||
|
<MainPanelTopbar />
|
||||||
|
}
|
||||||
|
<div className="main-panel-center flex-row">
|
||||||
|
<div className="cur-view-container">
|
||||||
|
<div className="cur-view-path">
|
||||||
|
<h3 className="sf-heading">{gettext('Users')}</h3>
|
||||||
|
</div>
|
||||||
|
<div className="cur-view-content">
|
||||||
|
<div className="mt-4 mb-6">
|
||||||
|
<h4 className="border-bottom font-weight-normal mb-2 pb-1">{gettext('Search Users')}</h4>
|
||||||
|
<Form>
|
||||||
|
<FormGroup row>
|
||||||
|
<Col sm={5}>
|
||||||
|
<Input type="text" name="query" value={query} placeholder={gettext('Search users')} onChange={this.handleInputChange} />
|
||||||
|
</Col>
|
||||||
|
</FormGroup>
|
||||||
|
<FormGroup row>
|
||||||
|
<Col sm={{size: 5}}>
|
||||||
|
<button className="btn btn-outline-primary" disabled={!isSubmitBtnActive} onClick={this.getItems}>{gettext('Submit')}</button>
|
||||||
|
</Col>
|
||||||
|
</FormGroup>
|
||||||
|
</Form>
|
||||||
|
</div>
|
||||||
|
<div className="mt-4 mb-6">
|
||||||
|
<h4 className="border-bottom font-weight-normal mb-2 pb-1">{gettext('Result')}</h4>
|
||||||
|
<Content
|
||||||
|
isLDAPImported={false}
|
||||||
|
isAdmin={false}
|
||||||
|
isSearchResult={true}
|
||||||
|
loading={this.state.loading}
|
||||||
|
errorMsg={this.state.errorMsg}
|
||||||
|
items={this.state.userList}
|
||||||
|
updateUser={this.updateUser}
|
||||||
|
deleteUser={this.deleteUser}
|
||||||
|
updateAdminRole={this.updateAdminRole}
|
||||||
|
revokeAdmin={this.revokeAdmin}
|
||||||
|
onUserSelected={this.onUserSelected}
|
||||||
|
isAllUsersSelected={this.isAllUsersSelected}
|
||||||
|
toggleSelectAllUsers={this.toggleSelectAllUsers}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{isBatchSetQuotaDialogOpen &&
|
||||||
|
<SysAdminUserSetQuotaDialog
|
||||||
|
toggle={this.toggleBatchSetQuotaDialog}
|
||||||
|
updateQuota={this.setUserQuotaInBatch}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
{isBatchDeleteUserDialogOpen &&
|
||||||
|
<CommonOperationConfirmationDialog
|
||||||
|
title={gettext('Delete Users')}
|
||||||
|
message={gettext('Are you sure you want to delete the selected user(s) ?')}
|
||||||
|
executeOperation={this.deleteUserInBatch}
|
||||||
|
confirmBtnText={gettext('Delete')}
|
||||||
|
toggleDialog={this.toggleBatchDeleteUserDialog}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
</Fragment>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default SearchUsers;
|
452
frontend/src/pages/sys-admin/users/users-content.js
Normal file
452
frontend/src/pages/sys-admin/users/users-content.js
Normal file
@@ -0,0 +1,452 @@
|
|||||||
|
import React, { Component, Fragment } from 'react';
|
||||||
|
import moment from 'moment';
|
||||||
|
import { Link } from '@reach/router';
|
||||||
|
import { Utils } from '../../../utils/utils';
|
||||||
|
import { seafileAPI } from '../../../utils/seafile-api';
|
||||||
|
import { isPro, username, gettext, multiInstitution, siteRoot } from '../../../utils/constants';
|
||||||
|
import toaster from '../../../components/toast';
|
||||||
|
import EmptyTip from '../../../components/empty-tip';
|
||||||
|
import Loading from '../../../components/loading';
|
||||||
|
import Paginator from '../../../components/paginator';
|
||||||
|
import SysAdminUserStatusEditor from '../../../components/select-editor/sysadmin-user-status-editor';
|
||||||
|
import SysAdminUserRoleEditor from '../../../components/select-editor/sysadmin-user-role-editor';
|
||||||
|
import SelectEditor from '../../../components/select-editor/select-editor';
|
||||||
|
import SysAdminUserSetQuotaDialog from '../../../components/dialog/sysadmin-dialog/set-quota';
|
||||||
|
import CommonOperationConfirmationDialog from '../../../components/dialog/common-operation-confirmation-dialog';
|
||||||
|
import UserLink from '../user-link';
|
||||||
|
import OpMenu from './user-op-menu';
|
||||||
|
|
||||||
|
const { availableRoles, availableAdminRoles, institutions } = window.sysadmin.pageOptions;
|
||||||
|
|
||||||
|
class Content extends Component {
|
||||||
|
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
isItemFreezed: false
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
onFreezedItem = () => {
|
||||||
|
this.setState({isItemFreezed: true});
|
||||||
|
}
|
||||||
|
|
||||||
|
onUnfreezedItem = () => {
|
||||||
|
this.setState({isItemFreezed: false});
|
||||||
|
}
|
||||||
|
|
||||||
|
getPreviousPage = () => {
|
||||||
|
this.props.getListByPage(this.props.currentPage - 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
getNextPage = () => {
|
||||||
|
this.props.getListByPage(this.props.currentPage + 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { isAdmin, loading, errorMsg, items, isAllUsersSelected, curPerPage, hasNextPage, currentPage } = 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 users')}</h2>
|
||||||
|
</EmptyTip>
|
||||||
|
);
|
||||||
|
|
||||||
|
let columns = [];
|
||||||
|
const colNameText = `${gettext('Name')} / ${gettext('Contact Email')}`;
|
||||||
|
const colSpaceText = `${gettext('Space Used')} / ${gettext('Quota')}`;
|
||||||
|
const colCreatedText = `${gettext('Created At')} / ${gettext('Last Login')}`;
|
||||||
|
if (isPro) {
|
||||||
|
columns.push(
|
||||||
|
{width: '20%', text: colNameText},
|
||||||
|
{width: '15%', text: gettext('Status')},
|
||||||
|
{width: '15%', text: gettext('Role')}
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
columns.push(
|
||||||
|
{width: '30%', text: colNameText},
|
||||||
|
{width: '20%', text: gettext('Status')}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
if (multiInstitution && !isAdmin) {
|
||||||
|
columns.push(
|
||||||
|
{width: '14%', text: colSpaceText},
|
||||||
|
{width: '14%', text: gettext('Institution')},
|
||||||
|
{width: '14%', text: colCreatedText},
|
||||||
|
{width: '5%', text: ''}
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
columns.push(
|
||||||
|
{width: '20%', text: colSpaceText},
|
||||||
|
{width: '22%', text: colCreatedText},
|
||||||
|
{width: '5%', text: ''}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const table = (
|
||||||
|
<Fragment>
|
||||||
|
<table>
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th width="3%" className="pl-2">
|
||||||
|
<input type="checkbox" className="vam" onChange={this.props.toggleSelectAllUsers} checked={isAllUsersSelected} />
|
||||||
|
</th>
|
||||||
|
{columns.map((item, index) => {
|
||||||
|
return <th width={item.width} key={index}>{item.text}</th>;
|
||||||
|
})}
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{items.map((item, index) => {
|
||||||
|
return (<Item
|
||||||
|
key={index}
|
||||||
|
item={item}
|
||||||
|
isItemFreezed={this.state.isItemFreezed}
|
||||||
|
onFreezedItem={this.onFreezedItem}
|
||||||
|
onUnfreezedItem={this.onUnfreezedItem}
|
||||||
|
updateUser={this.props.updateUser}
|
||||||
|
deleteUser={this.props.deleteUser}
|
||||||
|
updateAdminRole={this.props.updateAdminRole}
|
||||||
|
revokeAdmin={this.props.revokeAdmin}
|
||||||
|
onUserSelected={this.props.onUserSelected}
|
||||||
|
isAdmin={this.props.isAdmin}
|
||||||
|
isLDAPImported={this.props.isLDAPImported}
|
||||||
|
/>);
|
||||||
|
})}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
{(!this.props.isAdmin && !this.props.isSearchResult) &&
|
||||||
|
<Paginator
|
||||||
|
gotoPreviousPage={this.getPreviousPage}
|
||||||
|
gotoNextPage={this.getNextPage}
|
||||||
|
currentPage={currentPage}
|
||||||
|
hasNextPage={hasNextPage}
|
||||||
|
canResetPerPage={true}
|
||||||
|
curPerPage={curPerPage}
|
||||||
|
resetPerPage={this.props.resetPerPage}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
</Fragment>
|
||||||
|
);
|
||||||
|
|
||||||
|
return items.length ? table : emptyTip;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class Item extends Component {
|
||||||
|
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
isOpIconShown: false,
|
||||||
|
highlight: false,
|
||||||
|
isSetQuotaDialogOpen: false,
|
||||||
|
isDeleteUserDialogOpen: false,
|
||||||
|
isResetUserPasswordDialogOpen: false,
|
||||||
|
isRevokeAdminDialogOpen: false
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
handleMouseEnter = () => {
|
||||||
|
if (!this.props.isItemFreezed) {
|
||||||
|
this.setState({
|
||||||
|
isOpIconShown: true,
|
||||||
|
highlight: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
handleMouseLeave = () => {
|
||||||
|
if (!this.props.isItemFreezed) {
|
||||||
|
this.setState({
|
||||||
|
isOpIconShown: false,
|
||||||
|
highlight: false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onUnfreezedItem = () => {
|
||||||
|
this.setState({
|
||||||
|
highlight: false,
|
||||||
|
isOpIconShow: false
|
||||||
|
});
|
||||||
|
this.props.onUnfreezedItem();
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleSetQuotaDialog = () => {
|
||||||
|
this.setState({isSetQuotaDialogOpen: !this.state.isSetQuotaDialogOpen});
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleDeleteUserDialog = () => {
|
||||||
|
this.setState({isDeleteUserDialogOpen: !this.state.isDeleteUserDialogOpen});
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleResetUserPasswordDialog = () => {
|
||||||
|
this.setState({isResetUserPasswordDialogOpen: !this.state.isResetUserPasswordDialogOpen});
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleRevokeAdminDialog = () => {
|
||||||
|
this.setState({isRevokeAdminDialogOpen: !this.state.isRevokeAdminDialogOpen});
|
||||||
|
}
|
||||||
|
|
||||||
|
onUserSelected = () => {
|
||||||
|
this.props.onUserSelected(this.props.item);
|
||||||
|
}
|
||||||
|
|
||||||
|
updateStatus= (value) => {
|
||||||
|
const isActive = value == 'active';
|
||||||
|
if (isActive) {
|
||||||
|
toaster.notify(gettext('It may take some time, please wait.'));
|
||||||
|
}
|
||||||
|
this.props.updateUser(this.props.item.email, 'is_active', isActive);
|
||||||
|
}
|
||||||
|
|
||||||
|
updateRole = (value) => {
|
||||||
|
this.props.updateUser(this.props.item.email, 'role', value);
|
||||||
|
}
|
||||||
|
|
||||||
|
updateAdminRole = (value) => {
|
||||||
|
this.props.updateAdminRole(this.props.item.email, value);
|
||||||
|
}
|
||||||
|
|
||||||
|
translateAdminRole = (role) => {
|
||||||
|
switch (role) {
|
||||||
|
case 'default_admin':
|
||||||
|
return gettext('Default Admin');
|
||||||
|
case 'system_admin':
|
||||||
|
return gettext('System Admin');
|
||||||
|
case 'daily_admin':
|
||||||
|
return gettext('Daily Admin');
|
||||||
|
case 'audit_admin':
|
||||||
|
return gettext('Audit Admin');
|
||||||
|
default:
|
||||||
|
return role;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
updateInstitution = (value) => {
|
||||||
|
this.props.updateUser(this.props.item.email, 'institution', value);
|
||||||
|
}
|
||||||
|
|
||||||
|
translateInstitution = (inst) => {
|
||||||
|
return inst;
|
||||||
|
}
|
||||||
|
|
||||||
|
updateQuota = (value) => {
|
||||||
|
this.props.updateUser(this.props.item.email, 'quota_total', value);
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteUser = () => {
|
||||||
|
this.props.deleteUser(this.props.item.email);
|
||||||
|
}
|
||||||
|
|
||||||
|
resetPassword = () => {
|
||||||
|
toaster.notify(gettext('It may take some time, please wait.'));
|
||||||
|
seafileAPI.sysAdminResetUserPassword(this.props.item.email).then(res => {
|
||||||
|
toaster.success(res.data.reset_tip);
|
||||||
|
}).catch((error) => {
|
||||||
|
let errMessage = Utils.getErrorMsg(error);
|
||||||
|
toaster.danger(errMessage);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
revokeAdmin = () => {
|
||||||
|
const { item } = this.props;
|
||||||
|
this.props.revokeAdmin(item.email, item.name);
|
||||||
|
}
|
||||||
|
|
||||||
|
getMenuOperations = () => {
|
||||||
|
const {
|
||||||
|
isAdmin, isLDAPImported,
|
||||||
|
isSearchResult, item
|
||||||
|
} = this.props;
|
||||||
|
let list = ['Delete'];
|
||||||
|
if (!isLDAPImported ||
|
||||||
|
(isSearchResult && item.source == 'db')) {
|
||||||
|
list.push('Reset Password');
|
||||||
|
}
|
||||||
|
if (isAdmin) {
|
||||||
|
list = ['Revoke Admin'];
|
||||||
|
}
|
||||||
|
return list;
|
||||||
|
}
|
||||||
|
|
||||||
|
translateOperations = (item) => {
|
||||||
|
let translateResult = '';
|
||||||
|
switch (item) {
|
||||||
|
case 'Delete':
|
||||||
|
translateResult = gettext('Delete');
|
||||||
|
break;
|
||||||
|
case 'Reset Password':
|
||||||
|
translateResult = gettext('Reset Password');
|
||||||
|
break;
|
||||||
|
case 'Revoke Admin':
|
||||||
|
translateResult = gettext('Revoke Admin');
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
return translateResult;
|
||||||
|
}
|
||||||
|
|
||||||
|
onMenuItemClick = (operation) => {
|
||||||
|
switch(operation) {
|
||||||
|
case 'Delete':
|
||||||
|
this.toggleDeleteUserDialog();
|
||||||
|
break;
|
||||||
|
case 'Reset Password':
|
||||||
|
this.toggleResetUserPasswordDialog();
|
||||||
|
break;
|
||||||
|
case 'Revoke Admin':
|
||||||
|
this.toggleRevokeAdminDialog();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { item, isAdmin } = this.props;
|
||||||
|
const {
|
||||||
|
isOpIconShown,
|
||||||
|
isSetQuotaDialogOpen,
|
||||||
|
isDeleteUserDialogOpen,
|
||||||
|
isResetUserPasswordDialogOpen,
|
||||||
|
isRevokeAdminDialogOpen
|
||||||
|
} = this.state;
|
||||||
|
|
||||||
|
const itemName = '<span class="op-target">' + Utils.HTMLescape(item.name) + '</span>';
|
||||||
|
const deleteDialogMsg = gettext('Are you sure you want to delete {placeholder} ?').replace('{placeholder}', itemName);
|
||||||
|
const resetPasswordDialogMsg = gettext('Are you sure you want to reset the password of {placeholder} ?').replace('{placeholder}', itemName);
|
||||||
|
const revokeAdminDialogMsg = gettext('Are you sure you want to revoke the admin permission of {placeholder} ?').replace('{placeholder}', itemName);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Fragment>
|
||||||
|
<tr className={this.state.highlight ? 'tr-highlight' : ''} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>
|
||||||
|
<td className="pl-2">
|
||||||
|
<input type="checkbox" className="vam" onChange={this.onUserSelected} checked={item.isSelected} />
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<UserLink email={item.email} name={item.name} />
|
||||||
|
{item.contact_email &&
|
||||||
|
<Fragment>
|
||||||
|
<br />
|
||||||
|
{item.contact_email}
|
||||||
|
</Fragment>}
|
||||||
|
{item.org_id &&
|
||||||
|
<Fragment>
|
||||||
|
<br />
|
||||||
|
<Link to={`${siteRoot}sys/organizations/${item.org_id}/info/`}>({item.org_name})</Link>
|
||||||
|
</Fragment>
|
||||||
|
}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<SysAdminUserStatusEditor
|
||||||
|
isTextMode={true}
|
||||||
|
isEditIconShow={isOpIconShown}
|
||||||
|
currentStatus={item.is_active ? 'active' : 'inactive'}
|
||||||
|
statusOptions={['active', 'inactive']}
|
||||||
|
onStatusChanged={this.updateStatus}
|
||||||
|
/>
|
||||||
|
</td>
|
||||||
|
{isPro &&
|
||||||
|
<td>
|
||||||
|
{isAdmin ?
|
||||||
|
<SelectEditor
|
||||||
|
isTextMode={true}
|
||||||
|
isEditIconShow={isOpIconShown}
|
||||||
|
options={availableAdminRoles}
|
||||||
|
currentOption={item.admin_role}
|
||||||
|
onOptionChanged={this.updateAdminRole}
|
||||||
|
translateOption={this.translateAdminRole}
|
||||||
|
/> :
|
||||||
|
<SysAdminUserRoleEditor
|
||||||
|
isTextMode={true}
|
||||||
|
isEditIconShow={isOpIconShown}
|
||||||
|
currentRole={item.role}
|
||||||
|
roleOptions={availableRoles}
|
||||||
|
onRoleChanged={this.updateRole}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
</td>
|
||||||
|
}
|
||||||
|
<td>
|
||||||
|
{`${Utils.bytesToSize(item.quota_usage)} / ${item.quota_total > 0 ? Utils.bytesToSize(item.quota_total) : '--'}`}
|
||||||
|
<span
|
||||||
|
title={gettext('Edit')}
|
||||||
|
className={`fa fa-pencil-alt attr-action-icon ${isOpIconShown ? '' : 'invisible'}`}
|
||||||
|
onClick={this.toggleSetQuotaDialog}>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
{(multiInstitution && !isAdmin) &&
|
||||||
|
<td>
|
||||||
|
<SelectEditor
|
||||||
|
isTextMode={true}
|
||||||
|
isEditIconShow={isOpIconShown && institutions.length > 0}
|
||||||
|
options={institutions}
|
||||||
|
currentOption={item.institution}
|
||||||
|
onOptionChanged={this.updateInstitution}
|
||||||
|
translateOption={this.translateInstitution}
|
||||||
|
/>
|
||||||
|
</td>
|
||||||
|
}
|
||||||
|
<td>
|
||||||
|
{`${item.create_time ? moment(item.create_time).format('YYYY-MM-DD HH:mm') : '--'} /`}
|
||||||
|
<br />
|
||||||
|
{`${item.last_login ? moment(item.last_login).fromNow() : '--'}`}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
{(item.email != username && isOpIconShown) &&
|
||||||
|
<OpMenu
|
||||||
|
operations={this.getMenuOperations()}
|
||||||
|
translateOperations={this.translateOperations}
|
||||||
|
onMenuItemClick={this.onMenuItemClick}
|
||||||
|
onFreezedItem={this.props.onFreezedItem}
|
||||||
|
onUnfreezedItem={this.onUnfreezedItem}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{isSetQuotaDialogOpen &&
|
||||||
|
<SysAdminUserSetQuotaDialog
|
||||||
|
toggle={this.toggleSetQuotaDialog}
|
||||||
|
updateQuota={this.updateQuota}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
{isDeleteUserDialogOpen &&
|
||||||
|
<CommonOperationConfirmationDialog
|
||||||
|
title={gettext('Delete User')}
|
||||||
|
message={deleteDialogMsg}
|
||||||
|
executeOperation={this.deleteUser}
|
||||||
|
confirmBtnText={gettext('Delete')}
|
||||||
|
toggleDialog={this.toggleDeleteUserDialog}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
{isResetUserPasswordDialogOpen &&
|
||||||
|
<CommonOperationConfirmationDialog
|
||||||
|
title={gettext('Reset Password')}
|
||||||
|
message={resetPasswordDialogMsg}
|
||||||
|
executeOperation={this.resetPassword}
|
||||||
|
confirmBtnText={gettext('Reset')}
|
||||||
|
toggleDialog={this.toggleResetUserPasswordDialog}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
{isRevokeAdminDialogOpen &&
|
||||||
|
<CommonOperationConfirmationDialog
|
||||||
|
title={gettext('Revoke Admin')}
|
||||||
|
message={revokeAdminDialogMsg}
|
||||||
|
executeOperation={this.revokeAdmin}
|
||||||
|
confirmBtnText={gettext('Revoke')}
|
||||||
|
toggleDialog={this.toggleRevokeAdminDialog}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
</Fragment>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Content;
|
@@ -1,17 +1,10 @@
|
|||||||
import React, { Component, Fragment } from 'react';
|
import React, { Component, Fragment } from 'react';
|
||||||
import { Link } from '@reach/router';
|
import { navigate } from '@reach/router';
|
||||||
import { Button } from 'reactstrap';
|
import { Button } from 'reactstrap';
|
||||||
import moment from 'moment';
|
|
||||||
import { Utils } from '../../../utils/utils';
|
import { Utils } from '../../../utils/utils';
|
||||||
import { seafileAPI } from '../../../utils/seafile-api';
|
import { seafileAPI } from '../../../utils/seafile-api';
|
||||||
import { isPro, username, gettext, multiInstitution, siteRoot, loginUrl } from '../../../utils/constants';
|
import { isPro, gettext, siteRoot, loginUrl } from '../../../utils/constants';
|
||||||
import toaster from '../../../components/toast';
|
import toaster from '../../../components/toast';
|
||||||
import EmptyTip from '../../../components/empty-tip';
|
|
||||||
import Loading from '../../../components/loading';
|
|
||||||
import Paginator from '../../../components/paginator';
|
|
||||||
import SysAdminUserStatusEditor from '../../../components/select-editor/sysadmin-user-status-editor';
|
|
||||||
import SysAdminUserRoleEditor from '../../../components/select-editor/sysadmin-user-role-editor';
|
|
||||||
import SelectEditor from '../../../components/select-editor/select-editor';
|
|
||||||
import SysAdminUserSetQuotaDialog from '../../../components/dialog/sysadmin-dialog/set-quota';
|
import SysAdminUserSetQuotaDialog from '../../../components/dialog/sysadmin-dialog/set-quota';
|
||||||
import SysAdminImportUserDialog from '../../../components/dialog/sysadmin-dialog/sysadmin-import-user-dialog';
|
import SysAdminImportUserDialog from '../../../components/dialog/sysadmin-dialog/sysadmin-import-user-dialog';
|
||||||
import SysAdminAddUserDialog from '../../../components/dialog/sysadmin-dialog/sysadmin-add-user-dialog';
|
import SysAdminAddUserDialog from '../../../components/dialog/sysadmin-dialog/sysadmin-add-user-dialog';
|
||||||
@@ -20,438 +13,11 @@ import CommonOperationConfirmationDialog from '../../../components/dialog/common
|
|||||||
import SysAdminUser from '../../../models/sysadmin-user';
|
import SysAdminUser from '../../../models/sysadmin-user';
|
||||||
import SysAdminAdminUser from '../../../models/sysadmin-admin-user';
|
import SysAdminAdminUser from '../../../models/sysadmin-admin-user';
|
||||||
import MainPanelTopbar from '../main-panel-topbar';
|
import MainPanelTopbar from '../main-panel-topbar';
|
||||||
import UserLink from '../user-link';
|
import Search from '../search';
|
||||||
import UsersNav from './users-nav';
|
import UsersNav from './users-nav';
|
||||||
import OpMenu from './user-op-menu';
|
import Content from './users-content';
|
||||||
|
|
||||||
const { availableRoles, availableAdminRoles, institutions } = window.sysadmin.pageOptions;
|
|
||||||
|
|
||||||
class Content extends Component {
|
|
||||||
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
this.state = {
|
|
||||||
isItemFreezed: false
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
onFreezedItem = () => {
|
|
||||||
this.setState({isItemFreezed: true});
|
|
||||||
}
|
|
||||||
|
|
||||||
onUnfreezedItem = () => {
|
|
||||||
this.setState({isItemFreezed: false});
|
|
||||||
}
|
|
||||||
|
|
||||||
getPreviousPage = () => {
|
|
||||||
this.props.getListByPage(this.props.currentPage - 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
getNextPage = () => {
|
|
||||||
this.props.getListByPage(this.props.currentPage + 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { isAdmin, loading, errorMsg, items, pageInfo, isAllUsersSelected, curPerPage, hasNextPage, currentPage } = 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 users')}</h2>
|
|
||||||
</EmptyTip>
|
|
||||||
);
|
|
||||||
|
|
||||||
let columns = [];
|
|
||||||
const colNameText = `${gettext('Name')} / ${gettext('Contact Email')}`;
|
|
||||||
const colSpaceText = `${gettext('Space Used')} / ${gettext('Quota')}`;
|
|
||||||
const colCreatedText = `${gettext('Created At')} / ${gettext('Last Login')}`;
|
|
||||||
if (isPro) {
|
|
||||||
columns.push(
|
|
||||||
{width: '20%', text: colNameText},
|
|
||||||
{width: '15%', text: gettext('Status')},
|
|
||||||
{width: '15%', text: gettext('Role')}
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
columns.push(
|
|
||||||
{width: '30%', text: colNameText},
|
|
||||||
{width: '20%', text: gettext('Status')}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
if (multiInstitution && !isAdmin) {
|
|
||||||
columns.push(
|
|
||||||
{width: '14%', text: colSpaceText},
|
|
||||||
{width: '14%', text: gettext('Institution')},
|
|
||||||
{width: '14%', text: colCreatedText},
|
|
||||||
{width: '5%', text: ''}
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
columns.push(
|
|
||||||
{width: '20%', text: colSpaceText},
|
|
||||||
{width: '22%', text: colCreatedText},
|
|
||||||
{width: '5%', text: ''}
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const table = (
|
|
||||||
<Fragment>
|
|
||||||
<table>
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th width="3%" className="pl-2">
|
|
||||||
<input type="checkbox" className="vam" onChange={this.props.toggleSelectAllUsers} checked={isAllUsersSelected} />
|
|
||||||
</th>
|
|
||||||
{columns.map((item, index) => {
|
|
||||||
return <th width={item.width} key={index}>{item.text}</th>;
|
|
||||||
})}
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
{items.map((item, index) => {
|
|
||||||
return (<Item
|
|
||||||
key={index}
|
|
||||||
item={item}
|
|
||||||
isItemFreezed={this.state.isItemFreezed}
|
|
||||||
onFreezedItem={this.onFreezedItem}
|
|
||||||
onUnfreezedItem={this.onUnfreezedItem}
|
|
||||||
updateUser={this.props.updateUser}
|
|
||||||
deleteUser={this.props.deleteUser}
|
|
||||||
updateAdminRole={this.props.updateAdminRole}
|
|
||||||
revokeAdmin={this.props.revokeAdmin}
|
|
||||||
onUserSelected={this.props.onUserSelected}
|
|
||||||
isAdmin={this.props.isAdmin}
|
|
||||||
isLDAPImported={this.props.isLDAPImported}
|
|
||||||
/>);
|
|
||||||
})}
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
{!this.props.isAdmin &&
|
|
||||||
<Paginator
|
|
||||||
gotoPreviousPage={this.getPreviousPage}
|
|
||||||
gotoNextPage={this.getNextPage}
|
|
||||||
currentPage={currentPage}
|
|
||||||
hasNextPage={hasNextPage}
|
|
||||||
canResetPerPage={true}
|
|
||||||
curPerPage={curPerPage}
|
|
||||||
resetPerPage={this.props.resetPerPage}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</Fragment>
|
|
||||||
);
|
|
||||||
|
|
||||||
return items.length ? table : emptyTip;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class Item extends Component {
|
|
||||||
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
this.state = {
|
|
||||||
isOpIconShown: false,
|
|
||||||
highlight: false,
|
|
||||||
isSetQuotaDialogOpen: false,
|
|
||||||
isDeleteUserDialogOpen: false,
|
|
||||||
isResetUserPasswordDialogOpen: false,
|
|
||||||
isRevokeAdminDialogOpen: false
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
handleMouseEnter = () => {
|
|
||||||
if (!this.props.isItemFreezed) {
|
|
||||||
this.setState({
|
|
||||||
isOpIconShown: true,
|
|
||||||
highlight: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
handleMouseLeave = () => {
|
|
||||||
if (!this.props.isItemFreezed) {
|
|
||||||
this.setState({
|
|
||||||
isOpIconShown: false,
|
|
||||||
highlight: false
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onUnfreezedItem = () => {
|
|
||||||
this.setState({
|
|
||||||
highlight: false,
|
|
||||||
isOpIconShow: false
|
|
||||||
});
|
|
||||||
this.props.onUnfreezedItem();
|
|
||||||
}
|
|
||||||
|
|
||||||
toggleSetQuotaDialog = () => {
|
|
||||||
this.setState({isSetQuotaDialogOpen: !this.state.isSetQuotaDialogOpen});
|
|
||||||
}
|
|
||||||
|
|
||||||
toggleDeleteUserDialog = () => {
|
|
||||||
this.setState({isDeleteUserDialogOpen: !this.state.isDeleteUserDialogOpen});
|
|
||||||
}
|
|
||||||
|
|
||||||
toggleResetUserPasswordDialog = () => {
|
|
||||||
this.setState({isResetUserPasswordDialogOpen: !this.state.isResetUserPasswordDialogOpen});
|
|
||||||
}
|
|
||||||
|
|
||||||
toggleRevokeAdminDialog = () => {
|
|
||||||
this.setState({isRevokeAdminDialogOpen: !this.state.isRevokeAdminDialogOpen});
|
|
||||||
}
|
|
||||||
|
|
||||||
onUserSelected = () => {
|
|
||||||
this.props.onUserSelected(this.props.item);
|
|
||||||
}
|
|
||||||
|
|
||||||
updateStatus= (value) => {
|
|
||||||
const isActive = value == 'active';
|
|
||||||
if (isActive) {
|
|
||||||
toaster.notify(gettext('It may take some time, please wait.'));
|
|
||||||
}
|
|
||||||
this.props.updateUser(this.props.item.email, 'is_active', isActive);
|
|
||||||
}
|
|
||||||
|
|
||||||
updateRole = (value) => {
|
|
||||||
this.props.updateUser(this.props.item.email, 'role', value);
|
|
||||||
}
|
|
||||||
|
|
||||||
updateAdminRole = (value) => {
|
|
||||||
this.props.updateAdminRole(this.props.item.email, value);
|
|
||||||
}
|
|
||||||
|
|
||||||
translateAdminRole = (role) => {
|
|
||||||
switch (role) {
|
|
||||||
case 'default_admin':
|
|
||||||
return gettext('Default Admin');
|
|
||||||
case 'system_admin':
|
|
||||||
return gettext('System Admin');
|
|
||||||
case 'daily_admin':
|
|
||||||
return gettext('Daily Admin');
|
|
||||||
case 'audit_admin':
|
|
||||||
return gettext('Audit Admin');
|
|
||||||
default:
|
|
||||||
return role;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
updateInstitution = (value) => {
|
|
||||||
this.props.updateUser(this.props.item.email, 'institution', value);
|
|
||||||
}
|
|
||||||
|
|
||||||
translateInstitution = (inst) => {
|
|
||||||
return inst;
|
|
||||||
}
|
|
||||||
|
|
||||||
updateQuota = (value) => {
|
|
||||||
this.props.updateUser(this.props.item.email, 'quota_total', value);
|
|
||||||
}
|
|
||||||
|
|
||||||
deleteUser = () => {
|
|
||||||
this.props.deleteUser(this.props.item.email);
|
|
||||||
}
|
|
||||||
|
|
||||||
resetPassword = () => {
|
|
||||||
seafileAPI.sysAdminResetUserPassword(this.props.item.email).then(res => {
|
|
||||||
toaster.success(res.data.reset_tip);
|
|
||||||
}).catch((error) => {
|
|
||||||
let errMessage = Utils.getErrorMsg(error);
|
|
||||||
toaster.danger(errMessage);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
revokeAdmin = () => {
|
|
||||||
const { item } = this.props;
|
|
||||||
this.props.revokeAdmin(item.email, item.name);
|
|
||||||
}
|
|
||||||
|
|
||||||
getMenuOperations = () => {
|
|
||||||
const { isAdmin, isLDAPImported } = this.props;
|
|
||||||
let list = ['Delete'];
|
|
||||||
if (!isLDAPImported) {
|
|
||||||
list.push('Reset Password');
|
|
||||||
}
|
|
||||||
if (isAdmin) {
|
|
||||||
list = ['Revoke Admin'];
|
|
||||||
}
|
|
||||||
return list;
|
|
||||||
}
|
|
||||||
|
|
||||||
translateOperations = (item) => {
|
|
||||||
let translateResult = '';
|
|
||||||
switch (item) {
|
|
||||||
case 'Delete':
|
|
||||||
translateResult = gettext('Delete');
|
|
||||||
break;
|
|
||||||
case 'Reset Password':
|
|
||||||
translateResult = gettext('Reset Password');
|
|
||||||
break;
|
|
||||||
case 'Revoke Admin':
|
|
||||||
translateResult = gettext('Revoke Admin');
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
return translateResult;
|
|
||||||
}
|
|
||||||
|
|
||||||
onMenuItemClick = (operation) => {
|
|
||||||
switch(operation) {
|
|
||||||
case 'Delete':
|
|
||||||
this.toggleDeleteUserDialog();
|
|
||||||
break;
|
|
||||||
case 'Reset Password':
|
|
||||||
this.toggleResetUserPasswordDialog();
|
|
||||||
break;
|
|
||||||
case 'Revoke Admin':
|
|
||||||
this.toggleRevokeAdminDialog();
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { item, isAdmin } = this.props;
|
|
||||||
const {
|
|
||||||
isOpIconShown,
|
|
||||||
isSetQuotaDialogOpen,
|
|
||||||
isDeleteUserDialogOpen,
|
|
||||||
isResetUserPasswordDialogOpen,
|
|
||||||
isRevokeAdminDialogOpen
|
|
||||||
} = this.state;
|
|
||||||
|
|
||||||
const itemName = '<span class="op-target">' + Utils.HTMLescape(item.name) + '</span>';
|
|
||||||
const deleteDialogMsg = gettext('Are you sure you want to delete {placeholder} ?').replace('{placeholder}', itemName);
|
|
||||||
const resetPasswordDialogMsg = gettext('Are you sure you want to reset the password of {placeholder} ?').replace('{placeholder}', itemName);
|
|
||||||
const revokeAdminDialogMsg = gettext('Are you sure you want to revoke the admin permission of {placeholder} ?').replace('{placeholder}', itemName);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Fragment>
|
|
||||||
<tr className={this.state.highlight ? 'tr-highlight' : ''} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>
|
|
||||||
<td className="pl-2">
|
|
||||||
<input type="checkbox" className="vam" onChange={this.onUserSelected} checked={item.isSelected} />
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<UserLink email={item.email} name={item.name} />
|
|
||||||
{item.contact_email &&
|
|
||||||
<Fragment>
|
|
||||||
<br />
|
|
||||||
{item.contact_email}
|
|
||||||
</Fragment>}
|
|
||||||
{item.org_id &&
|
|
||||||
<Fragment>
|
|
||||||
<br />
|
|
||||||
<Link to={`${siteRoot}sys/organizations/${item.org_id}/info/`}>({item.org_name})</Link>
|
|
||||||
</Fragment>
|
|
||||||
}
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<SysAdminUserStatusEditor
|
|
||||||
isTextMode={true}
|
|
||||||
isEditIconShow={isOpIconShown}
|
|
||||||
currentStatus={item.is_active ? 'active' : 'inactive'}
|
|
||||||
statusOptions={['active', 'inactive']}
|
|
||||||
onStatusChanged={this.updateStatus}
|
|
||||||
/>
|
|
||||||
</td>
|
|
||||||
{isPro &&
|
|
||||||
<td>
|
|
||||||
{isAdmin ?
|
|
||||||
<SelectEditor
|
|
||||||
isTextMode={true}
|
|
||||||
isEditIconShow={isOpIconShown}
|
|
||||||
options={availableAdminRoles}
|
|
||||||
currentOption={item.admin_role}
|
|
||||||
onOptionChanged={this.updateAdminRole}
|
|
||||||
translateOption={this.translateAdminRole}
|
|
||||||
/> :
|
|
||||||
<SysAdminUserRoleEditor
|
|
||||||
isTextMode={true}
|
|
||||||
isEditIconShow={isOpIconShown}
|
|
||||||
currentRole={item.role}
|
|
||||||
roleOptions={availableRoles}
|
|
||||||
onRoleChanged={this.updateRole}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</td>
|
|
||||||
}
|
|
||||||
<td>
|
|
||||||
{`${Utils.bytesToSize(item.quota_usage)} / ${item.quota_total > 0 ? Utils.bytesToSize(item.quota_total) : '--'}`}
|
|
||||||
<span
|
|
||||||
title={gettext('Edit')}
|
|
||||||
className={`fa fa-pencil-alt attr-action-icon ${isOpIconShown ? '' : 'invisible'}`}
|
|
||||||
onClick={this.toggleSetQuotaDialog}>
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
{(multiInstitution && !isAdmin) &&
|
|
||||||
<td>
|
|
||||||
<SelectEditor
|
|
||||||
isTextMode={true}
|
|
||||||
isEditIconShow={isOpIconShown && institutions.length > 0}
|
|
||||||
options={institutions}
|
|
||||||
currentOption={item.institution}
|
|
||||||
onOptionChanged={this.updateInstitution}
|
|
||||||
translateOption={this.translateInstitution}
|
|
||||||
/>
|
|
||||||
</td>
|
|
||||||
}
|
|
||||||
<td>
|
|
||||||
{`${item.create_time ? moment(item.create_time).format('YYYY-MM-DD HH:mm') : '--'} /`}
|
|
||||||
<br />
|
|
||||||
{`${item.last_login ? moment(item.last_login).fromNow() : '--'}`}
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
{(item.email != username && isOpIconShown) &&
|
|
||||||
<OpMenu
|
|
||||||
operations={this.getMenuOperations()}
|
|
||||||
translateOperations={this.translateOperations}
|
|
||||||
onMenuItemClick={this.onMenuItemClick}
|
|
||||||
onFreezedItem={this.props.onFreezedItem}
|
|
||||||
onUnfreezedItem={this.onUnfreezedItem}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
{isSetQuotaDialogOpen &&
|
|
||||||
<SysAdminUserSetQuotaDialog
|
|
||||||
toggle={this.toggleSetQuotaDialog}
|
|
||||||
updateQuota={this.updateQuota}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
{isDeleteUserDialogOpen &&
|
|
||||||
<CommonOperationConfirmationDialog
|
|
||||||
title={gettext('Delete User')}
|
|
||||||
message={deleteDialogMsg}
|
|
||||||
executeOperation={this.deleteUser}
|
|
||||||
confirmBtnText={gettext('Delete')}
|
|
||||||
toggleDialog={this.toggleDeleteUserDialog}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
{isResetUserPasswordDialogOpen &&
|
|
||||||
<CommonOperationConfirmationDialog
|
|
||||||
title={gettext('Reset Password')}
|
|
||||||
message={resetPasswordDialogMsg}
|
|
||||||
executeOperation={this.resetPassword}
|
|
||||||
confirmBtnText={gettext('Reset')}
|
|
||||||
toggleDialog={this.toggleResetUserPasswordDialog}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
{isRevokeAdminDialogOpen &&
|
|
||||||
<CommonOperationConfirmationDialog
|
|
||||||
title={gettext('Revoke Admin')}
|
|
||||||
message={revokeAdminDialogMsg}
|
|
||||||
executeOperation={this.revokeAdmin}
|
|
||||||
confirmBtnText={gettext('Revoke')}
|
|
||||||
toggleDialog={this.toggleRevokeAdminDialog}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</Fragment>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
const { availableRoles } = window.sysadmin.pageOptions;
|
||||||
|
|
||||||
class Users extends Component {
|
class Users extends Component {
|
||||||
|
|
||||||
@@ -840,6 +406,21 @@ class Users extends Component {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getSearch = () => {
|
||||||
|
if (this.props.isAdmin) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
// offer 'Search' for 'DB' & 'LDAPImported' users
|
||||||
|
return <Search
|
||||||
|
placeholder={gettext('Search users')}
|
||||||
|
submit={this.searchItems}
|
||||||
|
/>;
|
||||||
|
}
|
||||||
|
|
||||||
|
searchItems = (keyword) => {
|
||||||
|
navigate(`${siteRoot}sys/search-users/?query=${encodeURIComponent(keyword)}`);
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { isAdmin, isLDAPImported } = this.props;
|
const { isAdmin, isLDAPImported } = this.props;
|
||||||
const {
|
const {
|
||||||
@@ -852,7 +433,7 @@ class Users extends Component {
|
|||||||
} = this.state;
|
} = this.state;
|
||||||
return (
|
return (
|
||||||
<Fragment>
|
<Fragment>
|
||||||
<MainPanelTopbar>
|
<MainPanelTopbar search={this.getSearch()}>
|
||||||
{hasUserSelected ?
|
{hasUserSelected ?
|
||||||
<Fragment>
|
<Fragment>
|
||||||
<Button className="btn btn-secondary operation-item" onClick={this.toggleBatchSetQuotaDialog}>{gettext('Set Quota')}</Button>
|
<Button className="btn btn-secondary operation-item" onClick={this.toggleBatchSetQuotaDialog}>{gettext('Set Quota')}</Button>
|
||||||
|
@@ -717,6 +717,7 @@ urlpatterns = [
|
|||||||
url(r'^sys/departments/$', sysadmin_react_fake_view, name="sys_departments"),
|
url(r'^sys/departments/$', sysadmin_react_fake_view, name="sys_departments"),
|
||||||
url(r'^sys/departments/(?P<group_id>\d+)/$', sysadmin_react_fake_view, name="sys_department"),
|
url(r'^sys/departments/(?P<group_id>\d+)/$', sysadmin_react_fake_view, name="sys_department"),
|
||||||
url(r'^sys/users/$', sysadmin_react_fake_view, name="sys_users"),
|
url(r'^sys/users/$', sysadmin_react_fake_view, name="sys_users"),
|
||||||
|
url(r'^sys/search-users/$', sysadmin_react_fake_view, name="sys_search_users"),
|
||||||
url(r'^sys/users/admins/$', sysadmin_react_fake_view, name="sys_users_admin"),
|
url(r'^sys/users/admins/$', sysadmin_react_fake_view, name="sys_users_admin"),
|
||||||
url(r'^sys/users/ldap/$', sysadmin_react_fake_view, name="sys_users_ldap"),
|
url(r'^sys/users/ldap/$', sysadmin_react_fake_view, name="sys_users_ldap"),
|
||||||
url(r'^sys/users/ldap-imported/$', sysadmin_react_fake_view, name="sys_users_ldap_imported"),
|
url(r'^sys/users/ldap-imported/$', sysadmin_react_fake_view, name="sys_users_ldap_imported"),
|
||||||
|
Reference in New Issue
Block a user