Prechádzať zdrojové kódy

HUE-7503 [dashboard] New measure template

Romain Rigaux 8 rokov pred
rodič
commit
c4cbb29770

+ 1 - 3
desktop/libs/dashboard/src/dashboard/static/dashboard/js/search.ko.js

@@ -717,9 +717,7 @@ var Collection = function (vm, collection) {
     }
     if (facet.properties.facets) {
       facet.properties.facets.subscribe(function(newValue) {
-        if (newValue.length > 0) {
-          vm.search();
-        }
+        vm.search();
       });
     }
 

+ 46 - 11
desktop/libs/dashboard/src/dashboard/templates/common_search.mako

@@ -627,7 +627,7 @@ ${ dashboard.layout_skeleton(suffix='search') }
   <!-- /ko -->
   </div>
 
-  ## Dimensions > 1 , visible: !$parents[1].isLoading()
+  ## Dimensions > 1
   <!-- ko if: $root.isEditing -->
   <ul data-bind="sortable: { data: properties.facets, options: { axis: 'x', containment: 'parent', handle: '.title' }}" class="unstyled pull-left white">
     <li class="filter-box">
@@ -642,7 +642,7 @@ ${ dashboard.layout_skeleton(suffix='search') }
       <div class="content">
         <div class="facet-field-cnt">
           <span class="spinedit-cnt">
-            <span data-bind="template: { name: 'metric-form', data: aggregate }"></span>
+            <span data-bind="template: { name: 'measure-form' }"></span>
           </span>
         </div>
 
@@ -675,13 +675,7 @@ ${ dashboard.layout_skeleton(suffix='search') }
         <strong class="hit-title" data-bind="text: field, attr: {'title': field}"></strong>
         <span class="spinedit-cnt">
           <span class="facet-field-label">${ _('Metric') }</span>
-          <span data-bind="template: { name: 'metric-form', data: aggregate }"></span>
-        </span>
-        <span class="spinedit-cnt">
-          <span class="facet-field-label">
-            ${ _('Limit') }
-          </span>
-          <input type="text" class="input-medium" data-bind="spinedit: limit"/>
+          <span data-bind="template: { name: 'measure-form' }"></span>
         </span>
       </div>
     </div>
@@ -2106,6 +2100,47 @@ ${ dashboard.layout_skeleton(suffix='search') }
 </script>
 
 
+<script type="text/html" id="measure-form">
+  ## Facet measure has a slightly different format
+  <!-- ko with: typeof properties != "undefined" ? properties.aggregate : aggregate -->
+
+    <!-- ko if: $root.isEditing -->
+    <div>
+      <select data-bind="options: metrics, optionsText: 'label', optionsValue: 'value', value: $data.function" class="input-small"></select>
+
+      <!-- ko if: $data.function() == 'percentile' -->
+        <!-- ko foreach: percentiles() -->
+          <input type="number" class="input-mini" data-bind="value: value"/>
+          <a href="javascript: void(0)" data-bind="click: function() { $parent.percentiles.remove($data); }">
+            <i class="fa fa-minus" title="${ _('Delete') }"></i>
+          </a>
+        <!-- /ko -->
+        <a href="javascript: void(0)" data-bind="click: function() { percentiles.push(ko.mapping.fromJS({'value': 50})); }">
+          <i class="fa fa-plus" title="${ _('Add') }"></i>
+        </a>
+      <!-- /ko -->
+
+      <select data-bind="options: $root.collection.template.facetFieldsNames, value: $parent.field, optionsCaption: '${ _ko('Field...') }', selectize: $root.collection.template.facetFieldsNames" class="hit-options" style="margin-bottom: 0"></select>
+
+      <div class="clearfix"></div>
+      <br/>
+
+      <input data-bind="value: formula, visible: $parent.field() == 'formula'"></input>
+      <input data-bind="value: generated_formula" type="hidden"></input>
+    </div>
+    <!-- /ko -->
+
+    <!-- ko if: !$root.isEditing() -->
+    <div class="content" style="border: 1px solid #d8d8d8;">
+      <div data-bind="text: getPrettyMetric($data)" class="muted"></div>
+    </div>
+    <!-- /ko -->
+
+  <!-- /ko -->
+</script>
+
+
+
 <script type="text/html" id="metric-form">
   <div data-bind="visible: $root.isEditing">
     <!-- ko if: $data.function() != 'field' && $parent.properties -->
@@ -2884,8 +2919,8 @@ function getHitOption(value) {
   return value;
 }
 
-function getPrettyMetric(facet) {console.log(facet); // .function
-  return getHitOption(facet.function()); // facet. 
+function getPrettyMetric(facet) {
+  return getHitOption(facet.function());
 }
 
 function prettifyDate(from, widget, to) {