haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-07 09:51:26 +00:00
Code Issues Releases Wiki Activity

[manage group members] redesigned 'search group members' & removed the dialog footer (#5438)

Browse Source
This commit is contained in:
llj
2023-04-19 18:19:58 +08:00
committed by GitHub
parent 55803e2725
commit c33fdc8189
5 changed files with 91 additions and 198 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
frontend/src/components/dialog/manage-members-dialog.js
View File

@@ -1,9 +1,8 @@
import React, { Fragment } from 'react';
import React from 'react';
import PropTypes from 'prop-types';
import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Modal, ModalHeader, ModalBody } from 'reactstrap';
import { gettext } from '../../utils/constants';
import ListAndAddGroupMembers from '../list-and-add-group-members';
import SearchGroupMembers from '../search-group-members';
import '../../css/manage-members-dialog.css';
@@ -13,55 +12,19 @@ const propTypes = {
toggleManageMembersDialog: PropTypes.func.isRequired
};
const MANAGEMENT_MODE= {
LIST_AND_ADD: 'list_and_add',
SEARCH: 'search'
};
class ManageMembersDialog extends React.Component {
constructor(props) {
super(props);
this.state = {
currentMode: MANAGEMENT_MODE.LIST_AND_ADD
};
}
changeMode = () => {
this.setState({
currentMode: this.state.currentMode == MANAGEMENT_MODE.LIST_AND_ADD ?
MANAGEMENT_MODE.SEARCH : MANAGEMENT_MODE.LIST_AND_ADD
});
}
render() {
const { currentMode } = this.state;
const { groupID, isOwner, toggleManageMembersDialog: toggle } = this.props;
return (
<Modal isOpen={true} toggle={toggle} className="group-manage-members-dialog">
<ModalHeader toggle={toggle}>
{currentMode == MANAGEMENT_MODE.LIST_AND_ADD ?
gettext('Manage group members') : (
<Fragment>
<button className="fa fa-arrow-left back-icon border-0 bg-transparent mr-2 p-0" onClick={this.changeMode} title={gettext('Back')} aria-label={gettext('Back')}></button>
<span>{gettext('Search group members')}</span>
</Fragment>
)
}
</ModalHeader>
<ModalHeader toggle={toggle}>{gettext('Manage group members')}</ModalHeader>
<ModalBody className="pb-0">
{currentMode == MANAGEMENT_MODE.LIST_AND_ADD ?
<ListAndAddGroupMembers
groupID={groupID}
isOwner={isOwner}
changeMode={this.changeMode}
/> :
<SearchGroupMembers groupID={groupID} isOwner={isOwner} />
}
<ListAndAddGroupMembers
groupID={groupID}
isOwner={isOwner}
/>
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={toggle}>{gettext('Close')}</Button>
</ModalFooter>
</Modal>
);
}