瀏覽代碼

HUE-6387 [assist] Add filter to the HDFS panel

Johan Ahlen 8 年之前
父節點
當前提交
56fbb85

文件差異過大導致無法顯示
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


文件差異過大導致無法顯示
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


+ 5 - 1
desktop/core/src/desktop/static/desktop/js/apiHelper.js

@@ -366,10 +366,14 @@ var ApiHelper = (function () {
    * @param {string[]} options.pathParts
    * @param {number} [options.pageSize] - Default 500
    * @param {number} [options.page] - Default 1
+   * @param {string} [options.filter]
    */
   ApiHelper.prototype.fetchHdfsPath = function (options) {
     var self = this;
     var url = HDFS_API_PREFIX + "/" + options.pathParts.join("/") + '?format=json&sortby=name&descending=false&pagesize=' + (options.pageSize || 500) + '&pagenum=' + (options.page || 1);
+    if (options.filter) {
+      url += '&filter=' + options.filter;
+    }
     var fetchFunction = function (storeInCache) {
       if (options.timeout === 0) {
         self.assistErrorCallback(options)({ status: -1 });
@@ -381,7 +385,7 @@ var ApiHelper = (function () {
         timeout: options.timeout,
         success: function (data) {
           if (!data.error && !self.successResponseIsError(data) && typeof data.files !== 'undefined' && data.files !== null) {
-            if (data.files.length > 2) {
+            if (data.files.length > 2 && !options.filter) {
               storeInCache(data);
             }
             options.successCallback(data);

+ 15 - 0
desktop/core/src/desktop/static/desktop/js/assist/assistHdfsEntry.js

@@ -44,6 +44,19 @@ var AssistHdfsEntry = (function () {
     self.currentPage = 1;
     self.hasMorePages = true;
 
+    self.isFilterVisible = ko.observable(false);
+    self.filter = ko.observable('').extend({ rateLimit: 400 });
+
+    self.isFilterVisible.subscribe(function (newValue) {
+      if (!newValue && self.filter()) {
+        self.filter('');
+      }
+    });
+
+    self.filter.subscribe(function () {
+      self.loadEntries();
+    });
+
     self.entries = ko.observableArray([]);
 
     self.loaded = false;
@@ -106,6 +119,7 @@ var AssistHdfsEntry = (function () {
     self.apiHelper.fetchHdfsPath({
       pageSize: PAGE_SIZE,
       page: self.currentPage,
+      filter: self.isFilterVisible() && self.filter().trim() ? self.filter() : undefined,
       pathParts: self.getHierarchy(),
       successCallback: successCallback,
       errorCallback: errorCallback
@@ -181,6 +195,7 @@ var AssistHdfsEntry = (function () {
     self.apiHelper.fetchHdfsPath({
       pageSize: PAGE_SIZE,
       page: self.currentPage,
+      filter: self.isFilterVisible() && self.filter().trim() ? self.filter() : undefined,
       pathParts: self.getHierarchy(),
       successCallback: function (data) {
         self.hasMorePages = data.page.next_page_number > self.currentPage;

+ 1 - 0
desktop/core/src/desktop/static/desktop/less/hue-assist.less

@@ -491,6 +491,7 @@
   white-space: nowrap;
 }
 
+.assist-flex-hdfs-search,
 .assist-flex-function-search {
   overflow: hidden;
   position: relative;

+ 5 - 1
desktop/core/src/desktop/templates/assist.mako

@@ -430,6 +430,7 @@ from notebook.conf import get_ordered_interpreters
   <script type="text/html" id="assist-hdfs-header-actions">
     <div class="assist-db-header-actions">
       <a class="inactive-action" href="javascript:void(0)" data-bind="click: goHome" title="Go to ${ home_dir }"><i class="pointer fa fa-home"></i></a>
+      <a class="inactive-action" href="javascript:void(0)" data-bind="toggle: isFilterVisible, css: { 'blue': isFilterVisible }" title="Filter"><i class="pointer fa fa-filter"></i></a>
       <a class="inactive-action" href="javascript:void(0)" data-bind="click: function () { huePubSub.publish('assist.hdfs.refresh'); }" title="${_('Manual refresh')}"><i class="pointer fa fa-refresh" data-bind="css: { 'fa-spin blue' : loading }"></i></a>
     </div>
   </script>
@@ -452,6 +453,9 @@ from notebook.conf import get_ordered_interpreters
       <!-- /ko -->
       <!-- ko template: 'assist-hdfs-header-actions' --><!-- /ko -->
     </div>
+    <div class="assist-flex-hdfs-search" data-bind="visible: isFilterVisible()">
+      <div class="assist-filter"><input class="clearable" type="text" placeholder="${ _('Filter...') }" data-bind="clearable: filter, value: filter, valueUpdate: 'afterkeydown'"/></div>
+    </div>
     <div class="assist-flex-fill assist-hdfs-scrollable">
       <div data-bind="visible: ! loading() && ! hasErrors()" style="position: relative;">
         <!-- ko hueSpinner: { spin: loadingMore, overlay: true } --><!-- /ko -->
@@ -476,7 +480,7 @@ from notebook.conf import get_ordered_interpreters
         </ul>
         <!-- ko if: !loading() && entries().length === 0 -->
         <ul class="assist-tables">
-          <li class="assist-entry"><span class="assist-no-entries">${_('Empty directory')}</span></li>
+          <li class="assist-entry"><span class="assist-no-entries"><!-- ko if: filter() -->${_('No results found')}<!-- /ko --><!-- ko ifnot: filter() -->${_('Empty directory')}<!-- /ko --></span></li>
         </ul>
         <!-- /ko -->
       </div>

部分文件因文件數量過多而無法顯示