Explorar el Código

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 hace 12 años
padre
commit
3f21246
Se han modificado 2 ficheros con 26 adiciones y 13 borrados
  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) {