Pārlūkot izejas kodu

[security] Added modify role on create modal

Enrico Berti 11 gadi atpakaļ
vecāks
revīzija
ca6e3a8

+ 34 - 5
apps/security/src/security/templates/hive.mako

@@ -303,15 +303,16 @@ ${ layout.menubar(section='hive') }
 <div id="createRoleModal" class="modal hide fade in" role="dialog">
   <div class="modal-header">
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-    <h3>${ _('Add role') }</h3>
+    <h3 data-bind="visible: ! $root.role().isEditing()">${ _('Add role') }</h3>
+    <h3 data-bind="visible: $root.role().isEditing()">${ _('Edit role') }</h3>
   </div>
   <div class="modal-body" data-bind="with: $root.role, visible: showCreateRole">
 
     <div class="row-fluid">
       <div class="span6">
         <h4>${ _('Name') }</h4>
-        <input type="text" class="input-xlarge" data-bind="value: $data.name, valueUpdate: 'afterkeydown', style: {'border-color': $root.role.hasDuplicateName() ? '#b94a48':''}" placeholder="${ _('Required') }" style="width: 360px" />
-        <div style="color: #b94a48;" data-bind="visible: $root.role.hasDuplicateName"><em>${ _('The specified role name already exists.') }</em></div>
+        <input id="createRoleName" type="text" class="input-xlarge" data-bind="value: $data.name, valueUpdate: 'afterkeydown', visible: ! $data.isEditing()" placeholder="${ _('Required') }" style="width: 360px" />
+        <strong data-bind="text: $data.name, visible: $data.isEditing()"></strong>
       </div>
       <div class="span6">
         <h4>${ _('Groups') }</h4>
@@ -326,8 +327,9 @@ ${ layout.menubar(section='hive') }
     </div>
   </div>
   <div class="modal-footer">
-    <button class="btn" data-dismiss="modal" aria-hidden="true" data-bind="click: $root.role.reset">${ _('Cancel') }</button>
-    <button data-loading-text="${ _('Saving...') }" class="btn btn-primary disable-enter" data-bind="click: $root.role.create, enable: ! $root.role.hasDuplicateName()">${ _('Save') }</button>
+    <button class="btn" data-dismiss="modal" aria-hidden="true">${ _('Cancel') }</button>
+    <button data-loading-text="${ _('Saving...') }" class="btn btn-primary disable-enter" data-bind="click: $root.role().create, visible: ! $root.role().isEditing()">${ _('Save') }</button>
+    <button data-loading-text="${ _('Saving...') }" class="btn btn-primary disable-enter" data-bind="click: $root.role().update, visible: $root.role().isEditing()">${ _('Update') }</button>
   </div>
 </div>
 
@@ -552,6 +554,10 @@ ${ tree.import_templates(itemClick='$root.assist.setPath', iconClick='$root.assi
         show: false
       });
 
+      $("#createRoleModal").on("hidden", function () {
+        viewModel.resetCreateRole();
+      });
+
       $("#deleteRoleModal").modal({
         show: false
       });
@@ -581,7 +587,30 @@ ${ tree.import_templates(itemClick='$root.assist.setPath', iconClick='$root.assi
         show: false
       });
 
+      $(document).on("create.typeahead", function(){
+        $("#createRoleName").typeahead({
+            source: function (query) {
+              var _options = [];
+              viewModel.selectableRoles().forEach(function(item){
+                if (item.toLowerCase().indexOf(query.toLowerCase()) > -1){
+                  _options.push(item);
+                }
+              });
+              return _options;
+            },
+            'updater': function(item) {
+                return item;
+             }
+        });
+      });
+      $(document).on("destroy.typeahead", function(){
+        $('.typeahead').unbind();
+        $("ul.typeahead").hide();
+      });
+
+      $(document).trigger("create.typeahead");
     });
+
 </script>
 
 ${ commonfooter(messages) | n,unicode }

+ 11 - 0
apps/security/static/css/security.css

@@ -115,14 +115,25 @@
   width: 25%;
 }
 
+.modal .showAdvanced {
+  display: block;
+  margin-top: 4px;
+  margin-left: 6px;
+}
+
 .span6 .acl-block .showAdvanced {
   display: block;
   margin-top: 4px;
+  margin-left: 6px;
 }
 .span6 .acl-block .showAdvancedSpacer {
   display: none;
 }
 
