Sfoglia il codice sorgente

HUE-4464 [editor] Result column quick scroll does not scroll with a search

Enrico Berti 9 anni fa
parent
commit
fb7988070c

+ 2 - 1
desktop/core/src/desktop/static/desktop/js/jquery.horizontalscrollbar.js

@@ -33,7 +33,7 @@
 
   function initWhenReady(el) {
     if ($(el).parents('.dataTables_wrapper').length > 0) {
-      var colWidth = $(el).parents('.dataTables_wrapper').find('.jHueTableExtenderClonedContainerColumn').width() + 5;
+      var colWidth = $(el).find('thead tr th').width() + 5;
       if ($(el).parents('.dataTables_wrapper').find('.hue-scrollbar-x-rail').length == 0 && $(el).parents('.dataTables_wrapper').width() < $(el).parents('.dataTables_wrapper')[0].scrollWidth) {
         $('.hue-scrollbar-x-rail').remove();
         var scrollbarRail = $('<div>');
@@ -78,6 +78,7 @@
 
         var scrollbarRail = $(el).parents('.dataTables_wrapper').find('.hue-scrollbar-x-rail');
         scrollbarRail.width($(el).parents(".dataTables_wrapper").width() - colWidth);
+        scrollbarRail.css("marginLeft", (colWidth) + "px");
         scrollbar.css("left", ((scrollbarRail.width() - scrollbar.width()) * ($(el).parents('.dataTables_wrapper').scrollLeft() / ($(el).parents('.dataTables_wrapper')[0].scrollWidth - $(el).parents('.dataTables_wrapper').width()))) + "px");
       }
     }

+ 17 - 7
desktop/core/src/desktop/static/desktop/js/jquery.huedatatable.js

@@ -54,7 +54,7 @@
           if ($(this).position().left > 0 && startCol == -1){
             startCol = i;
           }
-          if ($(this).position().left < $t.parent().width() + 10){
+          if ($(this).position().left < $t.parent().width() + $t.parent().position().left){
             endCol = i;
           }
         });
@@ -119,18 +119,28 @@
               appendable.children().eq(i).html(html);
             }
 
+            if ($t.data('scrollToCol')){
+              var colSel = $t.find("tr th:nth-child(" + ($t.data('scrollToCol') + 1) + ")");
+              $t.parent().animate({
+                scrollLeft: colSel.position().left + $t.parent().scrollLeft() - $t.parent().offset().left - 30
+              }, 300);
+              colSel = $t.find("tr td:nth-child(" + ($t.data('scrollToCol') + 1) + ")");
+              colSel.addClass("columnSelected");
+              $t.data('scrollToCol', null);
+            }
+
             if ($t.data('plugin_jHueTableExtender')) {
               $t.data('plugin_jHueTableExtender').drawHeader(typeof force === 'undefined');
               $t.data('plugin_jHueTableExtender').drawLockedRows();
             }
 
-            $t.data('fnDraws', $t.data('fnDraws') + 1);
-            if ($t.data('oInit')['fnDrawCallback']) {
-              $t.data('oInit')['fnDrawCallback']();
-            }
-
-            $t.trigger('headerpadding');
           }
+          $t.data('fnDraws', $t.data('fnDraws') + 1);
+          if ($t.data('oInit')['fnDrawCallback']) {
+            $t.data('oInit')['fnDrawCallback']();
+          }
+
+          $t.trigger('headerpadding');
 
         self.isDrawing = false;
       }

+ 5 - 4
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -1611,7 +1611,7 @@ ${ hueIcons.symbols() }
         <span class="inactive-action pull-right" href="javascript:void(0)" data-bind="click: function(){ result.isMetaFilterVisible(true); }, css: { 'blue' : result.isMetaFilterVisible }"><i class="pointer fa fa-search" title="${ _('Search') }"></i></span>
         <input class="all-meta-checked no-margin-top" type="checkbox" data-bind="enable: !result.isMetaFilterVisible() && result.filteredMeta().length > 0, event: { change: function(){ toggleAllColumns($element, $data); result.clickFilteredMetaCheck() } }, checked: result.filteredMetaChecked" />
         <span class="meta-title pointer" data-bind="click: toggleResultSettings">${_('columns')}</span>
-        (<span class="meta-title pointer" data-bind="click: toggleResultSettings, text: Math.max(0, result.filteredMeta().length - 1)"></span>)
+        (<span class="meta-title pointer" data-bind="click: toggleResultSettings, text: result.filteredMeta().length"></span>)
       </li>
     </ul>
     <input class="meta-filter" type="text" data-bind="visible: result.isMetaFilterVisible, blurHide: result.isMetaFilterVisible, clearable: result.metaFilter, valueUpdate:'afterkeydown'" placeholder="${ _('Filter columns...') }" style="margin-bottom: 10px"/>
@@ -2354,19 +2354,20 @@ ${ hueIcons.symbols() }
     dt.fnSetColumnVis(index, linkElement.checked);
   }
 
-  function scrollToColumn(linkElement) {
+  function scrollToColumn(linkElement, index) {
     var _t = $(linkElement).parents(".snippet").find("table.resultTable:eq(0)");
-    var _text = $.trim($(linkElement).text().split("(")[0]);
+    var _text = $.trim($(linkElement).text().split(" ")[0]);
     var _col = _t.find("th").filter(function () {
       return $.trim($(this).text()) == _text;
     });
     _t.find(".columnSelected").removeClass("columnSelected");
-    var _colSel = _t.find("tr td:nth-child(" + (_col.index() + 1) + ")");
+    var _colSel = _t.find("tr th:nth-child(" + (_col.index() + 1) + ")");
     if (_colSel.length > 0) {
       _colSel.addClass("columnSelected");
       _t.parent().animate({
         scrollLeft: _colSel.position().left + _t.parent().scrollLeft() - _t.parent().offset().left - 30
       }, 300, function(){
+        _t.data('scrollToCol', _col.index());
         _t.parent().trigger('scroll');
       });
     }