浏览代码

HUE-5117 [hbase] Only apply actions on the filtered selected tables

Johan Ahlen 9 年之前
父节点
当前提交
2d0709e3f7

+ 16 - 13
apps/hbase/src/hbase/static/hbase/js/base.js

@@ -46,7 +46,7 @@ var ListViewModel = function (options) {
     return self;
   };
 
-  self.searchQuery = ko.observable("");
+  self.searchQuery = ko.observable('');
 
   self.allVisibleSelected = ko.computed(function() {
     if (self.items().length === 0) {
@@ -68,17 +68,20 @@ var ListViewModel = function (options) {
     }
     return self.deselectAll();
   };
-  self.selected = function () {
-    var acc = [];
-    var items = self.items();
-    for (i = 0; i < items.length; i++) {
-      if (items[i].isSelected())
-        acc.push(items[i]);
-    }
-    return acc;
-  };
+  self.selected = ko.pureComputed(function () {
+    return self.items().filter(function (item) {
+      return item.isSelected();
+    })
+  });
+
+  self.selectedAndVisible = ko.pureComputed(function () {
+    return self.items().filter(function (item) {
+      return item.isSelected() && item.isVisible();
+    })
+  });
+
   self.batchSelected = function (action) {
-    var selected = self.selected();
+    var selected = self.selectedAndVisible();
     var batchCount = 0;
 
     for (q = 0; q < selected.length; q++) {
@@ -111,14 +114,14 @@ var ListViewModel = function (options) {
     });
   };
   self.disableSelected = function () {
-    confirm("Confirm Disable", "Disable these tables?", function () {
+    confirm('Confirm Disable', 'Are you sure you want to disable the ' + self.selectedAndVisible().length + ' selected tables?', function () {
       self.batchSelected(function () {
         return this.disable();
       });
     });
   };
   self.dropSelected = function () {
-    confirm("Confirm Delete", "Are you sure you want to drop the selected items? (WARNING: This cannot be undone!)", function () {
+    confirm('Confirm Delete', 'Are you sure you want to drop the ' + self.selectedAndVisible().length + ' selected items? (WARNING: This cannot be undone!)', function () {
       self.batchSelected(function () {
         var s = this;
         self.droppedTables.push(s);

+ 3 - 3
apps/hbase/src/hbase/static/hbase/js/controls.js

@@ -112,7 +112,7 @@ var DataTableViewModel = function (options) {
   };
 
   self.canDrop = ko.computed(function () {
-    var selected = self.selected();
+    var selected = self.selectedAndVisible();
     if (selected.length <= 0) return false;
     for (var i = 0; i < selected.length; i++) {
       if (selected[i].enabled()) return false;
@@ -121,7 +121,7 @@ var DataTableViewModel = function (options) {
   });
 
   self.canDisable = ko.computed(function () {
-    var selected = self.selected();
+    var selected = self.selectedAndVisible();
     if (selected.length <= 0) return false;
     for (var i = 0; i < selected.length; i++) {
       if (!selected[i].enabled()) return false;
@@ -130,7 +130,7 @@ var DataTableViewModel = function (options) {
   });
 
   self.canEnable = ko.computed(function () {
-    var selected = self.selected();
+    var selected = self.selectedAndVisible();
     if (selected.length <= 0) return false;
     for (var i = 0; i < selected.length; i++) {
       if (selected[i].enabled()) return false;

+ 2 - 2
apps/hbase/src/hbase/templates/app.mako

@@ -157,9 +157,9 @@ ${ commonheader(None, "hbase", user, request) | n,unicode }
   <div id="hbase-page-clusterview" class="hbase-page"> <!-- maybe turn these into script tags, then populate them into #main and then rerender + apply bindings to old viemodels to have modular viewmodels? -->
     <div class="actionbar">
       <div style="padding-bottom: 20px">
-        <input type="text" class="input-large search-query" placeholder="${_('Search for Table Name')}" data-bind="value: views.tables.searchQuery, valueUpdate: 'afterkeydown'">
+        <input type="text" class="input-large search-query" placeholder="${_('Search for Table Name')}" data-bind="value: views.tables.searchQuery, clearable: views.tables.searchQuery, valueUpdate: 'afterkeydown'">
         % if can_write:
-          <span class="btn-group">
+          <span class="btn-group margin-left-10">
             <button class="btn" data-bind="enable: views.tables.canEnable, click: views.tables.enableSelected"><i class="fa fa-check-square"></i> ${_('Enable')}</button>
             <button class="btn" data-bind="enable: views.tables.canDisable, click: views.tables.disableSelected">
               <i class="fa fa-square-o"></i> ${_('Disable')}