浏览代码

HUE-5428 [assist] Add standard sorting options for DB assist

Johan Ahlen 9 年之前
父节点
当前提交
1ab5321

+ 17 - 7
desktop/core/src/desktop/static/desktop/js/assist/assistDbEntry.js

@@ -36,10 +36,11 @@ var AssistDbEntry = (function () {
    * @param {Object} navigationSettings
    * @constructor
    */
-  function AssistDbEntry (definition, parent, assistDbSource, filter, i18n, navigationSettings) {
+  function AssistDbEntry (definition, parent, assistDbSource, filter, i18n, navigationSettings, sortFunctions) {
     var self = this;
     self.i18n = i18n;
     self.definition = definition;
+    self.sortFunctions = sortFunctions;
 
     self.assistDbSource = assistDbSource;
     self.parent = parent;
@@ -50,6 +51,7 @@ var AssistDbEntry = (function () {
     self.invalidateOnRefresh =  self.assistDbSource.invalidateOnRefresh;
     self.highlight = ko.observable(false);
     self.highlightParent = ko.observable(false);
+    self.activeSort = self.assistDbSource.activeSort;
 
     self.expandable = typeof definition.type === "undefined" || /table|view|struct|array|map/i.test(definition.type);
 
@@ -73,6 +75,10 @@ var AssistDbEntry = (function () {
       return self.entries().length > 0;
     });
 
+    self.assistDbSource.activeSort.subscribe(function (newSort) {
+      self.entries.sort(self.sortFunctions[newSort]);
+    });
+
     self.filteredEntries = ko.pureComputed(function () {
       if (self.filter == null || (self.filter.showTables && self.filter.showTables() && self.filter.showViews() && !self.filter.showActive() && self.filter.query().length === 0)) {
         return self.entries();
@@ -250,10 +256,12 @@ var AssistDbEntry = (function () {
       self.loading(false);
 
       var newEntries = [];
+      var index = 0;
       if (typeof data.tables_meta !== "undefined") {
         newEntries = $.map(data.tables_meta, function(table) {
           return self.createEntry({
             name: table.name,
+            index: index++,
             displayName: table.name,
             title: table.name + (table.comment ? ' - ' + table.comment : ''),
             type: table.type,
@@ -277,6 +285,7 @@ var AssistDbEntry = (function () {
           }
           return self.createEntry({
             name: columnDef.name,
+            index: index++,
             displayName: displayName,
             title: title,
             isColumn: true,
@@ -287,6 +296,7 @@ var AssistDbEntry = (function () {
         newEntries = $.map(data.columns, function(columnName) {
           return self.createEntry({
             name: columnName,
+            index: index++,
             displayName: columnName,
             title: columnName,
             isColumn: true
@@ -297,6 +307,7 @@ var AssistDbEntry = (function () {
           newEntries = [
             self.createEntry({
               name: "key",
+              index: index++,
               displayName: "key (" + data.key.type + ")",
               title: "key (" + data.key.type + ")",
               type: data.key.type,
@@ -304,6 +315,7 @@ var AssistDbEntry = (function () {
             }),
             self.createEntry({
               name: "value",
+              index: index++,
               displayName: "value (" + data.value.type + ")",
               title: "value (" + data.value.type + ")",
               isMapValue: true,
@@ -315,6 +327,7 @@ var AssistDbEntry = (function () {
           newEntries = $.map(data.fields, function(field) {
             return self.createEntry({
               name: field.name,
+              index: index++,
               displayName: field.name + " (" + field.type + ")",
               title: field.name + " (" + field.type + ")",
               type: field.type,
@@ -325,6 +338,7 @@ var AssistDbEntry = (function () {
           newEntries = [
             self.createEntry({
               name: "item",
+              index: index++,
               displayName: "item (" + data.item.type + ")",
               title: "item (" + data.item.type + ")",
               isArray: true,
@@ -340,11 +354,7 @@ var AssistDbEntry = (function () {
         self.entries(newEntries);
         self.entries()[0].open(true);
       } else {
-        if (newEntries.length > 0 && !newEntries[0].definition.isColumn) {
-          newEntries.sort(function (a, b) {
-            return a.definition.name.localeCompare(b.definition.name);
-          });
-        }
+        newEntries.sort(self.sortFunctions[self.assistDbSource.activeSort()]);
         self.entries(newEntries);
       }
       if (typeof callback === 'function') {
@@ -378,7 +388,7 @@ var AssistDbEntry = (function () {
    */
   AssistDbEntry.prototype.createEntry = function (definition) {
     var self = this;
-    return new AssistDbEntry(definition, self, self.assistDbSource, null, self.i18n, self.navigationSettings)
+    return new AssistDbEntry(definition, self, self.assistDbSource, null, self.i18n, self.navigationSettings, self.sortFunctions)
   };
 
   AssistDbEntry.prototype.getHierarchy = function () {

+ 25 - 3
desktop/core/src/desktop/static/desktop/js/assist/assistDbSource.js

@@ -15,6 +15,19 @@
 // limitations under the License.
 
 var AssistDbSource = (function () {
+
+  var sortFunctions = {
+    alpha: function (a, b) {
+      return a.definition.name.localeCompare(b.definition.name);
+    },
+    creation: function (a, b) {
+      if (!a.definition.isColumn || !a.definition.isComplex) {
+        return sortFunctions.alpha(a, b);
+      }
+      return a.definition.index - b.definition.index;
+    }
+  };
+
   /**
    * @param {Object} options
    * @param {Object} options.i18n
@@ -42,6 +55,12 @@ var AssistDbSource = (function () {
 
     self.invalidateOnRefresh = ko.observable('cache');
 
+    self.activeSort = ko.observable('alpha');
+
+    self.activeSort.subscribe(function (newSort) {
+      self.databases.sort(sortFunctions[newSort]);
+    });
+
     self.filter = {
       query: ko.observable("").extend({ rateLimit: 150 })
     };
@@ -124,20 +143,23 @@ var AssistDbSource = (function () {
 
     var updateDatabases = function (names, lastSelectedDb) {
       dbIndex = {};
-      self.databases($.map(names, function(name) {
+      var dbs = $.map(names, function(name) {
         var database = new AssistDbEntry({
           name: name,
           displayName: name,
           title: name,
           isDatabase: true
-        }, null, self, nestedFilter, self.i18n, self.navigationSettings);
+        }, null, self, nestedFilter, self.i18n, self.navigationSettings, sortFunctions);
         dbIndex[name] = database;
         if (name === lastSelectedDb) {
           self.selectedDatabase(database);
           self.selectedDatabaseChanged();
         }
         return database;
-      }));
+      });
+
+      dbs.sort(sortFunctions[self.activeSort()]);
+      self.databases(dbs);
       self.reloading(false);
       self.loading(false);
       self.loaded(true);

+ 7 - 0
desktop/core/src/desktop/templates/assist.mako

@@ -1023,6 +1023,13 @@ from notebook.conf import ENABLE_QUERY_BUILDER
     <div class="assist-db-header-actions">
       <span class="assist-tables-counter">(<span data-bind="text: filteredEntries().length"></span>)</span>
       <!-- ko ifnot: loading -->
+      <!-- ko if: $parent.activeSort -->
+      <a class="inactive-action" data-toggle="dropdown" href="javascript:void(0)"><i class="pointer fa fa-sort" title="${_('Sort')}"></i></a>
+      <ul class="dropdown-menu hue-inner-drop-down" style="top: initial; left: inherit; position: fixed; z-index:10000;">
+        <li><a href="javascript:void(0)" data-bind="click: function () { $parent.activeSort('creation'); }"><i class="fa fa-fw" data-bind="css: { 'fa-check': $parent.activeSort() === 'creation' }"></i> ${ _('Column order') }</a></li>
+        <li><a href="javascript:void(0)" data-bind="click: function () { $parent.activeSort('alpha'); }"><i class="fa fa-fw" data-bind="css: { 'fa-check': $parent.activeSort() === 'alpha' }"></i> ${ _('Alphabetical') }</a></li>
+      </ul>
+      <!-- /ko -->
       <a class="inactive-action" href="javascript:void(0)" data-bind="click: toggleSearch, css: { 'blue' : isSearchVisible }"><i class="pointer fa fa-filter" title="${_('Filter')}"></i></a>
       <!-- ko if: sourceType === 'impala' -->
       <a class="inactive-action" href="javascript:void(0)" data-bind="templatePopover : { contentTemplate: 'ask-for-invalidate-content', titleTemplate: 'ask-for-invalidate-title', trigger: 'click', minWidth: '320px' }"><i class="pointer fa fa-refresh" data-bind="css: { 'fa-spin blue' : loading }" title="${_('Manually refresh the table list')}"></i></a>