controller.ts 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. ///<reference path="../../../headers/common.d.ts" />
  2. import angular from 'angular';
  3. import _ from 'lodash';
  4. import moment from 'moment';
  5. import * as FileExport from 'app/core/utils/file_export';
  6. import PanelMeta from 'app/features/panel/panel_meta2';
  7. import {transformDataToTable} from './transformers';
  8. export class TablePanelCtrl {
  9. /** @ngInject */
  10. constructor($scope, $rootScope, $q, panelSrv, panelHelper, annotationsSrv) {
  11. $scope.ctrl = this;
  12. $scope.pageIndex = 0;
  13. $scope.panelMeta = new PanelMeta({
  14. panelName: 'Table',
  15. editIcon: "fa fa-table",
  16. fullscreen: true,
  17. metricsEditor: true,
  18. });
  19. $scope.panelMeta.addEditorTab('Options', 'app/plugins/panel/table/options.html');
  20. $scope.panelMeta.addEditorTab('Time range', 'app/features/panel/partials/panelTime.html');
  21. $scope.panelMeta.addExtendedMenuItem('Export CSV', '', 'exportCsv()');
  22. var panelDefaults = {
  23. targets: [{}],
  24. transform: 'timeseries_to_columns',
  25. pageSize: null,
  26. showHeader: true,
  27. styles: [
  28. {
  29. type: 'date',
  30. pattern: 'Time',
  31. dateFormat: 'YYYY-MM-DD HH:mm:ss',
  32. },
  33. {
  34. unit: 'short',
  35. type: 'number',
  36. decimals: 2,
  37. colors: ["rgba(245, 54, 54, 0.9)", "rgba(237, 129, 40, 0.89)", "rgba(50, 172, 45, 0.97)"],
  38. colorMode: null,
  39. pattern: '/.*/',
  40. thresholds: [],
  41. }
  42. ],
  43. columns: [],
  44. scroll: true,
  45. fontSize: '100%',
  46. sort: {col: 0, desc: true},
  47. };
  48. $scope.init = function() {
  49. if ($scope.panel.styles === void 0) {
  50. $scope.panel.styles = $scope.panel.columns;
  51. $scope.panel.columns = $scope.panel.fields;
  52. delete $scope.panel.columns;
  53. delete $scope.panel.fields;
  54. }
  55. _.defaults($scope.panel, panelDefaults);
  56. panelSrv.init($scope);
  57. };
  58. $scope.refreshData = function(datasource) {
  59. panelHelper.updateTimeRange($scope);
  60. $scope.pageIndex = 0;
  61. if ($scope.panel.transform === 'annotations') {
  62. return annotationsSrv.getAnnotations($scope.dashboard).then(annotations => {
  63. $scope.dataRaw = annotations;
  64. $scope.render();
  65. });
  66. }
  67. return panelHelper.issueMetricQuery($scope, datasource)
  68. .then($scope.dataHandler, function(err) {
  69. $scope.render();
  70. throw err;
  71. });
  72. };
  73. $scope.toggleColumnSort = function(col, colIndex) {
  74. if ($scope.panel.sort.col === colIndex) {
  75. if ($scope.panel.sort.desc) {
  76. $scope.panel.sort.desc = false;
  77. } else {
  78. $scope.panel.sort.col = null;
  79. }
  80. } else {
  81. $scope.panel.sort.col = colIndex;
  82. $scope.panel.sort.desc = true;
  83. }
  84. $scope.render();
  85. };
  86. $scope.dataHandler = function(results) {
  87. $scope.dataRaw = results.data;
  88. $scope.pageIndex = 0;
  89. $scope.render();
  90. };
  91. $scope.render = function() {
  92. // automatically correct transform mode
  93. // based on data
  94. if ($scope.dataRaw && $scope.dataRaw.length) {
  95. if ($scope.dataRaw[0].type === 'table') {
  96. $scope.panel.transform = 'table';
  97. } else {
  98. if ($scope.dataRaw[0].type === 'docs') {
  99. $scope.panel.transform = 'json';
  100. } else {
  101. if ($scope.panel.transform === 'table' || $scope.panel.transform === 'json') {
  102. $scope.panel.transform = 'timeseries_to_rows';
  103. }
  104. }
  105. }
  106. }
  107. $scope.table = transformDataToTable($scope.dataRaw, $scope.panel);
  108. $scope.table.sort($scope.panel.sort);
  109. panelHelper.broadcastRender($scope, $scope.table, $scope.dataRaw);
  110. };
  111. $scope.exportCsv = function() {
  112. FileExport.exportTableDataToCsv($scope.table);
  113. };
  114. $scope.init();
  115. }
  116. }