Просмотр исходного кода

[assist] KO'ified the samples table

Enrico Berti 10 лет назад
Родитель
Сommit
e78c58d

+ 0 - 27
apps/beeswax/src/beeswax/templates/execute.mako

@@ -728,29 +728,6 @@ ${ layout.menubar(section='query') }
       <button data-bind="click: trySaveResults" class="btn btn-primary disable-feedback">${_('Save')}</button>
     </div>
   </div>
-
-  <div id="navigatorQuicklook" class="modal hide fade">
-    <div class="modal-header">
-      <a href="#" class="close" data-dismiss="modal">&times;</a>
-      % if has_metastore:
-      <a class="tableLink pull-right" href="#" target="_blank" style="margin-right: 20px;margin-top:6px">
-        <i class="fa fa-external-link"></i> ${ _('View in Metastore Browser') }
-      </a>
-      % endif
-
-      <h3>${_('Data sample for')} <span class="tableName"></span></h3>
-    </div>
-    <div class="modal-body" style="min-height: 100px">
-      <div class="loader">
-        <!--[if !IE]><!--><i class="fa fa-spinner fa-spin" style="font-size: 30px; color: #DDD"></i><!--<![endif]-->
-        <!--[if IE]><img src="${ static('desktop/art/spinner.gif') }"/><![endif]-->
-      </div>
-      <div class="sample"></div>
-    </div>
-    <div class="modal-footer">
-      <button class="btn btn-primary disable-feedback" data-dismiss="modal">${_('Ok')}</button>
-    </div>
-  </div>
 </div>
 
 
@@ -1316,10 +1293,6 @@ $(document).ready(function () {
 
   renderRecent();
 
-  $("#navigatorQuicklook").modal({
-    show: false
-  });
-
   $("#navigatorSearch").jHueDelayedInput(function(){
     $("#navigatorTables li").removeClass("hide");
     $("#navigatorTables li").each(function () {

+ 2 - 2
apps/metastore/src/metastore/templates/describe_table.mako

@@ -91,7 +91,7 @@ ${ assist.assistPanel() }
     <tbody data-bind="foreach: $data">
       <tr>
         ## start at 0
-        <td data-bind="text: $index()"></td>
+        <td data-bind="text: $index()+1"></td>
         ## no stats for partition key type
         <td>
          <span class="blue" data-bind="component: { name: 'table-stats', params: {
@@ -168,7 +168,7 @@ ${ assist.assistPanel() }
       <tbody>
         <!-- ko foreach: rows -->
           <tr>
-            <td data-bind="text: $index"></td>
+            <td data-bind="text: $index()+1"></td>
             <!-- ko foreach: $data -->
               <td data-bind="text: $data"></td>
             <!-- /ko -->

+ 4 - 3
desktop/core/src/desktop/static/desktop/js/assist/assistEntry.js

@@ -286,7 +286,8 @@
 
     $assistQuickLook.find(".tableName").text(self.definition.name);
     $assistQuickLook.find(".tableLink").attr("href", "/metastore/table/" + databaseName + "/" + tableName);
-    $assistQuickLook.find(".sample").empty("");
+    self.assistSource.loadingSamples(true);
+    self.assistSource.samples({});
     $assistQuickLook.attr("style", "width: " + ($(window).width() - 120) + "px;margin-left:-" + (($(window).width() - 80) / 2) + "px!important;");
 
     self.assistSource.assistHelper.fetchTableSample({
@@ -295,8 +296,8 @@
       tableName: tableName,
       dataType: "html",
       successCallback: function(data) {
-        $assistQuickLook.find(".loader").hide();
-        $assistQuickLook.find(".sample").html(data);
+        self.assistSource.samples(data);
+        self.assistSource.loadingSamples(false);
       },
       errorCallback: function(e) {
         if (e.status == 500) {

+ 3 - 0
desktop/core/src/desktop/static/desktop/js/assist/assistSource.js

@@ -65,6 +65,9 @@
       return typeof self.selectedDatabase() != "undefined" && self.selectedDatabase() !== null && self.selectedDatabase().loading();
     });
 
+    self.loadingSamples = ko.observable(true);
+    self.samples = ko.observable();
+
     self.selectedDatabase.subscribe(function (newValue) {
       if (newValue) {
         if (self.selectedDatabase() && self.selectedDatabase().definition.name === newValue) {

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

@@ -263,11 +263,41 @@ from desktop.views import _ko
         <h3>${_('Data sample for')} <span class="tableName"></span></h3>
       </div>
       <div class="modal-body" style="min-height: 100px">
+        <!-- ko if: assistSource.loadingSamples -->
         <div class="loader">
           <!--[if !IE]><!--><i class="fa fa-spinner fa-spin" style="font-size: 30px; color: #DDD"></i><!--<![endif]-->
           <!--[if IE]><img src="${ static('desktop/art/spinner.gif') }"/><![endif]-->
         </div>
-        <div class="sample"></div>
+        <!-- /ko -->
+        <!-- ko ifnot: assistSource.loadingSamples -->
+        <div style="overflow: auto">
+          <!-- ko with: assistSource.samples -->
+          <!-- ko if: rows.length == 0 -->
+          <div class="alert">${ _('The selected table has no data.') }</div>
+          <!-- /ko -->
+          <!-- ko if: rows.length > 0 -->
+          <table class="table table-striped table-condensed">
+            <tr>
+              <th style="width: 10px"></th>
+              <!-- ko foreach: headers -->
+              <th data-bind="text: $data"></th>
+              <!-- /ko -->
+            </tr>
+            <tbody>
+              <!-- ko foreach: rows -->
+                <tr>
+                  <td data-bind="text: $index()+1"></td>
+                  <!-- ko foreach: $data -->
+                    <td data-bind="text: $data"></td>
+                  <!-- /ko -->
+                </tr>
+              <!-- /ko -->
+            </tbody>
+          </table>
+          <!-- /ko -->
+          <!-- /ko -->
+        </div>
+        <!-- /ko -->
       </div>
       <div class="modal-footer">
         <button class="btn btn-primary disable-feedback" data-dismiss="modal">${_('Ok')}</button>