浏览代码

[impala] Adding columns to dashboard

Romain Rigaux 11 年之前
父节点
当前提交
86e0a2e

+ 13 - 2
apps/impala/src/impala/templates/dashboard.mako

@@ -95,7 +95,8 @@ ${ commonheader(None, "impala", user) | n,unicode }
 
   <form class="form-search" style="margin: 0" data-bind="submit: search">
     <strong>${_("Search")}</strong>
-    <div class="input-append">
+    <span data-bind="text: $root.dashboard.properties()[0].database"></span>.<span data-bind="text: $root.dashboard.properties()[0].table"></span>
+      <div class="input-append">
 
       <span data-bind="foreach: query.qs">
         <input data-bind="clearable: q" maxlength="4096" type="text" class="search-query input-xlarge">
@@ -107,7 +108,7 @@ ${ commonheader(None, "impala", user) | n,unicode }
   ##    <a class="btn" href="javascript:void(0)" data-bind="click: $root.query.addQ"><i class="fa fa-plus"></i></a>
 
       <button type="submit" id="search-btn" class="btn btn-inverse" style="margin-left:10px"><i class="fa fa-search"></i></button>
-    </div>
+      </div>
   </form>
 </div>
 
@@ -119,6 +120,12 @@ ${ dashboard.layout_skeleton() }
 <div id="result-main" style="overflow-x: auto">
   <table id="result-container" style="margin-top: 0; width: 100%">
     <thead>
+      <tr>
+        <th style="width: 18px">&nbsp;</th>
+        <!-- ko foreach: $root.results_cols -->
+          <th data-bind="text: $data"></th>       
+        <!-- /ko -->
+      </tr>
     </thead>
     <tbody data-bind="foreach: { data: $root.results, as: 'row'}" class="result-tbody">
       <tr class="result-row">
@@ -141,6 +148,8 @@ ${ dashboard.layout_skeleton() }
   <div class="row-fluid" data-bind="with: $root.getFacetFromResult(id())">
     <div data-bind="visible: $root.isEditing, with: $root.dashboard.getFacetById($parent.id())" style="margin-bottom: 20px">
       <input type="text" data-bind="value: properties.limit" />
+      <input type="text" data-bind="value: field" />
+      <input type="text" data-bind="value: properties.limit" />
     </div>
   
     <span data-bind="foreach: data()">
@@ -186,6 +195,8 @@ ${ dashboard.import_charts() }
 
   var viewModel = new TestViewModel(${ query_json | n,unicode }, ${ dashboard_json | n,unicode  });
   ko.applyBindings(viewModel);
+  
+  viewModel.init();
 </script>
 
 ${ commonfooter(messages) | n,unicode }

+ 4 - 2
apps/impala/src/impala/views.py

@@ -46,7 +46,7 @@ def dashboard(request):
          ],
         'facets': [{'id': '52f07188-f30f-1296-2450-f77e02e1a5c1', 'label': 'Top salaries', 'field': 'salary', 'widget_type': 'pie', 
                     'properties': {'limit': 10}}],
-        'properties': {'database': 'default', 'table': 'sample_07'}
+        'properties': [{'database': 'default', 'table': 'sample_07'}]
         }), 
                                             # type: MAX, / ORDER BY, LIMIT 100
   })
@@ -77,7 +77,9 @@ def query(request):
   handle = db.execute_and_wait(query, timeout_sec=5.0)
 
   if handle:
-    result['data'] = list(db.fetch(handle, rows=100).rows())
+    data = db.fetch(handle, rows=100)
+    result['data'] = list(data.rows())
+    result['cols'] = list(data.cols())
     result['status'] = 0
     db.close(handle)
     

+ 17 - 9
apps/impala/static/js/impala-dashboard.ko.js

@@ -99,9 +99,9 @@ var Dashboard = function (vm, dashboard) {
   var self = this;
   
   self.facets = ko.observable(dashboard.facets);
+  self.properties = ko.observable(dashboard.properties);
   
   self.addFacet = function(data) {
-    
   }
   
   self.getFacetById = function (facet_id) {
@@ -118,7 +118,8 @@ var Dashboard = function (vm, dashboard) {
 
 var TestViewModel = function (query_json, dashboard_json) {
     var self = this;
-    self.isEditing = ko.observable(false);
+
+    self.isEditing = ko.observable(true);
     self.toggleEditing = function () {
       self.isEditing(! self.isEditing());
     };
@@ -129,19 +130,25 @@ var TestViewModel = function (query_json, dashboard_json) {
 
     self.query = new Query(self, query_json);
     self.dashboard = new Dashboard(self, dashboard_json);
+
     self.results = ko.observableArray([]);
     self.results_facet = ko.observableArray([]);
+    self.results_cols = ko.observableArray([]);
 
+    self.init = function() {
+      self.search();
+    }
+    
     self.search = function (callback) {
       self.results.removeAll();
     	
       var multiQs = $.map(self.dashboard.facets(), function(facet) {
-            return $.post("/impala/query", {
-                "query": ko.mapping.toJSON(self.query),
-                "dashboard": ko.mapping.toJSON(self.dashboard),
-                "layout": ko.mapping.toJSON(self.columns),
-                "facet": ko.mapping.toJSON(facet),
-              }, function (data) {return data});
+        return $.post("/impala/query", {
+           "query": ko.mapping.toJSON(self.query),
+           "dashboard": ko.mapping.toJSON(self.dashboard),
+           "layout": ko.mapping.toJSON(self.columns),
+           "facet": ko.mapping.toJSON(facet),
+        }, function (data) {return data});
       });    	
     	
       $.when.apply($, [
@@ -151,6 +158,7 @@ var TestViewModel = function (query_json, dashboard_json) {
             "layout": ko.mapping.toJSON(self.columns),
             }, function (data) {
               if (data.status == 0) {
+            	self.results_cols(data.cols)
             	$.each(data.data, function (index, row) {
             	  self.results.push(row);
             	});
@@ -167,7 +175,7 @@ var TestViewModel = function (query_json, dashboard_json) {
               removeFrom(self.results_facet, facet.id);
               self.results_facet.push(ko.mapping.fromJS(facet));
             }
-          }
+          }          
         })
       .fail(function (xhr, textStatus, errorThrown) {
     	  $(document).trigger("error", data.message);