浏览代码

HUE-1778 [dbquery] Query hangs with MySql

The query hangs because the browser is busy trying to add DOM
elements for over 1000 rows. Also, datatables is trying to manage
more DOM elements than it seemingly can. Added infinite scrolling
without backend to fix this.
Abraham Elmahrek 12 年之前
父节点
当前提交
3f21246b87
共有 2 个文件被更改,包括 26 次插入13 次删除
  1. 24 5
      apps/rdbms/src/rdbms/templates/execute.mako
  2. 2 8
      apps/rdbms/static/js/rdbms.vm.js

+ 24 - 5
apps/rdbms/src/rdbms/templates/execute.mako

@@ -119,11 +119,6 @@ ${ commonheader(_('Query'), app_name, user) | n,unicode }
               <th data-bind="text: $data"></th>
             </tr>
           </thead>
-          <tbody data-bind="foreach: rows">
-            <tr data-bind="foreach: $data">
-              <td data-bind="text: $data"></td>
-            </tr>
-          </tbody>
         </table>
       </div>
     </div>
@@ -722,6 +717,7 @@ ${ commonheader(_('Query'), app_name, user) | n,unicode }
   var dataTable = null;
   function cleanResultsTable() {
     if (dataTable) {
+      dataTable.fnClearTable();
       dataTable.fnDestroy();
       viewModel.columns.valueHasMutated();
       viewModel.rows.valueHasMutated();
@@ -729,6 +725,16 @@ ${ commonheader(_('Query'), app_name, user) | n,unicode }
     }
   }
 
+  function addResults(viewModel, dataTable, index, pageSize) {
+    $.each(viewModel.rows.slice(index, index+pageSize), function(row_index, row) {
+      var ordered_row = [];
+      $.each(viewModel.columns(), function(col_index, col) {
+        ordered_row.push(row[col]);
+      });
+      dataTable.fnAddData(ordered_row);
+    });
+  }
+
   function resultsTable() {
     if (!dataTable) {
       dataTable = $(".resultTable").dataTable({
@@ -750,6 +756,19 @@ ${ commonheader(_('Query'), app_name, user) | n,unicode }
       $(".dataTables_filter").hide();
       $(".dataTables_wrapper").jHueTableScroller();
 
+      // Automatic results grower
+      var dataTableEl = $(".dataTables_wrapper");
+      var index = 0;
+      var pageSize = 100;
+      dataTableEl.on("scroll", function (e) {
+        if (dataTableEl.scrollTop() + dataTableEl.outerHeight() + 20 > dataTableEl[0].scrollHeight && dataTable) {
+          addResults(viewModel, dataTable, index, pageSize);
+          index += pageSize;
+        }
+      });
+      addResults(viewModel, dataTable, index, pageSize);
+      index += pageSize;
+
       $(".resultTable").width($(".resultTable").parent().width());
     }
   }

+ 2 - 8
apps/rdbms/static/js/rdbms.vm.js

@@ -79,14 +79,8 @@ function RdbmsViewModel() {
     var rows = [];
     self.columns.removeAll();  // Needed for datatables to refresh properly.
     self.columns(results.columns);
-    $.each(results.rows, function(i, result_row) {
-      var row = [];
-      $.each(self.columns(), function(j, column) {
-        row.push(result_row[column]);
-      });
-      rows.push(row);
-    });
-    self.rows(rows);
+    self.rows.removeAll();
+    self.rows(results.rows);
   };
 
   self.updateServers = function(servers) {