Bläddra i källkod

HUE-4488 [editor] Show result row detail view

Enrico Berti 9 år sedan
förälder
incheckning
cd0db36

+ 6 - 1
desktop/core/src/desktop/static/desktop/js/jquery.tableextender.js

@@ -193,7 +193,7 @@
       drawFirstColumn(_this);
     }
 
-    $(document).on('click', '.dataTables_wrapper > table tbody tr', function () {
+    $(document).on('click dblclick', '.dataTables_wrapper > table tbody tr', function () {
       $('.dataTables_wrapper > .jHueTableExtenderClonedContainerColumn table tbody tr.selected').removeClass('selected');
       if ($(this).hasClass('selected')) {
         $(this).removeClass('selected');
@@ -203,6 +203,11 @@
         $('.dataTables_wrapper > .jHueTableExtenderClonedContainerColumn table tbody tr:eq('+($(this).index())+')').addClass('selected');
       }
     });
+    $(document).on('dblclick', '.dataTables_wrapper > table tbody tr', function () {
+      if (huePubSub){
+        huePubSub.publish('table.row.dblclick', {idx: $(this).index(), table: $(this).parents('table')});
+      }
+    });
   };
 
   function drawLockedRow(plugin, rowNo, force) {

+ 33 - 0
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -362,6 +362,19 @@ ${ hueIcons.symbols() }
 
 <%def name="commonHTML()">
 
+<div id="detailsModal" class="modal transparent-modal hide" data-backdrop="true" style="width:980px;margin-left:-510px!important">
+  <div class="modal-header">
+    <a data-dismiss="modal" class="pointer pull-right"><i class="fa fa-times"></i></a>
+    <h3>${_('Row details')}</h3>
+  </div>
+  <div class="modal-body">
+    <table class="table table-striped table-condensed">
+
+    </table>
+  </div>
+</div>
+
+
 <div id="helpModal" class="modal transparent-modal hide" data-backdrop="true" style="width:980px;margin-left:-510px!important">
   <div class="modal-header">
     <a data-dismiss="modal" class="pointer pull-right"><i class="fa fa-times"></i></a>
@@ -2886,6 +2899,26 @@ ${ hueIcons.symbols() }
       }
     });
 
+    huePubSub.subscribe('table.row.dblclick', function(data){
+      var $el = $(data.table);
+
+      var $t = $('#detailsModal').find('table');
+      $t.html('');
+
+      var html = '';
+
+      $el.find('thead th').each(function (colIdx, col) {
+        if (colIdx > 0){
+          html += '<tr><th width="10%">' + $(col).text() + '</th><td>' + $el.data('data')[data.idx][colIdx] + '</td></tr>';
+        }
+      });
+
+      $t.html(html);
+
+      $('#detailsModal').modal('show');
+
+    });
+
     window.redrawFixedHeaders = redrawFixedHeaders;
 
     function addAce(content, snippetType) {