');
- for (var i = 0; i < data.columns.length; i++) {
- var column = data.columns[i];
- var colElem = $('
' + column.text + '
');
- rowElem.append(colElem);
- }
-
- var headElem = $('');
- headElem.append(rowElem);
- headElem.appendTo(tableElem);
- }
-
function createColumnFormater(style) {
return function(v) {
if (v === null || v === void 0) {
@@ -50,12 +37,23 @@ export function tablePanel() {
if (_.isString(v) || !style) {
return v;
}
+
if (style.type === 'date') {
+ if (_.isArray(v)) { v = v[0]; }
var date = moment(v);
return date.format(style.dateFormat);
}
- let valueFormater = kbn.valueFormats[style.unit];
- return valueFormater(v, style.decimals);
+
+ if (_.isNumber(v) && style.type === 'number') {
+ let valueFormater = kbn.valueFormats[style.unit];
+ return valueFormater(v, style.decimals);
+ }
+
+ if (_.isArray(v)) {
+ v = v.join(', ');
+ }
+
+ return v;
};
}
diff --git a/public/app/panels/table/renderer.ts b/public/app/panels/table/renderer.ts
new file mode 100644
index 00000000000..c3b09ee45da
--- /dev/null
+++ b/public/app/panels/table/renderer.ts
@@ -0,0 +1,31 @@
+
+export class TableRenderer {
+ constructor(private panel, private table) {
+ }
+
+ formatColumnValue(columnIndex, value) {
+ return "value";
+ }
+
+ renderCell(columnIndex, value) {
+ var colValue = this.formatColumnValue(columnIndex, value);
+ return '
' + colValue + '
';
+ }
+
+ render(page) {
+ let endPos = Math.min(this.panel.pageSize, this.table.rows.length);
+ let startPos = 0;
+ var html = "";
+
+ for (var y = startPos; y < endPos; y++) {
+ let row = this.table.rows[y];
+ html += '
';
+ for (var i = 0; i < this.table.columns.length; i++) {
+ html += this.renderCell(i, row[i]);
+ }
+ html += '
';
+ }
+
+ return html;
+ }
+}
diff --git a/public/app/panels/table/specs/renderer_specs.ts b/public/app/panels/table/specs/renderer_specs.ts
new file mode 100644
index 00000000000..c4c5ff5d3c3
--- /dev/null
+++ b/public/app/panels/table/specs/renderer_specs.ts
@@ -0,0 +1,25 @@
+import {describe, beforeEach, it, sinon, expect} from 'test/lib/common';
+
+import {TableModel} from '../table_model';
+import {TableRenderer} from '../renderer';
+
+describe('when rendering table', () => {
+ describe('given 2 columns', () => {
+ var table = new TableModel();
+ table.columns = [{text: 'Time'}, {text: 'Value'}];
+ table.rows.push([1446733230253, 12.4]);
+ table.rows.push([1446733231253, 10.4]);
+
+ var panel = {
+ pageSize: 10
+ };
+
+ it('render should return html', () => {
+ var html = new TableRenderer(panel, table).render(0);
+ expect(html).to.be('