|
@@ -17,6 +17,7 @@ class GroupDeleteModal extends React.Component {
|
|
|
constructor(props) {
|
|
constructor(props) {
|
|
|
super(props);
|
|
super(props);
|
|
|
|
|
|
|
|
|
|
+ // actionName master constants
|
|
|
this.actionForPages = {
|
|
this.actionForPages = {
|
|
|
public: 'public',
|
|
public: 'public',
|
|
|
delete: 'delete',
|
|
delete: 'delete',
|
|
@@ -41,7 +42,7 @@ class GroupDeleteModal extends React.Component {
|
|
|
deleteGroupId: '',
|
|
deleteGroupId: '',
|
|
|
deleteGroupName: '',
|
|
deleteGroupName: '',
|
|
|
groups: [],
|
|
groups: [],
|
|
|
- actionForPages: '',
|
|
|
|
|
|
|
+ actionName: '',
|
|
|
selectedGroupId: '',
|
|
selectedGroupId: '',
|
|
|
};
|
|
};
|
|
|
|
|
|
|
@@ -59,6 +60,8 @@ class GroupDeleteModal extends React.Component {
|
|
|
componentDidMount() {
|
|
componentDidMount() {
|
|
|
this.retrieveUserGroupRelations();
|
|
this.retrieveUserGroupRelations();
|
|
|
|
|
|
|
|
|
|
+ // bootstrap and this jQuery opens/hides modal.
|
|
|
|
|
+ // let React handle it in the future.
|
|
|
$('#admin-delete-user-group-modal').on('show.bs.modal', (button) => {
|
|
$('#admin-delete-user-group-modal').on('show.bs.modal', (button) => {
|
|
|
const data = $(button.relatedTarget);
|
|
const data = $(button.relatedTarget);
|
|
|
const deleteGroupId = data.data('user-group-id');
|
|
const deleteGroupId = data.data('user-group-id');
|
|
@@ -80,8 +83,8 @@ class GroupDeleteModal extends React.Component {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
changeActionHandler(e) {
|
|
changeActionHandler(e) {
|
|
|
- const actionForPages = e.target.value;
|
|
|
|
|
- this.setState({ actionForPages });
|
|
|
|
|
|
|
+ const actionName = e.target.value;
|
|
|
|
|
+ this.setState({ actionName });
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
changeGroupHandler(e) {
|
|
changeGroupHandler(e) {
|
|
@@ -101,12 +104,12 @@ class GroupDeleteModal extends React.Component {
|
|
|
return (
|
|
return (
|
|
|
<FormGroup className="grant-selector m-b-0">
|
|
<FormGroup className="grant-selector m-b-0">
|
|
|
<FormControl
|
|
<FormControl
|
|
|
- name="actionForPages"
|
|
|
|
|
|
|
+ name="actionName"
|
|
|
componentClass="select"
|
|
componentClass="select"
|
|
|
placeholder="select"
|
|
placeholder="select"
|
|
|
bsClass={bsClassName}
|
|
bsClass={bsClassName}
|
|
|
className="btn-group-sm selectpicker"
|
|
className="btn-group-sm selectpicker"
|
|
|
- value={this.state.actionForPages}
|
|
|
|
|
|
|
+ value={this.state.actionName}
|
|
|
onChange={this.changeActionHandler}
|
|
onChange={this.changeActionHandler}
|
|
|
>
|
|
>
|
|
|
<option value="" disabled>{t('user_group_management.choose_action')}</option>
|
|
<option value="" disabled>{t('user_group_management.choose_action')}</option>
|
|
@@ -119,23 +122,25 @@ class GroupDeleteModal extends React.Component {
|
|
|
renderGroupSelector() {
|
|
renderGroupSelector() {
|
|
|
const { t } = this.props;
|
|
const { t } = this.props;
|
|
|
|
|
|
|
|
- const options = this.state.groups.map((group) => {
|
|
|
|
|
- if (group._id !== this.state.deleteGroupId) {
|
|
|
|
|
- const dataContent = `<i class="icon icon-fw icon-organization"></i> ${this.getGroupName(group)}`;
|
|
|
|
|
- return <option key={group._id} value={group._id} data-content={dataContent}>{this.getGroupName(group)}</option>;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ const groups = this.state.groups.filter((group) => {
|
|
|
|
|
+ return group._id !== this.state.deleteGroupId;
|
|
|
|
|
+ });
|
|
|
|
|
|
|
|
- return;
|
|
|
|
|
|
|
+ const options = groups.map((group) => {
|
|
|
|
|
+ const dataContent = `<i class="icon icon-fw icon-organization"></i> ${this.getGroupName(group)}`;
|
|
|
|
|
+ return <option key={group._id} value={group._id} data-content={dataContent}>{this.getGroupName(group)}</option>;
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
|
|
+ const defaultOptionText = groups.length === 0 ? t('user_group_management.no_groups') : t('user_group_management.select_group');
|
|
|
|
|
+
|
|
|
return (
|
|
return (
|
|
|
<select
|
|
<select
|
|
|
name="selectedGroupId"
|
|
name="selectedGroupId"
|
|
|
- className={this.state.actionForPages === this.actionForPages.transfer ? '' : 'd-none'}
|
|
|
|
|
|
|
+ className={this.state.actionName === this.actionForPages.transfer ? '' : 'd-none'}
|
|
|
value={this.state.selectedGroupId}
|
|
value={this.state.selectedGroupId}
|
|
|
onChange={this.changeGroupHandler}
|
|
onChange={this.changeGroupHandler}
|
|
|
>
|
|
>
|
|
|
- <option value="" disabled>{this.state.groups.length === 0 ? t('user_group_management.no_groups') : t('user_group_management.select_group')}</option>
|
|
|
|
|
|
|
+ <option value="" disabled>{defaultOptionText}</option>
|
|
|
{options}
|
|
{options}
|
|
|
</select>
|
|
</select>
|
|
|
);
|
|
);
|
|
@@ -144,10 +149,10 @@ class GroupDeleteModal extends React.Component {
|
|
|
disableSubmit() {
|
|
disableSubmit() {
|
|
|
let isDisabled = false;
|
|
let isDisabled = false;
|
|
|
|
|
|
|
|
- if (this.state.actionForPages === '') {
|
|
|
|
|
|
|
+ if (this.state.actionName === '') {
|
|
|
isDisabled = true;
|
|
isDisabled = true;
|
|
|
}
|
|
}
|
|
|
- else if (this.state.actionForPages === this.actionForPages.transfer) {
|
|
|
|
|
|
|
+ else if (this.state.actionName === this.actionForPages.transfer) {
|
|
|
isDisabled = this.state.selectedGroupId === '';
|
|
isDisabled = this.state.selectedGroupId === '';
|
|
|
}
|
|
}
|
|
|
|
|
|