Update user add/edit UI to support System Auditor setting

Also moved the LDAP indicator to be inline with the mockups (bubble next
to the uesrname in the upper left)

 #1937
 #1888

awx/ui/client/legacy-styles/forms.less

@@ -49,7 +49,7 @@
     min-height: 40px;
 }
 
-.Form-title--is_superuser{
+.Form-title--is_superuser, .Form-title--is_system_auditor, .Form-title--is_ldap_user{
     height:15px;
     color: @default-interface-txt;
     background-color: @default-list-header-bg;
@@ -61,7 +61,7 @@
     margin-left: 10px;
     text-transform: uppercase;
     font-weight: 100;
-    position: absolute;
+    //position: absolute;
     margin-top: 2.25px;
     height: 16px;
 }

awx/ui/client/src/controllers/Users.js

@@ -10,6 +10,26 @@
  * @description This controller's the Users page
 */
 
+const user_type_options = [
+    {type: 'normal'              , label: 'Normal User'          },
+    {type: 'system_auditor'      , label: 'System Auditor'       },
+    {type: 'system_administrator', label: 'System Administrator' },
+];
+
+function user_type_sync($scope) {
+    return (type_option) => {
+        $scope.is_superuser = false;
+        $scope.is_system_auditor = false;
+        switch (type_option.type) {
+            case 'system_administrator':
+                $scope.is_superuser = true;
+            break;
+            case 'system_auditor':
+                $scope.is_system_auditor = true;
+            break;
+        }
+    };
+}
 
 export function UsersList($scope, $rootScope, $location, $log, $stateParams,
     Rest, Alert, UserList, GenerateList, Prompt, SearchInit, PaginateInit,
@@ -116,10 +136,13 @@ UsersList.$inject = ['$scope', '$rootScope', '$location', '$log',
 ];
 
 
+
+
+
 export function UsersAdd($scope, $rootScope, $compile, $location, $log,
     $stateParams, UserForm, GenerateForm, Rest, Alert, ProcessErrors,
     ReturnToCaller, ClearScope, GetBasePath, LookUpInit, OrganizationList,
-    ResetForm, Wait, $state) {
+    ResetForm, Wait, CreateSelect2, $state) {
 
     ClearScope();
 
@@ -138,6 +161,15 @@ export function UsersAdd($scope, $rootScope, $compile, $location, $log,
 
     generator.reset();
 
+    $scope.user_type_options = user_type_options;
+    $scope.user_type = user_type_options[0]
+    $scope.$watch('user_type', user_type_sync($scope));
+
+    CreateSelect2({
+        element: '#user_user_type',
+        multiple: false
+    });
+
     // Configure the lookup dialog. If we're adding a user through the Organizations tab,
     // default the Organization value.
     LookUpInit({
@@ -177,7 +209,8 @@ export function UsersAdd($scope, $rootScope, $compile, $location, $log,
                         data[fld] = $scope[fld];
                     }
                 }
-                data.is_superuser = data.is_superuser || false;
+                data.is_superuser = $scope.is_superuser;
+                data.is_system_auditor = $scope.is_system_auditor;
                 Wait('start');
                 Rest.post(data)
                     .success(function (data) {
@@ -215,14 +248,14 @@ export function UsersAdd($scope, $rootScope, $compile, $location, $log,
 UsersAdd.$inject = ['$scope', '$rootScope', '$compile', '$location', '$log',
     '$stateParams', 'UserForm', 'GenerateForm', 'Rest', 'Alert',
     'ProcessErrors', 'ReturnToCaller', 'ClearScope', 'GetBasePath',
-    'LookUpInit', 'OrganizationList', 'ResetForm', 'Wait', '$state'
+    'LookUpInit', 'OrganizationList', 'ResetForm', 'Wait', 'CreateSelect2', '$state'
 ];
 
 
 export function UsersEdit($scope, $rootScope, $location,
     $stateParams, UserForm, GenerateForm, Rest, ProcessErrors,
     RelatedSearchInit, RelatedPaginateInit, ClearScope,
-    GetBasePath, ResetForm, Wait, $state) {
+    GetBasePath, ResetForm, Wait, CreateSelect2 ,$state) {
 
     ClearScope();
 
@@ -237,6 +270,10 @@ export function UsersEdit($scope, $rootScope, $location,
     generator.inject(form, { mode: 'edit', related: true, scope: $scope });
     generator.reset();
 
+    $scope.user_type_options = user_type_options;
+    $scope.user_type = user_type_options[0]
+    $scope.$watch('user_type', user_type_sync($scope));
+
     var setScopeFields = function(data){
         _(data)
         .pick(function(value, key){
@@ -278,6 +315,8 @@ export function UsersEdit($scope, $rootScope, $location,
              data[key] = $scope[key];
             }
         });
+        data.is_superuser = $scope.is_superuser;
+        data.is_system_auditor = $scope.is_system_auditor;
         return data;
     };
 
@@ -292,6 +331,24 @@ export function UsersEdit($scope, $rootScope, $location,
             master.ldap_user = $scope.ldap_user;
             $scope.socialAuthUser = (data.auth.length > 0) ? true : false;
 
+            $scope.user_type = $scope.user_type_options[0];
+            $scope.is_system_auditor = false;
+            $scope.is_superuser = false;
+            if (data.is_system_auditor) {
+                $scope.user_type = $scope.user_type_options[1];
+                $scope.is_system_auditor = true;
+            }
+            if (data.is_superuser) {
+                $scope.user_type = $scope.user_type_options[2];
+                $scope.is_superuser = true;
+            }
+
+            CreateSelect2({
+                element: '#user_user_type',
+                multiple: false
+            });
+
+
             setScopeFields(data);
             setScopeRelated(data, form.related);
 
@@ -353,5 +410,5 @@ export function UsersEdit($scope, $rootScope, $location,
 UsersEdit.$inject = ['$scope', '$rootScope', '$location',
     '$stateParams', 'UserForm', 'GenerateForm', 'Rest', 'ProcessErrors',
     'RelatedSearchInit', 'RelatedPaginateInit', 'ClearScope', 'GetBasePath',
-    'ResetForm', 'Wait', '$state'
+    'ResetForm', 'Wait', 'CreateSelect2', '$state'
 ];

awx/ui/client/src/forms/Users.js

@@ -87,21 +87,13 @@ export default
                     associated: 'password',
                     autocomplete: false
                 },
-                is_superuser: {
+                user_type: {
-                    label: 'Superuser <span style="text-transform:none;">(User has full system administration privileges)</span>',
+                    label: 'User Type',
-                    type: 'checkbox',
+                    type: 'select',
-                    trueValue: 'true',
+                    ngOptions: 'item as item.label for item in user_type_options track by item.type',
-                    falseValue: 'false',
+                    disableChooseOption: true,
-                    "default": 'false',
+                    ngModel: 'user_type',
-                    ngShow: "current_user['is_superuser'] == true",
-                    ngModel: 'is_superuser'
                 },
-                ldap_user: {
-                    label: 'Created by LDAP',
-                    type: 'checkbox',
-                    readonly: true,
-                    awFeature: 'ldap'
-                }
             },
 
             buttons: {

awx/ui/client/src/shared/form-generator.js

@@ -1101,7 +1101,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
 
                         html += "<div class=\"Form-dropDownContainer\">\n";
                         html += "<select ";
-                        html += "ng-model=\"" + fld + '" ';
+                        html += "ng-model=\"" + (field.ngModel ? field.ngModel : fld) + '" ';
                         html += 'name="' + fld + '" ';
                         html += "class=\"form-control Form-dropDown";
                         html += "\" ";
@@ -1109,6 +1109,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
                         html += (field.ngChange) ? this.attr(field, 'ngChange') : "";
                         html += (field.ngDisabled) ? this.attr(field, 'ngDisabled'): "";
                         html += (field.ngRequired) ? this.attr(field, 'ngRequired') : "";
+                        html += (field.ngInit) ? this.attr(field, 'ngInit') : "";
                         html += buildId(field, fld, this.form);
                         html += (options.mode === 'edit' && field.editRequired) ? "required " : "";
                         html += (options.mode === 'add' && field.addRequired) ? "required " : "";
@@ -1121,7 +1122,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
                             html += field.awRequiredWhen.alwaysShowAsterisk ? "data-awrequired-always-show-asterisk=true " : "";
                         }
                         html += ">\n";
-                        if(!field.multiSelect){
+                        if(!field.multiSelect && !field.disableChooseOption){
                             html += "<option value=\"\">";
                                 // Add a custom default select 'value' (default text)
                             html += (field.defaultText) ? field.defaultText : "Choose a " + field.label.toLowerCase();
@@ -1469,7 +1470,11 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
                     html += (options.mode === 'edit') ? this.form.editTitle : this.form.addTitle;
                     if(this.form.name === "user"){
                         html+= "<span class=\"Form-title--is_superuser\" "+
-                            "ng-if=is_superuser>System Administrator</span>";
+                            "ng-show='is_superuser'>Admin</span>";
+                        html+= "<span class=\"Form-title--is_system_auditor\" "+
+                            "ng-show='is_system_auditor'>Auditor</span>";
+                        html+= "<span class=\"Form-title--is_ldap_user\" "+
+                            "ng-show='ldap_user'>LDAP</span>";
                     }
                     html += "</div>\n";
                     html += "<div class=\"Form-header--fields\">";