1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-19 01:20:32 +00:00

[org admin - departments] redesigned it (#6070)

This commit is contained in:
llj
2024-05-12 08:17:02 +08:00
committed by GitHub
parent d62a566e20
commit 67e09a4295
19 changed files with 1198 additions and 986 deletions

View File

@@ -8,15 +8,15 @@ const propTypes = {
groupID: PropTypes.string,
parentGroupID: PropTypes.string,
toggle: PropTypes.func.isRequired,
onDepartChanged: PropTypes.func.isRequired,
onAddNewDepartment: PropTypes.func.isRequired,
};
class AddDepartDialog extends React.Component {
class AddDepartmentDialog extends React.Component {
constructor(props) {
super(props);
this.state = {
departName: '',
departmentName: '',
errMessage: '',
};
}
@@ -28,9 +28,9 @@ class AddDepartDialog extends React.Component {
if (this.props.parentGroupID) {
parentGroup = this.props.parentGroupID;
}
seafileAPI.orgAdminAddDepartGroup(orgID, parentGroup, this.state.departName.trim()).then((res) => {
seafileAPI.orgAdminAddDepartGroup(orgID, parentGroup, this.state.departmentName.trim()).then((res) => {
this.props.toggle();
this.props.onDepartChanged();
this.props.onAddNewDepartment(res.data);
}).catch(error => {
let errorMsg = gettext(error.response.data.error_msg);
this.setState({ errMessage: errorMsg });
@@ -40,7 +40,7 @@ class AddDepartDialog extends React.Component {
validateName = () => {
let errMessage = '';
const name = this.state.departName.trim();
const name = this.state.departmentName.trim();
if (!name.length) {
errMessage = gettext('Name is required');
this.setState({ errMessage: errMessage });
@@ -51,7 +51,7 @@ class AddDepartDialog extends React.Component {
handleChange = (e) => {
this.setState({
departName: e.target.value,
departmentName: e.target.value,
});
};
@@ -70,11 +70,11 @@ class AddDepartDialog extends React.Component {
<ModalBody>
<Form>
<FormGroup>
<Label for="departName">{gettext('Name')}</Label>
<Label for="departmentName">{gettext('Name')}</Label>
<Input
id="departName"
id="departmentName"
onKeyDown={this.handleKeyDown}
value={this.state.departName}
value={this.state.departmentName}
onChange={this.handleChange}
autoFocus={true}
/>
@@ -83,6 +83,7 @@ class AddDepartDialog extends React.Component {
{ this.state.errMessage && <p className="error">{this.state.errMessage}</p> }
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.handleSubmit}>{gettext('Submit')}</Button>
</ModalFooter>
</Modal>
@@ -90,6 +91,6 @@ class AddDepartDialog extends React.Component {
}
}
AddDepartDialog.propTypes = propTypes;
AddDepartmentDialog.propTypes = propTypes;
export default AddDepartDialog;
export default AddDepartmentDialog;

View File

@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Alert } from 'reactstrap';
import { gettext, orgID } from '../../utils/constants';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
@@ -9,8 +9,8 @@ import UserSelect from '../user-select';
const propTypes = {
toggle: PropTypes.func.isRequired,
groupID: PropTypes.string.isRequired,
onMemberChanged: PropTypes.func.isRequired
groupID: PropTypes.string.isRequired,
onAddNewMembers: PropTypes.func.isRequired
};
class AddMemberDialog extends React.Component {
@@ -40,7 +40,7 @@ class AddMemberDialog extends React.Component {
this.setState({ errMessage: res.data.failed[0].error_msg });
}
if (res.data.success.length > 0) {
this.props.onMemberChanged();
this.props.onAddNewMembers(res.data.success);
this.props.toggle();
}
}).catch(error => {
@@ -50,6 +50,7 @@ class AddMemberDialog extends React.Component {
};
render() {
const { errMessage } = this.state;
return (
<Modal isOpen={true} toggle={this.props.toggle}>
<ModalHeader toggle={this.props.toggle}>{gettext('Add Member')}</ModalHeader>
@@ -61,11 +62,11 @@ class AddMemberDialog extends React.Component {
isMulti={false}
className='org-add-member-select'
/>
{ this.state.errMessage && <p className="error">{this.state.errMessage}</p> }
{errMessage && <Alert color="danger" className="mt-2">{errMessage}</Alert>}
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={this.handleSubmit}>{gettext('Submit')}</Button>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.handleSubmit}>{gettext('Submit')}</Button>
</ModalFooter>
</Modal>
);

View File

@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Input, Form, FormGroup, Label } from 'reactstrap';
import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Input, Form, FormGroup, Label, Alert } from 'reactstrap';
import { gettext, orgID } from '../../utils/constants';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
@@ -8,7 +8,7 @@ import { Utils } from '../../utils/utils';
const propTypes = {
toggle: PropTypes.func.isRequired,
groupID: PropTypes.string,
onRepoChanged: PropTypes.func.isRequired,
onAddNewRepo: PropTypes.func.isRequired,
};
class AddRepoDialog extends React.Component {
@@ -26,7 +26,7 @@ class AddRepoDialog extends React.Component {
if (isValid) {
seafileAPI.orgAdminAddDepartmentRepo(orgID, this.props.groupID, this.state.repoName.trim()).then((res) => {
this.props.toggle();
this.props.onRepoChanged();
this.props.onAddNewRepo(res.data);
}).catch(error => {
let errorMsg = Utils.getErrorMsg(error);
this.setState({ errMessage: errorMsg });
@@ -59,6 +59,7 @@ class AddRepoDialog extends React.Component {
};
render() {
const { errMessage } = this.state;
return (
<Modal isOpen={true} toggle={this.props.toggle} autoFocus={false}>
<ModalHeader toggle={this.props.toggle}>{gettext('New Library')}</ModalHeader>
@@ -75,9 +76,10 @@ class AddRepoDialog extends React.Component {
/>
</FormGroup>
</Form>
{ this.state.errMessage && <p className="error">{this.state.errMessage}</p> }
{errMessage && <Alert color="danger" className="mt-2">{errMessage}</Alert>}
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.handleSubmit}>{gettext('Submit')}</Button>
</ModalFooter>
</Modal>

View File

@@ -10,7 +10,7 @@ const propTypes = {
groupName: PropTypes.string,
groupID: PropTypes.number.isRequired,
toggle: PropTypes.func.isRequired,
onDepartChanged: PropTypes.func.isRequired
onDeleteDepartment: PropTypes.func.isRequired
};
class DeleteDepartDialog extends React.Component {
@@ -20,9 +20,10 @@ class DeleteDepartDialog extends React.Component {
}
deleteDepart = () => {
const { groupID } = this.props;
this.props.toggle();
seafileAPI.orgAdminDeleteDepartGroup(orgID, this.props.groupID).then((res) => {
this.props.onDepartChanged();
seafileAPI.orgAdminDeleteDepartGroup(orgID, groupID).then((res) => {
this.props.onDeleteDepartment(groupID);
}).catch(error => {
let errMessage = Utils.getErrorMsg(error);
toaster.danger(errMessage);

View File

@@ -42,8 +42,8 @@ class DeleteMemberDialog extends React.Component {
<div dangerouslySetInnerHTML={{__html: subtitle}}></div>
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={this.deleteMember}>{gettext('Delete')}</Button>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.deleteMember}>{gettext('Delete')}</Button>
</ModalFooter>
</Modal>
);

View File

@@ -13,9 +13,10 @@ class DeleteRepoDialog extends React.Component {
}
deleteRepo = () => {
const { repo } = this.props;
seafileAPI.orgAdminDeleteDepartmentRepo(orgID, this.props.groupID, this.props.repo.repo_id).then((res) => {
if (res.data.success) {
this.props.onRepoChanged();
this.props.onDeleteRepo(repo.repo_id);
this.props.toggle();
}
}).catch(error => {
@@ -34,8 +35,8 @@ class DeleteRepoDialog extends React.Component {
<div dangerouslySetInnerHTML={{__html: subtitle}}></div>
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={this.deleteRepo}>{gettext('Delete')}</Button>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.deleteRepo}>{gettext('Delete')}</Button>
</ModalFooter>
</Modal>
);
@@ -46,7 +47,7 @@ const propTypes = {
repo: PropTypes.object.isRequired,
toggle: PropTypes.func.isRequired,
groupID: PropTypes.string,
onRepoChanged: PropTypes.func.isRequired
onDeleteRepo: PropTypes.func.isRequired
};
DeleteRepoDialog.propTypes = propTypes;

View File

@@ -97,6 +97,7 @@ class RenameDepartmentDialog extends React.Component {
{this.state.errMessage && <p className="error">{this.state.errMessage}</p>}
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.handleSubmit}>{gettext('Submit')}</Button>
</ModalFooter>
</Modal>

View File

@@ -9,7 +9,7 @@ import toaster from '../toast';
const propTypes = {
toggle: PropTypes.func.isRequired,
groupID: PropTypes.number.isRequired,
onDepartChanged: PropTypes.func.isRequired,
onSetQuota: PropTypes.func.isRequired,
};
class SetGroupQuotaDialog extends React.Component {
@@ -30,7 +30,7 @@ class SetGroupQuotaDialog extends React.Component {
let newQuota = this.state.quota == -2 ? this.state.quota : this.state.quota * 1000000;
seafileAPI.orgAdminSetGroupQuota(orgID, this.props.groupID, newQuota).then((res) => {
this.props.toggle();
this.props.onDepartChanged();
this.props.onSetQuota(res.data);
}).catch(error => {
let errMessage = Utils.getErrorMsg(error);
toaster.danger(errMessage);
@@ -74,6 +74,7 @@ class SetGroupQuotaDialog extends React.Component {
{ this.state.errMessage && <p className="error">{this.state.errMessage}</p> }
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.setGroupQuota}>{gettext('Submit')}</Button>
</ModalFooter>
</Modal>