1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-21 03:18:23 +00:00
Files
seahub/frontend/src/components/dialog/sysadmin-dialog/sysadmin-group-add-member-dialog.js
Michael An 08abceb14b custom modal header close icon (#7240)
* seahub custom modal header

* add custom modal header

* special modal use custom close
2024-12-24 11:20:40 +08:00

61 lines
1.7 KiB
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import { Button, Modal, ModalBody, ModalFooter } from 'reactstrap';
import { gettext } from '../../../utils/constants';
import UserSelect from '../../user-select';
import SeahubModalHeader from '@/components/common/seahub-modal-header';
const propTypes = {
toggle: PropTypes.func.isRequired,
addMembers: PropTypes.func.isRequired
};
class SysAdminGroupAddMemberDialog extends React.Component {
constructor(props) {
super(props);
this.state = {
selectedOptions: null,
isSubmitBtnDisabled: true
};
}
handleSelectChange = (options) => {
this.setState({
selectedOptions: options,
isSubmitBtnDisabled: !options.length
});
};
addMembers = () => {
let emails = this.state.selectedOptions.map(item => item.email);
this.props.addMembers(emails);
this.props.toggle();
};
render() {
const { isSubmitBtnDisabled } = this.state;
return (
<Modal isOpen={true} toggle={this.props.toggle}>
<SeahubModalHeader toggle={this.props.toggle}>{gettext('Add Member')}</SeahubModalHeader>
<ModalBody>
<UserSelect
ref="userSelect"
isMulti={true}
placeholder={gettext('Search users')}
onSelectChange={this.handleSelectChange}
/>
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.props.toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.addMembers} disabled={isSubmitBtnDisabled}>{gettext('Submit')}</Button>
</ModalFooter>
</Modal>
);
}
}
SysAdminGroupAddMemberDialog.propTypes = propTypes;
export default SysAdminGroupAddMemberDialog;