X-Git-Url: https://osm.etsi.org/gitweb/?p=osm%2FUI.git;a=blobdiff_plain;f=skyquake%2Fplugins%2Fuser_management%2Fsrc%2Fdashboard%2Fdashboard.jsx;h=70386c7ac3644618122f657dbdc038a6eedb66a5;hp=0275831a602b1fe6059a6e2f94618c36499ddde8;hb=refs%2Fheads%2Fprojects;hpb=3d39b18290b9cb3e10c1a80d91ac4819e7c58474

diff --git a/skyquake/plugins/user_management/src/dashboard/dashboard.jsx b/skyquake/plugins/user_management/src/dashboard/dashboard.jsx
index 0275831a6..70386c7ac 100644
--- a/skyquake/plugins/user_management/src/dashboard/dashboard.jsx
+++ b/skyquake/plugins/user_management/src/dashboard/dashboard.jsx
@@ -10,7 +10,7 @@ import SkyquakeComponent from 'widgets/skyquake_container/skyquakeComponent.jsx'
 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';
@@ -19,6 +19,10 @@ 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 {merge} from 'lodash';
+
+import ROLES from 'utils/roleConstants.js';
+const PLATFORM = ROLES.PLATFORM;
 
 class UserManagementDashboard extends React.Component {
     constructor(props) {
@@ -26,7 +30,6 @@ class UserManagementDashboard extends React.Component {
         this.Store = this.props.flux.stores.hasOwnProperty('UserManagementStore') ? this.props.flux.stores.UserManagementStore : this.props.flux.createStore(UserManagementStore);
        this.state = this.Store.getState();
        this.actions = this.state.actions;
-
     }
     componentDidUpdate() {
         let self = this;
@@ -91,10 +94,13 @@ class UserManagementDashboard extends React.Component {
     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();
@@ -102,12 +108,18 @@ class UserManagementDashboard extends React.Component {
         if(this.state['new-password'] != this.state['confirm-password']) {
             this.props.actions.showNotification('Passwords do not match')
         } else {
-            this.Store.createUser({
-                'user-name': this.state['user-name'],
-                'user-domain': this.state['user-domain'],
-                'password': this.state['new-password']
-                // 'confirm-password': this.state['confirm-password']
-            });
+            let isDisabled = {};
+            if (this.state.disabled == "TRUE") {
+                let isDisabled = {
+                    disabled: [null]
+                }
+            }
+            this.Store.createUser(_.merge({
+                            'user-name': this.state['user-name'],
+                            'user-domain': this.state['user-domain'],
+                            'password': this.state['new-password']
+                            // 'confirm-password': this.state['confirm-password']
+                        }, isDisabled));
         }
     }
     updateUser = (e) => {
@@ -116,18 +128,35 @@ class UserManagementDashboard extends React.Component {
         e.stopPropagation();
         let validatedPasswords = validatePasswordFields(this.state);
         if(validatedPasswords) {
+            let isDisabled = {};
+            let password = {};
+            if (self.state.disabled == "TRUE") {
+                isDisabled = {
+                    disabled: [null]
+                }
+            }
+            if (this.state['new-password'] != '') {
+                password = {'password': this.state['new-password']}
+            } else {
+                password = {
+                    'password': this.state.currentPassword
+                }
+            }
             this.Store.updateUser(_.merge({
                             'user-name': this.state['user-name'],
-                            'user-domain': this.state['user-domain'],
-                            'password': this.state['new-password']
-                        }));
+                            'user-domain': this.state['user-domain']
+                        }, _.merge(isDisabled, password)));
         }
         function validatePasswordFields(state) {
             let oldOne = state['old-password'];
             let newOne = state['new-password'];
             let confirmOne = state['confirm-password'];
             if(true) {
-                if(oldOne == newOne) {
+                // if(!oldOne || !newOne) {
+                //      self.props.actions.showNotification('Please fill in all fields.');
+                //     return false;
+                // }
+                if((oldOne || newOne) && (oldOne == newOne)) {
                     self.props.actions.showNotification('Your new password must not match your old one');
                     return false;
                 }
@@ -163,12 +192,7 @@ class UserManagementDashboard extends React.Component {
     disableChange = (e) => {
         let value = e.target.value;
         value = value.toUpperCase();
-        if (value=="TRUE") {
-            value = true;
-        } else {
-            value = false;
-        }
-        console.log(value)
+        this.actions.handleDisabledChange(value);
     }
     render() {
         let self = this;
@@ -200,22 +224,24 @@ class UserManagementDashboard extends React.Component {
                                 state.isEdit ?
                                 (
                                     <ButtonGroup className="buttonGroup">
-                                        <Button label="Update" type="submit" onClick={this.updateUser} />
                                         <Button label="Delete" onClick={this.deleteUser} />
                                         <Button label="Cancel" onClick={this.cancelEditUser} />
+                                        <Button label="Update" type="submit" onClick={this.updateUser} />
                                     </ButtonGroup>
                                 )
                                 : (
                                     <ButtonGroup className="buttonGroup">
+                                        <Button label="Cancel" onClick={this.closePanel} />
                                         <Button label="Create" type="submit" onClick={this.createUser}  />
                                     </ButtonGroup>
                                 )
                             )
         }
-
         html = (
             <PanelWrapper column>
-                <AppHeader nav={[{name: 'PLATFORM ROLE MANAGEMENT', onClick: this.context.router.push.bind(this, {pathname: '/platform'})}]}/>
+                <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>
@@ -226,6 +252,9 @@ class UserManagementDashboard extends React.Component {
                                 <div>
                                     Domain
                                 </div>
+                                <div>
+                                    Status
+                                </div>
                             </div>
                             {state.users && state.users.map((u, k) => {
                                 let platformRoles = [];
@@ -244,15 +273,20 @@ class UserManagementDashboard extends React.Component {
                                         <div>
                                             {u['user-domain']}
                                         </div>
+                                        <div>
+                                            {u['disabled'] ? "DISABLED" : "ENABLED"}
+                                        </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} />
+                        <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`}>
@@ -261,37 +295,75 @@ class UserManagementDashboard extends React.Component {
                             style={{marginBottom: 0}}
                             hasCloseButton={this.closePanel}
                             no-corners>
-                            <FormSection title="USER INFO">
+                            <FormSection title="USER INFO" className="userInfo">
                             {
-                                this.state.isEdit ?
-                                    null
-                                    : <Input  readonly={state.isReadOnly}  label="Username" value={state['user-name']} onChange={this.updateInput.bind(null, 'user-name')} />
+                                (!state.isEditUser ||  state.isReadOnly) ?
+                                <Input className="userInfo-section" readonly={state.isReadOnly || this.state.isEdit}  label="Username" value={state['user-name']} onChange={this.updateInput.bind(null, 'user-name')} />
+                                : null
                             }
-                                <Input readonly={true} label="Domain" value={state['user-domain']}  onChange={this.updateInput.bind(null, 'user-domain')}></Input>
-
-                                <Input type="radiogroup" readonly={state.isReadOnly} label="Disabled" value={state.disabled} options={[{value: true, label: 'YES'}, {value: false, label: 'NO'}]}  onChange={this.disableChange} />
+                            {
+                                (!state.isEditUser ||  state.isReadOnly) ?
+                                <Input className="userInfo-section" readonly={true} label="Domain" value={state['user-domain']}  onChange={this.updateInput.bind(null, 'user-domain')}></Input>
+                                : null
+                            }
+                                <Input className="userInfo-section"
+                                    type="radiogroup"
+                                    onChange={this.disableChange}
+                                    label="STATUS"
+                                    value={this.state.disabled}
+                                    options={[{label: "DISABLED", value: "TRUE"},{label: "ENABLED", value: "FALSE"}]}
+                                    readonly={state.isReadOnly}
+                                    readonlydisplay={this.state.disabled == "TRUE" ? "DISABLED" : "ENABLED"}
+                                    />
                             </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>
+                            {
+                                !state.isEditUser ?
+                                <FormSection title="PROJECT ROLES">
+                                    <table className="userProfile-table">
+                                        <thead>
+                                            <tr>
+                                                <td>Project</td>
+                                                <td>Role</td>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            {
+                                                this.state.projects && this.state.projects.ids && this.state.projects.ids.map((p,i)=> {
+                                                    let project = self.state.projects.data[p];
+                                                    let userRoles = [];
+                                                    return (
+                                                        <tr key={i}>
+                                                            <td>
+                                                                {p}
+                                                            </td>
+                                                            <td>
+                                                                {
+                                                                    project.map(function(k) {
+                                                                        return <div>{k}</div>
+                                                                    })
+                                                                }
+                                                            </td>
+                                                        </tr>
+                                                    )
+                                                })
+                                            }
+                                        </tbody>
+                                    </table>
+                                </FormSection>
+                                : null
+                            }
+
                             {passwordSectionHTML}
 
                         </Panel>
+                        <SkyquakeRBAC allow={[PLATFORM.SUPER, PLATFORM.ADMIN]} className="rbacButtonGroup">
                             {formButtonsHTML}
+                        </SkyquakeRBAC>
                     </PanelWrapper>
                 </PanelWrapper>
             </PanelWrapper>
@@ -301,7 +373,8 @@ class UserManagementDashboard extends React.Component {
 }
 // onClick={this.Store.update.bind(null, Account)}
 UserManagementDashboard.contextTypes = {
-    router: React.PropTypes.object
+    router: React.PropTypes.object,
+    userProfile: React.PropTypes.object
 };
 
 UserManagementDashboard.defaultProps = {