+.span6 .acl-block input[type='text'] {
+  width: 21%;
+}
+
 .acl-actions {
   padding: 5px;
   text-align: center;

+ 54 - 11
apps/security/static/js/hive.ko.js

@@ -112,6 +112,21 @@ var Role = function (vm, role) {
   var self = this;
 
   self.name = ko.observable(typeof role.name != "undefined" && role.name != null ? role.name : "");
+  self.name.subscribe(function (value){
+    var _found = false;
+    vm.role().isEditing(false);
+    ko.utils.arrayForEach(vm.roles(), function (role) {
+      if (role.name() == value){
+        vm.role(role);
+        _found = true;
+      }
+    });
+    if (_found) {
+      vm.role().isEditing(true);
+      vm.list_sentry_privileges_by_role(vm.role());
+      $(document).trigger("destroy.typeahead");
+    }
+  });
   self.selected = ko.observable(false);
   self.handleSelect = function (row, e) {
     self.selected(!self.selected());
@@ -128,7 +143,7 @@ var Role = function (vm, role) {
   self.originalPrivileges = ko.observableArray();
   self.showPrivileges = ko.observable(false);
   self.showEditGroups = ko.observable(false);
-  self.hasDuplicateName = ko.observable(false);
+  self.isEditing = ko.observable(false);
 
   self.privilegesChanged = ko.computed(function () {
     return $.grep(self.privileges(), function (privilege) {
@@ -158,6 +173,7 @@ var Role = function (vm, role) {
     self.groups.removeAll();
     self.privileges.removeAll();
     self.originalPrivileges.removeAll();
+    self.isEditing(false);
   }
 
   self.addGroup = function () {
@@ -220,6 +236,26 @@ var Role = function (vm, role) {
     });
   }
 
+  self.update = function () {
+    $(".jHueNotify").hide();
+    $.post("/security/api/hive/update_role", {
+      role: ko.mapping.toJSON(self)
+    }, function (data) {
+      if (data.status == 0) {
+        $(document).trigger("info", data.message);
+        vm.showCreateRole(false);
+        self.reset();
+        $(document).trigger("updated.role");
+        vm.assist.refreshTree();
+        vm.list_sentry_privileges_by_role(role); // Show privileges
+      } else {
+        $(document).trigger("error", data.message);
+      }
+    }).fail(function (xhr, textStatus, errorThrown) {
+      $(document).trigger("error", xhr.responseText);
+    });
+  }
+
   self.remove = function (role) {
     $(".jHueNotify").hide();
     $.post("/security/api/hive/drop_sentry_role", {
@@ -681,6 +717,7 @@ var HiveViewModel = function (initial) {
 
   // Models
   self.roles = ko.observableArray();
+  self.originalRoles = ko.observableArray();
   self.roleFilter = ko.observable("");
   self.filteredRoles = ko.computed(function () {
     var _filter = self.roleFilter().toLowerCase();
@@ -705,21 +742,26 @@ var HiveViewModel = function (initial) {
     }
   }, self);
 
+  self.selectableRoles = ko.computed(function () {
+    var _roles = ko.utils.arrayMap(self.roles(), function (role) {
+      return role.name();
+    });
+    return _roles.sort();
+  }, self);
+
   self.availableHadoopGroups = ko.observableArray();
   self.assist = new Assist(self, initial);
 
   // Editing
   self.showCreateRole = ko.observable(false);
-  self.role = new Role(self, {});
-  self.role.name.subscribe(function (value){
-    var _found = false;
-    ko.utils.arrayForEach(self.roles(), function (role) {
-      if (role.name() == value){
-        _found = true;
-      }
-    });
-    self.role.hasDuplicateName(_found);
-  });
+  self.role = ko.observable(new Role(self, {}));
+
+  self.resetCreateRole = function() {
+    self.roles(self.originalRoles());
+    self.role(new Role(self, {}));
+    $(document).trigger("create.typeahead");
+  };
+
   self.privilege = new Privilege(self, {});
 
   self.doAs = ko.observable(initial.user);
@@ -814,6 +856,7 @@ var HiveViewModel = function (initial) {
           self.roles.removeAll();
           $.each(data.roles, function (index, item) {
             self.roles.push(new Role(self, item));
+            self.originalRoles.push(new Role(self, item));
           });
         }
       }