Ver código fonte

HUE-7820 [autocomplete] Add a component to show a mini context panel for a catalog entry

Johan Ahlen 7 anos atrás
pai
commit
143c693

Diferenças do arquivo suprimidas por serem muito extensas
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue-embedded.css


Diferenças do arquivo suprimidas por serem muito extensas
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


Diferenças do arquivo suprimidas por serem muito extensas
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


+ 3 - 3
desktop/core/src/desktop/static/desktop/js/sqlAutocompleter3.js

@@ -1341,11 +1341,11 @@ var AutocompleteResults = (function () {
             tablesDeferred.done(function (tableSuggestions) {
               tableSuggestions.forEach(function (suggestion) {
                 if (popularityIndex[suggestion.details.name]) {
-                  var relativePopularity = Math.round(100 * suggestion.details.navOptMeta.popularity / totalPopularity);
-                  if (relativePopularity >= 5) {
+                  suggestion.relativePopularity = Math.round(100 * suggestion.details.navOptMeta.popularity / totalPopularity);
+                  if (suggestion.relativePopularity >= 5) {
                     suggestion.popular(true);
                   }
-                  suggestion.weightAdjust = relativePopularity;
+                  suggestion.weightAdjust = suggestion.relativePopularity;
                 }
               });
               popularTablesDeferred.resolve();

+ 27 - 2
desktop/core/src/desktop/static/desktop/less/hue-autocomplete.less

@@ -52,6 +52,7 @@
 
 .autocompleter-header {
   .flex(0 0 20px);
+  position:relative;
   padding: 5px;
   background-color: @cui-gray-050;
   line-height: 20px;
@@ -61,6 +62,14 @@
   text-overflow: ellipsis;
 }
 
+.autocompleter-header-popularity {
+  position: absolute;
+  top: 5px;
+  right: 5px;
+  width: 19px;
+  height: 19px;
+}
+
 .autocompleter-spinner {
   position: relative;
   float: right;
@@ -170,18 +179,34 @@
 .autocompleter-details-contents .details-comment,
 .autocompleter-details-contents .details-description {
   margin-top: 5px;
+  margin-bottom: 5px;
   color: @cui-gray-700;
 }
 
-.autocompleter-details-contents .details-comment {
+.autocompleter-details-contents .details-header {
+  font-size: 14px;
+  font-weight: bold;
+  margin: 2px 0;
+}
+
+.autocompleter-details-contents .details-no-comment {
+  margin-top: 5px;
+  margin-bottom: 5px;
+  font-size: 13px;
+  color: @cui-gray-700;
   font-style: italic;
 }
+.autocompleter-details-contents .details-comment * {
+  font-size: 13px !important;
+  line-height: 14px !important;
+}
 
 .autocompleter-details-contents .details-code {
   background-color: @cui-gray-050;
   padding:3px;
   color: @cui-gray-700;
-  font: 12px/normal @font-family-monospace;direction: ltr;
+  font: 12px/normal @font-family-monospace;
+  direction: ltr;
 }
 
 .fn-details {

+ 36 - 0
desktop/core/src/desktop/templates/hue_ace_autocompleter.mako

@@ -607,4 +607,40 @@ from desktop.views import _ko
       });
     })();
   </script>
+
+  <script type="text/html" id="data-catalog-mini-context">
+    <!-- ko if: comment() -->
+    <div class="details-comment" data-bind="html: comment"></div>
+    <!-- /ko -->
+    <!-- ko ifnot: comment() -->
+    <div class="details-no-comment">
+      ${ _('No description') }
+    </div>
+    <!-- /ko -->
+  </script>
+
+
+  <script type="text/javascript">
+    (function () {
+      function DataCatalogMiniContext (params) {
+        var self = this;
+        var catalogEntry = params.catalogEntry;
+        self.filter = params.filter;
+        self.comment = ko.observable();
+        self.popularity = ko.observable();
+
+        // TODO: Load nav comment with 1 sec delay if not there
+        catalogEntry.getComment({ cacheOnly: true }).done(self.comment);
+
+        if (catalogEntry.navOptMeta && catalogEntry.navOptMeta.relativePopularity) {
+          self.popularity(catalogEntry.navOptMeta.relativePopularity);
+        }
+      }
+
+      ko.components.register('dataCatalogMiniContext', {
+        viewModel: DataCatalogMiniContext,
+        template: { element: 'data-catalog-mini-context' }
+      });
+    })();
+  </script>
 </%def>

Alguns arquivos não foram mostrados porque muitos arquivos mudaram nesse diff