import 'style/layout.scss';
import './userMgmt.scss';
import {Panel, PanelWrapper} from 'widgets/panel/panel';
-
+import SkyquakeRBAC from 'widgets/skyquake_rbac/skyquakeRBAC.jsx';
import TextInput from 'widgets/form_controls/textInput.jsx';
import Input from 'widgets/form_controls/input.jsx';
import SelectOption from 'widgets/form_controls/selectOption.jsx';
import 'widgets/form_controls/formControls.scss';
import imgAdd from '../../node_modules/open-iconic/svg/plus.svg'
-import imgRemove from '../../node_modules/open-iconic/svg/trash.svg'
+import imgRemove from '../../node_modules/open-iconic/svg/trash.svg';
+
+import ROLES from 'utils/roleConstants.js';
+const PLATFORM = ROLES.PLATFORM;
class UserManagementDashboard extends React.Component {
constructor(props) {
super(props);
this.Store = this.props.flux.stores.hasOwnProperty('UserManagementStore') ? this.props.flux.stores.UserManagementStore : this.props.flux.createStore(UserManagementStore);
- this.Store.getUsers();
- this.state = this.Store.getState();
- this.actions = this.state.actions;
+ this.state = this.Store.getState();
+ this.actions = this.state.actions;
}
componentDidUpdate() {
let self = this;
}
componentWillMount() {
this.Store.listen(this.updateState);
+ this.Store.getUsers();
}
componentWillUnmount() {
this.Store.unlisten(this.updateState);
cancelEditUser = () => {
this.actions.editUser(true)
}
- closePanel = () => {
+ osePanel = () => {
this.actions.handleCloseUserPanel();
}
// updateUser = (e) => {
deleteUser = (e) => {
e.preventDefault();
e.stopPropagation();
- this.Store.deleteUser({
+ if (confirm('Are you sure you want to delete this user?')) {
+ this.Store.deleteUser({
'user-name': this.state['user-name'],
'user-domain': this.state['user-domain']
});
+ }
+
}
createUser = (e) => {
e.preventDefault();
let newOne = state['new-password'];
let confirmOne = state['confirm-password'];
if(true) {
+ if(!oldOne || !newOne) {
+ self.props.actions.showNotification('Please fill in all fields.');
+ return false;
+ }
if(oldOne == newOne) {
self.props.actions.showNotification('Your new password must not match your old one');
return false;
)
)
}
-
html = (
- <PanelWrapper className={`row userManagement ${!this.state.userOpen ? 'userList-open' : ''}`} style={{'flexDirection': 'row'}} >
- <PanelWrapper ref={(div) => { this.UserList = div}} className={`column userList expanded ${this.state.userOpen ? 'collapsed ' : ' '} ${this.state.hideColumns ? 'hideColumns ' : ' '}`}>
- <Panel title="User List" style={{marginBottom: 0}} no-corners>
- <div className="tableRow tableRow--header">
- <div className="userName">
- Username
- </div>
- <div>
- Domain
+ <PanelWrapper column>
+ <SkyquakeRBAC allow={[PLATFORM.SUPER, PLATFORM.ADMIN]} >
+ <AppHeader nav={[{name: 'PLATFORM ROLE MANAGEMENT', onClick: this.context.router.push.bind(this, {pathname: '/platform'})}]}/>
+ </SkyquakeRBAC>
+ <PanelWrapper className={`row userManagement ${!this.state.userOpen ? 'userList-open' : ''}`} style={{'flexDirection': 'row'}} >
+ <PanelWrapper ref={(div) => { this.UserList = div}} className={`column userList expanded ${this.state.userOpen ? 'collapsed ' : ' '} ${this.state.hideColumns ? 'hideColumns ' : ' '}`}>
+ <Panel title="User List" style={{marginBottom: 0}} no-corners>
+ <div className="tableRow tableRow--header">
+ <div className="userName">
+ Username
+ </div>
+ <div>
+ Domain
+ </div>
</div>
- </div>
- {state.users && state.users.map((u, k) => {
- let platformRoles = [];
- for(let role in u.platformRoles) {
- platformRoles.push(<div>{`${role}: ${u.platformRoles[role]}`}</div>)
- }
- return (
- <div ref={(el) => this[`user-ref-${k}`] = el} className={`tableRow tableRow--data ${((self.state.activeIndex == k) && self.state.userOpen) ? 'tableRow--data-active' : ''}`} key={k}>
- <div
- className={`userName userName-header ${((self.state.activeIndex == k) && self.state.userOpen) ? 'activeUser' : ''}`}
+ {state.users && state.users.map((u, k) => {
+ let platformRoles = [];
+ for(let role in u.platformRoles) {
+ platformRoles.push(<div>{`${role}: ${u.platformRoles[role]}`}</div>)
+ }
+ return (
+ <div ref={(el) => this[`user-ref-${k}`] = el} className={`tableRow tableRow--data ${((self.state.activeIndex == k) && self.state.userOpen) ? 'tableRow--data-active' : ''}`}
+ key={k}
onClick={self.viewUser.bind(null, u, k)}>
- {u['user-name']}
- </div>
- <div>
- {u['user-domain']}
- </div>
-
-
- </div>
- )
- })}
- </Panel>
- <ButtonGroup className="buttonGroup" style={{margin: '0 0.5rem 0.5rem', background: '#ddd', paddingBottom: '0.5rem'}}>
- <Button label="Add User" onClick={this.addUser} />
- </ButtonGroup>
- </PanelWrapper>
- <PanelWrapper onKeyUp={this.evaluateSubmit}
- className={`userAdmin column`}>
- <Panel
- title={state.isEdit ? state['user-name'] : 'Create User'}
- style={{marginBottom: 0}}
- hasCloseButton={this.closePanel}
- no-corners>
- <FormSection title="USER INFO">
- {
- this.state.isEdit ?
- null
- : <Input readonly={state.isReadOnly} label="Username" value={state['user-name']} onChange={this.updateInput.bind(null, 'user-name')} />
- }
- <Input readonly={true} label="Domain" value={state['user-domain']} onChange={this.updateInput.bind(null, 'user-domain')}></Input>
+ <div
+ className={`userName userName-header ${((self.state.activeIndex == k) && self.state.userOpen) ? 'activeUser' : ''}`}
+ >
+ {u['user-name']}
+ </div>
+ <div>
+ {u['user-domain']}
+ </div>
- <Input type="radiogroup" readonly={state.isReadOnly} label="Disabled" value={state.disabled} options={[{value: true, label: 'YES'}, {value: false, label: 'NO'}]} onChange={this.disableChange} />
- </FormSection>
- <FormSection title="PLATFORM ROLES" style={{display:'none'}}>
- <Input label="Super Admin" onChange={this.platformChange.bind(null, 'super_admin')} checked={state.platformRoles.super_admin} type="checkbox" />
- <Input label="Platform Admin" onChange={this.platformChange.bind(null, 'platform_admin')} checked={state.platformRoles.platform_admin} type="checkbox" />
- <Input label="Platform Oper" onChange={this.platformChange.bind(null, 'platform_oper')} checked={state.platformRoles.platform_oper} type="checkbox" />
- </FormSection>
- <FormSection title="PROJECT ROLES" style={{display:'none'}}>
- <InputCollection
- inital={true}
- type='select'
- readonly={state.isReadOnly}
- options={state.projectRolesOptions}
- collection={state.projectRoles}
- onChange={this.updateProjectRole}
- AddItemFn={this.addProjectRole}
- RemoveItemFn={this.removeProjectRole}
- />
- </FormSection>
- {passwordSectionHTML}
- </Panel>
- {formButtonsHTML}
+ </div>
+ )
+ })}
+ </Panel>
+ <SkyquakeRBAC allow={[PLATFORM.SUPER, PLATFORM.ADMIN]} className="rbacButtonGroup">
+ <ButtonGroup className="buttonGroup">
+ <Button label="Add User" onClick={this.addUser} />
+ </ButtonGroup>
+ </SkyquakeRBAC>
+ </PanelWrapper>
+ <PanelWrapper onKeyUp={this.evaluateSubmit}
+ className={`userAdmin column`}>
+ <Panel
+ title={state.isEdit ? state['user-name'] : 'Create User'}
+ style={{marginBottom: 0}}
+ hasCloseButton={this.closePanel}
+ no-corners>
+ <FormSection title="USER INFO">
+ {
+ this.state.isEdit ?
+ null
+ : <Input readonly={state.isReadOnly} label="Username" value={state['user-name']} onChange={this.updateInput.bind(null, 'user-name')} />
+ }
+ <Input readonly={true} label="Domain" value={state['user-domain']} onChange={this.updateInput.bind(null, 'user-domain')}></Input>
+ </FormSection>
+ <FormSection title="PLATFORM ROLES" style={{display:'none'}}>
+ <Input label="Super Admin" onChange={this.platformChange.bind(null, 'super_admin')} checked={state.platformRoles.super_admin} type="checkbox" />
+ <Input label="Platform Admin" onChange={this.platformChange.bind(null, 'platform_admin')} checked={state.platformRoles.platform_admin} type="checkbox" />
+ <Input label="Platform Oper" onChange={this.platformChange.bind(null, 'platform_oper')} checked={state.platformRoles.platform_oper} type="checkbox" />
+ </FormSection>
+ <FormSection title="PROJECT ROLES" style={{display:'none'}}>
+ <InputCollection
+ inital={true}
+ type='select'
+ readonly={state.isReadOnly}
+ options={state.projectRolesOptions}
+ collection={state.projectRoles}
+ onChange={this.updateProjectRole}
+ AddItemFn={this.addProjectRole}
+ RemoveItemFn={this.removeProjectRole}
+ />
+ </FormSection>
+ {passwordSectionHTML}
+ </Panel>
+ <SkyquakeRBAC allow={[PLATFORM.SUPER, PLATFORM.ADMIN]} className="rbacButtonGroup">
+ {formButtonsHTML}
+ </SkyquakeRBAC>
+ </PanelWrapper>
</PanelWrapper>
-
-
</PanelWrapper>
);
return html;
}
// onClick={this.Store.update.bind(null, Account)}
UserManagementDashboard.contextTypes = {
- router: React.PropTypes.object
+ router: React.PropTypes.object,
+ userProfile: React.PropTypes.object
};
UserManagementDashboard.defaultProps = {
projects / osm / UI.git / blobdiff